feat: better colors for active and hover state of NotePreview

sereneinserenade · May 28, 2022 · dfeac9f · dfeac9f
1 parent 91ab179
commit dfeac9f
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 17 deletions.
diff --git a/src/pages/Newtab/Newtab.tsx b/src/pages/Newtab/Newtab.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from 'react';
 import { createTheme, NextUIProvider, getDocumentTheme } from '@nextui-org/react';
-import { RecoilRoot, useRecoilState } from 'recoil';
+import { RecoilRoot } from 'recoil';
 
 import 'tippy.js/animations/shift-toward-subtle.css';
 
@@ -18,8 +18,8 @@ const Newtab = () => {
     type: 'dark',
     theme: {
       colors: {
-        primary: '#3D9CF7',
-        link: '#3D9CF7',
+        // primary: '#3D9CF7',
+        // link: '#3D9CF7',
       }
     }
   })

diff --git a/src/pages/Newtab/components/note/styles/NotePreview.scss b/src/pages/Newtab/components/note/styles/NotePreview.scss
@@ -6,8 +6,8 @@
   transition: all 0.2s ease-in-out;
 
   &:hover {
-    background: rgba($color: gray, $alpha: 0.1);
     transition: none;
+    background-color: var(--nextui-colors-primaryLight);
 
     .control-buttons {
       max-width: 50px !important;
@@ -16,7 +16,7 @@
 
   &.active {
     transition: all 0.2s ease-in-out;
-    background: rgba($color: gray, $alpha: 0.2);
+    background-color: var(--nextui-colors-primaryLightHover);
   }
 
   .title-and-action-center {
@@ -50,15 +50,3 @@
     }
   }
 }
-
-.dark-theme {
-  .sidebar-note {
-    &:hover {
-      background: rgba($color: white, $alpha: 0.1);
-    }
-
-    &.active {
-      background: rgba($color: white, $alpha: 0.2);
-    }
-  }
-}