enhance(ui): polish popover related colors

resources/css/shui.css

@@ -12,18 +12,22 @@ html {
     --muted: var(--rx-gray-05-hsl);
   }
 
-  .ui__dropdown-menu-item,
-  div[data-radix-popper-content-wrapper] div[role=menuitem] {
-    &:focus, &:hover {
-      /* background-color: var(--lx-gray-04, hsl(var(--accent))); */
+
+  &:not([data-color=logseq]) {
+    .ui__dropdown-menu-item,
+    div[data-radix-popper-content-wrapper] div[role=menuitem] {
+      &:focus, &:hover {
+        background-color: var(--lx-gray-04, hsl(var(--accent)));
+      }
     }
-  }
 
-  div[data-radix-popper-content-wrapper] div[role=menu] {
-    /* background-color: var(--lx-gray-03, hsl(var(--popover))); */
-  }
 
-  &:not([data-color=logseq]) {
+    div[data-radix-popper-content-wrapper] div[role=menu],
+    .menu-links-wrapper,
+    .menu-links-outer,
+    .absolute-modal[data-modal-name] {
+      background-color: var(--lx-popover-bg, var(--lx-gray-01, hsl(var(--popover))));
+    }
   }
 
   &[data-color=logseq] {
@@ -80,6 +84,12 @@ html[data-theme=dark] {
 
   background-color: #161616;
 
+  &:not([data-color=logseq]) {
+    body {
+      --lx-popover-bg: var(--lx-gray-02);
+    }
+  }
+
   &[data-color=logseq] {
     --background: 192 100% 11%;
     --foreground: 0 0% 95%;

src/main/frontend/components/datepicker.css

@@ -49,10 +49,8 @@
   top: 100px;
   left: 20px;
   padding: 10px;
-  margin-top: 1px;
   line-height: 16px;
   border-radius: 4px;
-  background: #efefef;
 }
 
 .datepicker table {

src/main/frontend/components/editor.css

@@ -52,6 +52,14 @@
       max-width: 90vw !important;
     }
   }
+
+  &[data-modal-name="date-picker"] {
+    @apply py-0;
+
+    .rc-datepicker {
+      @apply my-0;
+    }
+  }
 }
 
 .is-mobile {