diff --git a/apps/client/src/stylesheets/theme-next/base.css b/apps/client/src/stylesheets/theme-next/base.css
index 6a0ea97e53..e57de8cd67 100644
--- a/apps/client/src/stylesheets/theme-next/base.css
+++ b/apps/client/src/stylesheets/theme-next/base.css
@@ -643,106 +643,6 @@ li.dropdown-item a.dropdown-item-button:focus-visible {
     transform: translateY(4%);
 }
 
-/*
- * NOTE LIST
- */
-
- .note-list .note-book-card {
-    --note-list-horizontal-padding: 22px;
-    --note-list-vertical-padding: 15px;
-    background-color: var(--card-background-color);
-    border: 1px solid var(--card-border-color) !important;
-    border-radius: 12px;
-    user-select: none;
-    padding: 0;
-}
-
-:root .note-list .note-book-card:hover {
-    background-color: var(--card-background-hover-color);
-    transition: background-color 200ms ease-out;
-}
-
-:root .note-list.grid-view .note-book-card:active {
-    transform: scale(.98);
-}
-
-.note-list.list-view .note-book-card {
-    box-shadow: 0 0 3px var(--card-shadow-color);
-}
-
-.note-list.list-view .note-book-card .note-book-header .note-icon {
-    vertical-align: middle;
-}
-
-.note-list-wrapper .note-book-card a {
-    color: inherit !important;
-}
-
-.note-list-wrapper .note-book-card .note-book-content {
-    padding: 0 !important;
-    font-size: 0.8rem;
-}
-
-.note-list-wrapper .note-book-card .note-book-content .rendered-content {
-    padding: 1rem;
-}
-
-.note-list-wrapper .note-book-card .note-book-content.type-image .rendered-content,
-.note-list-wrapper .note-book-card .note-book-content.type-pdf .rendered-content {
-    padding: 0;
-}
-
-.note-list-wrapper .note-book-card .note-book-content .rendered-content.text-with-ellipsis {
-    padding: 1rem !important;
-}
-
-.note-list-wrapper .note-book-card .note-book-content h1,
-.note-list-wrapper .note-book-card .note-book-content h2,
-.note-list-wrapper .note-book-card .note-book-content h3,
-.note-list-wrapper .note-book-card .note-book-content h4,
-.note-list-wrapper .note-book-card .note-book-content h5,
-.note-list-wrapper .note-book-card .note-book-content h6 {
-    font-size: 1rem;
-    color: var(--active-item-text-color);
-}
-
-.note-list-wrapper .note-book-card .note-book-content p:last-child {
-    margin-bottom: 0;
-}
-
-.note-list-wrapper .note-book-card .note-book-content.type-canvas .rendered-content,
-.note-list-wrapper .note-book-card .note-book-content.type-mindMap .rendered-content,
-.note-list-wrapper .note-book-card .note-book-content.type-code .rendered-content,
-.note-list-wrapper .note-book-card .note-book-content.type-video .rendered-content {
-    padding: 0;
-}
-
-.note-list-wrapper .note-book-card .note-book-content.type-code {
-    height: 100%;
-}
-
-.note-list-wrapper .note-book-card .note-book-content.type-code pre {
-    height: 100%;
-    padding: 1em;
-    margin-bottom: 0;
-}
-
-.note-list.grid-view .note-book-card:hover {
-    filter: contrast(105%);
-}
-
-.note-list.grid-view .ck-content {
-    line-height: 1.3;
-}
-
-.note-list.grid-view .ck-content p {
-    margin-bottom: 0.5em;
-}
-
-.note-list.grid-view .ck-content figure.image {
-    width: 25%;
-}
-
 /*
  * NOTE SEARCH SUGGESTIONS
  */
diff --git a/apps/client/src/widgets/collections/legacy/ListOrGridView.css b/apps/client/src/widgets/collections/legacy/ListOrGridView.css
index f7ada94514..0b88a9c284 100644
--- a/apps/client/src/widgets/collections/legacy/ListOrGridView.css
+++ b/apps/client/src/widgets/collections/legacy/ListOrGridView.css
@@ -2,11 +2,11 @@
     overflow: visible;
     position: relative;
     height: 100%;
-}
 
-.note-list-wrapper {
-    height: 100%;
-    overflow: auto;
+    .note-list-wrapper {
+        height: 100%;
+        overflow: auto;
+    }
 }
 
 /* #region List view / Grid view common styles */
@@ -247,14 +247,29 @@
 /* #region Grid view */
 
 .note-book-card {
-    border-radius: 10px;
-    background-color: var(--accented-background-color);
-    padding: 10px 15px 15px 8px;
-    overflow: hidden;
+    --note-list-horizontal-padding: 22px;
+    --note-list-vertical-padding: 15px;
+    
     display: flex;
     flex-direction: column;
     flex-shrink: 0;
     flex-grow: 1;
+    border: 1px solid var(--card-border-color) !important;
+    border-radius: 12px;
+    background-color: var(--card-background-color, var(--accented-background-color));
+    padding: 0;
+    overflow: hidden;
+    user-select: none;
+
+    &:hover {
+        background-color: var(--card-background-hover-color);
+        filter: contrast(105%);
+        transition: background-color 200ms ease-out;
+    }
+
+    &:active {
+        transform: scale(.98);
+    }
 
     &.archived {
         opacity: 0.5;
@@ -323,4 +338,57 @@ body.mobile .note-list.grid-view .note-book-card {
     opacity: 0.5;
 }
 
+.note-book-card .note-book-content {
+    padding: 0;
+    font-size: 0.8rem;
+    
+    .ck-content p {
+        margin-bottom: 0.5em;
+        line-height: 1.3;
+    }
+
+    .ck-content figure.image {
+        width: 25%;
+    }
+
+    .rendered-content {
+        padding: 1rem;
+    }
+
+    &.type-image .rendered-content,
+    &.type-pdf .rendered-content {
+        padding: 0;
+    }
+
+    .rendered-content.text-with-ellipsis {
+        padding: 1rem !important;
+    }
+
+    h1, h2, h3, h4, h5, h6 {
+        font-size: 1rem;
+        color: var(--active-item-text-color);
+    }
+
+    p:last-child {
+        margin-bottom: 0;
+    }
+
+    &.type-canvas .rendered-content,
+    &.type-mindMap .rendered-content,
+    &.type-code .rendered-content,
+    &.type-video .rendered-content {
+        padding: 0;
+    }
+
+    &.type-code {
+        height: 100%;
+    }
+
+    &.type-code pre {
+        height: 100%;
+        padding: 1em;
+        margin-bottom: 0;
+    }
+}
+
 /* #endregion */
\ No newline at end of file