Browse Source

bootstrap

uf0 4 years ago
parent
commit
2432a20dfb
3 changed files with 153 additions and 0 deletions
  1. 103 0
      index.html
  2. BIN
      mappapuntisolidali.png
  3. 50 0
      style-ps.css

+ 103 - 0
index.html

@@ -0,0 +1,103 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, shrink-to-fit=no"
+    />
+    <title>Mappa Punti Solidali Milano</title>
+    <link rel="stylesheet" href="style-ps.css" />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@700&display=swap"
+      rel="stylesheet"
+    />
+    <!-- Primary Meta Tags -->
+    <meta name="title" content="Mappa Punti Solidali Milano" />
+    <meta
+      name="description"
+      content="Mappa Punti solidali nella città di milano e dintorni, punti per donazioni  di alimenti, spesa sospesa, pasti gratuiti o a prezzo solidale."
+    />
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="website" />
+    <meta
+      property="og:url"
+      content="https://www.offtopiclab.org/punti-solidali/"
+    />
+    <meta property="og:title" content="Mappa Punti Solidali Milano" />
+    <meta
+      property="og:description"
+      content="Mappa Punti solidali nella città di milano e dintorni, punti per donazioni  di alimenti, spesa sospesa, pasti gratuiti o a prezzo solidale."
+    />
+    <meta
+      property="og:image"
+      content="https://www.offtopiclab.org/punti-solidali/mappapuntisolidali.png"
+    />
+    <!-- Twitter -->
+    <meta property="twitter:card" content="summary_large_image" />
+    <meta
+      property="twitter:url"
+      content="https://www.offtopiclab.org/punti-solidali/"
+    />
+    <meta property="twitter:title" content="Mappa Punti Solidali Milano" />
+    <meta
+      property="twitter:description"
+      content="Mappa Punti solidali nella città di milano e dintorni, punti per donazioni  di alimenti, spesa sospesa, pasti gratuiti o a prezzo solidale."
+    />
+    <meta
+      property="twitter:image"
+      content="https://www.offtopiclab.org/punti-solidali/mappapuntisolidali.png"
+    />
+  </head>
+  <body>
+    <iframe
+      style="position:fixed; top:0; left:0; bottom:0; right:0; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:10;"
+      allowfullscreen
+      src="//umap.openstreetmap.fr/en/map/mappapuntisolidali_440667?scaleControl=false&miniMap=false&scrollWheelZoom=true&zoomControl=true&allowEdit=false&moreControl=true&searchControl=null&tilelayersControl=null&embedControl=null&datalayersControl=true&onLoadPanel=undefined&captionBar=false"
+    ></iframe>
+    <div id="footer" style="z-index:50;">
+      <ul id="legenda">
+        <li>
+          <img
+            src="https://img.icons8.com/color/48/000000/food-donor.png"
+            class="centered"
+            alt="Punti Raccolta"
+            height="48"
+            width="48"
+          />
+          <h6>Punti Raccolta</h6>
+        </li>
+        <li>
+          <img
+            src="https://img.icons8.com/color/48/000000/soup-plate.png"
+            class="centered"
+            alt="Distribuzione Pasti "
+            height="48"
+            width="48"
+          />
+          <h6>Distribuzione pasti</h6>
+        </li>
+        <li>
+          <img
+            src="https://img.icons8.com/color/48/000000/bread.png"
+            class="centered"
+            alt="Panifici"
+            height="48"
+            width="48"
+          />
+          <h6>Invenduto Panifici</h6>
+        </li>
+        <li>
+          <img
+            src="https://img.icons8.com/color/48/000000/ingredients.png"
+            class="centered"
+            alt="Spesa Sospesa"
+            height="48"
+            width="48"
+          />
+          <h6>Spesa Sospesa</h6>
+        </li>
+      </ul>
+    </div>
+  </body>
+</html>

BIN
mappapuntisolidali.png


+ 50 - 0
style-ps.css

@@ -0,0 +1,50 @@
+html {
+  box-sizing: border-box;
+  font-size: 16px;
+}
+
+*, *:before, *:after {
+  box-sizing: inherit;
+}
+
+body, h1, h2, h3, h4, h5, h6, p, ol, ul {
+  margin: 0;
+  padding: 0;
+  font-weight: normal;
+}
+
+ol, ul {
+  list-style: none;
+}
+
+img {
+  max-width: 100%;
+  height: auto;
+}
+
+#footer {
+   font-family: 'Roboto Condensed', sans-serif;
+   position: fixed;
+   bottom: 0px;
+   background-color: white;
+   padding: 5px;
+   width: 100%;
+   text-align: center;
+}
+
+.centered {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+
+ul > li {
+    display: inline-block;
+    /* You can also add some margins here to make it look prettier */
+    zoom:1;
+    *display:inline;
+    padding-left: 5px;
+    padding-right: 5px;
+    text-align: center;
+}