Icones dans le footer

Geoffrey PREUD'HOMME
1 parent 858bb856
Showing 7 changed files with 26 additions and 9 deletions Show diff stats
_includes/footer.html
_includes/icon-facebook.svg
_includes/icon-github.svg
_includes/icon-gitlab.svg
_includes/icon-mail.svg
_includes/icon-site.svg
assets/main.scss
@@ -8,18 +8,18 @@
       <div class="footer-col footer-col-1">
         <ul class="contact-list">
             {% if site.url %}
-            <li><a href="{{ site.url }}">{{ site.url }}</a></li>
+            <li><a href="{{ site.url }}"><span class="icon">{% include icon-site.svg %}</span> {{ site.url }}</a></li>
             {% endif %}
             {% if site.email %}
-            <li><a href="mailto:{{ site.email }}">{{ site.email }}</a></li>
+            <li><a href="mailto:{{ site.email }}"><span class="icon">{% include icon-mail.svg %}</span> {{ site.email }}</a></li>
             {% endif %}
             {% if site.facebook_link %}
-            <li><a href="{{ site.facebook_link }}">Page Facebook</a></li>
+            <li><a href="{{ site.facebook_link }}"><span class="icon">{% include icon-facebook.svg %}</span> Page Facebook</a></li>
             {% endif %}
             {% if site.github_link %}
-            <li><a href="{{ site.github_link }}">Organisation GitHub</a></li>
+            <li><a href="{{ site.github_link }}"><span class="icon">{% include icon-github.svg %}</span> Organisation GitHub</a></li>
             {% endif %}
-            <li><a href="https://archives.plil.fr/groups/LeClubInfo">Groupe GitLab</a></li>
+            <li><a href="https://archives.plil.fr/groups/LeClubInfo"><span class="icon">{% include icon-gitlab.svg %}</span> Groupe GitLab</a></li>
         </ul>
       </div>
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M14.895.25H1.105a.855.855 0 0 0-.855.855v13.79c0 .472.383.855.855.855H8.53V9.748H6.507v-2.34h2.02V5.683c0-2.002 1.223-3.09 3.01-3.09.855 0 1.59.06 1.805.09v2.093h-1.24c-.97 0-1.158.465-1.158 1.143V7.41h2.315l-.3 2.344h-2.015v5.996h3.95a.855.855 0 0 0 .855-.855V1.105a.855.855 0 0 0-.855-.855" color="#828282ff" fill-rule="nonzero" fill="#828282"/></svg>
 \ No newline at end of file
@@ -0,0 +1 @@
+<svg viewBox="0 0 16 16" width="16" height="16"><path fill="#828282" d="M8 .43a7.76 7.76 0 0 0-2.454 15.125c.388.07.53-.168.53-.374 0-.183-.007-.67-.01-1.32-2.16.47-2.614-1.04-2.614-1.04-.353-.895-.862-1.134-.862-1.134-.705-.48.053-.472.053-.472.78.055 1.19.8 1.19.8.69 1.186 1.815.843 2.257.645.07-.503.27-.844.493-1.038-1.723-.197-3.534-.862-3.534-3.836 0-.847.3-1.54.798-2.082-.08-.197-.347-.986.076-2.054 0 0 .652-.21 2.134.796A7.39 7.39 0 0 1 8 4.184a7.45 7.45 0 0 1 1.943.26c1.482-1.003 2.132-.795 2.132-.795.423 1.067.157 1.856.077 2.053.497.542.798 1.235.798 2.082 0 2.98-1.814 3.637-3.543 3.83.28.24.527.712.527 1.436 0 1.038-.01 1.875-.01 2.13 0 .208.14.45.534.373A7.762 7.762 0 0 0 7.998.43z"/></svg>
 \ No newline at end of file
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M15.72 9.025l-.866-2.67-1.72-5.29c-.087-.273-.472-.273-.562 0l-1.718 5.288H5.146L3.428 1.066c-.09-.274-.475-.274-.562-.002l-1.72 5.29-.867 2.67c-.08.243.007.51.212.66L8 15.14l7.508-5.455a.592.592 0 0 0 .213-.66" fill="#828282"/></svg>
 \ No newline at end of file
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 0.4375 0.4375" width="16" height="16"><g fill="#828282"><path d="M.22.28L.165.232l-.15.13a.03.03 0 0 0 .02.007H.4A.03.03 0 0 0 .42.362L.27.232z"/><path d="M.42.076A.03.03 0 0 0 .4.066H.037a.03.03 0 0 0-.02.01L.218.25zM.007.094v.25L.153.222zM.284.22L.43.346v-.25z"/></g></svg>
 \ No newline at end of file
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 19.125 19.125"><path d="M18.087 5.956c-.977-2.277-2.637-3.933-4.933-4.913a9.057 9.057 0 0 0-3.597-.74 9.01 9.01 0 0 0-3.596.74C3.685 2.02 2.008 3.675 1.03 5.956a9.015 9.015 0 0 0-.73 3.596c0 1.257.24 2.464.73 3.607.98 2.28 2.656 3.945 4.933 4.922a9.01 9.01 0 0 0 3.597.74 9.06 9.06 0 0 0 3.597-.74c2.296-.98 3.956-2.646 4.933-4.923a9.06 9.06 0 0 0 .74-3.608c0-1.256-.248-2.45-.74-3.596zm-11.61-3.93c-.8 1.013-1.387 2.3-1.762 3.86h-2.42a8.304 8.304 0 0 1 4.183-3.86zM1.424 9.552c0-.88.142-1.732.416-2.552h2.653a16.86 16.86 0 0 0 0 5.085H1.818a8.267 8.267 0 0 1-.395-2.533zm.87 3.647h2.422c.375 1.59.963 2.896 1.763 3.9-1.823-.76-3.323-2.148-4.184-3.9zm6.697 4.406c-.658-.193-1.276-.68-1.833-1.47-.557-.79-.983-1.772-1.277-2.937h3.11zm0-5.52H5.627a17.566 17.566 0 0 1-.203-2.534c0-.85.07-1.7.223-2.552H8.99v5.085zm0-6.2H5.88c.314-1.155.742-2.126 1.297-2.908.56-.788 1.155-1.276 1.813-1.46v4.367zm7.84 0h-2.42c-.375-1.56-.963-2.847-1.763-3.86a8.303 8.303 0 0 1 4.184 3.86zm-6.695-4.367c.658.182 1.253.67 1.813 1.458.555.782.983 1.753 1.297 2.907h-3.11zm0 5.48h3.343c.152.85.223 1.702.223 2.552 0 .79-.07 1.63-.202 2.533h-3.363zm0 10.606V13.2h3.11c-.304 1.164-.735 2.143-1.287 2.937-.553.796-1.155 1.286-1.823 1.47zm2.512-.507c.8-1.004 1.388-2.31 1.763-3.9h2.42c-.86 1.752-2.36 3.14-4.183 3.9zm4.66-5.015h-2.675a16.838 16.838 0 0 0 0-5.085h2.654c.274.82.416 1.67.416 2.552 0 .862-.132 1.712-.395 2.533z" fill="#828282"/></svg>
 \ No newline at end of file
@@ -91,13 +91,13 @@ html {
 }
 .footer-col-1 {
-  width: -webkit-calc(40% - (#{$spacing-unit} / 2));
-  width:         calc(40% - (#{$spacing-unit} / 2));
+  width: -webkit-calc(50% - (#{$spacing-unit} / 2));
+  width:         calc(50% - (#{$spacing-unit} / 2));
 }
 .footer-col-2 {
-  width: -webkit-calc(60% - (#{$spacing-unit} / 2));
-  width:         calc(60% - (#{$spacing-unit} / 2));
+  width: -webkit-calc(50% - (#{$spacing-unit} / 2));
+  width:         calc(50% - (#{$spacing-unit} / 2));
 }
 .page-nav {
@@ -120,6 +120,10 @@ html {
 .site-header, .site-footer {
     background: black;
     color: white;
+
+    a:hover {
+        color: $grey-color-light;
+    }
 }
 .site-nav {
@@ -142,3 +146,11 @@ html {
 .site-title, .site-title:visited {
     color: white;
 }
+
+.icon > svg {
+  height: 16px;
+  width: 16px;
+  path {
+    fill: $brand-color;
+  }
+}