Merge branch 'master' into 'master'

Replace vendor css and js with gems. Using sprockets. Update bundle. Remove...

See merge request unitoo/websites/unitoo-site!68

Gemfile

@@ -1,11 +1,16 @@
 source 'https://rubygems.org'
 
-gem 'jekyll', '~> 3.8.6'
+gem 'kramdown-parser-gfm'
-gem 'sprockets', '~> 3.7'
+gem 'jekyll', '~> 3'
+gem 'sprockets'
+gem 'uglifier'
 
 group :jekyll_plugins do
-  gem 'jekyll-feed', '~> 0.6'
+  gem 'popper_js'
-  gem 'jekyll-assets'
+  gem 'bootstrap', '~> 4'
+  gem 'font-awesome-sass'
+
+  gem "jekyll-assets", git: 'https://github.com/UnitooTeam/jekyll-assets.git'
   gem 'jekyll-seo'
   gem 'jekyll-seo-tag', git: 'https://github.com/UnitooTeam/jekyll-seo-tag.git'
   gem 'jekyll-sitemap'

Gemfile.lock

@@ -1,3 +1,20 @@
+GIT
+  remote: https://github.com/UnitooTeam/jekyll-assets.git
+  revision: 16e4e543639dd2ffcf2e949a27a68cfbc0cba798
+  specs:
+    jekyll-assets (4.0.0.alpha)
+      activesupport (>= 5, < 7)
+      execjs (~> 2.7)
+      extras (~> 0.2)
+      fastimage (~> 2.0, >= 1.8)
+      jekyll (>= 3.5, < 5.0)
+      jekyll-sanity (~> 1.2)
+      liquid-tag-parser (>= 1, < 3)
+      nokogiri (~> 1.10)
+      pathutil (~> 0.16)
+      sassc (>= 1.11, < 3.0)
+      sprockets (~> 4.0.beta7)
+
 GIT
   remote: https://github.com/UnitooTeam/jekyll-seo-tag.git
   revision: 40727f3d6461a8468152f7fc35374f465d758bf5
@@ -8,56 +25,68 @@ GIT
 GEM
   remote: https://rubygems.org/
   specs:
-    activesupport (5.2.4.4)
+    actionpack (6.0.3.7)
+      actionview (= 6.0.3.7)
+      activesupport (= 6.0.3.7)
+      rack (~> 2.0, >= 2.0.8)
+      rack-test (>= 0.6.3)
+      rails-dom-testing (~> 2.0)
+      rails-html-sanitizer (~> 1.0, >= 1.2.0)
+    actionview (6.0.3.7)
+      activesupport (= 6.0.3.7)
+      builder (~> 3.1)
+      erubi (~> 1.4)
+      rails-dom-testing (~> 2.0)
+      rails-html-sanitizer (~> 1.1, >= 1.2.0)
+    activesupport (6.0.3.7)
       concurrent-ruby (~> 1.0, >= 1.0.2)
       i18n (>= 0.7, < 2)
       minitest (~> 5.1)
       tzinfo (~> 1.1)
+      zeitwerk (~> 2.2, >= 2.2.2)
     addressable (2.7.0)
       public_suffix (>= 2.0.2, < 5.0)
+    autoprefixer-rails (10.2.5.1)
+      execjs (> 0)
+    bootstrap (4.6.0)
+      autoprefixer-rails (>= 9.1.0)
+      popper_js (>= 1.14.3, < 2)
+      sassc-rails (>= 2.0.0)
+    builder (3.2.4)
     colorator (1.1.0)
-    concurrent-ruby (1.1.7)
+    concurrent-ruby (1.1.9)
+    crass (1.0.6)
     cssminify2 (2.0.1)
     em-websocket (0.5.2)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0.6.0)
+    erubi (1.10.0)
     eventmachine (1.2.7)
-    execjs (2.7.0)
+    execjs (2.8.1)
     extras (0.3.0)
       forwardable-extended (~> 2.5)
-    fastimage (2.2.1)
+    fastimage (2.2.4)
-    ffi (1.14.2)
+    ffi (1.15.1)
+    font-awesome-sass (5.15.1)
+      sassc (>= 1.11)
     forwardable-extended (2.6.0)
     htmlcompressor (0.4.0)
     http_parser.rb (0.6.0)
     i18n (0.9.5)
       concurrent-ruby (~> 1.0)
-    jekyll (3.8.7)
+    jekyll (3.9.1)
       addressable (~> 2.4)
       colorator (~> 1.0)
       em-websocket (~> 0.5)
       i18n (~> 0.7)
       jekyll-sass-converter (~> 1.0)
       jekyll-watch (~> 2.0)
-      kramdown (~> 1.14)
+      kramdown (>= 1.17, < 3)
       liquid (~> 4.0)
       mercenary (~> 0.3.3)
       pathutil (~> 0.9)
       rouge (>= 1.7, < 4)
       safe_yaml (~> 1.0)
-    jekyll-assets (3.0.12)
-      activesupport (~> 5.0)
-      execjs (~> 2.7)
-      extras (~> 0.2)
-      fastimage (~> 2.0, >= 1.8)
-      jekyll (>= 3.5, < 4.0)
-      jekyll-sanity (~> 1.2)
-      liquid-tag-parser (~> 1.0)
-      nokogiri (~> 1.8)
-      pathutil (~> 0.16)
-      sprockets (>= 3.3, < 4.1.beta)
-    jekyll-feed (0.15.1)
-      jekyll (>= 3.7, < 5.0)
     jekyll-minifier (0.1.10)
       cssminify2 (~> 2.0)
       htmlcompressor (~> 0.4)
@@ -79,26 +108,51 @@ GEM
     json (2.5.1)
     json-minify (0.0.3)
       json (> 0)
-    kramdown (1.17.0)
+    kramdown (2.3.1)
+      rexml
+    kramdown-parser-gfm (1.1.0)
+      kramdown (~> 2.0)
     liquid (4.0.3)
-    liquid-tag-parser (1.9.0)
+    liquid-tag-parser (2.0.2)
       extras (~> 0.3)
       liquid (>= 3.0, < 5.0)
-    listen (3.3.3)
+    listen (3.5.1)
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
+    loofah (2.10.0)
+      crass (~> 1.0.2)
+      nokogiri (>= 1.5.9)
     mercenary (0.3.6)
-    mini_portile2 (2.4.0)
+    method_source (1.0.0)
-    minitest (5.14.2)
+    mini_portile2 (2.5.3)
-    nokogiri (1.10.10)
+    minitest (5.14.4)
-      mini_portile2 (~> 2.4.0)
+    nokogiri (1.11.7)
+      mini_portile2 (~> 2.5.0)
+      racc (~> 1.4)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
+    popper_js (1.16.0)
     public_suffix (4.0.6)
+    racc (1.5.2)
     rack (2.2.3)
-    rb-fsevent (0.10.4)
+    rack-test (1.1.0)
+      rack (>= 1.0, < 3)
+    rails-dom-testing (2.0.3)
+      activesupport (>= 4.2.0)
+      nokogiri (>= 1.6)
+    rails-html-sanitizer (1.3.0)
+      loofah (~> 2.3)
+    railties (6.0.3.7)
+      actionpack (= 6.0.3.7)
+      activesupport (= 6.0.3.7)
+      method_source
+      rake (>= 0.8.7)
+      thor (>= 0.20.3, < 2.0)
+    rake (13.0.3)
+    rb-fsevent (0.11.0)
     rb-inotify (0.10.1)
       ffi (~> 1.0)
+    rexml (3.2.5)
     rouge (3.26.0)
     safe_yaml (1.0.5)
     sass (3.7.4)
@@ -106,28 +160,47 @@ GEM
     sass-listen (4.0.0)
       rb-fsevent (~> 0.9, >= 0.9.4)
       rb-inotify (~> 0.9, >= 0.9.7)
-    sprockets (3.7.2)
+    sassc (2.4.0)
+      ffi (~> 1.9)
+    sassc-rails (2.1.2)
+      railties (>= 4.0.0)
+      sassc (>= 2.0)
+      sprockets (> 3.0)
+      sprockets-rails
+      tilt
+    sprockets (4.0.2)
       concurrent-ruby (~> 1.0)
       rack (> 1, < 3)
+    sprockets-rails (3.2.2)
+      actionpack (>= 4.0)
+      activesupport (>= 4.0)
+      sprockets (>= 3.0.0)
+    thor (1.1.0)
     thread_safe (0.3.6)
+    tilt (2.0.10)
     tzinfo (1.2.9)
       thread_safe (~> 0.1)
     uglifier (4.2.0)
       execjs (>= 0.3.0, < 3)
+    zeitwerk (2.4.2)
 
 PLATFORMS
   ruby
 
 DEPENDENCIES
-  jekyll (~> 3.8.6)
+  bootstrap (~> 4)
-  jekyll-assets
+  font-awesome-sass
-  jekyll-feed (~> 0.6)
+  jekyll (~> 3)
+  jekyll-assets!
   jekyll-minifier
   jekyll-multiple-languages-plugin
   jekyll-seo
   jekyll-seo-tag!
   jekyll-sitemap
-  sprockets (~> 3.7)
+  kramdown-parser-gfm
+  popper_js
+  sprockets
+  uglifier
 
 BUNDLED WITH
    1.17.3

README.md

@@ -1,3 +1,17 @@
 # unitoo-site
 
 New Unitoo website based on Jekyll
+
+## How to contribute
+
+### Start dev server
+
+`bundle exec jekyll serve` and go to `localhost:4000`
+
+### Build for production
+
+1. Generate tags
+   `python3 tag-generator.py`
+
+2. Build Jekyll
+   `JEKYLL_BUILD=production bundle exec jekyll build`

_assets/javascripts/main.js

@@ -1,3 +1,12 @@
+//= require jquery
+// require popper
+// require jquery-ui
+//= require simple-jekyll-search
+//= require bootstrap
+//= require bootstrap-sprockets
+//= require morphext
+// require overhang
+
 /* Set the width of the side navigation to 250px */
 function openNav() {
     document.getElementById("mySidenav").style.width = "250px";
@@ -14,7 +23,7 @@ $(document).ready(function () {
         resultsContainer: document.getElementById('results-container'),
         json: '/search.json',
         searchResultTemplate: '<a class="dropdown-item" href="{url}">{title}</a>',
-        noResultsText: '<a class="dropdown-item" href="#">Nessun risultato</a>',
+        noResultsText: '<a class="dropdown-item" href="#">'+ $("meta[name='no-results']").attr('content') +'</a>',
         exclude: ["https://blog.unitoo.it", "https://blog.unitoo.pw"]
     });
 

_assets/oldcss/_base.scss

@@ -1,304 +0,0 @@
-/**
- * Reset some basic elements
- */
-body, h1, h2, h3, h4, h5, h6,
-p, blockquote, pre, hr,
-dl, dd, ol, ul, figure {
-    margin: 0;
-    padding: 0;
-}
-
-
-
-/**
- * Basic styling
- */
-body {
-    font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
-    color: $text-color;
-    background-color: $background-color;
-    -webkit-text-size-adjust: 100%;
-    -webkit-font-feature-settings: "kern" 1;
-    -moz-font-feature-settings: "kern" 1;
-    -o-font-feature-settings: "kern" 1;
-    font-feature-settings: "kern" 1;
-    font-kerning: normal;
-}
-
-
-
-/**
- * Set `margin-bottom` to maintain vertical rhythm
- */
-h1, h2, h3, h4, h5, h6,
-p, blockquote, pre,
-ul, ol, dl, figure,
-%vertical-rhythm {
-    margin-bottom: $spacing-unit / 2;
-}
-
-
-
-/**
- * Articles
- */
-article {
-    background: #faf9f5;
-    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.05);
-    margin-bottom: $spacing-unit;
-    padding: 3em 3em 1em;
-
-    @include media-query($on-palm) {
-        padding: 1em 1em 0.3em;
-    }
-
-    > .entry-content {
-        @include media-query($on-palm) {
-            font-size: 80%;
-        }
-
-        &:first-letter {
-            color: #b7b1a9;
-            display: inline-block;
-            float: left;
-            font-family: "Raleway", sans-serif;
-            font-size: 121px;
-            font-style: normal;
-            font-weight: 700;
-            line-height: 70px;
-            margin: 6px 10px 0 -5px;
-
-            @include media-query($on-palm) {
-                font-size: 70px;
-                line-height: 30px;
-            }
-        }
-
-        &:first-line {
-            color: #787065;
-            font-family: "Raleway", sans-serif;
-            font-size: 1em;
-            font-style: normal !important;
-            font-weight: bold;
-            letter-spacing: 2px;
-        }
-    }
-}
-
-.post-header {
-    margin-bottom: 2rem;
-    text-align: center;
-
-    &:before {
-        background: #faf9f5;
-        border: 1px solid #d9d6d0;
-        border-radius: 50%;
-        box-shadow: 0 0 0 4px #faf9f5;
-        color: #a09a92;
-        display: inline-block;
-        font-family: libretto-icons;
-        font-size: 21px;
-        line-height: 21px;
-        margin: 1rem auto 2rem;
-        text-shadow: none;
-        padding: 4px 10px 10px 10px;
-    }
-
-    > div {
-        color: $grey-color;
-        font-size: $base-font-size;
-        font-style: italic;
-
-        @include media-query($on-palm) {
-            font-size: $small-font-size;
-        }
-
-        &:before {
-            color: #d9d6d0;
-            display: inline-block;
-            font-family: libretto-icons;
-            font-size: 24px;
-            margin: 0 0.25rem;
-            text-shadow: none;
-            vertical-align: -6px;
-        }
-
-        &:after {
-            color: #d9d6d0;
-            display: inline-block;
-            font-family: libretto-icons;
-            font-size: 24px;
-            margin: 0 0.25rem;
-            text-shadow: none;
-            vertical-align: -6px;
-        }
-    }
-}
-
-.post-list {
-    .post-header {
-        &:before {
-            background: #eae9e6;
-            border-color: #faf9f5;
-            box-shadow: 0 0 0 4px #eae9e6;
-        }
-    }
-}
-
-
-
-/**
- * Images
- */
-img {
-    max-width: 100%;
-    vertical-align: middle;
-}
-
-.cover {
-    background-attachment: fixed;
-    background-size: cover;
-    background-repeat: no-repeat;
-    min-height: 100vh;
-}
-
-/**
- * Figures
- */
-figure {
-    background: #fff;
-    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.025);
-    padding: 0.5em;
-}
-
-figure > img {
-    display: block;
-}
-
-figcaption {
-    color: $grey-color;
-    font-size: 16px;
-    font-style: italic;
-    line-height: 1.2;
-    margin: 1em 0.5em 0.5em;
-    text-align: center;
-}
-
-
-
-/**
- * Lists
- */
-ul, ol {
-    margin-left: $spacing-unit;
-}
-
-li {
-    > ul,
-    > ol {
-         margin-bottom: 0;
-    }
-}
-
-
-
-/**
- * Headings
- */
-h1, h2, h3, h4, h5, h6 {
-    line-height: initial;
-    font-weight: $base-font-weight;
-}
-
-h5 { font-size: 1.25rem; }
-
-/**
- * Links
- */
-a {
-    color: $brand-color;
-    // text-decoration: none;
-
-    &:hover {
-        color: darken($brand-color, 5%);
-        // text-decoration: none;
-    }
-}
-
-
-
-/**
- * Blockquotes
- */
-blockquote {
-    color: $grey-color;
-    border-left: 4px solid $grey-color-light;
-    padding-left: $spacing-unit / 2;
-    font-size: 18px;
-    letter-spacing: -1px;
-    font-style: italic;
-
-    > :last-child {
-        margin-bottom: 0;
-    }
-}
-
-
-
-/**
- * Code formatting
- */
-pre,
-code {
-    font-size: 15px;
-    border: 1px solid $grey-color-light;
-    border-radius: 3px;
-    background-color: #eef;
-}
-
-code {
-    padding: 1px 5px;
-}
-
-pre {
-    padding: 8px 12px;
-    overflow-x: auto;
-
-    > code {
-        border: 0;
-        padding-right: 0;
-        padding-left: 0;
-    }
-}
-
-
-/**
- * Clearfix
- */
-%clearfix {
-
-    &:after {
-        content: "";
-        display: table;
-        clear: both;
-    }
-}
-
-
-
-/**
- * Icons
- */
-.icon {
-
-    > svg {
-        display: inline-block;
-        width: 16px;
-        height: 16px;
-        vertical-align: middle;
-
-        path {
-            fill: $grey-color;
-        }
-    }
-}

_assets/oldcss/_font.scss

@@ -1,64 +0,0 @@
-/* latin-ext */
-@font-face {
-    font-family: 'Raleway';
-    font-style: normal;
-    font-weight: 400;
-    src: local('Raleway'), local('Raleway-Regular'), asset_url("fonts/1Ptug8zYS_SKggPNyCMIT5lu.woff2") format('woff2');
-    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-    font-family: 'Raleway';
-    font-style: normal;
-    font-weight: 400;
-    src: local('Raleway'), local('Raleway-Regular'), asset_url("fonts/1Ptug8zYS_SKggPNyC0ITw.woff2") format('woff2');
-    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Libre Baskerville Italic'), local('LibreBaskerville-Italic'), asset_url("fonts/kmKhZrc3Hgbbcjq75U4uslyuy4kn0qNcWx8QDP2V.woff2") format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: italic;
-  font-weight: 400;
-  src: local('Libre Baskerville Italic'), local('LibreBaskerville-Italic'), asset_url("fonts/kmKhZrc3Hgbbcjq75U4uslyuy4kn0qNcWxEQDA.woff2") format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Libre Baskerville'), local('LibreBaskerville-Regular'), asset_url("fonts/kmKnZrc3Hgbbcjq75U4uslyuy4kn0qNXaxMICA.woff2") format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: normal;
-  font-weight: 400;
-  src: local('Libre Baskerville'), local('LibreBaskerville-Regular'), asset_url("fonts/kmKnZrc3Hgbbcjq75U4uslyuy4kn0qNZaxM.woff2") format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Libre Baskerville Bold'), local('LibreBaskerville-Bold'), asset_url("fonts/kmKiZrc3Hgbbcjq75U4uslyuy4kn0qviTgY5KcCsww.woff2") format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Libre Baskerville';
-  font-style: normal;
-  font-weight: 700;
-  src: local('Libre Baskerville Bold'), local('LibreBaskerville-Bold'), asset_url("fonts/kmKiZrc3Hgbbcjq75U4uslyuy4kn0qviTgY3KcA.woff2") format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}

_assets/oldcss/_layout.scss

@@ -1,338 +0,0 @@
-/**
- * Site header
- */
-.site-header {
-    background: #faf9f5;
-    border-top: 5px solid $title-color;
-    border-bottom: 1px solid $grey-color-light;
-    min-height: 56px;
-
-    // Positioning context for the mobile navigation icon
-    position: relative;
-}
-
-.site-title {
-    font-family: "Raleway", sans-serif;
-    font-size: 32px;
-    font-weight: 300;
-    line-height: 40px;
-    margin-bottom: 0;
-
-    &,
-    &:visited {
-        color: $title-color;
-    }
-}
-
-.search-input-group {
-    max-width: 300px !important;
-}
-@media screen and (max-width: 768px) {
-    .search-input-group {
-        max-width: 200px !important;
-    }
-}
-
-
-
-/**
- * Site footer
- */
-.site-footer {
-    min-height: 300px;
-    border-top: 1px solid $grey-color-light;
-    padding: $spacing-unit 0;
-    text-align: center;
-    color: #FFF;
-
-    line-height: 1.3;
-}
-
-.footer-heading {
-    font-size: 18px;
-    margin-bottom: $spacing-unit / 2;
-}
-
-ul.social-buttons {
-    margin-bottom:0
-}
-
-ul.social-buttons li a {
-    font-size:20px;
-    line-height:40px;
-    display:block;
-    width:40px;
-    height:40px;
-    transition:all .3s;
-    color: #222;
-    border-radius:100%;
-    outline:0;
-    background-color:#FFF;
-}
-
-ul.social-buttons li a:active,ul.social-buttons li a:focus,ul.social-buttons li a:hover {
-    background-color:#4087c7
-}
-
-/**
- * Page content
- */
-aside.aside {
-    padding: 100px 0;
-}
-
-.page-content {
-    padding: $spacing-unit 0;
-
-    background-attachment: fixed;
-    background-size: cover;
-    background-repeat: no-repeat;
-}
-
-.page-heading {
-    font-size: 20px;
-}
-
-.post-list {
-    margin-left: 0;
-    list-style: none;
-}
-
-.post-meta {
-    color: $grey-color;
-}
-
-.post-link {
-    display: block;
-    font-family: "Raleway", sans-serif;
-
-    @include media-query($on-palm) {
-        font-size: 1.1em;
-    }
-}
-
-
-
-/**
- * Posts
- */
-.post-header {
-    margin-bottom: $spacing-unit;
-}
-
-.post-title {
-    color: $grey-color;
-    font-family: "Raleway", sans-serif;
-    font-size: 42px;
-    letter-spacing: -1px;
-    line-height: 1;
-
-    @include media-query($on-laptop) {
-        font-size: 36px;
-    }
-}
-
-.post-content {
-    margin-bottom: $spacing-unit;
-
-    h2 {
-        font-size: 32px;
-
-        @include media-query($on-laptop) {
-            font-size: 28px;
-        }
-    }
-
-    h3 {
-        font-size: 26px;
-
-        @include media-query($on-laptop) {
-            font-size: 22px;
-        }
-    }
-
-    h4 {
-        font-size: 20px;
-
-        @include media-query($on-laptop) {
-            font-size: 18px;
-        }
-    }
-}
-
-#post-nav {
-    display: block;
-
-    .next,
-    .previous {
-        float: left;
-        margin: 1rem 0;
-        width: 50%;
-
-        span:before,
-        span:after {
-            border: solid transparent 4px;
-            content: "";
-            display: inline-block;
-            height: 0;
-            margin: 0 0.5rem;
-            top: 0.8em;
-            width: 0;
-        }
-    }
-
-    .previous {
-        span:before {
-            border-left: 0;
-            border-right-color: $grey-color;
-        }
-    }
-
-    .next {
-        text-align: right;
-
-        span:after {
-            border-left-color: $grey-color;
-            border-right: 0;
-        }
-    }
-
-    @include media-query($on-palm) {
-        padding: initial;
-
-        .next,
-        .previous {
-            text-align: center;
-            width: 100%;
-        }
-    }
-
-    span {
-        color: $brand-color;
-        display: block;
-        font-family: Montserrat;
-        font-size: 0.75rem;
-        font-style: normal;
-        letter-spacing: 1px;
-        text-transform: uppercase;
-    }
-
-    a {
-        color: $grey-color;
-        font-style: italic;
-    }
-}
-
-/**
- * Index
- */
-.home {
-    h1 {
-        color: $brand-color;
-        display: block;
-        font-family: "Raleway", sans-serif;
-        font-size: 44px;
-        text-align: center;
-
-        @include media-query($on-laptop) {
-            font-size: 36px;
-        }
-    }
-}
-
-
-
-/**
- * Error pages
- */
-.error {
-    text-align: center;
-}
-
-/**
- * Bootstrap Override
- */
-
-@media (min-width:1200px) {
-    .container {
-        max-width:960px;
-    }
-}
-
-.card {
-    line-height: 1.5;
-}
-
-.card td.img {
-    width: 220px;
-
-    background-size: cover;
-    background-repeat: no-repeat;
-}
-
-.btn-secondary {
-    background-color:#009fe3;
-    border-color:#009fe3;
-}
-
-.btn-secondary:hover {
-    background-color:#007aae;
-    border-color:#007aae;
-}
-
-.btn-outline-primary {
-    border-color: $brand-color;
-    color: $brand-color;
-
-    &:hover {
-        background-color: $brand-color;
-        border-color: $brand-color;
-    }
-}
-
-.btn-primary {
-    background-color: transparent;
-    border-color: $brand-color;
-    box-shadow: inset 0px -6px 0 $brand-color;
-    transition: box-shadow 1s;
-
-    &:hover {
-        background-color: $brand-color-hover;
-        border-color: $brand-color-hover;
-        box-shadow: inset 0px -100px 0 $brand-color;
-    }
-}
-
-.bg-primary {
-    background-color: $brand-color !important;
-}
-
-.text-primary {
-    color: $brand-color !important;
-}
-
-.card-columns {
-    @media (max-width: 1199.98px) {
-        column-count: 2;
-    }
-    @media (max-width: 991.98px) {
-        column-count: 1;
-    }
-}
-
-.dropdown-toggle:after { content: none }
-
-.list-inline-item:not(:last-child) {
-    margin-right: .25rem;
-}
-
-.min-height-100 {
-    min-height: 100vh;
-}
-
-.content-bottom {
-    background-color: rgba(0,0,0,0.65);
-    bottom: 0;
-    width: 100%;
-    padding: 100px 15px 100px;
-}

_assets/stylesheets/_base.scss

@@ -0,0 +1,323 @@
+/**
+ * Reset some basic elements
+ */
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+hr,
+dl,
+dd,
+ol,
+ul,
+figure {
+	margin: 0;
+	padding: 0;
+}
+
+/**
+ * Basic styling
+ */
+body {
+	font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
+	color: $text-color;
+	background-color: $background-color;
+	-webkit-text-size-adjust: 100%;
+	-webkit-font-feature-settings: 'kern' 1;
+	-moz-font-feature-settings: 'kern' 1;
+	-o-font-feature-settings: 'kern' 1;
+	font-feature-settings: 'kern' 1;
+	font-kerning: normal;
+}
+
+/**
+ * Set `margin-bottom` to maintain vertical rhythm
+ */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+ul,
+ol,
+dl,
+figure,
+%vertical-rhythm {
+	margin-bottom: $spacing-unit / 2;
+}
+
+/**
+ * Articles
+ */
+article {
+	background: #faf9f5;
+	box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.05);
+	margin-bottom: $spacing-unit;
+	padding: 3em 3em 1em;
+
+	@include media-query($on-palm) {
+		padding: 1em 1em 0.3em;
+	}
+
+	> .entry-content {
+		@include media-query($on-palm) {
+			font-size: 80%;
+		}
+
+		&:first-letter {
+			color: #b7b1a9;
+			display: inline-block;
+			float: left;
+			font-family: 'Raleway', sans-serif;
+			font-size: 121px;
+			font-style: normal;
+			font-weight: 700;
+			line-height: 70px;
+			margin: 6px 10px 0 -5px;
+
+			@include media-query($on-palm) {
+				font-size: 70px;
+				line-height: 30px;
+			}
+		}
+
+		&:first-line {
+			color: #787065;
+			font-family: 'Raleway', sans-serif;
+			font-size: 1em;
+			font-style: normal !important;
+			font-weight: bold;
+			letter-spacing: 2px;
+		}
+	}
+}
+
+.post-header {
+	margin-bottom: 2rem;
+	text-align: center;
+
+	&:before {
+		background: #faf9f5;
+		border: 1px solid #d9d6d0;
+		border-radius: 50%;
+		box-shadow: 0 0 0 4px #faf9f5;
+		color: #a09a92;
+		display: inline-block;
+		font-family: libretto-icons;
+		font-size: 21px;
+		line-height: 21px;
+		margin: 1rem auto 2rem;
+		text-shadow: none;
+		padding: 4px 10px 10px 10px;
+	}
+
+	> div {
+		color: $grey-color;
+		font-size: $base-font-size;
+		font-style: italic;
+
+		@include media-query($on-palm) {
+			font-size: $small-font-size;
+		}
+
+		&:before {
+			color: #d9d6d0;
+			display: inline-block;
+			font-family: libretto-icons;
+			font-size: 24px;
+			margin: 0 0.25rem;
+			text-shadow: none;
+			vertical-align: -6px;
+		}
+
+		&:after {
+			color: #d9d6d0;
+			display: inline-block;
+			font-family: libretto-icons;
+			font-size: 24px;
+			margin: 0 0.25rem;
+			text-shadow: none;
+			vertical-align: -6px;
+		}
+	}
+}
+
+.post-list {
+	.post-header {
+		&:before {
+			background: #eae9e6;
+			border-color: #faf9f5;
+			box-shadow: 0 0 0 4px #eae9e6;
+		}
+	}
+}
+
+/**
+ * Images
+ */
+img {
+	max-width: 100%;
+	vertical-align: middle;
+}
+
+.cover {
+	background-attachment: fixed;
+	background-size: cover;
+	background-repeat: no-repeat;
+	min-height: 100vh;
+}
+
+/**
+ * Figures
+ */
+figure {
+	background: #fff;
+	box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.025);
+	padding: 0.5em;
+}
+
+figure > img {
+	display: block;
+}
+
+figcaption {
+	color: $grey-color;
+	font-size: 16px;
+	font-style: italic;
+	line-height: 1.2;
+	margin: 1em 0.5em 0.5em;
+	text-align: center;
+}
+
+/**
+ * Lists
+ */
+ul,
+ol {
+	margin-left: $spacing-unit;
+}
+
+li {
+	> ul,
+	> ol {
+		margin-bottom: 0;
+	}
+}
+
+/**
+ * Headings
+ */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	line-height: initial;
+	font-weight: $base-font-weight;
+}
+
+h5 {
+	font-size: 1.25rem;
+}
+
+/**
+ * Links
+ */
+a {
+	color: $brand-color;
+	text-decoration: underline;
+
+	&:hover {
+		color: darken($brand-color, 5%);
+		text-decoration: none;
+	}
+}
+
+/**
+ * Blockquotes
+ */
+blockquote {
+	color: $grey-color;
+	border-left: 4px solid $grey-color-light;
+	padding-left: $spacing-unit / 2;
+	font-size: 18px;
+	letter-spacing: -1px;
+	font-style: italic;
+
+	> :last-child {
+		margin-bottom: 0;
+	}
+}
+
+/**
+ * Code formatting
+ */
+pre,
+code {
+	font-size: 15px;
+	border: 1px solid $grey-color-light;
+	border-radius: 3px;
+	background-color: #eef;
+}
+
+code {
+	padding: 1px 5px;
+}
+
+pre {
+	padding: 8px 12px;
+	overflow-x: auto;
+
+	> code {
+		border: 0;
+		padding-right: 0;
+		padding-left: 0;
+	}
+}
+
+/**
+ * Clearfix
+ */
+%clearfix {
+	&:after {
+		content: '';
+		display: table;
+		clear: both;
+	}
+}
+
+/**
+ * Icons
+ */
+.icon {
+	> svg {
+		display: inline-block;
+		width: 16px;
+		height: 16px;
+		vertical-align: middle;
+
+		path {
+			fill: $grey-color;
+		}
+	}
+}
+
+/**
+ * Override
+ */
+@media screen and (max-width: 768px) {
+	.display-4 {
+		font-size: 3rem;
+	}
+}

_assets/stylesheets/_bootstrap-custom.scss

@@ -0,0 +1,44 @@
+/*!
+ * Bootstrap v4.6.0 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */
+
+@import 'bootstrap/functions';
+@import 'bootstrap/variables';
+@import 'bootstrap/mixins';
+@import 'bootstrap/root';
+@import 'bootstrap/reboot';
+@import 'bootstrap/type';
+// @import 'bootstrap/images';
+@import 'bootstrap/code';
+@import 'bootstrap/grid';
+// @import 'bootstrap/tables';
+@import 'bootstrap/forms';
+@import 'bootstrap/buttons';
+// @import 'bootstrap/transitions';
+// @import 'bootstrap/dropdown';
+// @import 'bootstrap/button-group';
+@import 'bootstrap/input-group';
+// @import 'bootstrap/custom-forms';
+// @import 'bootstrap/nav';
+@import 'bootstrap/navbar';
+@import 'bootstrap/card';
+// @import 'bootstrap/breadcrumb';
+// @import 'bootstrap/pagination';
+// @import 'bootstrap/badge';
+@import 'bootstrap/jumbotron';
+// @import 'bootstrap/alert';
+// @import 'bootstrap/progress';
+// @import 'bootstrap/media';
+// @import 'bootstrap/list-group';
+// @import 'bootstrap/close';
+// @import 'bootstrap/toasts';
+// @import 'bootstrap/modal';
+// @import 'bootstrap/tooltip';
+// @import 'bootstrap/popover';
+// @import 'bootstrap/carousel';
+// @import 'bootstrap/spinners';
+@import 'bootstrap/utilities';
+// @import 'bootstrap/print';

_assets/stylesheets/_layout.scss

@@ -0,0 +1,440 @@
+/**
+ * Site header
+ */
+.site-header {
+	background: #f8f8f8;
+	border-top: 5px solid $title-color;
+	border-bottom: 1px solid $grey-color-light;
+	min-height: 56px;
+
+	// Positioning context for the mobile navigation icon
+	//position: relative;
+}
+
+.site-title {
+	font-family: 'Raleway', sans-serif;
+	font-size: 32px;
+	font-weight: 300;
+	line-height: 40px;
+	margin-bottom: 0;
+	color: #333;
+
+	&,
+	&:visited {
+		color: $title-color;
+	}
+}
+
+/**
+ * Site footer
+ */
+.site-footer {
+	min-height: 300px;
+	padding: $spacing-unit 0;
+	text-align: center;
+	color: #fff;
+
+	line-height: 1.3;
+	background-color: #222;
+	border-top: 3px dashed $background-color;
+	box-shadow: 0px 180px #222;
+}
+
+.footer-heading {
+	font-size: 18px;
+	margin-bottom: $spacing-unit / 2;
+}
+
+ul.social-buttons {
+	margin-bottom: 0;
+}
+
+ul.social-buttons li a {
+	font-size: 20px;
+	line-height: 40px;
+	display: block;
+	width: 40px;
+	height: 40px;
+	transition: all 0.3s;
+	color: #222;
+	border-radius: 100%;
+	outline: 0;
+	background-color: #fff;
+}
+
+ul.social-buttons li a:active,
+ul.social-buttons li a:focus,
+ul.social-buttons li a:hover {
+	background-color: #4087c7;
+}
+
+/**
+ * Page content
+ */
+aside.aside {
+	padding: 5rem 0;
+}
+
+.page-content {
+	padding: $spacing-unit 0;
+
+	background-attachment: fixed;
+	background-size: cover;
+	background-repeat: no-repeat;
+}
+
+.page-heading {
+	font-size: 20px;
+}
+
+.post-list {
+	margin-left: 0;
+	list-style: none;
+}
+
+.post-meta {
+	color: $grey-color;
+}
+
+.post-link {
+	display: block;
+	font-family: 'Raleway', sans-serif;
+
+	@include media-query($on-palm) {
+		font-size: 1.1em;
+	}
+}
+
+/**
+ * Posts
+ */
+.post-header {
+	margin-bottom: $spacing-unit;
+}
+
+.post-title {
+	color: $grey-color;
+	font-family: 'Raleway', sans-serif;
+	font-size: 42px;
+	letter-spacing: -1px;
+	line-height: 1;
+
+	@include media-query($on-laptop) {
+		font-size: 36px;
+	}
+}
+
+.post-content {
+	margin-bottom: $spacing-unit;
+
+	h2 {
+		font-size: 32px;
+
+		@include media-query($on-laptop) {
+			font-size: 28px;
+		}
+	}
+
+	h3 {
+		font-size: 26px;
+
+		@include media-query($on-laptop) {
+			font-size: 22px;
+		}
+	}
+
+	h4 {
+		font-size: 20px;
+
+		@include media-query($on-laptop) {
+			font-size: 18px;
+		}
+	}
+}
+
+#post-nav {
+	display: block;
+
+	.next,
+	.previous {
+		float: left;
+		margin: 1rem 0;
+		width: 50%;
+
+		span:before,
+		span:after {
+			border: solid transparent 4px;
+			content: '';
+			display: inline-block;
+			height: 0;
+			margin: 0 0.5rem;
+			top: 0.8em;
+			width: 0;
+		}
+	}
+
+	.previous {
+		span:before {
+			border-left: 0;
+			border-right-color: $grey-color;
+		}
+	}
+
+	.next {
+		text-align: right;
+
+		span:after {
+			border-left-color: $grey-color;
+			border-right: 0;
+		}
+	}
+
+	@include media-query($on-palm) {
+		padding: initial;
+
+		.next,
+		.previous {
+			text-align: center;
+			width: 100%;
+		}
+	}
+
+	span {
+		color: $brand-color;
+		display: block;
+		font-family: Montserrat;
+		font-size: 0.75rem;
+		font-style: normal;
+		letter-spacing: 1px;
+		text-transform: uppercase;
+	}
+
+	a {
+		color: $grey-color;
+		font-style: italic;
+	}
+}
+
+/**
+ * Index
+ */
+.home {
+	h1 {
+		color: $brand-color;
+		display: block;
+		font-family: 'Raleway', sans-serif;
+		font-size: 44px;
+		text-align: center;
+
+		@include media-query($on-laptop) {
+			font-size: 36px;
+		}
+	}
+}
+
+/**
+ * Error pages
+ */
+.error {
+	text-align: center;
+}
+
+/**
+ * Bootstrap Override
+ */
+
+@media (min-width: 1200px) {
+	.container {
+		max-width: 960px;
+	}
+}
+
+.card {
+	line-height: 1.5;
+}
+
+.card td.img {
+	width: 220px;
+
+	background-size: cover;
+	background-repeat: no-repeat;
+}
+
+.btn {
+	transition: box-shadow 0.3s ease-out, border-color 0.2s ease-out, color 0.3s ease-out;
+
+	text-decoration: none;
+}
+
+.btn-secondary {
+	background-color: transparent;
+	border-color: $brand-color-secondary;
+	box-shadow: inset 0px -0.3rem 0 $brand-color-secondary;
+
+	color: $text-color;
+
+	&:hover {
+		background-color: transparent;
+		border-color: $brand-color-secondary-hover;
+		box-shadow: inset 0px -100px 0 $brand-color-secondary-hover;
+
+		color: white;
+	}
+
+	&:focus {
+		box-shadow: inset 0 0 5px $brand-color-secondary;
+		color: $text-color;
+	}
+
+	&:not(:disabled):not(.disabled):active {
+		background-color: $brand-color-secondary;
+		border-color: $brand-color-secondary;
+	}
+
+	&:not(:disabled):not(.disabled):active:focus {
+		box-shadow: inset 0 0 5px $brand-color-secondary;
+	}
+}
+
+.btn-outline-primary {
+	border-color: $brand-color;
+	color: $brand-color;
+
+	&:hover {
+		background-color: $brand-color !important;
+		border-color: $brand-color !important;
+	}
+
+	&:active {
+		background-color: $brand-color !important;
+		border-color: $brand-color !important;
+	}
+}
+
+.btn-primary {
+	background-color: transparent;
+	border-color: $brand-color;
+	box-shadow: inset 0px -0.3rem 0 $brand-color, $shadow;
+
+	color: $text-color;
+
+	&:hover {
+		background-color: transparent;
+		border-color: $brand-color-hover;
+		box-shadow: inset 0px -100px 0 $brand-color;
+	}
+
+	&:focus {
+		box-shadow: inset 0 0 5px $brand-color;
+		color: $text-color;
+	}
+
+	&:not(:disabled):not(.disabled):active {
+		background-color: $brand-color;
+		border-color: $brand-color;
+	}
+
+	&:not(:disabled):not(.disabled):active:focus {
+		box-shadow: inset 0 0 5px $brand-color;
+	}
+}
+
+.btn-success {
+	background-color: transparent;
+	border-color: $success-color;
+	box-shadow: inset 0px -0.3rem 0 $success-color, $shadow;
+
+	color: $text-color;
+
+	&:hover {
+		background-color: transparent;
+		border-color: $success-color-hover;
+		box-shadow: inset 0px -100px 0 $success-color;
+	}
+
+	&:focus {
+		box-shadow: inset 0 0 5px $success-color;
+		color: $text-color;
+	}
+
+	&:not(:disabled):not(.disabled):active {
+		background-color: $success-color;
+		border-color: $success-color;
+	}
+
+	&:not(:disabled):not(.disabled):active:focus {
+		box-shadow: inset 0 0 5px $success-color;
+	}
+}
+
+.bg-primary {
+	background-color: $brand-color !important;
+}
+
+.border-primary {
+	border-color: $brand-color !important;
+}
+
+.border-secondary {
+	border-color: $brand-color-secondary !important;
+}
+
+.text-primary {
+	color: $brand-color !important;
+}
+
+.card-columns {
+	@media (max-width: 1199.98px) {
+		column-count: 2;
+	}
+	@media (max-width: 991.98px) {
+		column-count: 1;
+	}
+}
+
+.dropdown-toggle:after {
+	content: none;
+}
+
+.list-inline-item:not(:last-child) {
+	margin-right: 0.25rem;
+}
+
+.min-height-100 {
+	min-height: 100vh;
+}
+
+.content-bottom {
+	background-color: rgba(0, 0, 0, 0.65);
+	bottom: 0;
+	width: 100%;
+	padding: 100px 15px 100px;
+}
+
+.shadow {
+	box-shadow: $shadow !important;
+}
+
+.header-index {
+	min-height: 55vh;
+	background-size: cover;
+	background-attachment: fixed;
+	margin-top: -30px;
+	margin-bottom: 0;
+	background-image: asset_url('header-network.webp');
+}
+
+.header-peertube {
+	min-height: 80vh;
+	background-position: center;
+	background-image: asset_url('header-peertube.webp');
+}
+
+.header-libreboot {
+	background-image: asset_url('libreboot.webp');
+}
+.header-radio {
+	min-height: 80vh;
+	background-position: center;
+	background-image: asset_url('header-radio.webp');
+}

_assets/stylesheets/_syntax-highlighting.scss

@@ -0,0 +1,204 @@
+/**
+ * Syntax highlighting styles
+ */
+.highlight {
+	background: #fff;
+	@extend %vertical-rhythm;
+
+	.highlighter-rouge & {
+		background: #eef;
+	}
+
+	.c {
+		color: #998;
+		font-style: italic;
+	} // Comment
+	.err {
+		color: #a61717;
+		background-color: #e3d2d2;
+	} // Error
+	.k {
+		font-weight: bold;
+	} // Keyword
+	.o {
+		font-weight: bold;
+	} // Operator
+	.cm {
+		color: #998;
+		font-style: italic;
+	} // Comment.Multiline
+	.cp {
+		color: #999;
+		font-weight: bold;
+	} // Comment.Preproc
+	.c1 {
+		color: #998;
+		font-style: italic;
+	} // Comment.Single
+	.cs {
+		color: #999;
+		font-weight: bold;
+		font-style: italic;
+	} // Comment.Special
+	.gd {
+		color: #000;
+		background-color: #fdd;
+	} // Generic.Deleted
+	.gd .x {
+		color: #000;
+		background-color: #faa;
+	} // Generic.Deleted.Specific
+	.ge {
+		font-style: italic;
+	} // Generic.Emph
+	.gr {
+		color: #a00;
+	} // Generic.Error
+	.gh {
+		color: #999;
+	} // Generic.Heading
+	.gi {
+		color: #000;
+		background-color: #dfd;
+	} // Generic.Inserted
+	.gi .x {
+		color: #000;
+		background-color: #afa;
+	} // Generic.Inserted.Specific
+	.go {
+		color: #888;
+	} // Generic.Output
+	.gp {
+		color: #555;
+	} // Generic.Prompt
+	.gs {
+		font-weight: bold;
+	} // Generic.Strong
+	.gu {
+		color: #aaa;
+	} // Generic.Subheading
+	.gt {
+		color: #a00;
+	} // Generic.Traceback
+	.kc {
+		font-weight: bold;
+	} // Keyword.Constant
+	.kd {
+		font-weight: bold;
+	} // Keyword.Declaration
+	.kp {
+		font-weight: bold;
+	} // Keyword.Pseudo
+	.kr {
+		font-weight: bold;
+	} // Keyword.Reserved
+	.kt {
+		color: #458;
+		font-weight: bold;
+	} // Keyword.Type
+	.m {
+		color: #099;
+	} // Literal.Number
+	.s {
+		color: #d14;
+	} // Literal.String
+	.na {
+		color: #008080;
+	} // Name.Attribute
+	.nb {
+		color: #0086b3;
+	} // Name.Builtin
+	.nc {
+		color: #458;
+		font-weight: bold;
+	} // Name.Class
+	.no {
+		color: #008080;
+	} // Name.Constant
+	.ni {
+		color: #800080;
+	} // Name.Entity
+	.ne {
+		color: #900;
+		font-weight: bold;
+	} // Name.Exception
+	.nf {
+		color: #900;
+		font-weight: bold;
+	} // Name.Function
+	.nn {
+		color: #555;
+	} // Name.Namespace
+	.nt {
+		color: #000080;
+	} // Name.Tag
+	.nv {
+		color: #008080;
+	} // Name.Variable
+	.ow {
+		font-weight: bold;
+	} // Operator.Word
+	.w {
+		color: #bbb;
+	} // Text.Whitespace
+	.mf {
+		color: #099;
+	} // Literal.Number.Float
+	.mh {
+		color: #099;
+	} // Literal.Number.Hex
+	.mi {
+		color: #099;
+	} // Literal.Number.Integer
+	.mo {
+		color: #099;
+	} // Literal.Number.Oct
+	.sb {
+		color: #d14;
+	} // Literal.String.Backtick
+	.sc {
+		color: #d14;
+	} // Literal.String.Char
+	.sd {
+		color: #d14;
+	} // Literal.String.Doc
+	.s2 {
+		color: #d14;
+	} // Literal.String.Double
+	.se {
+		color: #d14;
+	} // Literal.String.Escape
+	.sh {
+		color: #d14;
+	} // Literal.String.Heredoc
+	.si {
+		color: #d14;
+	} // Literal.String.Interpol
+	.sx {
+		color: #d14;
+	} // Literal.String.Other
+	.sr {
+		color: #009926;
+	} // Literal.String.Regex
+	.s1 {
+		color: #d14;
+	} // Literal.String.Single
+	.ss {
+		color: #990073;
+	} // Literal.String.Symbol
+	.bp {
+		color: #999;
+	} // Name.Builtin.Pseudo
+	.vc {
+		color: #008080;
+	} // Name.Variable.Class
+	.vg {
+		color: #008080;
+	} // Name.Variable.Global
+	.vi {
+		color: #008080;
+	} // Name.Variable.Instance
+	.il {
+		color: #099;
+	} // Literal.Number.Integer.Long
+}

_assets/stylesheets/main.scss

@@ -0,0 +1,63 @@
+@charset "utf-8";
+
+@import 'font-awesome-sprockets';
+@import 'font-awesome';
+@import 'bootstrap-custom';
+@import 'vendor/fonts';
+@import 'vendor/animate';
+@import 'vendor/morphext';
+// @import 'vendor/overhang';
+
+// Font variables
+$font-name: libretto-icons;
+
+@font-face {
+	font-family: $font-name;
+	src: asset_url($font-name + '/' + $font-name + '.eot'); /* IE9 Compat Modes */
+	src: asset_url($font-name + '/' + $font-name + '.woff') format('woff'),
+		/* Pretty Modern Browsers */ asset_url($font-name + '/' + $font-name + '.ttf')
+			format('truetype'),
+		/* Safari, Android, iOS */ asset_url($font-name + '/' + $font-name + '.svg#font_name')
+			format('svg'); /* Legacy iOS */
+}
+
+// Our variables
+$base-font-family: 'Raleway', sans-serif, Baskerville, 'Book Antiqua', Georgia, Times, serif;
+$base-font-size: 17px;
+$base-font-weight: 400;
+$base-line-height: 2;
+
+$small-font-size: $base-font-size * 0.875;
+
+$spacing-unit: 30px;
+
+$brand-color: #f39200;
+$brand-color-hover: #f37700;
+$brand-color-secondary: #009fe3;
+$brand-color-secondary-hover: #007aae;
+$background-color: #f1f1f1;
+$text-color: #363431;
+$title-color: #009fe3;
+$success-color: #28a745;
+$success-color-hover: #218838;
+
+$grey-color: #a09a92;
+$grey-color-light: lighten($grey-color, 30%);
+$grey-color-dark: darken($grey-color, 25%);
+
+// Width of the content area
+$content-width: 800px;
+
+$on-palm: 600px;
+$on-laptop: 800px;
+
+$shadow: -0.1rem 0.2rem 0 rgba(0, 0, 0, 0.05);
+
+@mixin media-query($device) {
+	@media screen and (max-width: $device) {
+		@content;
+	}
+}
+
+// Import partials from `sass_dir` (defaults to `_sass`)
+@import 'base', 'layout', 'sidebar', 'syntax-highlighting';

_assets/stylesheets/vendor/_fonts.scss

@@ -2,89 +2,79 @@
 	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 300;
-	src:
+	src: local('Raleway Light'), local('Raleway-Light'),
-		local('Raleway Light'),
-		local('Raleway-Light'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwIYqWqZPAA.woff2 */
-		url('../fonts/Raleway_300.woff2') format('woff2'),
+			asset_url('Raleway_300.woff2') format('woff2'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwIYqWqZPBg.woff */
-		url('../fonts/Raleway_300.woff') format('woff'),
+			asset_url('Raleway_300.woff') format('woff'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwIYqWqZPBA.eot */
-		url('../fonts/Raleway_300.eot?#iefix') format('embedded-opentype'),
+			asset_url('Raleway_300.eot?#iefix') format('embedded-opentype'),
 		/* from https://fonts.gstatic.com/l/font?kit=1Ptrg8zYS_SKggPNwIYqWqZPBw&skey=f383b08b06c2c86f&v=v14#Raleway */
-		url('../fonts/Raleway_300.svg#Raleway') format('svg'),
+			asset_url('Raleway_300.svg#Raleway') format('svg'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwIYqWqZPBQ.ttf */
-		url('../fonts/Raleway_300.ttf') format('truetype');
+			asset_url('Raleway_300.ttf') format('truetype');
 }
 @font-face {
 	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 400;
-	src:
+	src: local('Raleway'), local('Raleway-Regular'),
-		local('Raleway'),
-		local('Raleway-Regular'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptug8zYS_SKggPNyC0ITw.woff2 */
-		url('../fonts/Raleway_400.woff2') format('woff2'),
+			asset_url('Raleway_400.woff2') format('woff2'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptug8zYS_SKggPNyC0ISQ.woff */
-		url('../fonts/Raleway_400.woff') format('woff'),
+			asset_url('Raleway_400.woff') format('woff'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptug8zYS_SKggPNyC0ISw.eot */
-		url('../fonts/Raleway_400.eot?#iefix') format('embedded-opentype'),
+			asset_url('Raleway_400.eot?#iefix') format('embedded-opentype'),
 		/* from https://fonts.gstatic.com/l/font?kit=1Ptug8zYS_SKggPNyC0ISA&skey=30a27f2564731c64&v=v14#Raleway */
-		url('../fonts/Raleway_400.svg#Raleway') format('svg'),
+			asset_url('Raleway_400.svg#Raleway') format('svg'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptug8zYS_SKggPNyC0ISg.ttf */
-		url('../fonts/Raleway_400.ttf') format('truetype');
+			asset_url('Raleway_400.ttf') format('truetype');
 }
 @font-face {
 	font-family: 'Raleway';
 	font-style: italic;
 	font-weight: 400;
-	src:
+	src: local('Raleway Italic'), local('Raleway-Italic'),
-		local('Raleway Italic'),
-		local('Raleway-Italic'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptsg8zYS_SKggPNyCg4TYFq.woff2 */
-		url('../fonts/Raleway_400i.woff2') format('woff2'),
+			asset_url('Raleway_400i.woff2') format('woff2'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptsg8zYS_SKggPNyCg4TYFs.woff */
-		url('../fonts/Raleway_400i.woff') format('woff'),
+			asset_url('Raleway_400i.woff') format('woff'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptsg8zYS_SKggPNyCg4TYFu.eot */
-		url('../fonts/Raleway_400i.eot?#iefix') format('embedded-opentype'),
+			asset_url('Raleway_400i.eot?#iefix') format('embedded-opentype'),
 		/* from https://fonts.gstatic.com/l/font?kit=1Ptsg8zYS_SKggPNyCg4TYFt&skey=bf44ee29381a37b0&v=v14#Raleway */
-		url('../fonts/Raleway_400i.svg#Raleway') format('svg'),
+			asset_url('Raleway_400i.svg#Raleway') format('svg'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptsg8zYS_SKggPNyCg4TYFv.ttf */
-		url('../fonts/Raleway_400i.ttf') format('truetype');
+			asset_url('Raleway_400i.ttf') format('truetype');
 }
 @font-face {
 	font-family: 'Raleway';
 	font-style: normal;
 	font-weight: 700;
-	src:
+	src: local('Raleway Bold'), local('Raleway-Bold'),
-		local('Raleway Bold'),
-		local('Raleway-Bold'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwJYtWqZPAA.woff2 */
-		url('../fonts/Raleway_700.woff2') format('woff2'),
+			asset_url('Raleway_700.woff2') format('woff2'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwJYtWqZPBg.woff */
-		url('../fonts/Raleway_700.woff') format('woff'),
+			asset_url('Raleway_700.woff') format('woff'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwJYtWqZPBA.eot */
-		url('../fonts/Raleway_700.eot?#iefix') format('embedded-opentype'),
+			asset_url('Raleway_700.eot?#iefix') format('embedded-opentype'),
 		/* from https://fonts.gstatic.com/l/font?kit=1Ptrg8zYS_SKggPNwJYtWqZPBw&skey=e507c3e2b7915ad1&v=v14#Raleway */
-		url('../fonts/Raleway_700.svg#Raleway') format('svg'),
+			asset_url('Raleway_700.svg#Raleway') format('svg'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptrg8zYS_SKggPNwJYtWqZPBQ.ttf */
-		url('../fonts/Raleway_700.ttf') format('truetype');
+			asset_url('Raleway_700.ttf') format('truetype');
 }
 @font-face {
 	font-family: 'Raleway';
 	font-style: italic;
 	font-weight: 700;
-	src:
+	src: local('Raleway Bold Italic'), local('Raleway-BoldItalic'),
-		local('Raleway Bold Italic'),
-		local('Raleway-BoldItalic'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptpg8zYS_SKggPNyCgw9qR_AtCb.woff2 */
-		url('../fonts/Raleway_700i.woff2') format('woff2'),
+			asset_url('Raleway_700i.woff2') format('woff2'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptpg8zYS_SKggPNyCgw9qR_AtCd.woff */
-		url('../fonts/Raleway_700i.woff') format('woff'),
+			asset_url('Raleway_700i.woff') format('woff'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptpg8zYS_SKggPNyCgw9qR_AtCf.eot */
-		url('../fonts/Raleway_700i.eot?#iefix') format('embedded-opentype'),
+			asset_url('Raleway_700i.eot?#iefix') format('embedded-opentype'),
 		/* from https://fonts.gstatic.com/l/font?kit=1Ptpg8zYS_SKggPNyCgw9qR_AtCc&skey=9ecf9384a6d643b6&v=v14#Raleway */
-		url('../fonts/Raleway_700i.svg#Raleway') format('svg'),
+			asset_url('Raleway_700i.svg#Raleway') format('svg'),
 		/* from https://fonts.gstatic.com/s/raleway/v14/1Ptpg8zYS_SKggPNyCgw9qR_AtCe.ttf */
-		url('../fonts/Raleway_700i.ttf') format('truetype');
+			asset_url('Raleway_700i.ttf') format('truetype');
 }

_config.yml

@@ -13,7 +13,7 @@ twitter:
   username: UnitooInc
   card: summary
 
-logo: /assets/images/logo-extended.png
+logo: /assets/images/logo-extended.webp
 
 # Build settings
 markdown: kramdown
@@ -28,10 +28,20 @@ exclude_from_localizations: ["javascript", "images", "css"]
 
 mastodon_url: "https://mastodon.uno/@unitoo"
 
+assets:
+  compress:
+    css: sass
+    js:  uglifier
+  digest: true
+  sources:
+    - _assets/images
+    - _assets/javascripts
+    - _assets/stylesheets
+    - _assets/fonts
+
 plugins:
   - jekyll-assets
   - jekyll-seo-tag
-  - jekyll-feed
   - jekyll-sitemap
   - jekyll-minifier
   - jekyll-multiple-languages-plugin

_i18n/it.yml

@@ -38,12 +38,14 @@ buttons:
   projects: "Progetti"
   know_us_on_mastodon: "Vieni a conoscerci su Mastodon!"
   find_how_we_build_software: "Scopri quali tecnologie utilizziamo"
-  find_what: "Scopri in cosa possiamo essere di aiuto"
+  find_what: "Scopri la nostra piattaforma e i costi"
   know_more: "Approfondisci"
   go_to_channel: "Vai al canale"
+  go_to_helpdesk: "Vai all'Helpdesk"
 
 inputs:
   search: "Vuoi cercare qualcosa?"
+  no_results: "Nessun risultato"
 
 index:
   header_title: "Sviluppo software e consulenza senza compromessi"
@@ -54,7 +56,7 @@ index:
     software_development: "Sviluppo software"
     software_development_text: "Un processo lineare basato sull'analisi dei requisiti, le migliori tecnologie e la massima disponibilità. <br>Inoltre, avrai sempre una traccia di ciò che è stato fatto e di cosa verrà sviluppato grazie ai software di controllo versione come Git.<br><br> Siamo disponibili anche a partecipare allo sviluppo di software già avviati."
     technical_advice: "Consulenza"
-    technical_advice_text: "Siamo pronti a fornire i dettagli che faranno la differenza nella scelta dei migliori software sul mercato.<br><br>Lavoriamo da anni con diversi software liberi come LibreOffice, Nextcloud, GNU/Linux... e possiamo guidarti nella loro configurazione/ installazione per ottenere il massimo profitto."
+    technical_advice_text: "Tramite la nostra piattaforma di Helpdesk, siamo pronti a fornire i dettagli che faranno la differenza nel mondo del software e delle infrastrutture.<br><br>Da anni lavoriamo con diversi software liberi come GNU/Linux, LibreOffice, Nextcloud... e possiamo guidarti nella loro configurazione per raggiungere al meglio i tuoi obiettivi."
   products_title: "Soluzioni software"
   products:
     nextcloud: "Nextcloud"
@@ -99,13 +101,59 @@ software_technologies:
 
 technical_advice:
   title: "Consulenza tecnica"
-  text: "Il panorama tecnologico cresce a dismisura ed avere una chiara visione delle possibilità presenti non è cosa semplice. Per questo ci rendiamo disponibili a suggerire le migliori tecnologie da applicare alle necessità espresse. <br> Il nostro obiettivo in tal senso è soddisfare l'esigenza nel modo più professionale, consigliando in primis soluzioni etiche basate su Free software.<br>Qualche area d esempio"
+  text: "Il panorama tecnologico cresce a dismisura ed avere una chiara visione delle possibilità presenti non è cosa semplice. Per questo siamo disponibili, tramite la nostra piattaforma dedicata, a suggerire le migliori tecnologie da applicare alle necessità espresse.<br> Il nostro obiettivo in tal senso è soddisfare l'esigenza nel modo più professionale, consigliando in primis soluzioni etiche basate su software libero.<br><br> Ecco alcune aree su cui potrete ricevere consulenza: server e infrastrutture Cloud su piattaforme moderne, progettazione software, strumenti di teamwork agile, strumenti di backup, piattaforme di monitoring, sistemi di gestione password sicuri, sistemi di sicurezza da ransomware, malware..."
   cloud_title: "Server e infrastrutture \"Cloud\""
-  cloud_text: "Suggeriamo software completamente liberi e applichiamo al nostro meglio gli ultimi standard in termini di sicurezza e privacy."
+  cloud_text: "<ul>
-  software_solutions_title: "Soluzioni software libero"
+    <li>Primo avvio, buone pratiche di configurazione e scalabilità</li>
-  software_solutions_text: "Di soluzioni ne esistono tante ma quello che conta è scegliere quella più idonea e scalabile. Il software libero in questo caso è di prima scelta"
+    <li>Alert e monitoring</li>
+    <li>Backup e resilienza</li>
+    <li>VPN e Tunnel</li>
+  </ul>"
+  software_solutions_title: "Soluzioni software e teamwork"
+  software_solutions_text: "<ul>
+    <li>Soluzioni teamwork e gestione dei processi</li>
+    <li>Piattaforme per helpdesk</li>
+    <li>Strumenti per la gestione di file, calendario, video conferenza in cloud</li>
+    <li>DNS e protezioni da ransomware, ads, malware</li>
+    <li>Sistemi analytics non dipendenti da Google</li>
+  </ul>"
   licenses_title: "Licenze, copyleft e applicazione del GDPR"
   licenses_text: "Rilasciare un software non è solo questione di codice, ma è anche questione di diritti ed etica. Perchè non valutare strade alternative?"
+  how_to_buy_title: "Come posso accedere alla piattaforma di consulenza?"
+  how_to_buy_text: "
+    Per poter ottenere un accesso alla piattaforma di helpdesk è necessario prima di tutto contattarci (scorrendo la pagina troverete tutte le modalità) per conoscere nel dettaglio le esigenze per le quali si richiede una consulenza. Ci teniamo a sottolineare che questo servizio è rivolto maggiormente alle piccole/ medie realtà che hanno bisogno di maggiori soluzioni rivolte a rendere i processi aziendali più semplici, tracciabili, mantenibili e di conseguenza aumentare i profitti.
+  "
+  prices_title: "Quanto costa?"
+  prices_text: "
+    La piattaforma e il know-how li mettiamo noi, tu scegli il periodo che più ti soddisfa.<br><b>Nessun contratto vincolante. Nessuna clausola vessatoria. Semplice come lo immagini.</b><br><br>
+    <i>Accettiamo anche pagamenti in Cryptovalute!</i>
+  "
+  aside_helpdesk: "Hai già le credenziali per il login ma non trovi l'accesso alla piattaforma? Eccolo qui!"
+  prices:
+    first_title: "ESSENTIAL"
+    first_text: "La scelta perfetta per un primo contatto o per consulenze con tempi brevi e prestabiliti"
+    first_description: "
+      Accesso alla piattaforma<br>
+      Prima risposta entro 24 ore lavorative<br>
+      Tracciabilità via mail
+    "
+    second_title: "PERFORMANCE"
+    second_text: "Il giusto compromesso. 3 mesi per aiutarti al meglio con i tuoi progetti."
+    second_description: "
+      Accesso alla piattaforma<br>
+      Prima risposta entro 12 ore lavorative<br>
+      Tracciabilità via mail<br>
+      Accesso multiutenza (max 2 utenze)
+    "
+    third_title: "PROFESSIONAL"
+    third_text: "La soluzione definitiva per progetti a lungo termine e strutture in crescita"
+    third_description: "
+      Accesso alla piattaforma<br>
+      Prima risposta entro 8 ore lavorative<br>
+      Tracciabilità via mail<br>
+      Accesso multiutenza<br>
+      Accesso alla libreria interna
+    "
 
 projects:
   title: "Progetti, per andare oltre"
@@ -209,9 +257,31 @@ radio:
   text_5: " hanno rilasciato la versione aggiornata del software, abbiamo subito provveduto a spostare i nostri contenuti nella loro piattaforma. Pertanto al seguente link avrete la possibilità di ascoltare, scaricare e condividere (nelle libertà concesse e nel rispetto delle licenze CC associate ad ogni file) i vari Podcast."
 
 staff:
+  yamabiiko:
+    alt_img: "Foto profilo di Lorenzo Tucci"
+    text: "<pre><code>
+        Compiling yamabiiko v0.1.0 (file:///projects/unsafe-yamabiiko)<br>
+        error[E0133]: call to yamabiiko is unsafe and requires unsafe function or block<br>
+        --> src/main.rs:4:5<br>
+          |<br>
+        4 |     dangerous();<br>
+          |     ^^^^^^^^^^^ call to unsafe function<br>
+          |<br>
+          = note: consult the function's documentation for information on how to avoid undefined behavior<br>
+        <br>
+        error: aborting due to previous error<br>
+        <br>
+        For more information about this error, try `rustc --explain yamabiiko`.<br>
+        error: could not compile `unsafe-example`<br>
+        <br>
+        To learn more, run the command again with --verbose.<br>
+    </code></pre>
+    "
+    github_url: "https://github.com/yamabiiko"
+    gitlab_url: "https://gitlab.com/yamabik0"
   cmaradonna:
     alt_img: "Foto profilo di Claudio Maradonna"
-    text: "Fondatore di Unitoo e sviluppatore. <br>Si introduce nel  mondo del software a 13 anni e da li inizia la sua avventura nel mondo GNU/Linux, tra un overclock e l altro.<br><br>Oggi sviluppa con Ruby e Rails e ritiene il C++ uno dei linguaggi più belli e funzionali."
+    text: "Fondatore di Unitoo e sviluppatore. <br>Si introduce nel mondo del software a 13 anni e da li inizia la sua avventura nel mondo GNU/Linux, tra un overclock e l altro.<br><br>Oggi sviluppa principalmente con Ruby e Rails. Ha un debole per il C++ <3"
     mastodon_url: "https://mastodon.uno/@penguyman"
     instagram_url: "https://www.instagram.com/cmaradonna/"
     github_url: "https://github.com/FiloSpaTeam"

_includes/bottom.html

@@ -1,4 +1,4 @@
-{% asset app.js %}
+{% asset main.js %}
 
 <!-- Matomo -->
 <script defer="true" type="text/javascript">

_includes/cookie-consent.html

@@ -6,7 +6,7 @@
         #cookie-notice a {position: relative; bottom: 4px;}
     }
 </style>
-<div id="cookie-notice"><span>Utilizziamo Matomo (una tecnologia libera) per analizzare e migliorare il servizio che offriamo.</span><a id="cookie-notice-accept" class="btn btn-primary btn-sm">Approva</a><a href="https://matomo.org/gdpr/" rel="nofollow" class="btn btn-primary btn-sm">Scopri di più</a><a id="cookie-notice-dismiss" class="float-right"><i class="fa fa-times-circle"></i></a></div>
+<div id="cookie-notice"><span>Utilizziamo Matomo (una tecnologia libera) per analizzare e migliorare il servizio che offriamo.</span><a id="cookie-notice-accept" class="btn btn-primary btn-sm">Approva</a><a href="https://matomo.org/gdpr/" rel="nofollow" target="_blank" class="btn btn-primary btn-sm text-white">Scopri di più</a><a id="cookie-notice-dismiss" class="float-right"><i class="fa fa-times-circle"></i></a></div>
 <script>
     function createCookie(name,value,days) {
         var expires = "";