jekyll-theme-centos 0.9.20220805132206 → 2.0.8

data/_layouts/search.html

@@ -5,8 +5,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
     <title>{{ page.title }}</title>
-    <link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicon.png">
-    <link rel="stylesheet" href="/assets/css/centos.bootstrap.min.css">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ site.baseurl }}/assets/img/favicon.png">
+    <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/centos.bootstrap.min.css">
     <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.6.0/dist/instantsearch.min.css">
     <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/instantsearch.js@2.6.0/dist/instantsearch-theme-algolia.min.css">
 </head>
@@ -32,9 +32,7 @@
 
   {% include footer.html -%}
 
-  <script src="/assets/js/jquery.min.js"></script>
-  <script src="/assets/js/bootstrap.min.js"></script>
-  <script src="/assets/js/customization.js"></script>
+  <script src="{{ site.baseurl }}/assets/js/bootstrap.bundle.min.js"></script>
 </body>
 
 </html>

data/_sass/centos/_links.scss

@@ -0,0 +1,62 @@
+/* CentOS Links
+ *
+ * Thanks Harshil Patel for sharing the code used as reference.
+ * https://css-tricks.com/css-link-hover-effects/
+ */
+a {
+  position: relative;
+  padding-bottom: 5px;
+
+  &::before {
+    content: '';
+    position: absolute;
+    width: 100%;
+    height: 3px;
+    bottom: 0;
+    left: 0;
+    transform-origin: right;
+    transform: scaleX(0);
+    transition: transform .1s ease-in-out;
+    background-color: var(--bs-primary);
+  }
+  &:hover{
+    color: var(--bs-primary);
+  }
+  &:hover::before {
+    transform-origin: left;
+    transform: scaleX(1);
+  }
+}
+
+// --------------------------------------------------------------------------------
+// Exceptions
+//
+// By default, the link effects defined above are applied to all anchor
+// elements. This is the desired behavior in most of cases. However there are
+// some elements in which we don't what to apply the link effect. Such
+// elements/classes are specified below.
+// --------------------------------------------------------------------------------
+.navbar, .rollers {
+  a {
+    &::before {
+      content: none;
+    }
+  }
+}
+.btn, .navbar-brand  {
+  &::before {
+    content: none;
+  }
+}
+
+// --------------------------------------------------------------------------------
+// Navbar and linked headings' correction.
+//
+// By default, when you access page headings from the page table of content
+// (toc) links, the heading is hidden behind the navbar.  This workaround fixes
+// the linked headings visibility issue in the page.
+// --------------------------------------------------------------------------------
+h1,h2,h3,h4,h5,h6 {
+  padding-top: calc(#{$navbar-brand-height} * 2);
+  margin-top: calc(#{$navbar-brand-height} * -2);
+}

data/_sass/centos/_sponsors.scss

@@ -0,0 +1,112 @@
+/* Sponsors' rolling images used in the homepage.
+ *
+ * Thanks Anand Vunnam for sharing the code used as reference.
+ * https://bbbootstrap.com/snippets/bootstrap-5-rolling-images-animation-33714815
+ **/
+@keyframes roll {
+  0% {
+    left: 0%;
+  }
+  100% {
+    left: -100%;
+  }
+}
+@keyframes roll-reverse {
+  0% {
+    left: 100%;
+  }
+  100% {
+  left: 0%; }
+}
+@keyframes roll-clockwise {
+  0% {
+    left: -100%;
+  }
+  100% {
+  left: 0%; }
+}
+@keyframes roll-reverse-clockwise {
+  0% {
+    left: 0%;
+  }
+  100% {
+    left: 100%;
+  }
+}
+.container {
+  .start-roller {
+    left: 0;
+    top: 0;
+    background-image: linear-gradient(to right, #f8f9fa 30%, #f8f9fa00);
+  }
+  .end-roller {
+    right: 0;
+    top: 0;
+    background-image: linear-gradient(to left, #f8f9fa 30%, #f8f9fa00);
+  }
+  .start-roller, .end-roller {
+    height: 100%;
+    width: 40px;
+    position: absolute;
+    z-index: 1;
+  }
+  .rollers {
+    flex: 0 0 230px;
+    .wrapper {
+      position: relative;
+      // You may need to adjust the wrapper width based on the number of images
+      // you are loading. In our case, 15600px is fine to present 65 images.
+      // The image size expected is 200x60 pixels.
+      width: 15600px;
+      height: 80px;
+      margin: 0 0 20px 0;
+      flex: 0 0 auto;
+      .items-container {
+        display: flex;
+        align-items: center;
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        animation-duration: 240s;
+        animation-iteration-count: infinite;
+        animation-timing-function: linear;
+        &.roll-LL {
+          animation-name: roll;
+        }
+        &.roll-RL {
+          animation-name: roll-reverse;
+          left: 100%;
+        }
+        &.reverse-roll-LL {
+          animation-name: roll-clockwise;
+          left: -100%;
+        }
+        &.reverse-roll-RL {
+          animation-name: roll-reverse-clockwise;
+          left: 100%;
+        }
+        .item {
+          flex: 1 1 200px;
+          min-width: 0;
+          margin: 20px;
+          .company {
+            filter: grayscale(100%);
+            opacity: 0.2;
+            width: 100%;
+            object-fit: scale-down;
+            opacity: 0.4;
+            &:hover {
+              filter: grayscale(0%);
+              opacity: 1;
+              cursor: pointer;
+            }
+          }
+          img {
+            vertical-align: middle;
+            height: 60px;
+          }
+        }
+      }
+    }
+  }
+}

data/_sass/centos/_variables.scss

@@ -1,53 +1,25 @@
-// Variables
 //
-// Variables should follow the `$component-state-property-size` formula for
-// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
-$centos-color-0:                    #9ccd2a;
-$centos-color-1:                    #efa724;
-$centos-color-2:                    #a14f8c;
-$centos-color-3:                    #262577;
-$centos-img-logo:                   "../img/logo.png";
-$centos-img-motif:                  "../img/motif.png";
-
-// Color system - based in the artistic motif palette and the number of
-// occurrence each color has in the image.
-$white:                             #fff;
-$primary:                           $centos-color-2;
-$secondary:                         $centos-color-3;
-$dark:                              #020008;
-
-// Header
-$home-header-padding-top:           202px;
-$home-header-padding-bottom:        150px;
-$page-header-padding-top:           152px;
-$page-header-padding-bottom:        100px;
-$heading-margin-top:                1rem;
-$scroll-margin-top:                 $heading-margin-top * 2.6;
-
-// Body - settings for `<body>` element.
-$body-bg:                           #f0f0f0;
-$body-color:                        $dark;
-
-// Paragraphs
-$paragraph-margin-bottom:           1.8rem;
-$code-color:                        $dark;
-
-// Typography - Font, line-height, and color for body text, headings, and more.
-$font-family-path:                  "../fonts";
-$font-family-sans-serif:            Montserrat;
-$line-height-base:                  1.75;
-$headings-line-height:              $line-height-base - 0.3;
-$headings-font-weight:              700;
-
-// Dropdown menu container and contents.
-$dropdown-bg:                       $dark;
-$dropdown-link-color:               $white;
-$dropdown-link-hover-color:         $white;
-$dropdown-link-hover-bg:            rgba($primary, .2);
-
-// Breadcrumbs
-$breadcrumb-bg:                     transparent;
-$breadcrumb-padding-x:              0;
-
-// Tables
-$table-dark-bg:                     $dark;
+// CentOS Branding
+//
+$centos-color-1: #a14f8c;
+$centos-color-2: #262577;
+$centos-color-3: #9ccd2a;
+$centos-color-4: #efa724;
+//
+// Bootstrap v5 customization variables
+//
+$enable-rounded:              true;
+$enable-negative-margins:     true;
+$nav-pills-link-active-bg:    $centos-color-1;
+$link-color:                  $centos-color-1;
+$link-decoration:             none;
+$primary:                     $centos-color-1;
+$secondary:                   $centos-color-4;
+$dark:                        #200735;
+$dropdown-dark-bg:            $dark;
+$gradient:                    linear-gradient(rgba(239,167,36,0.3), rgba(161,79,140,0.3) 30%, rgba(255,255,255,1));
+$font-family-sans-serif:      Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
+$font-family-monospace:       overpass-mono, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
+$headings-font-weight:        700;
+$line-height-base:            1.75;
+$headings-line-height:        1.85;

data/_sass/centos/centos-lists.scss

@@ -20,7 +20,6 @@
           border-bottom: 1px solid #ccc;
           border-top: 1px solid #ccc;
           max-height: none;
-          font-size: 1rem;
           padding: 0;
           padding-top: 1rem;
           padding-bottom: 1rem;

data/_sass/centos/fonts/_montserrat.scss

@@ -3,126 +3,126 @@
 	font-family: "Montserrat";
 	font-weight: 100;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Thin.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Thin.woff") format("woff");
+	src: url("../webfonts/Montserrat-Thin.woff2") format("woff2"), url("../webfonts/Montserrat-Thin.woff") format("woff");
 }
 /** Montserrat Thin-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 100;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-ThinItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-ThinItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-ThinItalic.woff2") format("woff2"), url("../webfonts/Montserrat-ThinItalic.woff") format("woff");
 }
 /** Montserrat ExtraLight **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 200;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-ExtraLight.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-ExtraLight.woff") format("woff");
+	src: url("../webfonts/Montserrat-ExtraLight.woff2") format("woff2"), url("../webfonts/Montserrat-ExtraLight.woff") format("woff");
 }
 /** Montserrat ExtraLight-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 200;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-ExtraLightItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-ExtraLightItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-ExtraLightItalic.woff2") format("woff2"), url("../webfonts/Montserrat-ExtraLightItalic.woff") format("woff");
 }
 /** Montserrat Light **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 300;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Light.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Light.woff") format("woff");
+	src: url("../webfonts/Montserrat-Light.woff2") format("woff2"), url("../webfonts/Montserrat-Light.woff") format("woff");
 }
 /** Montserrat Light-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 300;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-LightItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-LightItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-LightItalic.woff2") format("woff2"), url("../webfonts/Montserrat-LightItalic.woff") format("woff");
 }
 /** Montserrat Regular **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 400;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Regular.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Regular.woff") format("woff");
+	src: url("../webfonts/Montserrat-Regular.woff2") format("woff2"), url("../webfonts/Montserrat-Regular.woff") format("woff");
 }
 /** Montserrat Regular-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 400;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-Italic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Italic.woff") format("woff");
+	src: url("../webfonts/Montserrat-Italic.woff2") format("woff2"), url("../webfonts/Montserrat-Italic.woff") format("woff");
 }
 /** Montserrat Medium **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 500;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Medium.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Medium.woff") format("woff");
+	src: url("../webfonts/Montserrat-Medium.woff2") format("woff2"), url("../webfonts/Montserrat-Medium.woff") format("woff");
 }
 /** Montserrat Medium-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 500;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-MediumItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-MediumItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-MediumItalic.woff2") format("woff2"), url("../webfonts/Montserrat-MediumItalic.woff") format("woff");
 }
 /** Montserrat SemiBold **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 600;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-SemiBold.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-SemiBold.woff") format("woff");
+	src: url("../webfonts/Montserrat-SemiBold.woff2") format("woff2"), url("../webfonts/Montserrat-SemiBold.woff") format("woff");
 }
 /** Montserrat SemiBold-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 600;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-SemiBoldItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-SemiBoldItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-SemiBoldItalic.woff2") format("woff2"), url("../webfonts/Montserrat-SemiBoldItalic.woff") format("woff");
 }
 /** Montserrat Bold **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 700;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Bold.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Bold.woff") format("woff");
+	src: url("../webfonts/Montserrat-Bold.woff2") format("woff2"), url("../webfonts/Montserrat-Bold.woff") format("woff");
 }
 /** Montserrat Bold-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 700;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-BoldItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-BoldItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-BoldItalic.woff2") format("woff2"), url("../webfonts/Montserrat-BoldItalic.woff") format("woff");
 }
 /** Montserrat ExtraBold **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 800;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-ExtraBold.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-ExtraBold.woff") format("woff");
+	src: url("../webfonts/Montserrat-ExtraBold.woff2") format("woff2"), url("../webfonts/Montserrat-ExtraBold.woff") format("woff");
 }
 /** Montserrat ExtraBold-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 800;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-ExtraBoldItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-ExtraBoldItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-ExtraBoldItalic.woff2") format("woff2"), url("../webfonts/Montserrat-ExtraBoldItalic.woff") format("woff");
 }
 /** Montserrat Black **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 900;
 	font-style: normal;
-	src: url("#{$font-family-path}/Montserrat-Black.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-Black.woff") format("woff");
+	src: url("../webfonts/Montserrat-Black.woff2") format("woff2"), url("../webfonts/Montserrat-Black.woff") format("woff");
 }
 /** Montserrat Black-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 900;
 	font-style: italic;
-	src: url("#{$font-family-path}/Montserrat-BlackItalic.woff2") format("woff2"), url("#{$font-family-path}/Montserrat-BlackItalic.woff") format("woff");
+	src: url("../webfonts/Montserrat-BlackItalic.woff2") format("woff2"), url("../webfonts/Montserrat-BlackItalic.woff") format("woff");
 }
 /** =================== MONTSERRAT ALTERNATES =================== **/
 /** Montserrat Alternates Thin **/
@@ -130,124 +130,124 @@
 	font-family: "Montserrat Alternates";
 	font-weight: 100;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Thin.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Thin.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Thin.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Thin.woff") format("woff");
 }
 /** Montserrat Alternates Thin-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 100;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-ThinItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-ThinItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-ThinItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-ThinItalic.woff") format("woff");
 }
 /** Montserrat Alternates ExtraLight **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 200;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-ExtraLight.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-ExtraLight.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-ExtraLight.woff2") format("woff2"), url("../webfonts/MontserratAlternates-ExtraLight.woff") format("woff");
 }
 /** Montserrat Alternates ExtraLight-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 200;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-ExtraLightItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-ExtraLightItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-ExtraLightItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-ExtraLightItalic.woff") format("woff");
 }
 /** Montserrat Alternates Light **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 300;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Light.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Light.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Light.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Light.woff") format("woff");
 }
 /** Montserrat Alternates Light-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 300;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-LightItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-LightItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-LightItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-LightItalic.woff") format("woff");
 }
 /** Montserrat Alternates Regular **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 400;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Regular.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Regular.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Regular.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Regular.woff") format("woff");
 }
 /** Montserrat Alternates Regular-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 400;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-Italic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Italic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Italic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Italic.woff") format("woff");
 }
 /** Montserrat Alternates Medium **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 500;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Medium.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Medium.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Medium.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Medium.woff") format("woff");
 }
 /** Montserrat Alternates Medium-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 500;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-MediumItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-MediumItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-MediumItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-MediumItalic.woff") format("woff");
 }
 /** Montserrat Alternates SemiBold **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 600;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-SemiBold.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-SemiBold.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-SemiBold.woff2") format("woff2"), url("../webfonts/MontserratAlternates-SemiBold.woff") format("woff");
 }
 /** Montserrat Alternates SemiBold-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 600;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-SemiBoldItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-SemiBoldItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-SemiBoldItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-SemiBoldItalic.woff") format("woff");
 }
 /** Montserrat Alternates Bold **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 700;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Bold.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Bold.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Bold.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Bold.woff") format("woff");
 }
 /** Montserrat Alternates Bold-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 700;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-BoldItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-BoldItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-BoldItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-BoldItalic.woff") format("woff");
 }
 /** Montserrat Alternates ExtraBold **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 800;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-ExtraBold.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-ExtraBold.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-ExtraBold.woff2") format("woff2"), url("../webfonts/MontserratAlternates-ExtraBold.woff") format("woff");
 }
 /** Montserrat Alternates ExtraBold-Italic **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 800;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-ExtraBoldItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-ExtraBoldItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-ExtraBoldItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-ExtraBoldItalic.woff") format("woff");
 }
 /** Montserrat Alternates Black **/
 @font-face {
 	font-family: "Montserrat Alternates";
 	font-weight: 900;
 	font-style: normal;
-	src: url("#{$font-family-path}/MontserratAlternates-Black.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-Black.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-Black.woff2") format("woff2"), url("../webfonts/MontserratAlternates-Black.woff") format("woff");
 }
 /** Montserrat Alternates Black-Italic **/
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 900;
 	font-style: italic;
-	src: url("#{$font-family-path}/MontserratAlternates-BlackItalic.woff2") format("woff2"), url("#{$font-family-path}/MontserratAlternates-BlackItalic.woff") format("woff");
+	src: url("../webfonts/MontserratAlternates-BlackItalic.woff2") format("woff2"), url("../webfonts/MontserratAlternates-BlackItalic.woff") format("woff");
 }

data/_sass/centos/fonts/_overpass.scss

@@ -1,43 +1,43 @@
 @font-face {
   font-family: 'overpass-mono';
-  src: url('#{$font-family-path}/overpass-mono-light.eot');
-  src: url('#{$font-family-path}/overpass-mono-light.eot?#iefix') format('embedded-opentype'),
-       url('#{$font-family-path}/overpass-mono-light.woff2') format('woff2'),
-       url('#{$font-family-path}/overpass-mono-light.woff') format('woff'),
-       url('#{$font-family-path}/overpass-mono-light.ttf')  format('truetype');
+  src: url('../webfonts/OverpassMono-Light.eot');
+  src: url('../webfonts/OverpassMono-Light.eot?#iefix') format('embedded-opentype'),
+       url('../webfonts/OverpassMono-Light.woff2') format('woff2'),
+       url('../webfonts/OverpassMono-Light.woff') format('woff'),
+       url('../webfonts/OverpassMono-Light.ttf')  format('truetype');
        font-weight: 300;
        font-style: normal;
 }
 
 @font-face {
   font-family: 'overpass-mono';
-  src: url('#{$font-family-path}/overpass-mono-regular.eot');
-  src: url('#{$font-family-path}/overpass-mono-regular.eot?#iefix') format('embedded-opentype'),
-       url('#{$font-family-path}/overpass-mono-regular.woff2') format('woff2'),
-       url('#{$font-family-path}/overpass-mono-regular.woff') format('woff'),
-       url('#{$font-family-path}/overpass-mono-regular.ttf')  format('truetype');
+  src: url('../webfonts/OverpassMono-Regular.eot');
+  src: url('../webfonts/OverpassMono-Regular.eot?#iefix') format('embedded-opentype'),
+       url('../webfonts/OverpassMono-Regular.woff2') format('woff2'),
+       url('../webfonts/OverpassMono-Regular.woff') format('woff'),
+       url('../webfonts/OverpassMono-Regular.ttf')  format('truetype');
        font-weight: 400;
        font-style: normal;
 }
 
 @font-face {
   font-family: 'overpass-mono';
-  src: url('#{$font-family-path}/overpass-mono-semibold.eot');
-  src: url('#{$font-family-path}/overpass-mono-semibold.eot?#iefix') format('embedded-opentype'),
-       url('#{$font-family-path}/overpass-mono-semibold.woff2') format('woff2'),
-       url('#{$font-family-path}/overpass-mono-semibold.woff') format('woff'),
-       url('#{$font-family-path}/overpass-mono-semibold.ttf')  format('truetype');
+  src: url('../webfonts/OverpassMono-SemiBuild.eot');
+  src: url('../webfonts/OverpassMono-SemiBuild.eot?#iefix') format('embedded-opentype'),
+       url('../webfonts/OverpassMono-SemiBuild.woff2') format('woff2'),
+       url('../webfonts/OverpassMono-SemiBuild.woff') format('woff'),
+       url('../webfonts/OverpassMono-SemiBuild.ttf')  format('truetype');
        font-weight: 500;
        font-style: normal;
 }
 
 @font-face {
   font-family: 'overpass-mono';
-  src: url('#{$font-family-path}/overpass-mono-bold.eot');
-  src: url('#{$font-family-path}/overpass-mono-bold.eot?#iefix') format('embedded-opentype'),
-       url('#{$font-family-path}/overpass-mono-bold.woff2') format('woff2'),
-       url('#{$font-family-path}/overpass-mono-bold.woff') format('woff'),
-       url('#{$font-family-path}/overpass-mono-bold.ttf')  format('truetype');
+  src: url('../webfonts/OverpassMono-Bold.eot');
+  src: url('../webfonts/OverpassMono-Bold.eot?#iefix') format('embedded-opentype'),
+       url('../webfonts/OverpassMono-Bold.woff2') format('woff2'),
+       url('../webfonts/OverpassMono-Bold.woff') format('woff'),
+       url('../webfonts/OverpassMono-Bold.ttf')  format('truetype');
        font-weight: 600;
        font-style: normal;
 }