Parcourir la source

:art: Use an icon class

In order to use any image as a title icon.
DricomDragon il y a 1 an
Parent
commit
a5a336ba53

+ 11 - 5
src/include/css/custom/main.css

@@ -4,11 +4,6 @@ body {
     background-color: rgb(230, 255, 230);
 }
 
-.focus-center {
-    padding: 3rem 1.5rem;
-    text-align: center;
-}
-
 @media (min-width: 576px) {
     h1 {
         font-size: 5em;
@@ -23,6 +18,17 @@ h4 {
     color: #0b2e13;
 }
 
+/* Components */
+.focus-center {
+    padding: 3rem 1.5rem;
+    text-align: center;
+}
+
+.icon {
+    margin-bottom: 5px;
+    height: 38px;
+}
+
 /* Navigation bar bigger title */
 @media (min-width: 576px) {
     .navbar-brand {

+ 1 - 1
src/projets/quoridor/content.src.html

@@ -13,7 +13,7 @@ sur le jeu de stratégie Quoridor.
 </p>
 
 <h3>
-    <img src="quoridor_96x96.png" class="rounded-circle" alt="Quoridor icon" height=38 style="margin-bottom:5px">
+    <img class="rounded-circle icon" src="quoridor_96x96.png" alt="Quoridor icon">
     Notre travail
 </h3>
 <div class="row">

+ 1 - 1
src/templates/card.html

@@ -3,7 +3,7 @@
     <img class="card-img-top" src="$it.target.dir$/$it.data.title-img.path$"$if(it.title-img.alt)$ alt="$it.data.title-img.alt$"$endif$>
     <div class="card-body">
         <h4 class="card-title">
-            <img src="$it.target.dir$/$it.data.title-img.path$"$if(it.title-img.alt)$ alt="$it.data.title-img.alt$"$endif$>
+            <img class="icon" src="$it.target.dir$/$it.data.title-img.path$"$if(it.title-img.alt)$ alt="$it.data.title-img.alt$"$endif$>
             $it.data.title$
         </h4>
         <p class="card-text">