disable button temporarily

3 files changed, 70 insertions, 7 deletions

diff --git a/assets/scss/_components.scss b/assets/scss/_components.scss
index d17ecd2..8d33ca7 100644
--- a/assets/scss/_components.scss
+++ b/assets/scss/_components.scss
@@ -219,6 +219,7 @@
     position: relative;
     overflow: hidden;
     box-shadow: 0 0.25rem 1rem rgba(0,0,0,0.15);
+    display: none;
     &::before, &::after {
       content: "";
       z-index: 1;
diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.content b/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.content
index 795355a..e1e2515 100644
--- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.content
+++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.content
@@ -41,7 +41,8 @@
   src: local("Cookie-Regular"), url("http://localhost:1313/theme/newsroom/fonts/cookie-v10-latin-regular.woff2") format("woff2"), url("http://localhost:1313/theme/newsroom/fonts/cookie-v10-latin-regular.woff") format("woff");
 }
 
-:root {
+html {
+  --color-mode: 'light';
   --light: #fff;
   --dark: #000;
   --gray: #f5f5f5;
@@ -54,16 +55,28 @@
 }
 
 @media (prefers-color-scheme: dark) {
-  :root {
+  html:not(.light) {
+    --color-mode: 'dark';
     --bg: var(--dark);
     --text: var(--light);
     --accent: var(--bubble);
   }
-  * {
+  html:not(.light) * {
     box-shadow: none !important;
   }
 }
 
+html.dark {
+  --color-mode: 'dark';
+  --bg: var(--dark);
+  --text: var(--light);
+  --accent: var(--bubble);
+}
+
+html.dark * {
+  box-shadow: none !important;
+}
+
 @keyframes showMenu {
   0% {
     top: -100%;
@@ -287,7 +300,7 @@ aside h3 {
 
 .article_meta.center_y {
   transform-origin: center;
-  transition: all 0.5s;
+  transition: transform 0.5s;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -358,8 +371,7 @@ aside h3 {
 
 @media screen and (min-width: 769px) {
   .article:hover .article_meta.center_y {
-    margin-left: -15px;
-    padding-right: 35px;
+    transform: translateX(-1rem);
   }
 }
 
@@ -495,6 +507,56 @@ aside h3 {
   opacity: 1;
 }
 
+.color_mode {
+  width: 3rem;
+  height: 1.5rem;
+  background-color: var(--theme);
+  border-radius: 1rem;
+  display: grid;
+  align-items: center;
+  cursor: pointer;
+  margin: 5rem 1.5rem 0;
+  position: relative;
+  overflow: hidden;
+  box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
+  display: none;
+}
+
+.color_mode::before, .color_mode::after {
+  content: "";
+  z-index: 1;
+  position: absolute;
+  height: 1rem;
+  width: 2rem;
+  background-size: contain;
+  background-repeat: no-repeat;
+}
+
+.color_mode::before {
+  background-image: url("http://localhost:1313/theme/newsroom/images/crescent.svg");
+  left: 0.25rem;
+}
+
+.color_mode::after {
+  background-image: url("http://localhost:1313/theme/newsroom/images/sun.svg");
+  right: 0.25rem;
+  background-position: right;
+}
+
+.color_choice {
+  width: 1.5rem;
+  height: 1.5rem;
+  border-radius: 50%;
+  background-color: var(--light);
+  transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1);
+  position: relative;
+  z-index: 3;
+}
+
+.color_live .color_choice {
+  transform: translateX(1.5rem);
+}
+
 .nav {
   position: absolute;
   top: 0;
diff --git a/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.json b/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.json
index 98005c1..91c7569 100644
--- a/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.json
+++ b/exampleSite/resources/_gen/assets/scss/scss/main.scss_65b0252c4a2fb050308e79c52b2c1909.json
@@ -1 +1 @@
-{"Target":"css/main.b0c2524beabff3a7000928d0f91bc37fa3e3408f5772e6753b41cfd3856fdf95f238abea6bbebebd8a82222dbfbdf8cc923fce7c0cfc4a7683eb4712e584c901.css","MediaType":"text/css","Data":{"Integrity":"sha512-sMJSS+q/86cACSjQ+RvDf6PjQI9XcuZ1O0HP04Vv35XyOKvqa76+vYqCIi2/vfjMkj/OfAz8SnaD60cS5YTJAQ=="}}
\ No newline at end of file
+{"Target":"css/main.765cae356b704919c1885312d146ad0e2cd6cab43d6d9a77a97a55b6adf32ce3895bc3a38781997f45ec17e5d400995912da2fd756ee7962ddb0caa35a2c0550.css","MediaType":"text/css","Data":{"Integrity":"sha512-dlyuNWtwSRnBiFMS0UatDizWyrQ9bZp3qXpVtq3zLOOJW8Ojh4GZf0XsF+XUAJlZEtov11bueWLdsMqjWiwFUA=="}}
\ No newline at end of file