navigation.css in material_design-0.2.2

- old
+ new

@@ -10,10 +10,13 @@
     background: var(--md-sys-light-surface-container-low);
   }
   @media (prefers-color-scheme: dark) {
     background: var(--md-sys-dark-surface-container-low);
   }
+  @media (max-width: 840px) {
+    display: none;
+  }
 }
 
 .navigation-drawer__headline {
   display: flex;
   height: 56px;
@@ -41,10 +44,24 @@
   align-self: stretch;
   border-radius: 100px;
 }
 
 .navigation-drawer__nav_item:hover {
-  background: var(-md-state-layers-light-on-surface-opacity, #1D1B2014);
+  @media (prefers-color-scheme: light) {
+    background: var(--md-sys-light-secondary-container);
+  }
+  @media (prefers-color-scheme: dark) {
+    background: var(--md-sys-dark-secondary-container);
+  }
+}
+
+.navigation-drawer__nav_item.active {
+  @media (prefers-color-scheme: light) {
+    background: var(--md-sys-light-secondary-container);
+  }
+  @media (prefers-color-scheme: dark) {
+    background: var(--md-sys-dark-secondary-container);
+  }
 }
 
 .navigation-drawer__state-layer {
   display: flex;
   padding: 16px 24px 16px 16px;