fix inline styles #193
|
@ -56,7 +56,7 @@
|
||||||
<!-- declares mapBoxToken constant -->
|
<!-- declares mapBoxToken constant -->
|
||||||
<script src="./secrets.js" type="text/javascript"></script>
|
<script src="./secrets.js" type="text/javascript"></script>
|
||||||
<!-- this is the guts of it -->
|
<!-- this is the guts of it -->
|
||||||
<script src="./load-map.js" integrity="sha384-Dz5rVm6gkjHMT0sWOLGuQUEdqMEma27u5vJsimbd1eQ7hoOAqnyvHZTE1oOz6Ap/" crossorigin="anonymous" type="text/javascript"></script>
|
<script src="./load-map.js" nonce="NGINX_CSP_NONCE" type="text/javascript"></script>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
<p>This website and the data it uses licensed <a href="https://creativecommons.org/licenses/by/4.0/">CC-BY-4.0</a></p>
|
<p>This website and the data it uses licensed <a href="https://creativecommons.org/licenses/by/4.0/">CC-BY-4.0</a></p>
|
||||||
|
|
|
@ -413,12 +413,12 @@ Promise.all([boundaries, branchesCsv, ikcCsv, mechanics, nslaBranches, caul])
|
||||||
this._div.innerHTML =
|
this._div.innerHTML =
|
||||||
`<p>Hover over an area for more information</p>
|
`<p>Hover over an area for more information</p>
|
||||||
<section>
|
<section>
|
||||||
<div><div class="circle" style="background-color: #4dac26"></div>Fine free</div>
|
<div><div class="circle fine-free"></div>Fine free</div>
|
||||||
<div><div class="circle" style="background-color: #b8e186"></div>Fine free (unconfirmed)</div>
|
<div><div class="circle fine-free-unconfirmed"></div>Fine free (unconfirmed)</div>
|
||||||
<div><div class="circle" style="background-color: #f1b6da"></div>Fine free for children</div>
|
<div><div class="circle fine-free-kids"></div>Fine free for children</div>
|
||||||
<div><div class="circle" style="background-color: #abd9e9"></div>Fine policy varies</div>
|
<div><div class="circle fine-varies"></div>Fine policy varies</div>
|
||||||
<div><div class="circle" style="background-color: #d01c8b"></div>Fines for all users</div>
|
<div><div class="circle fine-all"></div>Fines for all users</div>
|
||||||
<div><div class="circle" style="background-color: #bbb"></div>Unknown (help me find out!)</div>
|
<div><div class="circle fine-unknown"></div>Unknown (help me find out!)</div>
|
||||||
</section>
|
</section>
|
||||||
`
|
`
|
||||||
};
|
};
|
||||||
|
|
|
@ -91,23 +91,6 @@ nav li a:hover {
|
||||||
border-top-right-radius: 10px;
|
border-top-right-radius: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 800px) {
|
|
||||||
|
|
||||||
nav ul {
|
|
||||||
margin-left: 0;
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
nav li {
|
|
||||||
display: block;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0.5em 0 0.5em 1em;
|
|
||||||
border-color: #777;
|
|
||||||
border-left: none;
|
|
||||||
border-right: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#title {
|
#title {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -264,6 +247,49 @@ ul#libraries li {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* rules map key styles */
|
||||||
|
|
||||||
|
.fine-free {
|
||||||
|
background-color: #4dac26
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine-free-unconfirmed {
|
||||||
|
background-color: #b8e186
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine-free-kids {
|
||||||
|
background-color: #f1b6da
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine-varies {
|
||||||
|
background-color: #abd9e9
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine-all {
|
||||||
|
background-color: #d01c8b
|
||||||
|
}
|
||||||
|
|
||||||
|
.fine-unknown {
|
||||||
|
background-color: #bbb
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 800px) {
|
||||||
|
|
||||||
|
nav ul {
|
||||||
|
margin-left: 0;
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
nav li {
|
||||||
|
display: block;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0.5em 0 0.5em 1em;
|
||||||
|
border-color: #777;
|
||||||
|
border-left: none;
|
||||||
|
border-right: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* when below max width of para */
|
/* when below max width of para */
|
||||||
@media only screen and (max-width: 54em) {
|
@media only screen and (max-width: 54em) {
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue