d0zingcat/nextjs-notion-starter-kit
1
0
Fork 0
mirror of https://github.com/d0zingcat/nextjs-notion-starter-kit.git synced 2026-06-08 23:16:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: replace use-dark-mode with next-themes

Browse Source
This commit is contained in:
Travis Fischer
2022-04-15 21:57:29 -04:00
parent b1ac72e5f8
commit 218097539a
11 changed files with 3474 additions and 3859 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
styles/notion.css
View File

@@ -331,15 +331,15 @@
);
}
.dark-mode .notion-red_background,
.dark-mode .notion-pink_background,
.dark-mode .notion-blue_background,
.dark-mode .notion-purple_background,
.dark-mode .notion-teal_background,
.dark-mode .notion-yellow_background,
.dark-mode .notion-orange_background,
.dark-mode .notion-brown_background,
.dark-mode .notion-gray_background {
[data-theme='dark'] .notion-red_background,
[data-theme='dark'] .notion-pink_background,
[data-theme='dark'] .notion-blue_background,
[data-theme='dark'] .notion-purple_background,
[data-theme='dark'] .notion-teal_background,
[data-theme='dark'] .notion-yellow_background,
[data-theme='dark'] .notion-orange_background,
[data-theme='dark'] .notion-brown_background,
[data-theme='dark'] .notion-gray_background {
padding: 0;
margin: 0;
border-radius: 0;
@@ -361,7 +361,7 @@
backdrop-filter: saturate(180%) blur(16px);
}
.dark-mode .notion-header {
[data-theme='dark'] .notion-header {
background: transparent;
box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1);
backdrop-filter: saturate(180%) blur(8px);
@@ -369,7 +369,7 @@
/* Workaround for Firefox not supporting backdrop-filter yet */
@-moz-document url-prefix() {
.dark-mode .notion-header {
[data-theme='dark'] .notion-header {
background: hsla(203, 8%, 20%, 0.8);
}
}

18
styles/prism-theme.css
View File

@@ -7,7 +7,7 @@
padding: 1.5em !important;
}
.dark-mode .notion-code {
[data-theme='dark'] .notion-code {
background-color: rgba(17, 24, 39, 1);
border-color: rgba(55, 65, 81, 1);
}
@@ -18,11 +18,11 @@
background: none !important;
padding: 0 !important;
}
.dark-mode .notion code {
[data-theme='dark'] .notion code {
color: rgba(229, 231, 235, 1);
}
.dark-mode .notion .notion-inline-code {
[data-theme='dark'] .notion .notion-inline-code {
background: rgb(71, 76, 80) !important;
color: #ff4081;
padding: 0.2em 0.4em !important;
@@ -42,15 +42,15 @@
.token.comment {
color: #5b9b4c;
}
.dark-mode .token.cdata,
.dark-mode .token.doctype,
.dark-mode .token.prolog {
[data-theme='dark'] .token.cdata,
[data-theme='dark'] .token.doctype,
[data-theme='dark'] .token.prolog {
color: rgba(209, 213, 219, 1);
}
.token.punctuation {
color: rgba(55, 65, 81, 1);
}
.dark-mode .token.punctuation {
[data-theme='dark'] .token.punctuation {
color: rgba(209, 213, 219, 1);
}
.token.boolean,
@@ -95,8 +95,8 @@ code[class*='language-'],
pre[class*='language-'] {
color: rgba(31, 41, 55, 1);
}
.dark-mode code[class*='language-'],
.dark-mode pre[class*='language-'] {
[data-theme='dark'] code[class*='language-'],
[data-theme='dark'] pre[class*='language-'] {
color: rgba(249, 250, 251, 1);
}
pre::-webkit-scrollbar {