add button link

OsmAnd-Rendering · Jun 23, 2024 · 8b59700 · 8b59700
1 parent 3d74984
commit 8b59700
Show file tree

Hide file tree

Showing 9 changed files with 50 additions and 17 deletions.
diff --git a/CycloRoute/index.html b/CycloRoute/index.html
@@ -156,10 +156,11 @@ <h4>Mode CycloTourisme</h4>
         </div>
         <hr>
         <br>
-      
+
         <ul>
-          <li>Télécharger <a class="div-link" href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf">ce fichier</a></li>
+          <li>Télécharger le fichier&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf"><strong>Download</strong></a></button></li>
         </ul>
+
         <br>
         <div class="responsive-two-columns">
           <table>

diff --git a/CycloRoute/index_EN.html b/CycloRoute/index_EN.html
@@ -149,10 +149,11 @@ <h2>CycloRoute</h2>
             </div>
             <hr>
             <br>
-      
+
             <ul>
-                <li>Download <a class="div-link" href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf">this file</a></li>
+              <li>Download this file&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf"><strong>Download</strong></a></button></li>
             </ul>
+
             <br>
 
             <div class="responsive-two-columns">

diff --git a/CycloRoute/index_ES.html b/CycloRoute/index_ES.html
@@ -150,10 +150,11 @@ <h2>CycloRoute</h2>
             </div>
             <hr>
             <br>
-      
+
             <ul>
-                <li>Descargar <a class="div-link" href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf">este enlace</a></li>
+              <li>Descargar este archivo&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Cycling/raw/main/CycloRoute.osf"><strong>Download</strong></a></button></li>
             </ul>
+
             <br>
 
             <div class="responsive-two-columns">

diff --git a/Enduro/index.html b/Enduro/index.html
@@ -143,8 +143,9 @@ <h2>Enduro</h2>
       <br>
 
       <ul>
-        <li>Télécharger <a class="div-link" href="https://github.com/OsmAnd-Rendering/Motorcycle/raw/main/installation.osf">ce fichier</a></li>
+        <li>Télécharger le fichier&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Motorcycle/raw/main/installation.osf"><strong>Download</strong></a></button></li>
       </ul>
+
       <br>
       <p>Ce fichier contient :</p>
 

diff --git a/Enduro/index_EN.html b/Enduro/index_EN.html
@@ -142,10 +142,11 @@ <h2>Enduro</h2>
         </div>
         <hr>
         <br>
-      
+
         <ul>
-          <li>Download <a class="div-link" href="https://github.com/OsmAnd-Rendering/Motorcycle/raw/main/installation.osf">this file</a></li>
+          <li>Download this file&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Motorcycle/raw/main/installation.osf"><strong>Download</strong></a></button></li>
         </ul>
+
         <br>
         <p>This file contains:</p>
 

diff --git a/Hiking/index.html b/Hiking/index.html
@@ -130,10 +130,11 @@ <h2>Randonnée</h2>
       </div>
       <hr>
       <br>
-        
+
       <ul>
-      <li>Télécharger <a class="div-link" href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Hiking.osf">ce fichier</a></li>
+        <li>Télécharger le fichier&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Hiking.osf"><strong>Download</strong></a></button></li>
       </ul>
+
       <br>
 
       <div class="responsive-two-columns">
@@ -184,7 +185,7 @@ <h4>Mise à jour du rendu</h4>
       <br><br>
 
 
-      <div style="display: flex; align-items: center;"><img src="/icon/Documentation.svg" width="30" id="Documentation"alt="Documentation" title="Documentation">&nbsp<h3>Documentation</h3>
+      <div style="display: flex; align-items: center;"><img src="/icon/Documentation.svg" width="30" id="Documentation"alt="Documentation" title="Documentation">&nbsp;<h3>Documentation</h3>
       </div>
       <hr>
       <br>
@@ -240,7 +241,7 @@ <h4 id="nous-avons-désactivé">Nous avons désactivé:</h4>
     <br><br>
 
 
-    <div style="display: flex; align-items: center;"><img src="/icon/Legend.svg" width="30" id="Legend" alt="Legend" title="Legend">&nbsp<h3>Légende</h3>
+    <div style="display: flex; align-items: center;"><img src="/icon/Legend.svg" width="30" id="Legend" alt="Legend" title="Legend">&nbsp;<h3>Légende</h3>
     </div>
 
     <hr>

diff --git a/Hiking/index_EN.html b/Hiking/index_EN.html
@@ -125,10 +125,11 @@ <h2>Hiking</h2>
       </div>
       <hr>
       <br>
-    
+
       <ul>
-        <li>Download <a class="div-link" href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Hiking.osf">this file</a></li>
+        <li>Download this file&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Hiking.osf"><strong>Download</strong></a></button></li>
       </ul>
+
       <br>
 
       <div class="responsive-two-columns">

diff --git a/Hiking/index_ES.html b/Hiking/index_ES.html
@@ -124,10 +124,11 @@ <h2>Senderismo</h2>
       </div>
       <hr>
       <br>
-        
+
       <ul>
-      <li>Descargar <a class="div-link" href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Senderismo.osf">este archivo</a></li>
+        <li>Descargar este archivo&nbsp;&nbsp;<button class="button button1"><a href="https://github.com/OsmAnd-Rendering/Hiking/raw/main/Senderismo.osf"><strong>Download</strong></a></button></li>
       </ul>
+
       <br>
       <div class="responsive-two-columns">
       <table>

diff --git a/Style.css b/Style.css
@@ -460,4 +460,29 @@ div, button {
   .responsive-three-columns > * {
       width:calc(100% / 3);
   }
+}
+
+.button {
+  border: none;
+  color: white;
+  padding: 10px 30px;
+  text-align: center;
+  text-decoration: none;
+  display: inline-block;
+  font-size: 16px;
+  margin: 4px 2px;
+  transition-duration: 0.35s;
+  cursor: pointer;
+}
+
+.button1 {
+  background-color:  var(--bg); 
+  color: black; 
+  border: 2px solid #ff8800;
+  border-radius: 40px;
+}
+
+.button1:hover {
+  background-color: #ff8800;
+  color: white;
 }