hugh/public_library_map
hugh/public_library_map
1
Fork 0
Code Issues 9 Pull requests Actions Packages Projects Releases Wiki Activity

improve menu tabs

Browse source 
Menu tabs now appear consistently on all pages. The active page is colour-reversed and has no link.
Also improved the logo file.
This commit is contained in:
Hugh Rundle 2021-01-18 13:29:43 +11:00
parent 80ad14b14d
commit 035c593c13
6 changed files with 29 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
website/about.html
View file

@ -19,6 +19,7 @@
<nav> <nav>
<ul> <ul>
<li><a href="index.html">Home</a></li> <li><a href="index.html">Home</a></li>
<li class="active-tab">About</li>
<li><a href="sources.html">Acknowledgements</a></li> <li><a href="sources.html">Acknowledgements</a></li>
<li><a href="contributing.html">How you can help</a></li> <li><a href="contributing.html">How you can help</a></li>
<li><a href="https://github.com/hughrun/public_library_map">Code</a></li> <li><a href="https://github.com/hughrun/public_library_map">Code</a></li>

2
website/contributing.html
View file

@ -19,7 +19,9 @@
<nav> <nav>
<ul> <ul>
<li><a href="index.html">Home</a></li> <li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li>
<li><a href="sources.html">Acknowledgements</a></li> <li><a href="sources.html">Acknowledgements</a></li>
<li class="active-tab">How you can help</li>
<li><a href="https://github.com/hughrun/public_library_map">Code</a></li> <li><a href="https://github.com/hughrun/public_library_map">Code</a></li>
</ul> </ul>
</nav> </nav>

33
website/index.html
View file

@ -13,7 +13,25 @@
<link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="style.css">
</head> </head>
<body> <body>
<header>
<section id="title">
<img id="logo" src="logo.svg"/>
<h2>Library Map</h2>
<p id="beta">Beta!</p>
</section>
</header>
<nav>
<ul>
<li class="active-tab">Home</li>
<li><a href="about.html">About</a></li>
<li><a href="sources.html">Acknowledgements</a></li>
<li><a href="contributing.html">How you can help</a></li>
<li><a href="https://github.com/hughrun/public_library_map">Code</a></li>
</ul>
</nav>
<div id="loading">Loading, please be patient...</div> <div id="loading">Loading, please be patient...</div>
<!-- leaflet script --> <!-- leaflet script -->
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
<!-- TopoJSON --> <!-- TopoJSON -->
@ -30,21 +48,6 @@
<script src="mechanics.js" type="text/javascript"></script> <script src="mechanics.js" type="text/javascript"></script>
<script src="nsla.js" type="text/javascript"></script> <script src="nsla.js" type="text/javascript"></script>
<header>
<section id="title">
<img id="logo" src="logo.svg"/>
<h2>Library Map</h2>
<p id="beta">Beta!</p>
</section>
</header>
<nav>
<ul>
<li><a href="about.html">About</a></li>
<li><a href="sources.html">Acknowledgements</a></li>
<li><a href="contributing.html">How you can help</a></li>
<li><a href="https://github.com/hughrun/public_library_map">Code</a></li>
</ul>
</nav>
<section class="intro"> <section class="intro">
<p>Made by <a href="https://www.hughrundle.net">Hugh Rundle</a> using open data. Play with the layers by using the layer control at the top right of the map.</p> <p>Made by <a href="https://www.hughrundle.net">Hugh Rundle</a> using open data. Play with the layers by using the layer control at the top right of the map.</p>
<p>Email <strong>librarymap@hugh.run</strong> if you have any tips or suggestions.</p> <p>Email <strong>librarymap@hugh.run</strong> if you have any tips or suggestions.</p>

2
website/logo.svg
View file

@ -1 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 75 75" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;"><circle cx="37.398" cy="37.514" r="35.817" style="fill:#fff;"/><circle cx="37.398" cy="37.514" r="35.817" style="fill:#ff3961;fill-opacity:0.2;stroke:#ff3961;stroke-width:4.17px;"/><path d="M46.196,14.155c0.001,0.861 0.645,2.187 1.019,2.906c0.487,0.935 3.86,9.853 4.832,9.852m0.044,0.731c0.833,2.81 3.168,4.613 4.623,6.965c0.498,0.805 1.247,1.512 1.857,2.198c0.196,0.222 0.439,0.526 0.692,0.669c0.055,0.031 0.246,0.221 0.246,0.184m-0.272,0.79c-1.024,3.484 -2.321,7.05 -3.679,10.393c-0.291,0.716 -1.459,3.216 -1.409,3.858c0.019,0.239 -0.344,1.946 -0.345,1.185m-0.002,0.115c-0.631,0.238 -1.249,0.61 -1.902,0.833c-0.877,0.298 -5.257,0.756 -5.257,0.062m0.061,0.185c-1.891,-1.065 -5.118,-2.648 -6.357,-4.603c-0.372,-0.585 -1.879,-4.47 -2.527,-4.469m-0.439,-0.11c-4.404,-2.48 -10.048,0.28 -14.441,1.526c-1.521,0.431 -3.021,1.03 -4.526,1.517c-0.492,0.16 -0.985,0.338 -1.467,0.536c-0.211,0.086 -0.605,0.583 -0.606,0.33m29.665,-35.137c-0.819,1.857 -1.293,4.135 -1.832,6.128c-0.241,0.89 -0.527,1.776 -0.784,2.648c-0.047,0.162 -0.046,0.384 -0.046,0.32m0.144,0.253c-0.532,-0.598 -4.603,-3.796 -5.168,-3.796m-0,0c0.392,-0.222 1.958,-4.163 1.957,-4.803m0,0c-2.714,0.003 -3.762,-2.119 -6.604,0.026c-0.97,0.732 -1.647,2.032 -2.46,2.953c-0.276,0.313 -0.352,0.677 -0.494,1.083c-0.045,0.129 -0.092,0.49 -0.092,0.365m0.199,0.516c-0.27,-0.304 -0.785,-0.807 -1.161,-0.912c-0.977,-0.275 -5.281,3.354 -5.827,3.971c-0.55,0.623 -0.807,1.478 -1.382,2.128c-0.174,0.197 -0.239,0.458 -0.416,0.658c-0.06,0.069 -0.204,0.364 -0.204,0.3m0.151,-0.126c-0.923,0.696 -1.626,1.793 -2.678,2.385c-1.534,0.863 -3.356,0.826 -4.861,1.777c-0.811,0.513 -1.312,1.339 -1.875,2.156c-0.218,0.315 -0.304,0.621 -0.304,0.999c0.001,0.107 0.001,0.285 0.001,0.185m3.976,15.857c-0.166,0 -0.383,-0.224 -0.508,-0.329c-1.626,-1.374 0.032,-1.643 0.181,-2.632c0.182,-1.208 0.06,-2.602 -0.119,-3.805c-0.128,-0.864 -0.637,-1.446 -1.085,-2.118c-0.268,-0.402 -0.293,-0.962 -0.49,-1.406c-0.838,-1.885 -1.791,-3.441 -1.793,-5.517m36.422,23.686c0.492,-0.001 1.166,0.868 2.126,0.505c0.302,-0.114 1.738,-0.422 1.271,-0.157m-3.385,0.371c-0.156,0.001 0.201,1.324 0.247,1.427c0.274,0.617 0.534,1.202 0.86,1.754c0.22,0.371 0.721,0.544 1.105,0.76c0.096,0.054 0.555,-0.42 0.653,-0.532c1.304,-1.475 1.271,-1.586 1.269,-3.69m-4.818,-1.644c-0.218,0.001 -0.216,0.485 0.021,0.485m4.085,-0.26c-0,0.197 0.527,0.23 0.245,0.231" style="fill:none;stroke:#ff3961;stroke-width:1.29px;"/></svg> <?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 750 750" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:1.5;"><circle cx="376.867" cy="376.427" r="338.613" style="fill:#fff;"/><circle cx="376.867" cy="376.427" r="338.613" style="fill:#ff3961;fill-opacity:0.2;stroke:#ff3961;stroke-width:39.42px;"/><path d="M474.309,148.916c0.009,8.14 6.097,20.676 9.633,27.473c4.604,8.839 36.492,93.15 45.682,93.14m0.416,6.911c7.875,26.566 29.95,43.611 43.705,65.847c4.708,7.611 11.789,14.295 17.556,20.78c1.853,2.099 4.151,4.973 6.542,6.325c0.52,0.293 2.326,2.089 2.326,1.739m-2.571,7.469c-9.681,32.937 -21.943,66.65 -34.781,98.255c-2.752,6.769 -13.794,30.404 -13.321,36.473c0.18,2.26 -3.252,18.398 -3.262,11.203m-0.019,1.087c-5.965,2.251 -11.808,5.767 -17.981,7.876c-8.291,2.817 -49.7,7.147 -49.7,0.586m0.577,1.749c-17.877,-10.069 -48.385,-25.034 -60.099,-43.517c-3.517,-5.53 -17.764,-42.259 -23.89,-42.25m-4.15,-1.04c-41.635,-23.445 -94.994,2.648 -136.525,14.427c-14.379,4.075 -28.56,9.738 -42.789,14.342c-4.651,1.513 -9.312,3.195 -13.868,5.067c-1.995,0.813 -5.72,5.512 -5.73,3.12m280.452,-332.184c-7.743,17.556 -12.224,39.092 -17.319,57.934c-2.279,8.414 -4.983,16.79 -7.412,25.034c-0.445,1.532 -0.435,3.63 -0.435,3.025m1.361,2.392c-5.029,-5.653 -43.516,-35.887 -48.858,-35.887m0,-0c3.706,-2.099 18.511,-39.357 18.501,-45.407m0,-0c-25.658,0.028 -35.565,-20.033 -62.433,0.245c-9.171,6.921 -15.571,19.211 -23.257,27.918c-2.61,2.959 -3.328,6.4 -4.67,10.239c-0.426,1.219 -0.87,4.632 -0.87,3.45m1.881,4.878c-2.552,-2.874 -7.421,-7.629 -10.976,-8.622c-9.236,-2.599 -49.926,31.709 -55.088,37.542c-5.2,5.89 -7.63,13.973 -13.066,20.118c-1.645,1.863 -2.259,4.33 -3.932,6.221c-0.568,0.652 -1.929,3.441 -1.929,2.836m1.427,-1.191c-8.726,6.58 -15.372,16.951 -25.317,22.548c-14.503,8.158 -31.728,7.809 -45.956,16.799c-7.667,4.85 -12.404,12.659 -17.726,20.383c-2.061,2.978 -2.874,5.871 -2.874,9.445c0.009,1.011 0.009,2.694 0.009,1.749m37.589,149.911c-1.569,0 -3.621,-2.118 -4.802,-3.11c-15.372,-12.99 0.302,-15.533 1.711,-24.883c1.72,-11.421 0.567,-24.599 -1.125,-35.972c-1.21,-8.169 -6.022,-13.671 -10.258,-20.024c-2.533,-3.8 -2.77,-9.095 -4.632,-13.292c-7.923,-17.821 -16.932,-32.531 -16.951,-52.158m344.332,223.927c4.651,-0.01 11.023,8.206 20.099,4.774c2.855,-1.078 16.431,-3.989 12.016,-1.484m-32.001,3.507c-1.475,0.01 1.9,12.517 2.335,13.491c2.59,5.833 5.048,11.364 8.13,16.582c2.08,3.508 6.816,5.143 10.447,7.185c0.907,0.511 5.247,-3.97 6.173,-5.029c12.328,-13.945 12.016,-14.994 11.997,-34.885m-45.549,-15.543c-2.061,0.01 -2.042,4.586 0.199,4.586m38.619,-2.459c0,1.863 4.982,2.175 2.316,2.184" style="fill:none;stroke:#ff3961;stroke-width:12.2px;"/></svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

1
website/sources.html
View file

@ -20,6 +20,7 @@
<ul> <ul>
<li><a href="index.html">Home</a></li> <li><a href="index.html">Home</a></li>
<li><a href="about.html">About</a></li> <li><a href="about.html">About</a></li>
<li class="active-tab">Acknowledgements</li>
<li><a href="contributing.html">How you can help</a></li> <li><a href="contributing.html">How you can help</a></li>
<li><a href="https://github.com/hughrun/public_library_map">Code</a></li> <li><a href="https://github.com/hughrun/public_library_map">Code</a></li>
</ul> </ul>

6
website/style.css
View file

@ -48,6 +48,12 @@ nav li a:hover {
color: #FF3961; color: #FF3961;
} }
.active-tab,
.active-tab {
color: #000;
background-color: #fff;
}
#loading { #loading {
font-family: "Calibri", Arial, Tahoma, sans-serif; font-family: "Calibri", Arial, Tahoma, sans-serif;
font-size: 20px; font-size: 20px;