feat: create new card styles, update navbar colors, and remove obsolete service styles

Author: techwithanirudh

src/components/_cards.scss

@@ -0,0 +1,21 @@
+@use 'globals' as *;
+
+div.border-l.border-dashed.box-without-bg-without-border {
+  border-radius: var(--radius-xl);
+  background: var(--card);
+  color: var(--card-foreground);
+  padding: s(4) s(0) s(4) s(4);
+  border-style: solid;
+  background-clip: padding-box;
+  overflow: hidden;
+}
+
+div.border-l-2.bg-white.dark\:bg-coolgray-100 {
+  border-radius: var(--radius-xl);
+  background: var(--card);
+  color: var(--card-foreground);
+  padding: s(4);
+  border-style: solid;
+  background-clip: padding-box;
+  overflow: hidden;
+}

src/components/_index.scss

@@ -9,4 +9,4 @@
 @use 'settings-menu';
 @use 'spinner';
 @use 'search';
-@use 'service';
+@use 'cards';

src/components/_navbar.scss

@@ -24,7 +24,7 @@
 .navbar-main nav a {
   padding: s(1.25);
   border-radius: 10px;
-  color: var(--sidebar-foreground);
+  color: var(--muted-foreground);
   font-weight: 600;
   cursor: pointer;
   transition:
@@ -33,12 +33,12 @@
 }
 
 .navbar-main nav a:hover {
-  color: var(--sidebar-accent-foreground);
+  color: var(--sidebar-foreground);
 }
 
 .navbar-main nav a[class*='dark:text-white'],
 .navbar-main nav a[aria-current='page'] {
-  color: var(--sidebar-accent-foreground);
+  color: var(--sidebar-foreground);
 }
 
 .navbar-main .flex-1 {

src/components/_service.scss

@@ -1,13 +1,5 @@
 @use 'globals' as *;
 
-// Deployment Card
-.p-2.border-l-2.bg-white.dark\:bg-coolgray-100 {
-  padding: s(2);
-  background-color: var(--card);
-  color: var(--card-foreground);
-  border-radius: var(--radius-lg);
-}
-
 .p-4.my-4.border.dark\:border-coolgray-200.border-neutral-200 {
   padding: s(4);
   margin-top: s(4);