fix: scrollbar color in light, closes #185

Signed-off-by: Innei <i@innei.in>
Innei · Dec 13, 2023 · 9bf5e07 · 9bf5e07
1 parent 4e36cad
commit 9bf5e07
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 9 deletions.
diff --git a/src/components/ui/markdown/renderers/LinkRenderer.tsx b/src/components/ui/markdown/renderers/LinkRenderer.tsx
@@ -196,15 +196,17 @@ const GithubUrlRenderL: FC<{
       const ref = splitString[0]
       const path = ref ? splitString.slice(1).join('/') : afterTypeString
       return (
-        <>
-          <MLink href={href}>{href}</MLink>
+        <div className="flex w-full flex-col items-center">
           <EmbedGithubFile
             owner={owner}
             repo={repo}
             path={path}
             refType={ref}
           />
-        </>
+          <div className="mt-4">
+            <MLink href={href}>{href}</MLink>
+          </div>
+        </div>
       )
     }
   }

diff --git a/src/components/widgets/shared/EmbedGithubFile.tsx b/src/components/widgets/shared/EmbedGithubFile.tsx
@@ -107,7 +107,7 @@ export const EmbedGithubFile = memo(
     if (!data) return null
 
     return (
-      <div className="h-[50vh] overflow-auto">
+      <div className="h-[50vh] w-full overflow-auto">
         <HighLighter content={data} lang={fileType} />
       </div>
     )

diff --git a/src/styles/scrollbar.css b/src/styles/scrollbar.css
@@ -21,14 +21,14 @@ body {
 *::-webkit-scrollbar-thumb,
 *::-webkit-scrollbar-thumb:hover {
   background-color: transparent;
-  border: 3px solid theme(colors.base-100);
+  border: 3px solid theme(colors.zinc.200/20);
   border-radius: 5px;
 }
 
 *::-webkit-scrollbar {
   width: 5px !important;
   height: 5px !important;
-  background: theme(colors.base-100);
+  background: theme(colors.zinc.100);
 }
 
 *::-webkit-scrollbar-thumb {
@@ -40,5 +40,5 @@ body {
 }
 
 *::-webkit-scrollbar-corner {
-  background: theme(colors.base-100);
+  background: theme(colors.zinc.100);
 }
diff --git a/src/styles/variables.css b/src/styles/variables.css
@@ -25,8 +25,8 @@ html {
 }
 
 ::selection {
-  background-color: var(--theme-color);
-  color: theme(colors.always.white);
+  background-color: var(--theme-color) !important;
+  color: theme(colors.always.white) !important;
   text-shadow: none;
 }