remove fork awesome

public/internal/footer.php

@@ -33,17 +33,40 @@ function getFooter(){
     </div>
     <div class="center">
         <p class="center">
-            <a href="https://www.instagram.com/jonasled1/"><i class="fa fa-instagram fa-2x"></i></a><i class="footerIconSpacer"></i>
-            <a href="https://www.thingiverse.com/jonasled/designs/"><i class="fa fa-cubes fa-2x"></i></a><i class="footerIconSpacer"></i>
-            <a href="https://paypal.me/jonasled/"><i class="fa fa-paypal fa-2x"></i></a><i class="footerIconSpacer"></i>
-            <a href="https://matrix.jonasled.de/invite/#/@jonasled:jonasled.de"><i class="fa fa-matrix-org fa-2x"></i></a>
+            <a href="https://www.instagram.com/jonasled1/">
+                <svg viewBox="0 0 512 512">
+                <path
+                    d="M256,49.471c67.266,0,75.233.257,101.8,1.469,24.562,1.121,37.9,5.224,46.778,8.674a78.052,78.052,0,0,1,28.966,18.845,78.052,78.052,0,0,1,18.845,28.966c3.45,8.877,7.554,22.216,8.674,46.778,1.212,26.565,1.469,34.532,1.469,101.8s-0.257,75.233-1.469,101.8c-1.121,24.562-5.225,37.9-8.674,46.778a83.427,83.427,0,0,1-47.811,47.811c-8.877,3.45-22.216,7.554-46.778,8.674-26.56,1.212-34.527,1.469-101.8,1.469s-75.237-.257-101.8-1.469c-24.562-1.121-37.9-5.225-46.778-8.674a78.051,78.051,0,0,1-28.966-18.845,78.053,78.053,0,0,1-18.845-28.966c-3.45-8.877-7.554-22.216-8.674-46.778-1.212-26.564-1.469-34.532-1.469-101.8s0.257-75.233,1.469-101.8c1.121-24.562,5.224-37.9,8.674-46.778A78.052,78.052,0,0,1,78.458,78.458a78.053,78.053,0,0,1,28.966-18.845c8.877-3.45,22.216-7.554,46.778-8.674,26.565-1.212,34.532-1.469,101.8-1.469m0-45.391c-68.418,0-77,.29-103.866,1.516-26.815,1.224-45.127,5.482-61.151,11.71a123.488,123.488,0,0,0-44.62,29.057A123.488,123.488,0,0,0,17.3,90.982C11.077,107.007,6.819,125.319,5.6,152.134,4.369,179,4.079,187.582,4.079,256S4.369,333,5.6,359.866c1.224,26.815,5.482,45.127,11.71,61.151a123.489,123.489,0,0,0,29.057,44.62,123.486,123.486,0,0,0,44.62,29.057c16.025,6.228,34.337,10.486,61.151,11.71,26.87,1.226,35.449,1.516,103.866,1.516s77-.29,103.866-1.516c26.815-1.224,45.127-5.482,61.151-11.71a128.817,128.817,0,0,0,73.677-73.677c6.228-16.025,10.486-34.337,11.71-61.151,1.226-26.87,1.516-35.449,1.516-103.866s-0.29-77-1.516-103.866c-1.224-26.815-5.482-45.127-11.71-61.151a123.486,123.486,0,0,0-29.057-44.62A123.487,123.487,0,0,0,421.018,17.3C404.993,11.077,386.681,6.819,359.866,5.6,333,4.369,324.418,4.079,256,4.079h0Z"/>
+                <path
+                    d="M256,126.635A129.365,129.365,0,1,0,385.365,256,129.365,129.365,0,0,0,256,126.635Zm0,213.338A83.973,83.973,0,1,1,339.974,256,83.974,83.974,0,0,1,256,339.973Z"/>
+                <circle
+                    cx="390.476" cy="121.524" r="30.23"/>
+                </svg>
+            </a><i class="footerIconSpacer"></i>
+            
+            <a href="https://www.thingiverse.com/jonasled/designs/">
+                <svg viewBox="0 0 512 512">
+                  <path d="M488.6 250.2L392 214V105.5c0-15-9.3-28.4-23.4-33.7l-100-37.5c-8.1-3.1-17.1-3.1-25.3 0l-100 37.5c-14.1 5.3-23.4 18.7-23.4 33.7V214l-96.6 36.2C9.3 255.5 0 268.9 0 283.9V394c0 13.6 7.7 26.1 19.9 32.2l100 50c10.1 5.1 22.1 5.1 32.2 0l103.9-52 103.9 52c10.1 5.1 22.1 5.1 32.2 0l100-50c12.2-6.1 19.9-18.6 19.9-32.2V283.9c0-15-9.3-28.4-23.4-33.7zM358 214.8l-85 31.9v-68.2l85-37v73.3zM154 104.1l102-38.2 102 38.2v.6l-102 41.4-102-41.4v-.6zm84 291.1l-85 42.5v-79.1l85-38.8v75.4zm0-112l-102 41.4-102-41.4v-.6l102-38.2 102 38.2v.6zm240 112l-85 42.5v-79.1l85-38.8v75.4zm0-112l-102 41.4-102-41.4v-.6l102-38.2 102 38.2v.6z"/>
+                </svg>        
+            </a><i class="footerIconSpacer"></i>
+            
+            <a href="https://paypal.me/jonasled/">
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512">
+                    <path d="M111.4 295.9c-3.5 19.2-17.4 108.7-21.5 134-.3 1.8-1 2.5-3 2.5H12.3c-7.6 0-13.1-6.6-12.1-13.9L58.8 46.6c1.5-9.6 10.1-16.9 20-16.9 152.3 0 165.1-3.7 204 11.4 60.1 23.3 65.6 79.5 44 140.3-21.5 62.6-72.5 89.5-140.1 90.3-43.4.7-69.5-7-75.3 24.2zM357.1 152c-1.8-1.3-2.5-1.8-3 1.3-2 11.4-5.1 22.5-8.8 33.6-39.9 113.8-150.5 103.9-204.5 103.9-6.1 0-10.1 3.3-10.9 9.4-22.6 140.4-27.1 169.7-27.1 169.7-1 7.1 3.5 12.9 10.6 12.9h63.5c8.6 0 15.7-6.3 17.4-14.9.7-5.4-1.1 6.1 14.4-91.3 4.6-22 14.3-19.7 29.3-19.7 71 0 126.4-28.8 142.9-112.3 6.5-34.8 4.6-71.4-23.8-92.6z"/>
+                </svg>
+            </a><i class="footerIconSpacer"></i>
+            
+            <a href="https://matrix.jonasled.de/invite/#/@jonasled:jonasled.de">
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1536 1792">
+                    <path d="M40.467 163.152v1465.696H145.92V1664H0V128h145.92v35.152zm450.757 464.64v74.14h2.069c19.79-28.356 43.717-50.215 71.483-65.575 27.765-15.656 59.963-23.336 96-23.336 34.56 0 66.165 6.795 94.818 20.086 28.652 13.293 50.216 37.22 65.28 70.893 16.246-23.926 38.4-45.194 66.166-63.507 27.766-18.314 60.848-27.472 98.954-27.472 28.948 0 55.828 3.545 80.64 10.635 24.812 7.088 45.785 18.314 63.508 33.968 17.722 15.656 31.31 35.742 41.354 60.85 9.747 25.107 14.768 55.236 14.768 90.683v366.573h-150.35V865.28c0-18.314-.59-35.741-2.068-51.987-1.476-16.247-5.316-30.426-11.52-42.24-6.499-12.112-15.656-21.563-28.062-28.653-12.405-7.088-29.242-10.634-50.214-10.634-21.268 0-38.4 4.135-51.397 12.112-12.997 8.27-23.336 18.608-30.72 31.901-7.386 12.997-12.407 27.765-14.77 44.602-2.363 16.542-3.84 33.379-3.84 50.216v305.133H692.971v-307.2c0-16.247-.294-32.197-1.18-48.149-.591-15.95-3.84-30.424-9.157-44.011-5.317-13.293-14.178-24.223-26.585-32.197-12.406-7.976-30.425-12.112-54.646-12.112-7.088 0-16.542 1.478-28.062 4.726-11.52 3.25-23.04 9.157-33.968 18.02-10.93 8.86-20.383 21.563-28.063 38.103-7.68 16.543-11.52 38.4-11.52 65.28v317.834H349.44V627.792zm1004.309 1001.056V163.152H1390.08V128H1536v1536h-145.92v-35.152z"/>
+                </svg>
+            </a>
         </p>
     </div>
     </div>
     </footer>
         <div class="cookieinfo">
-        <div class="cookieinfo-close">
-            ✖
+        <div class="cookieinfo-close">            ✖
         </div>
         <span class="cookieinfo-text">
                We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies. <a class="cookieinfo-link" href="http://wikipedia.org/wiki/HTTP_cookie">More info</a>

public/internal/header.php

@@ -22,7 +22,6 @@ function getHeader($pagetitle, $navselect)
         <title > $pagetitle - Jonas Leder </title >
     
         <link href = "/css/style.css" rel = "stylesheet" >
-        <link href = "/css/fas.css" rel = "stylesheet" >
     </head >
     <body >
     <header >

scss/Fork-Awesome/_animated.scss

-// Spinning Icons
-// --------------------------
-
-.#{$fa-css-prefix}-spin {
-  -webkit-animation: #{$fa-css-prefix}-spin 2s infinite linear;
-          animation: #{$fa-css-prefix}-spin 2s infinite linear;
-}
-
-.#{$fa-css-prefix}-pulse {
-  -webkit-animation: #{$fa-css-prefix}-spin 1s infinite steps(8);
-          animation: #{$fa-css-prefix}-spin 1s infinite steps(8);
-}
-
-@-webkit-keyframes #{$fa-css-prefix}-spin {
-  0% {
-    -webkit-transform: rotate(0deg);
-            transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(359deg);
-            transform: rotate(359deg);
-  }
-}
-
-@keyframes #{$fa-css-prefix}-spin {
-  0% {
-    -webkit-transform: rotate(0deg);
-            transform: rotate(0deg);
-  }
-  100% {
-    -webkit-transform: rotate(359deg);
-            transform: rotate(359deg);
-  }
-}

scss/Fork-Awesome/_bordered-pulled.scss

-// Bordered & Pulled
-// -------------------------
-
-.#{$fa-css-prefix}-border {
-  padding: .2em .25em .15em;
-  border: solid .08em $fa-border-color;
-  border-radius: .1em;
-}
-
-.#{$fa-css-prefix}-pull-left { float: left; }
-.#{$fa-css-prefix}-pull-right { float: right; }
-
-.#{$fa-css-prefix} {
-  &.#{$fa-css-prefix}-pull-left { margin-right: .3em; }
-  &.#{$fa-css-prefix}-pull-right { margin-left: .3em; }
-}
-
-/* Deprecated as of 4.4.0 */
-.pull-right { float: right; }
-.pull-left { float: left; }
-
-.#{$fa-css-prefix} {
-  &.pull-left { margin-right: .3em; }
-  &.pull-right { margin-left: .3em; }
-}

scss/Fork-Awesome/_core.scss

-// Base Class Definition
-// -------------------------
-
-.#{$fa-css-prefix} {
-  display: inline-block;
-  font: normal normal normal #{$fa-font-size-base}/#{$fa-line-height-base} #{$fa-font-family}; // shortening font declaration
-  font-size: inherit; // can't have font-size inherit on line above, so need to override
-  text-rendering: auto; // optimizelegibility throws things off #1094
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-}

scss/Fork-Awesome/_fixed-width.scss

-// Fixed Width Icons
-// -------------------------
-.#{$fa-css-prefix}-fw {
-  width: (18em / 14);
-  text-align: center;
-}

scss/Fork-Awesome/_functions.scss

-// Functions
-// --------------------------
-
-// Helper function which adds quotes to preserve unicode values in CSS output.
-//
-// See: https://github.com/sass/sass/issues/1395
-// See: https://stackoverflow.com/questions/30421570/sass-unicode-escape-is-not-preserved-in-css-file
-
-@function fa-content($fa-var) {
-  @return unquote("\"#{$fa-var}\"");
-}

scss/Fork-Awesome/_larger.scss

-// Icon Sizes
-// -------------------------
-
-/* makes the font 33% larger relative to the icon container */
-.#{$fa-css-prefix}-lg {
-  font-size: (4em / 3);
-  line-height: (3em / 4);
-  vertical-align: -15%;
-}
-.#{$fa-css-prefix}-2x { font-size: 2em; }
-.#{$fa-css-prefix}-3x { font-size: 3em; }
-.#{$fa-css-prefix}-4x { font-size: 4em; }
-.#{$fa-css-prefix}-5x { font-size: 5em; }

scss/Fork-Awesome/_list.scss

-// List Icons
-// -------------------------
-
-.#{$fa-css-prefix}-ul {
-  padding-left: 0;
-  margin-left: $fa-li-width;
-  list-style-type: none;
-  > li { position: relative; }
-}
-.#{$fa-css-prefix}-li {
-  position: absolute;
-  left: -$fa-li-width;
-  width: $fa-li-width;
-  top: (2em / 14);
-  text-align: center;
-  &.#{$fa-css-prefix}-lg {
-    left: -$fa-li-width + (4em / 14);
-  }
-}

scss/Fork-Awesome/_main.scss

-/*!
-Fork Awesome 1.2.0
-License - https://forkaweso.me/Fork-Awesome/license
-
-Copyright 2018 Dave Gandy & Fork Awesome
-
-Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
- */
-
-
-@import "variables";
-@import "mixins";
-@import "functions";
-@import "path";
-@import "core";
-@import "larger";
-@import "fixed-width";
-@import "list";
-@import "bordered-pulled";
-@import "animated";
-@import "rotated-flipped";
-@import "stacked";
-@import "icons";
-@import "screen-reader";

scss/Fork-Awesome/_mixins.scss

-// Mixins
-// --------------------------
-
-@mixin fa-icon() {
-  display: inline-block;
-  font: normal normal normal #{$fa-font-size-base}/#{$fa-line-height-base} #{$fa-font-family}; // shortening font declaration
-  font-size: inherit; // can't have font-size inherit on line above, so need to override
-  text-rendering: auto; // optimizelegibility throws things off #1094
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-
-}
-
-@mixin fa-icon-rotate($degrees, $rotation) {
-  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})";
-  -webkit-transform: rotate($degrees);
-      -ms-transform: rotate($degrees);
-          transform: rotate($degrees);
-}
-
-@mixin fa-icon-flip($horiz, $vert, $rotation) {
-  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)";
-  -webkit-transform: scale($horiz, $vert);
-      -ms-transform: scale($horiz, $vert);
-          transform: scale($horiz, $vert);
-}
-
-
-// Only display content to screen readers. A la Bootstrap 4.
-//
-// See: http://a11yproject.com/posts/how-to-hide-content/
-
-@mixin sr-only {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  padding: 0;
-  margin: -1px;
-  overflow: hidden;
-  clip: rect(0,0,0,0);
-  border: 0;
-}
-
-// Use in conjunction with .sr-only to only display content when it's focused.
-//
-// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
-//
-// Credit: HTML5 Boilerplate
-
-@mixin sr-only-focusable {
-  &:active,
-  &:focus {
-    position: static;
-    width: auto;
-    height: auto;
-    margin: 0;
-    overflow: visible;
-    clip: auto;
-  }
-}

scss/Fork-Awesome/_path.scss

-/* FONT PATH
- * -------------------------- */
-
-@font-face {
-  font-family: '#{$fa-font-family}';
-  src: url('#{$fa-font-path}/forkawesome-webfont.eot?v=#{$fa-version}');
-  src: url('#{$fa-font-path}/forkawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
-    url('#{$fa-font-path}/forkawesome-webfont.woff2?v=#{$fa-version}') format('woff2'),
-    url('#{$fa-font-path}/forkawesome-webfont.woff?v=#{$fa-version}') format('woff'),
-    url('#{$fa-font-path}/forkawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),
-    url('#{$fa-font-path}/forkawesome-webfont.svg?v=#{$fa-version}#forkawesomeregular') format('svg');
-//  src: url('#{$fa-font-path}/ForkAwesome.otf') format('opentype'); // used when developing fonts
-  font-weight: normal;
-  font-style: normal;
-  font-display: block;
-}

scss/Fork-Awesome/_rotated-flipped.scss

-// Rotated & Flipped Icons
-// -------------------------
-
-.#{$fa-css-prefix}-rotate-90  { @include fa-icon-rotate(90deg, 1);  }
-.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
-.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
-
-.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
-.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1, 2); }
-
-// Hook for IE8-9
-// -------------------------
-
-:root .#{$fa-css-prefix}-rotate-90,
-:root .#{$fa-css-prefix}-rotate-180,
-:root .#{$fa-css-prefix}-rotate-270,
-:root .#{$fa-css-prefix}-flip-horizontal,
-:root .#{$fa-css-prefix}-flip-vertical {
-  filter: none;
-}

scss/Fork-Awesome/_screen-reader.scss

-// Screen Readers
-// -------------------------
-
-.sr-only { @include sr-only(); }
-.sr-only-focusable { @include sr-only-focusable(); }

scss/Fork-Awesome/_stacked.scss

-// Stacked Icons
-// -------------------------
-
-.#{$fa-css-prefix}-stack {
-  position: relative;
-  display: inline-block;
-  width: 2em;
-  height: 2em;
-  line-height: 2em;
-  vertical-align: middle;
-}
-.#{$fa-css-prefix}-stack-1x, .#{$fa-css-prefix}-stack-2x {
-  position: absolute;
-  left: 0;
-  width: 100%;
-  text-align: center;
-}
-.#{$fa-css-prefix}-stack-1x { line-height: inherit; }
-.#{$fa-css-prefix}-stack-2x { font-size: 2em; }
-.#{$fa-css-prefix}-inverse { color: $fa-inverse; }

scss/_footer.scss

@@ -21,12 +21,23 @@ footer{
       margin-top: 0;
     }
 
-    a {
+    a{
       color: $text-color;
       transition: color $link-hover-animation-time;
+
+      &:hover{
+        color: $accent-color;
+      }
     }
-    a:hover{
-      color: $accent-color;
+
+    a svg {
+      fill: $text-color;
+      max-width: 30px;
+      transition: fill $link-hover-animation-time;
+
+      &:hover{
+        fill: $accent-color;
+      }
     }
   }