Optimize box-shadow of .site-brand-container

.github/labeler.yml

@@ -5,3 +5,4 @@ Configurations: _config.yml
 CSS: source/css/**/*
 📖 Docs: docs/**/*
 Layout: layout/**/*
+🌍 i18n: languages/**/*

_config.yml

@@ -853,6 +853,7 @@ canvas_ribbon:
 vendors:
   # The CDN provider of NexT internal scripts.
   # Available values: local | jsdelivr | unpkg
+  # Warning: If you are using the latest master branch of NexT, please set `internal: local`
   internal: local
   # The default CDN provider of third-party plugins.
   # Available values: local | jsdelivr | unpkg | cdnjs

source/css/_common/outline/header/site-nav.styl

@@ -22,7 +22,7 @@
     display: none;
   }
 
-  &.site-nav-on {
+  .site-nav-on & {
     display: block;
   }
 }

source/css/_schemes/Pisces/_header.styl

@@ -1,8 +1,10 @@
 .site-brand-container {
   background: $black-deep;
 
-  +tablet-mobile() {
-    box-shadow: 0 0 16px rgba(0, 0, 0, .5);
+  .site-nav-on & {
+    +tablet-mobile() {
+      box-shadow: 0 0 16px rgba(0, 0, 0, .5);
+    }
   }
 }
 

source/js/next-boot.js

@@ -12,10 +12,10 @@ NexT.boot.registerEvents = function() {
     event.currentTarget.classList.toggle('toggle-close');
     const siteNav = document.querySelector('.site-nav');
     if (!siteNav) return;
-    const animateAction = siteNav.classList.contains('site-nav-on');
+    const animateAction = document.body.classList.contains('site-nav-on');
     const height = NexT.utils.getComputedStyle(siteNav);
     siteNav.style.height = animateAction ? height : 0;
-    const toggle = () => siteNav.classList.toggle('site-nav-on');
+    const toggle = () => document.body.classList.toggle('site-nav-on');
     const begin = () => {
       siteNav.style.overflow = 'hidden';
     };