jekyll-theme-centos 0.5.10 → 0.6.2

data/_sass/centos/_main.scss

@@ -27,6 +27,7 @@
       }
     }
     &__planet, &__news-and-events {
+      a { font-weight: bold; }
       @include link-list;
     }
   }
@@ -177,16 +178,15 @@
         border: none;
         padding: 15px;
         text-align: left;
-        &__image {
-          img {
-            width: auto;
-            height: 50px;
-          }
+        img {
+          width: auto;
+          height: 50px;
         }
         &__body {
-          &__title {
+          &_title {
+            display: none;
           }
-          &__description {
+          &_description {
           }
         }
       }

data/_sass/centos/_nav.scss

@@ -1,6 +1,13 @@
 .navbar {
   box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
   &-dark {
-    background: $black;
+    background: $dark;
+  }
+  &-brand {
+    .manifestation {
+      color: white;
+      font-size: small;
+      padding-left: 5px;
+    }
   }
 }

data/_sass/centos/_toc.scss

@@ -20,7 +20,7 @@
     list-style: none;
     &:before {
       @extend .fas;
-      color: $secondary;
+      color: $primary;
       margin-right: 5px;
       content: fa-content($fa-var-angle-right);
     }

data/_sass/centos/_variables.scss

@@ -1,47 +1,30 @@
-// Variables
-//
-// Variables should follow the `$component-state-property-size` formula for
-// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
-//
-
-//
 /* ----------------------------------------------------------------------
- * Color system
+ * Fontawesome
  * ---------------------------------------------------------------------- */
-$white:                             #fff;
-$black:                             #000;
-$dark:                              #343a40;
+@import "fontawesome/fontawesome";
+@import "fontawesome/solid";
+@import "fontawesome/brands";
 
 /* ----------------------------------------------------------------------
- * Nord Identity
- * ---------------------------------------------------------------------- */
-$nord-color-0:                      #2e3440;
-$nord-color-1:                      #3b4252;
-$nord-color-2:                      #434c5e;
-$nord-color-3:                      #4c566a;
-$nord-color-4:                      #d8dee9;
-$nord-color-5:                      #e5e9f0;
-$nord-color-6:                      #eceff4;
-$nord-color-7:                      #8fbcbb;
-$nord-color-8:                      #88c0d0;
-$nord-color-9:                      #81a1c1;
-$nord-color-10:                     #5e81ac;
-$nord-color-11:                     #bf616a;
-$nord-color-12:                     #d08770;
-$nord-color-13:                     #ebcb8b;
-$nord-color-14:                     #a3be8c;
-$nord-color-15:                     #b48ead;
-/* ----------------------------------------------------------------------
- * CentOS Identity
+ * CentOS Theme
  * ---------------------------------------------------------------------- */
-$color-0:                           #9ccd2a;
-$color-1:                           #efa724;
-$color-2:                           #a14f8c;
-$color-3:                           #262577;
+$centos-color-0:                    #9ccd2a;
+$centos-color-1:                    #efa724;
+$centos-color-2:                    #a14f8c;
+$centos-color-3:                    #262577;
+$centos-img-logo:                   "/assets/img/logo.png";
+$centos-img-motif:                  "/assets/img/motif.png";
 
-$logo-image:                        "/assets/img/logo.png";
-$background-image:                  "/assets/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:                           #6226a9;
+$secondary:                         #0f1c4c;
+$dark:                              #05112b;
 
+/* Header
+ */
 $home-header-padding-top:           202px;
 $home-header-padding-bottom:        150px;
 $page-header-padding-top:           152px;
@@ -49,40 +32,40 @@ $page-header-padding-bottom:        100px;
 $heading-margin-top:                1rem;
 $scroll-margin-top:                 $heading-margin-top * 2.6;
 
-// Body
-//
-// Settings for the `<body>` element.
-
+/* Body - settings for `<body>` element.
+ */
 $body-bg:                           #f0f0f0;
-$body-color:                        #212529;
-
-// Paragraphs
-//
-// Style p element.
+$body-color:                        $dark;
 
+/* Paragraphs
+ */
 $paragraph-margin-bottom:           1.8rem;
 
-// Typography
-//
-// Font, line-height, and color for body text, headings, and more.
-
+/* Typography - Font, line-height, and color for body text, headings, and more.
+ */
+$font-family-path:                  "/assets/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:                       $black;
+/* Dropdown menu container and contents.
+ */
+$dropdown-bg:                       $dark;
 $dropdown-link-color:               $white;
 $dropdown-link-hover-color:         $white;
-$dropdown-link-hover-bg:            rgba($white, .2);
+$dropdown-link-hover-bg:            rgba($primary, .2);
 
-// Breadcrumbs
+/* Breadcrumbs
+ */
 $breadcrumb-bg:                     transparent;
 $breadcrumb-padding-x:              0;
 
-//
-//$component-active-color:            $white;
-//#$component-active-bg:               $dark;
+/* Tables
+ */
+$table-dark-bg:                     $dark;
+
+/* ----------------------------------------------------------------------
+ * Bootstrap
+ * ---------------------------------------------------------------------- */
+@import "bootstrap/bootstrap";

data/_sass/centos/centos.scss

@@ -1,18 +1,10 @@
 /*!
- * CentOS Theme
- * Copyright 2020 Alain Reguera Delgado <areguera@centosproject.org>
- * Licensed under MIT
+ * jekyll-theme-centos v0.6.2 (https://gitlab.com/areguera/jekyll-theme-centos/)
+ * Copyright 2020-2021 Alain Reguera Delgado
+ * Licensed under MIT (https://gitlab.com/areguera/jekyll-theme-centos/-/blob/master/LICENSE)
  */
-
-@import "fontawesome/fontawesome";
-@import "fontawesome/solid";
-@import "fontawesome/brands";
-
 @import "_variables";
 @import "_fonts";
-
-@import "bootstrap/bootstrap";
-
 @import "_mixins";
 @import "_datatable";
 @import "_highlighter";

data/_sass/centos/fonts/_montserrat.scss

@@ -1,7 +1,4 @@
-/** =================== MONTSERRAT =================== **/
 /** Montserrat Thin **/
-$font-family-path: "../fonts/Montserrat";
-
 @font-face {
 	font-family: "Montserrat";
 	font-weight: 100;

data/_sass/centos/fonts/_overpass.scss

@@ -0,0 +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');
+       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');
+       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');
+       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');
+       font-weight: 600;
+       font-style: normal;
+}

data/_sass/centos/mixins/_code-header.scss

@@ -1,40 +1,60 @@
+/* code-header
+ */
 @mixin code-header {
 
   .code-header {
+    @extend .bg-light;
     display: flex;
-    justify-content: flex-end;
-    background: $black;
-  }
-
-  .copy-code-button {
-    @extend .btn, .btn-dark, .shadow-none;
-    border-radius: 0px;
-    display: grid;
-    grid-auto-flow: column;
+    justify-content: space-between;
     align-items: center;
-    grid-column-gap: 4px;
-    border: none;
-    cursor: pointer;
-    background-color: $black;
-    font-size: small;
+    padding-left: 10px;
+    font-size: small; 
 
-    &:before {
-      @extend .fas;
-      content: fa-content($fa-var-clipboard);
-    }
-    &:after {
-      content: "Copy";
-      display: block;
+    &--description {
+      &-code {
+        &:before { @extend .fas; content: fa-content($fa-var-code); padding-right: 5px; }
+      }
+      &-python {
+        &:before { @extend .fab; content: fa-content($fa-var-python); padding-right: 5px; }
+      }
+      &-terminal {
+        &:before { @extend .fas; content: fa-content($fa-var-terminal); padding-right: 5px; }
+      }
+      &-key {
+        &:before { @extend .fas; content: fa-content($fa-var-key); padding-right: 5px; }
+      }
     }
 
-    // This class will be toggled via JavaScript
-    &.copied {
-      &:before {
-        @extend .fas;
-        content: fa-content($fa-var-clipboard-check);
-      }
-      &:after {
-        content: "Copied!";
+    &--button {
+      .copy-code-button {
+        @extend .btn, .btn-light, .shadow-none, .btn-sm;
+        border-radius: 0px;
+        display: grid;
+        grid-auto-flow: column;
+        align-items: center;
+        grid-column-gap: 4px;
+        border: none;
+        cursor: pointer;
+        font-size: small;
+
+        &:before {
+          @extend .fas;
+          content: fa-content($fa-var-clipboard);
+        }
+        &:after {
+          content: "Copy";
+        }
+
+        // This class will be toggled via JavaScript
+        &.copied {
+          &:before {
+            @extend .fas;
+            content: fa-content($fa-var-clipboard-check);
+          }
+          &:after {
+            content: "Copied!";
+          }
+        }
       }
     }
   }

data/_sass/centos/mixins/_content.scss

@@ -3,7 +3,7 @@
   background: #fff;
   padding: 2.75rem;
   margin-top: -120px;
-  min-height: 430px;
+  min-height: 490px;
   box-shadow: 0px -2px 3px 0px rgba(50, 50, 50, 0.25);
 
   h1, h2, h3, h4, h5, h6 {
@@ -16,7 +16,7 @@
 
   h2 {
     margin-top: $scroll-margin-top;
-    border-bottom: 3px solid $body-color;
+    border-bottom: 3px solid $dark;
   }
 
   img {
@@ -25,8 +25,13 @@
   }
 
   pre {
+    font-family: "overpass-mono";
     @extend .highlight, .pre-scrollable;
-    padding: 1rem;
+    padding: 5px 10px;
+  }
+
+  code {
+    font-family: "overpass-mono";
   }
 
   table {

data/_sass/centos/mixins/_link-list.scss

@@ -7,9 +7,9 @@
       margin-left: 1em;
       &:before {
         @extend .fas;
-        color: $secondary;
         margin-right: 0.5em;
         margin-left: -1em;
+        color: $primary;
         content: fa-content($fa-var-angle-right);
       }
     }