Refactored font awesome classes

MaastrichtU-Library · Jul 24, 2024 · e755811 · e755811
1 parent a242c10
commit e755811
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 9 deletions.
diff --git a/_includes/head.html b/_includes/head.html
@@ -59,6 +59,7 @@
 	<!-- <link href="https://fonts.googleapis.com/css?family=Lora:400,600|Source+Sans+Pro:200,400,700" rel="stylesheet"> -->
 	<!-- Font Awesome -->
 	<link rel="stylesheet" href="{{ relativebase }}assets/fonts/font-awesome/css/fontawesome.min.css">
+	<link rel="stylesheet" href="{{ relativebase }}assets/fonts/font-awesome/css/solid.min.css">
 	<link rel="stylesheet" href="{{ relativebase }}assets/fonts/font-awesome/css/brands.min.css">
 	<!-- Styles -->
 	<link rel="stylesheet" href="{{ relativebase }}assets/css/main.css">

diff --git a/_includes/header.html b/_includes/header.html
@@ -5,10 +5,10 @@
   <div class="wrapper">
     <div class="header-flex">
       <div class="menu-icon-container">
-        <span class="menu-icon"><i class="fa fa-bars" aria-hidden="true"></i></span>
+        <span class="menu-icon"><i class="fa-solid fa-bars" aria-hidden="true"></i></span>
       </div>
       <nav class="main-nav">
-        <span class="menu-icon-close"><i class="fa fa-times" aria-hidden="true"></i></span>
+        <span class="menu-icon-close"><i class="fa-solid fa-times" aria-hidden="true"></i></span>
         <ul>
           <li>
             {% include theme-toggle.html %}
@@ -69,7 +69,7 @@
       {% assign logo_url = logo_url | replace: "//", "/" %}
       <div class="logo"><a href="{{ relativebase }}"><img class="logo" id="logo" src="{{ logo_url }}" alt="{{ site.title }}"></a></div>
       <div class="search-icon-container">
-        <span class="search-icon"><a><i class="fa fa-search" aria-hidden="true"></i></a></span>
+        <span class="search-icon"><a><i class="fa-solid fa-search" aria-hidden="true"></i></a></span>
       </div>
     </div>
   </div>

diff --git a/_includes/javascripts.html b/_includes/javascripts.html
@@ -155,7 +155,7 @@
           tweetSpanIcon.className = 'tweetIcon';
           tweetSpanIcon.appendChild(document.createTextNode("click to tweet"));
           tweetI = document.createElement("i");
-          tweetI.className = 'fa fa-twitter';
+          tweetI.className = 'fa-brands fa-x-twitter';
           tweetSpanIcon.appendChild(tweetI);
           tweetA.appendChild(tweetSpanText);
           tweetA.appendChild(tweetSpanIcon);

diff --git a/_includes/search.html b/_includes/search.html
@@ -8,7 +8,7 @@
       </form>
       <ul id="results-container" class="results-search"></ul>
       <div class="icon-close-container">
-        <span class="search-icon-close"><i class="fa fa-times" aria-hidden="true"></i></span>
+        <span class="search-icon-close"><i class="fa-solid fa-times" aria-hidden="true"></i></span>
       </div>
     </div>
   </div>

diff --git a/_includes/share-icons.html b/_includes/share-icons.html
@@ -2,10 +2,10 @@
     <div class="share-hover {{ include.class }}">
         <span class="share-button {{ include.class }}"><svg fill="currentColor" width="25" height="25" class="{{ include.class }}"><g fill-rule="evenodd"><path d="M15.6 5a.42.42 0 0 0 .17-.3.42.42 0 0 0-.12-.33l-2.8-2.79a.5.5 0 0 0-.7 0l-2.8 2.8a.4.4 0 0 0-.1.32c0 .12.07.23.16.3h.02a.45.45 0 0 0 .57-.04l2-2V10c0 .28.23.5.5.5s.5-.22.5-.5V2.93l2.02 2.02c.08.07.18.12.3.13.11.01.21-.02.3-.08v.01"></path><path d="M18 7h-1.5a.5.5 0 0 0 0 1h1.6c.5 0 .9.4.9.9v10.2c0 .5-.4.9-.9.9H6.9a.9.9 0 0 1-.9-.9V8.9c0-.5.4-.9.9-.9h1.6a.5.5 0 0 0 .35-.15A.5.5 0 0 0 9 7.5a.5.5 0 0 0-.15-.35A.5.5 0 0 0 8.5 7H7a2 2 0 0 0-2 2v10c0 1.1.9 2 2 2h11a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2"></path></g></svg></span>
         <div class="share-icons {{ include.class }}" id="{{ include.id }}-icons">
-            <a class="twitter" href="https://twitter.com/intent/tweet?text={{ page.title }}&url={{ site.url }}{{ page.url }}" title="Share on Twitter" rel="nofollow" target="_blank"><i class="fa fa-twitter" aria-hidden="true"></i></a>
-            <a class="facebook" href="https://facebook.com/sharer.php?u={{ site.url }}{{ page.url }}" title="Share on Facebook" rel="nofollow" target="_blank"><i class="fa fa-facebook" aria-hidden="true"></i></a>
-            <a class="reddit" href="http://www.reddit.com/submit?url={{ site.url }}{{ page.url }}&title={{ page.title }}" title="Submit to Reddit" rel="nofollow" target="_blank"><i class="fa fa-reddit" aria-hidden="true"></i></a>
-            <a class="linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url={{ site.url }}{{ page.url }}&title={{ page.title }}&summary={{ page.description }}&source={{ site.url }}{{ page.url }}" title="Share on LinkedIn" rel="nofollow" target="_blank"><i class="fa fa-linkedin" aria-hidden="true"></i></a>
+            <a class="twitter" href="https://twitter.com/intent/tweet?text={{ page.title }}&url={{ site.url }}{{ page.url }}" title="Share on Twitter" rel="nofollow" target="_blank"><i class="fa-brands fa-x-twitter" aria-hidden="true"></i></a>
+            <a class="facebook" href="https://facebook.com/sharer.php?u={{ site.url }}{{ page.url }}" title="Share on Facebook" rel="nofollow" target="_blank"><i class="fa-brands fa-facebook" aria-hidden="true"></i></a>
+            <a class="reddit" href="http://www.reddit.com/submit?url={{ site.url }}{{ page.url }}&title={{ page.title }}" title="Submit to Reddit" rel="nofollow" target="_blank"><i class="fa-brands fa-reddit" aria-hidden="true"></i></a>
+            <a class="linkedin" href="https://www.linkedin.com/shareArticle?mini=true&url={{ site.url }}{{ page.url }}&title={{ page.title }}&summary={{ page.description }}&source={{ site.url }}{{ page.url }}" title="Share on LinkedIn" rel="nofollow" target="_blank"><i class="fa-brands fa-linkedin" aria-hidden="true"></i></a>
             <a class="email" href="mailto:?subject={{ page.title }}&body={{ page.description }}%0A%0ARead more here: {{ site.url }}{{ page.url }}" title="Share via e-mail" rel="nofollow" target="_blank"><i class="fa fa-envelope" aria-hidden="true"></i></a>
             <a class="copy-link" onclick="copyToClipboard()" title="Copy to clipboard" rel="nofollow" target="_blank"><svg width="20px" fill="currentColor" class="{{ include.class }}" viewBox="0 0 18 18"><path d="M16.94 1.1A3.7 3.7 0 0 0 14.3 0c-1 0-1.94.39-2.64 1.1L7.43 5.3c-.91.92-2.09 3.2 0 5.27a.75.75 0 0 0 .82.16c.09-.03.17-.09.24-.15a.74.74 0 0 0 0-1.06c-1.16-1.15-.77-2.39-.02-3.16l4.24-4.22a2.2 2.2 0 0 1 1.58-.65c.6 0 1.16.23 1.58.65.86.87.86 2.29 0 3.16L12.7 8.47a.74.74 0 0 0 1.04 1.05l3.17-3.16a3.73 3.73 0 0 0 0-5.27h.03zM9.54 7.4a.74.74 0 0 0 0 1.06c1.16 1.15.76 2.39 0 3.16l-4.22 4.22c-.42.42-.99.65-1.59.65a2.23 2.23 0 0 1-1.58-3.82l3.17-3.16A.73.73 0 0 0 5.54 9a.78.78 0 0 0-.22-.52.77.77 0 0 0-1.05 0L1.1 11.64A3.72 3.72 0 0 0 3.74 18c1 0 1.94-.39 2.65-1.1l4.23-4.2c.21-.22.94-1.02 1.13-2.2.18-1.12-.2-2.15-1.12-3.07-.27-.27-.78-.27-1.06 0l-.02-.02z" clip-rule="evenodd" fill-rule="evenodd"></path></svg></a>
         </div>