Merge branch 'develop' into noel

assets/css/app.scss

@@ -313,16 +313,15 @@ pre[class*="language-"] {
 }
 
 .header {
-  background: linear-gradient(45deg, $color-header-background-from 0%, #0685b3 29%, #1fbaf2 66%, $color-header-background-to 100%);
+  background: url('../images/header.jpg') no-repeat;
-  background-size: 400% 400%;
+  background-size: cover;
-  animation: HeaderGradient 15s ease infinite;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   justify-content: space-evenly;
   overflow: hidden;
   position: relative;
-  text-shadow: 0px 0px 6px #274298;
+  text-shadow: 0px 0px 2px #fff;
 }
 
 .header-wrapper {
@@ -331,6 +330,12 @@ pre[class*="language-"] {
   margin: auto;
   text-align: center;
   z-index: 1000;
+
+  p, ul {
+    background: rgba(255, 255, 255, 0.8);
+    padding: 4px 10px;
+    border-radius: 20px;
+  }
 }
 
 .header-shadow {

assets/css/app/config.scss

@@ -19,9 +19,13 @@ $color-small-menu-background: $color-dark-grey;
 $color-wide-menu-background-from: $color-dark-grey;
 $color-wide-menu-background-to: darken($color-dark-grey, 10%);
 
-$color-header-background-from: $color-blue2;
+//$color-header-background-from: $color-blue2;
-$color-header-background-to: $color-blue;
+//$color-header-background-to: $color-blue;
-$color-header-text: $color-white;
+//$color-header-text: $color-white;
+
+$color-header-background-from: #e8e8e8;
+$color-header-background-to: #f4f4f4;
+$color-header-text: #373238;
 
 $color-body-text: $color-dark-grey;
 $color-body-link-border: $color-blue;

assets/js/app/particles.js

@@ -16,7 +16,8 @@ class Particles {
         this.particles.style.maxHeight = height + 'px'
         this.particles.style.maxWidth = width + 'px'
 
-        particlesJS.load('particles', '/js/particles.json?v=3')
+        // particlesJS.load('particles', '/js/particles.json?v=3')
+        particlesJS.load('particles', '/js/particles.flocons.json?v=3')
     }
 
     clean() {