jekyll-theme-fica 0.2.0 → 0.2.2

data/_sass/layouts/variable.scss

@@ -0,0 +1,201 @@
+// 
+// text settings
+// 
+$font-family: 'Roboto', sans-serif !default;
+$code-font-family: "Noto Sans", sans-serif !default;
+
+$font-size: 17px !default;
+$small-font-size: $font-size * 0.875 !default;
+
+$font-weight: 300 !default;
+$font-spacing: 30px !default;
+$line-height: 2.5 !default;
+
+//
+// Table
+//
+$table-text-align: left !default;
+
+//
+// Site banner
+//
+$site-banner-title-fnt-sze: 50px;
+$site-banner-description-fnt-sze: 18px;
+$site-banner-picture-sze_wdth: 60%;
+
+//
+// Transitions
+//
+$transition-btn: all 0.2s ease-in-out;
+$transition-links: all 0.3s ease-in-out;
+$tansitions-page-bar: all 0.3s ease-in-out;
+
+//
+// Animations
+//
+$animation-site-pic: 2s; //animations for banner-pic
+$animation-main: 1s; //animations for banner description and the body of the site.
+$animation-left: 250ms;
+
+// 
+// Content
+// 
+$content-width: 800px !default;
+
+
+$mobile-width: 710px !default;
+$pc-width: 800px !default;
+$medium-width: 442px !default;
+
+//                                     //
+// ---------- site queries ---------- //
+//                                   //
+
+@mixin media-query($device) {
+  @media screen and (max-width: $device) {
+    @content;
+  }
+}
+
+@mixin animation-fade-in($speed) {
+  opacity: 0;
+  animation: fade-in 1s linear forwards;
+  animation-delay: #{$speed}s;
+  -webkit-animation-delay: #{$speed}s;
+}
+
+@mixin relative-font-size($ratio) {
+  font-size: #{$ratio}rem;
+}
+
+//                                 //
+//---------- scss mixin --------- //
+//                               //
+
+@mixin text-muted {
+  color: $text-mute-color;
+}
+
+@mixin text-unmuted {
+  color: $text-color;
+}
+
+@mixin footer-wrapper {
+  margin-bottom: $font-spacing / 2;
+  width: calc(18% - (#{$font-spacing} / 2));
+  padding: 0 ($font-spacing / 2);
+
+  &:first-child {
+    padding-right: $font-spacing / 2;
+    padding-left: 0;
+  }
+
+  &:last-child {
+    padding-right: 0;
+    padding-left: $font-spacing / 2;
+  }
+}
+
+@mixin prompt($gf-icon, $gf-color, $bg-color, $fnt-fam) {
+  border-radius: 5px;
+  padding: 0.8rem 1.2rem;
+  font-style: normal;
+  color: $text-color;
+  font-weight: 400;
+  border-left: 6px solid $gf-color;
+  background-color: $bg-color;
+  font-size: 0.975rem;
+
+  &::before {
+    content: $gf-icon;
+    font-family: $fnt-fam;
+    color: $gf-color;
+    font-size: 34px;
+    line-height: 1;
+    padding-right: 10px;
+    padding-bottom: 13px;
+  }
+}
+
+@mixin horizontal-scroll {
+  &::-webkit-scrollbar {
+    height: 16px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: transparent;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: rgba(128, 134, 139, 0.2);
+    background-clip: padding-box;
+    border: 4px solid transparent;
+    border-radius: 10px;
+    box-sizing: border-box;
+
+    &:hover {
+      background: rgba(128, 134, 139, 0.4);
+      box-sizing: border-box;
+      background-clip: padding-box;
+    }
+  }
+}
+
+//                                 //
+//---------- Animations --------- //
+//                               //
+
+@keyframes left-animation {
+  from {
+    opacity: 0;
+    transform: translate3d(100%, 0, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes BTT-Entrance {
+  from {
+    opacity: 0;
+    transform: translate3d(0, 100%, 0);
+  }
+
+  to {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+@keyframes BTT-Exit {
+  from {
+    opacity: 1;
+  }
+
+  to {
+    opacity: 0;
+    transform: translate3d(0, 100%, 0);
+  }
+}
+
+@keyframes slide {
+  100% {
+    transform: translateX(0);
+  }
+}
+
+@keyframes slide-up {
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes fade-in {
+  100% {
+    opacity: 1;
+  }
+}
+

data/assets/css/Style.scss

@@ -1,13 +1,12 @@
----
----
-
-@import "jekyll-theme-fica";
-
-
-.site-title::before {
-    content: url("{{site.baseurl}}/logo.png");
-    display: inline-block;
-    position: relative;
-    width: 37px;
-    top: 7px;
-  }
+---
+---
+
+@import "jekyll-theme-fica";
+
+.logo::before {
+  content: url("{{site.baseurl}}/logo.png");
+  display: inline-block;
+  position: relative;
+  width: 37px;
+  top: 7px;
+}

data/bin/run

@@ -1,150 +1,195 @@
-#!/usr/bin/env bash
-
-# 
-# Name of the theme
-# 
-THEME="jekyll-theme-fica"
-
-# 
-# the name of the script
-# 
-SCRIPT="bin/"$( basename "$0" )
-
-# 
-# Current version
-# 
-VERSION="0.2.0"
-
-#
-# Colors
-RED='\033[0;31m'
-YELLOW='\033[0;33m'
-CYAN='\033[0;36m'
-NC='\033[0m' # No Color
-
-# 
-# help option
-# 
-function usage
-{
-echo -e "$CYAN$THEME$NC the modern theme with minimal look"
-echo -e ""
-echo -e "Usage:"
-echo -e    "$SCRIPT $CYAN[subcommand]$NC"
-echo -e ""
-echo -e ""
-echo -e "Subcommand:"
-echo -e "  $YELLOW upgrade, u $NC       Upgrades $TEME to the latest version"
-echo -e "  $YELLOW help, h  $NC         displays all the subcommand available and how to use it"
-echo -e "  $YELLOW version, v   $NC     show the version of the theme"
-echo -e "  $YELLOW server, s $NC        Runs the server locally"
-echo -e "  $YELLOW insdep, idp $NC      Installs all the dependencies"
-echo -e "  $YELLOW chktheme, ckte $NC   Checks the theme for errors"
-}
-
-#
-# Upgrade the theme to the latest version
-#
-function Upgrade 
-{
-  echo "Upgrading $THEME to $VERSION"
-  sed -i "s/gem 'jekyll-theme-fica', '~> 0.1.9'/gem 'jekyll-theme-fica', '~> 2.0.0'/gi" ./Gemfile
-  echo "Upgrade Complete!"
-}
-
-#
-# Runing the server locally
-#
-function server 
-{
-  echo "Starting Server....."
-  bundle exec jekyll serve
-}
-
-#
-# Installs all dependencies
-#
-function install_dependencies
-{
-  echo "Installing Dependencies of $THEME"
-  gem install bundler
-  bundle install
-}
-
-function error
-{
-    printf "${RED}Subcommand not recognized.${NC}"
-    echo ""
-    usage
-}
-
-function version
-{
-printf "$CYAN$THEME$NC v$VERSION"
-}
-
-#
-# Theme check
-#
-function chktheme
-{
-    printf "Running ${YELLOW}jekyll doctor ${NC}"
-    echo ""
-    jekyll doctor
-    echo ""
-    printf "Running ${YELLOW}jekyll build ${NC}"
-    echo ""
-    jekyll build
-}
-
-#
-# Process subcommands
-#
-while (( $# ))
-do
-    case "$1" in
-
-    
-        Upgrade  | u)
-            Upgrade
-            install_dependencies 
-            exit 0
-        ;; 
-
-        insdep | idp)
-            install_dependencies
-            exit 0
-        ;;    
-
-        server | s)
-            server
-            exit 0
-        ;;
-
-        help | h)
-            usage
-            exit 0
-        ;;
-
-        version | v)
-            version
-            exit 0
-        ;;
-
-        chktheme | ckte)
-            chktheme
-            exit 0
-        ;;
-        
-
-                    *)
-            error
-            exit 1
-        ;;
-
-    esac
-done
-
-printf "${RED}A subcommand is required.${NC}"
-echo ""
-usage
+#!/usr/bin/env bash
+
+#
+# Name of the theme
+#
+THEME="jekyll-theme-fica"
+
+#
+# the name of the script
+#
+SCRIPT="bin/"$( basename "$0" )
+
+#
+# Current version
+#
+VERSION="0.2.2"
+
+#
+# Colors
+#
+RED='\033[0;31m'
+YELLOW='\033[0;33m'
+CYAN='\033[0;36m'
+NC='\033[0m' # No Color
+
+#
+# help option
+#
+function usage
+{
+    echo -e "$CYAN$THEME$NC the modern theme with minimal look"
+    echo -e ""
+    echo -e "Usage:"
+    echo -e    "$SCRIPT $CYAN[subcommand]$NC"
+    echo -e ""
+    echo -e ""
+    echo -e "Subcommand:"
+    echo -e "  $YELLOW upgrade, u $NC       Upgrades $TEME to the latest version"
+    echo -e "  $YELLOW help, h  $NC         displays all the subcommand available and how to use it"
+    echo -e "  $YELLOW version, v   $NC     show the version of the theme"
+    echo -e "  $YELLOW server, s $NC        Runs the server locally"
+    echo -e "  $YELLOW insdep, ip $NC       Installs all the dependencies"
+    echo -e "  $YELLOW chktheme, ct $NC     Checks the theme for errors"
+    echo -e "  $YELLOW bldgem, bm $NC       builds the theme and uploads it to RubyGems"
+}
+
+#
+# Upgrade the theme to the latest version
+#
+function Upgrade
+{
+    echo "Upgrading $THEME to $VERSION"
+    sed -i "s/gem 'jekyll-theme-fica', '~> 0.1.9'/gem 'jekyll-theme-fica', '~> 2.2.0'/gi" ./Gemfile
+    echo "Upgrade Complete!"
+    # insdep
+}
+
+#
+# Runing the server locally
+#
+function server
+{
+    echo "Starting Server....."
+    bundle exec jekyll serve
+}
+
+#
+# Installs all dependencies
+#
+function install_dependencies
+{
+    echo "Installing Dependencies of $THEME"
+    gem install bundler
+    bundle install
+}
+
+function error
+{
+    printf "${RED}Subcommand not recognized.${NC}"
+    echo ""
+    usage
+}
+
+function version
+{
+    printf "$CYAN$THEME$NC v$VERSION"
+}
+
+#
+# Theme check
+#
+function chktheme
+{
+    echo ""
+    printf "Running ${YELLOW}Bundle ${NC}"
+    echo ""
+    bundle clean --force
+    install_dependencies
+    echo ""
+    printf "Running ${YELLOW}jekyll doctor ${NC}"
+    echo ""
+    jekyll doctor
+    echo ""
+    printf "Running ${YELLOW}jekyll build ${NC}"
+    echo ""
+    jekyll build
+}
+
+#
+# gem build and upload
+#
+function gm_bld
+{
+    echo Building gemspec.....
+    gem build jekyll-theme-fica.gemspec
+    echo Build complete
+    
+    while true; do
+        
+        read -p "Do you need to upload the the gem to RubyGem.org ? (y/n) " yn
+        
+        case $yn in
+            [yY] ) echo ok, we will proceed;
+                echo upload Gem file
+                read gm_uld
+                gem push $gm_uld
+            exit;;
+            [nN] ) echo exiting...;
+            exit;;
+            * ) echo invalid response;
+        esac
+        
+        
+    done
+}
+
+#
+# Process subcommands
+#
+
+while (( $# ))
+do
+    case "$1" in
+        
+        
+        bldgem  | bm)
+            gm_bld
+            exit 0
+        ;;
+        
+        Upgrade  | u)
+            Upgrade
+            install_dependencies
+            exit 0
+        ;;
+        
+        insdep | ip)
+            install_dependencies
+            exit 0
+        ;;
+        
+        server | s)
+            server
+            exit 0
+        ;;
+        
+        help | h)
+            usage
+            exit 0
+        ;;
+        
+        version | v)
+            version
+            exit 0
+        ;;
+        
+        chktheme | ct)
+            chktheme
+            exit 0
+        ;;
+        
+        
+        *)
+            error
+            exit 1
+        ;;
+        
+    esac
+done
+
+
+
+printf "${RED}A subcommand is required.${NC}"
+echo ""
+usage

data/js/Main.js

@@ -0,0 +1,21 @@
+const nav = document.getElementById("nav")
+const navcheck = document.getElementById("check")
+const screenWidth = window.innerWidth;
+window.addEventListener("resize", function () {
+    if (window.innerWidth !== screenWidth) {
+        // Do something
+        if (screenWidth < 1993) {
+            document.getElementById("banner-content").style.transform = "translateX(0)";
+        }
+    }
+}
+);
+navcheck.addEventListener('click', () => {
+    if (navcheck.checked) {
+    nav.style.position = "fixed";
+    document.documentElement.style.overflow = "hidden";
+    } else {
+    nav.style.position = "static";
+    document.documentElement.style.overflow = "auto";
+    }
+});

data/js/back-to-top.js

@@ -1,48 +1,39 @@
-const BackToTop = document.querySelector("#back-to-top");
-
-window.addEventListener("scroll", scrollFunction);
-
-function scrollFunction() {
-  if (window.pageYOffset > 200) { // Show BackToTop
-    if(!BackToTop.classList.contains("BTT-Entrance")) {
-      BackToTop.classList.remove("BTT-Exit");
-      BackToTop.classList.add("BTT-Entrance");
-      BackToTop.style.display = "block";
-    }
-  }
-  else { // Hide BackToTop
-    if(BackToTop.classList.contains("BTT-Entrance")) {
-      BackToTop.classList.remove("BTT-Entrance");
-      BackToTop.classList.add("BTT-Exit");
-      setTimeout(function() {
-        BackToTop.style.display = "none";
-      }, 250);
-    }
-  }
-}
-
-BackToTop.addEventListener("click", smoothScrollBackToTop);
-
-function smoothScrollBackToTop() {
-  const targetPosition = 0;
-  const startPosition = window.pageYOffset;
-  const distance = targetPosition - startPosition;
-  const duration = 750;
-  let start = null;
-  
-  window.requestAnimationFrame(step);
-
-  function step(timestamp) {
-    if (!start) start = timestamp;
-    const progress = timestamp - start;
-    window.scrollTo(0, easeInOutCubic(progress, startPosition, distance, duration));
-    if (progress < duration) window.requestAnimationFrame(step);
-  }
-}
-
-function easeInOutCubic(t, b, c, d) {
-	t /= d/2;
-	if (t < 1) return c/2*t*t*t + b;
-	t -= 2;
-	return c/2*(t*t*t + 2) + b;
-};
+const BackToTop = document.querySelector("#back-to-top");
+
+window.addEventListener("scroll", scrollFunction);
+
+function scrollFunction() {
+  if (window.pageYOffset > 200) {
+    // Show BackToTop
+    if (!BackToTop.classList.contains("BTT-Entrance")) {
+      BackToTop.classList.remove("BTT-Exit");
+      BackToTop.classList.add("BTT-Entrance");
+      BackToTop.style.display = "block";
+    }
+  } else {
+    // Hide BackToTop
+    if (BackToTop.classList.contains("BTT-Entrance")) {
+      BackToTop.classList.remove("BTT-Entrance");
+      BackToTop.classList.add("BTT-Exit");
+      setTimeout(function () {
+        BackToTop.style.display = "none";
+      }, 250);
+    }
+  }
+}
+
+BackToTop.addEventListener("click", smoothScrollBackToTop);
+
+function smoothScrollBackToTop() {
+  window.scrollTo(
+    0,
+    0
+  );
+}
+
+function easeInOutCubic(t, b, c, d) {
+  t /= d / 2;
+  if (t < 1) return (c / 2) * t * t * t + b;
+  t -= 2;
+  return (c / 2) * (t * t * t + 2) + b;
+}