From ebe86093e15911fdefd6f743877d50a4867a1b31 Mon Sep 17 00:00:00 2001
From: Fredrik Jonsson <frjo@xdeb.org>
Date: Tue, 25 Sep 2018 10:23:25 +0200
Subject: [PATCH] Add js or no-js class to html tag.
---
opentech/static_src/src/javascript/main.js | 4 ++--
.../static_src/src/sass/apply/base/_base.scss | 14 ++++++++++++++
.../static_src/src/sass/public/base/_base.scss | 15 +++++++++++++++
3 files changed, 31 insertions(+), 2 deletions(-)
diff --git a/opentech/static_src/src/javascript/main.js b/opentech/static_src/src/javascript/main.js
index 72f51de55..ea8e83040 100755
--- a/opentech/static_src/src/javascript/main.js
+++ b/opentech/static_src/src/javascript/main.js
@@ -104,8 +104,8 @@
}
};
- // remove no-js class if js is enabled
- document.querySelector('html').classList.remove('no-js');
+ // Replace no-js with js class if js is enabled.
+ document.querySelector('html').classList.replace('no-js', 'js');
$(MobileMenu.selector()).each((index, el) => {
new MobileMenu($(el), $('.js-mobile-menu-close'), $('.header__menus--mobile'), $('.header__search'));
diff --git a/opentech/static_src/src/sass/apply/base/_base.scss b/opentech/static_src/src/sass/apply/base/_base.scss
index 17a897268..265736153 100755
--- a/opentech/static_src/src/sass/apply/base/_base.scss
+++ b/opentech/static_src/src/sass/apply/base/_base.scss
@@ -80,6 +80,20 @@ ol {
display: none;
}
+.js-hidden,
+%js-hidden {
+ html.js & {
+ @extend %is-hidden;
+ }
+}
+
+.no-js-hidden,
+%no-js-hidden {
+ html.nojs & {
+ @extend %is-hidden;
+ }
+}
+
.is-unhidden,
%is-unhidden {
display: block;
diff --git a/opentech/static_src/src/sass/public/base/_base.scss b/opentech/static_src/src/sass/public/base/_base.scss
index 748e1f9de..fd23d62da 100755
--- a/opentech/static_src/src/sass/public/base/_base.scss
+++ b/opentech/static_src/src/sass/public/base/_base.scss
@@ -74,11 +74,26 @@ ol {
transition: opacity, z-index, $transition;
}
+.hidden,
.is-hidden,
%is-hidden {
display: none;
}
+.js-hidden,
+%js-hidden {
+ html.js & {
+ @extend %is-hidden;
+ }
+}
+
+.no-js-hidden,
+%no-js-hidden {
+ html.nojs & {
+ @extend %is-hidden;
+ }
+}
+
.is-unhidden,
%is-unhidden {
display: block;
--
GitLab