1 files changed, 96 insertions, 20 deletions

diff --git a/templates/@theme-base/pm-styles/_pm-dark-theme.scss b/templates/@theme-base/pm-styles/_pm-dark-theme.scss
index 02f2d80..7e3dbbc 100644
--- a/templates/@theme-base/pm-styles/_pm-dark-theme.scss
+++ b/templates/@theme-base/pm-styles/_pm-dark-theme.scss
@@ -5,24 +5,38 @@
 @import "./pm-buttons-mixins";
 
 // forms/buttons
-.pm-button {
+.pm-button:not(.pm-button-blue):not(.pv-button-green):not(.pm-button--primary):not(.pm-button--primaryborderEvenInDarkMode):not(.pm-button--link):not(.pm-button--error):not(.pm-button--warning):not(.pm-button--redborder):not(.pm-button--primaryborder),
+.pm-button--info {
   @include pm-button-dark;
 }
-.pm-button-blueborder {
+
+// didn’t used extend, not possible in @media for design system website
+$primary-border-blue-selectors: ".pm-button-blueborder";
+@if ($pm-primary == $pm-blue) {
+	$primary-border-blue-selectors: $primary-border-blue-selectors + ", .pm-button--primaryborder";
+}
+#{$primary-border-blue-selectors} {
   @include pm-button-blueborder-dark;
 }
-.pv-button-greenborder {
+
+$primary-border-green-selectors: ".pv-button-greenborder";
+@if ($pm-primary == $pv-green) {
+	$primary-border-green-selectors: $primary-border-green-selectors + ", .pm-button--primaryborder";
+}
+#{$primary-border-green-selectors} {
   @include pv-button-greenborder-dark;
 }
 
-.pm-button-blue,
-.pm-button.pm-button-blue,
-.pv-button-green,
-.pm-button.pv-button-green {
-  &[disabled],
-  &.is-disabled {
-    @include button-disabled-state-dm;
-  }
+
+.pm-button--redborder,
+.pm-button.pm-button--redborder {
+	background-color: transparent;
+	&:focus,
+	&:hover,
+	&:not(div):active,
+	&:active {
+		color: $pm-global-warning;
+	}
 }
 
 .pm-button--link,
@@ -40,6 +54,21 @@ a, .link,
   }
 }
 
+.pm-group-button {
+  &[disabled],
+  &.is-disabled {
+    &.pm-button {
+      border-color: var(--bordercolor-input, $pm-global-border);
+    }
+    &.pm-button-blueborder {
+      border-color: $pm-primary-light;
+    }
+    &.pv-button-greenborder {
+      border-color: $pv-green-light;
+    }
+  }
+}
+
 
 .pm-field {
   &[type="search"] {
@@ -80,11 +109,16 @@ select.pm-field {
   }
 }
 
-
 .searchbox-field[type="search"] {
   background-image: none;
 }
 
+.pm-toggle-label {
+  & > .pm-toggle-label-text:first-child .pm-toggle-label-img {
+     fill: $white;
+  }
+}
+
 // loading
 [aria-busy="true"] {
   background-image: url(#{$path-images}loading-atom-smaller-dark.svg);
@@ -96,14 +130,29 @@ button[aria-busy="true"] {
 
 
 
+tr[aria-busy="true"] td,
 td[aria-busy="true"] {
-  position: relative;
-  background-image: none;
   &::before {
     background-image: url(#{$path-images}loading-atom-smaller-dark.svg);
   }
 }
 
+.progressive[aria-busy="true"] {
+  &::before {
+    animation-name: backgroundLoading-dark;
+  }
+}
+
+@keyframes backgroundLoading-dark {
+  0% {
+    background-color: $pm-secondary-grey;
+  }
+  100% {
+    background-color: lighten($pm-secondary-grey, 10%);
+  }
+}
+
+
 // others
 details {
   &[open] > summary {
@@ -115,25 +164,52 @@ summary {
 }
 
 
+.appConfigBody-darkmode, // for Angular
+.isDarkMode {
+  .display-on-darkmode {
+    display: flex;
+  }
+  .hide-on-darkmode {
+    display: none;
+  }
+}
+
+
 
 // quick and dirty
-.fill-global-grey,
-.fill-black { fill: $white; } // dirty, I know
+.fill-global-grey:not(.fill-pm-blue):not(.fill-primary),
+.fill-black:not(.fill-pm-blue):not(.fill-primary) { fill: $white; } // dirty, I know
+
+.fill-currentColor { fill: currentColor; } // to avoid some issues
+
+
+.qr-code {
+	border: 1px solid $white;
+}
+
+.pill-icon-attachment {
+	background-color: rgba(black, .45);
+
+}
 
 
 // global
 :root {
   --bgcolor-item-column-list: #{$pm-global-grey};
+  --bgcolor-unread-item-column-list: #{$pm-global-altgrey};
   --bgcolor-view-column-detail: #{$pm-secondary-grey};
   --bgcolor-main-area: #{$pm-secondary-grey};
-  --bgcolor-subnav: #{$pm-global-grey};
+  --bgcolor-context-bar: #{$pm-secondary-grey};
+  --bgcolor-subheader: #{$bluish-grey};
   --bgcolor-toolbar: #{$pm-global-altgrey};
-  --color-subnav-link: #{$white};
   --color-main-area: #{$white};
-  --fillcolor-icons: #{$white};
   --bgcolor-disabled-checkboxes-radios: #{$pm-global-altgrey};
   --bgcolor-item-column-active: #{$pm-blue-dark};
   --bordercolor-input: #{$pm-tertiary-grey};
+  --bgcolor-muted: #{$pm-tertiary-grey};
   --bgcolor-input: #{$pm-global-altgrey};
+  --bgcolor-highlight: #{$pm-global-altgrey};
   --color-input: #{$white};
-}
\ No newline at end of file
+  --dropdown-box-shadow: #{rgba(black, .75)};
+  --bgcolor-meterbar: #{rgba(black, .375)};
+}