From 23cb5b2ec5ee99eba1a93d8507525d9b838d8a2c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nicol=C3=B2=20P?= Date: Mon, 18 Oct 2021 12:31:24 +0200 Subject: [PATCH] Add first interactive map attempt --- .gitignore | 2 +- css/main.css | 34 +++++++++++--- css/spectre.css | 4 +- img/map.svg | 74 ++++++++++++++----------------- itinerario.html | 26 ++--------- map.html | 115 ++++++++++++++++++++++++++++++++++++++++++++++++ 6 files changed, 183 insertions(+), 72 deletions(-) create mode 100644 map.html diff --git a/.gitignore b/.gitignore index 6649e3f..dd156b2 100644 --- a/.gitignore +++ b/.gitignore @@ -5,4 +5,4 @@ spectre*/ *_bak* # Ignore videos in online version vid_*.mp4 -assets/video/vid_*.mp4 +assets/video/vid_*.mp4 \ No newline at end of file diff --git a/css/main.css b/css/main.css index fa4976f..d171738 100644 --- a/css/main.css +++ b/css/main.css @@ -343,6 +343,7 @@ section .container { line-height: 1.3rem; font-size: 12pt; } + @media (min-width: 1280px) { section .container { width: 1280px; @@ -369,7 +370,8 @@ section .container ul { margin-left: 0; margin-top: 2rem; } -section .container img { +section .container img, +.modal img { width: 100%; } section.prj-logos img { @@ -407,10 +409,16 @@ section.poi h3 { color: var(--lilac); } /** Modals **/ -#mod-vid .modal-overlay { +#mod-vid { background-color: #555; } -/** Temp **/ + +.modal-container div { + font-family: 'roboto_slablight', sans-serif; + line-height: 1.3rem; +} + +/** Temp .placeholder { background-color: rgba(0,0,0,.03); height: 70%; @@ -420,11 +428,11 @@ section.poi h3 { top: 0; width: 100%; } -/*****/ canvas { width: 100vw; height: 100vh; } +*/ /** Videos **/ video, .open-vid { cursor: pointer; @@ -433,12 +441,28 @@ video, .open-vid { color: var(--white); margin-top: 0.9rem; } +/* +.vid-thumb::before { + content: ""; + border-left:rgba(75, 99, 207, 0.658) 85px solid; + border-top: 60px solid transparent; + border-bottom: 60px solid transparent; + visibility: visible; + display: block; + position: absolute; + width: 0; + height: 0; + left: 70vh; + top: 15vh; + cursor: pointer; +} +*/ /** Slideshow... **/ .hide, .slide { display: none; } .show { - display: block; + display: block !important; } /* Fading animation */ .fadein { diff --git a/css/spectre.css b/css/spectre.css index 9b67bf2..19845de 100644 --- a/css/spectre.css +++ b/css/spectre.css @@ -2597,9 +2597,7 @@ summary.accordion-header::-webkit-details-marker { .modal.modal-lg .modal-container { box-shadow: none; - /* Custom max-width*/ - max-width: 100%; - max-height: 100vh; + max-width: 960px; } .modal-container { diff --git a/img/map.svg b/img/map.svg index 54192cf..229c074 100644 --- a/img/map.svg +++ b/img/map.svg @@ -8,34 +8,34 @@ xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" - width="210mm" - height="297mm" - viewBox="0 0 210 297" - version="1.1" - id="svg8" + sodipodi:docname="map.svg" inkscape:version="1.0 (4035a4fb49, 2020-05-01)" - sodipodi:docname="map.svg"> + id="svg8" + version="1.1" + viewBox="0 0 173.39732 173.39732" + height="173.39732mm" + width="173.39732mm"> + inkscape:window-x="1912" + inkscape:window-height="1027" + inkscape:window-width="1920" + showgrid="false" + inkscape:document-rotation="0" + inkscape:current-layer="layer1" + inkscape:document-units="mm" + inkscape:cy="250.48509" + inkscape:cx="323.25095" + inkscape:zoom="1.4" + inkscape:pageshadow="2" + inkscape:pageopacity="0.0" + borderopacity="1.0" + bordercolor="#666666" + pagecolor="#ffffff" + id="base" /> @@ -49,26 +49,18 @@ + inkscape:label="Layer 1"> - + style="image-rendering:optimizeQuality" + preserveAspectRatio="none" + height="173.39732" + width="173.39732" + x="19.13467" + y="37.277527" /> diff --git a/itinerario.html b/itinerario.html index 5b78f57..156e8d7 100644 --- a/itinerario.html +++ b/itinerario.html @@ -42,8 +42,9 @@
- Mappa dei percorsi a Fara Sabina - + + Mappa dei percorsi a Fara Sabina +

Il borgo storico in tappe

@@ -101,7 +102,7 @@ Viaggiatore #1
-
+

Il viaggiatore #1

@@ -467,25 +468,6 @@
-