feat: popup,elevator等组件暗黑模式支持

motian · Jul 29, 2022 · 11bbbc0 · 11bbbc0
1 parent e1c3274
commit 11bbbc0
Show file tree

Hide file tree

Showing 7 changed files with 64 additions and 0 deletions.
diff --git a/src/packages/__VUE/elevator/demo.vue b/src/packages/__VUE/elevator/demo.vue
@@ -422,6 +422,11 @@ export default createDemo({
 </script>
 
 <style lang="scss" scoped>
+.nut-theme-dark {
+  .demo {
+    background-color: #000 !important;
+  }
+}
 .demo {
   background-color: #fff !important;
 }

diff --git a/src/packages/__VUE/elevator/index.scss b/src/packages/__VUE/elevator/index.scss
@@ -1,3 +1,19 @@
+.nut-theme-dark {
+  .nut-elevator {
+    background-color: $dark-background2;
+    &__list {
+      &__item {
+        color: $dark-color;
+        &__code {
+          color: $dark-color;
+        }
+      }
+      &__fixed {
+        background-color: $dark-background2;
+      }
+    }
+  }
+}
 .nut-elevator {
   width: 100%;
   display: block;

diff --git a/src/packages/__VUE/popup/index.scss b/src/packages/__VUE/popup/index.scss
@@ -1,3 +1,13 @@
+.nut-theme-dark {
+  .nut-popup {
+    background: $dark-background2;
+  }
+  .nutui-popup {
+    &__close-icon {
+      color: $dark-color;
+    }
+  }
+}
 .popup-slide {
   &-center-enter-active,
   &-center-leave-active {

diff --git a/src/packages/__VUE/sidenavbaritem/index.scss b/src/packages/__VUE/sidenavbaritem/index.scss
@@ -1,3 +1,12 @@
+.nut-theme-dark {
+  .nut-sidenavbaritem {
+    background-color: $dark-background2;
+    &__title {
+      background-color: $dark-background2;
+      color: $dark-color;
+    }
+  }
+}
 .nut-sidenavbaritem {
   height: $sidenavbar-item-height;
   line-height: $sidenavbar-item-line-height;

diff --git a/src/packages/__VUE/steps/demo.vue b/src/packages/__VUE/steps/demo.vue
@@ -140,6 +140,11 @@ export default createDemo({
 </script>
 
 <style lang="scss">
+.nut-theme-dark {
+  .steps-wrapper {
+    background-color: #1b1b1b;
+  }
+}
 .padding {
   padding-left: 0 !important;
   padding-right: 0 !important;

diff --git a/src/packages/__VUE/sticky/demo.vue b/src/packages/__VUE/sticky/demo.vue
@@ -61,6 +61,13 @@ export default createDemo({
 });
 </script>
 <style lang="scss" scoped>
+.nut-theme-dark {
+  .demo {
+    .sticky-container {
+      background-color: #1b1b1b;
+    }
+  }
+}
 .demo {
   height: 200vh !important;
 }

diff --git a/src/packages/__VUE/subsidenavbar/index.scss b/src/packages/__VUE/subsidenavbar/index.scss
@@ -1,3 +1,15 @@
+.nut-theme-dark {
+  .nut-subsidenavbar {
+    background-color: $dark-background2;
+    &__title {
+      background-color: $dark-background3;
+      color: $dark-color;
+      &__text {
+        color: $dark-color;
+      }
+    }
+  }
+}
 .nut-subsidenavbar {
   display: grid;
   float: left;