update 6
This commit is contained in:
nanxiaobei
parent
c262edf469
commit
eb1107b7f1
11 changed files with 479 additions and 127 deletions
|
|
@ -15,13 +15,18 @@ body {
|
|||
height: 100%;
|
||||
}
|
||||
|
||||
:root {
|
||||
--light-bg: #fbfbfb;
|
||||
--dark-bg: #000;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
background: #fffefc;
|
||||
background: var(--light-bg);
|
||||
}
|
||||
|
||||
.dark body {
|
||||
background: #000;
|
||||
background: var(--dark-bg);
|
||||
}
|
||||
|
||||
.not-ready,
|
||||
|
|
@ -43,7 +48,7 @@ body {
|
|||
}
|
||||
|
||||
.nav-wrapper {
|
||||
background: #fffefc;
|
||||
background: var(--light-bg);
|
||||
}
|
||||
|
||||
.open {
|
||||
|
|
|
|||
558
assets/main.css
558
assets/main.css
|
|
@ -7,7 +7,7 @@
|
|||
*/
|
||||
|
||||
/*
|
||||
! tailwindcss v3.1.4 | MIT License | https://tailwindcss.com
|
||||
! tailwindcss v3.1.6 | MIT License | https://tailwindcss.com
|
||||
*/
|
||||
|
||||
/*
|
||||
|
|
@ -590,8 +590,22 @@ video {
|
|||
font-weight: 600;
|
||||
}
|
||||
|
||||
.prose :where(a strong):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(blockquote strong):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(thead th strong):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(ol):not(:where([class~="not-prose"] *)) {
|
||||
list-style-type: decimal;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
|
||||
|
|
@ -633,6 +647,8 @@ video {
|
|||
|
||||
.prose :where(ul):not(:where([class~="not-prose"] *)) {
|
||||
list-style-type: disc;
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
padding-left: 1.625em;
|
||||
}
|
||||
|
||||
|
|
@ -683,6 +699,7 @@ video {
|
|||
|
||||
.prose :where(h1 strong):not(:where([class~="not-prose"] *)) {
|
||||
font-weight: 900;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(h2):not(:where([class~="not-prose"] *)) {
|
||||
|
|
@ -696,6 +713,7 @@ video {
|
|||
|
||||
.prose :where(h2 strong):not(:where([class~="not-prose"] *)) {
|
||||
font-weight: 800;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(h3):not(:where([class~="not-prose"] *)) {
|
||||
|
|
@ -709,6 +727,7 @@ video {
|
|||
|
||||
.prose :where(h3 strong):not(:where([class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(h4):not(:where([class~="not-prose"] *)) {
|
||||
|
|
@ -721,6 +740,12 @@ video {
|
|||
|
||||
.prose :where(h4 strong):not(:where([class~="not-prose"] *)) {
|
||||
font-weight: 700;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(img):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.prose :where(figure > *):not(:where([class~="not-prose"] *)) {
|
||||
|
|
@ -750,7 +775,33 @@ video {
|
|||
}
|
||||
|
||||
.prose :where(a code):not(:where([class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-links);
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(h1 code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.prose :where(h4 code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(blockquote code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(thead th code):not(:where([class~="not-prose"] *)) {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.prose :where(pre):not(:where([class~="not-prose"] *)) {
|
||||
|
|
@ -824,10 +875,15 @@ video {
|
|||
|
||||
.prose :where(tbody td):not(:where([class~="not-prose"] *)) {
|
||||
vertical-align: baseline;
|
||||
padding-top: 0.5714286em;
|
||||
padding-right: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-left: 0.5714286em;
|
||||
}
|
||||
|
||||
.prose :where(tfoot):not(:where([class~="not-prose"] *)) {
|
||||
border-top-width: 1px;
|
||||
border-top-color: var(--tw-prose-th-borders);
|
||||
}
|
||||
|
||||
.prose :where(tfoot td):not(:where([class~="not-prose"] *)) {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.prose {
|
||||
|
|
@ -872,11 +928,6 @@ video {
|
|||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose :where(img):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.prose :where(video):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
|
|
@ -887,14 +938,6 @@ video {
|
|||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.prose :where(h2 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.875em;
|
||||
}
|
||||
|
||||
.prose :where(h3 code):not(:where([class~="not-prose"] *)) {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.prose :where(li):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
|
|
@ -908,24 +951,24 @@ video {
|
|||
padding-left: 0.375em;
|
||||
}
|
||||
|
||||
.prose > :where(ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
|
||||
.prose > :where(ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
.prose > :where(ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose > :where(ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
.prose > :where(ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
|
|
@ -958,55 +1001,242 @@ video {
|
|||
padding-right: 0;
|
||||
}
|
||||
|
||||
.prose :where(tbody td:first-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"] *)) {
|
||||
padding-top: 0.5714286em;
|
||||
padding-right: 0.5714286em;
|
||||
padding-bottom: 0.5714286em;
|
||||
padding-left: 0.5714286em;
|
||||
}
|
||||
|
||||
.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.prose :where(tbody td:last-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"] *)) {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.prose > :where(:first-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose > :where(:last-child):not(:where([class~="not-prose"] *)) {
|
||||
.prose :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-zinc {
|
||||
--tw-prose-body: #3f3f46;
|
||||
--tw-prose-headings: #18181b;
|
||||
--tw-prose-lead: #52525b;
|
||||
--tw-prose-links: #18181b;
|
||||
--tw-prose-bold: #18181b;
|
||||
--tw-prose-counters: #71717a;
|
||||
--tw-prose-bullets: #d4d4d8;
|
||||
--tw-prose-hr: #e4e4e7;
|
||||
--tw-prose-quotes: #18181b;
|
||||
--tw-prose-quote-borders: #e4e4e7;
|
||||
--tw-prose-captions: #71717a;
|
||||
--tw-prose-code: #18181b;
|
||||
--tw-prose-pre-code: #e4e4e7;
|
||||
--tw-prose-pre-bg: #27272a;
|
||||
--tw-prose-th-borders: #d4d4d8;
|
||||
--tw-prose-td-borders: #e4e4e7;
|
||||
--tw-prose-invert-body: #d4d4d8;
|
||||
.prose-sm :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.5714286em;
|
||||
margin-bottom: 0.5714286em;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.1428571em;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.1428571em;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.1428571em;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.1428571em;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose-sm :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.75em;
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose-base :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8888889em;
|
||||
margin-bottom: 0.8888889em;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose-lg :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8em;
|
||||
margin-bottom: 0.8em;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.2em;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.2em;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose-xl :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > ul > li p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0.8333333em;
|
||||
margin-bottom: 0.8333333em;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 1.3333333em;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > :first-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.prose-2xl :where(.prose > :last-child):not(:where([class~="not-prose"] *)) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.prose-neutral {
|
||||
--tw-prose-body: #404040;
|
||||
--tw-prose-headings: #171717;
|
||||
--tw-prose-lead: #525252;
|
||||
--tw-prose-links: #171717;
|
||||
--tw-prose-bold: #171717;
|
||||
--tw-prose-counters: #737373;
|
||||
--tw-prose-bullets: #d4d4d4;
|
||||
--tw-prose-hr: #e5e5e5;
|
||||
--tw-prose-quotes: #171717;
|
||||
--tw-prose-quote-borders: #e5e5e5;
|
||||
--tw-prose-captions: #737373;
|
||||
--tw-prose-code: #171717;
|
||||
--tw-prose-pre-code: #e5e5e5;
|
||||
--tw-prose-pre-bg: #262626;
|
||||
--tw-prose-th-borders: #d4d4d4;
|
||||
--tw-prose-td-borders: #e5e5e5;
|
||||
--tw-prose-invert-body: #d4d4d4;
|
||||
--tw-prose-invert-headings: #fff;
|
||||
--tw-prose-invert-lead: #a1a1aa;
|
||||
--tw-prose-invert-lead: #a3a3a3;
|
||||
--tw-prose-invert-links: #fff;
|
||||
--tw-prose-invert-bold: #fff;
|
||||
--tw-prose-invert-counters: #a1a1aa;
|
||||
--tw-prose-invert-bullets: #52525b;
|
||||
--tw-prose-invert-hr: #3f3f46;
|
||||
--tw-prose-invert-quotes: #f4f4f5;
|
||||
--tw-prose-invert-quote-borders: #3f3f46;
|
||||
--tw-prose-invert-captions: #a1a1aa;
|
||||
--tw-prose-invert-counters: #a3a3a3;
|
||||
--tw-prose-invert-bullets: #525252;
|
||||
--tw-prose-invert-hr: #404040;
|
||||
--tw-prose-invert-quotes: #f5f5f5;
|
||||
--tw-prose-invert-quote-borders: #404040;
|
||||
--tw-prose-invert-captions: #a3a3a3;
|
||||
--tw-prose-invert-code: #fff;
|
||||
--tw-prose-invert-pre-code: #d4d4d8;
|
||||
--tw-prose-invert-pre-code: #d4d4d4;
|
||||
--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
|
||||
--tw-prose-invert-th-borders: #52525b;
|
||||
--tw-prose-invert-td-borders: #3f3f46;
|
||||
--tw-prose-invert-th-borders: #525252;
|
||||
--tw-prose-invert-td-borders: #404040;
|
||||
}
|
||||
|
||||
.prose-stone {
|
||||
--tw-prose-body: #44403c;
|
||||
--tw-prose-headings: #1c1917;
|
||||
--tw-prose-lead: #57534e;
|
||||
--tw-prose-links: #1c1917;
|
||||
--tw-prose-bold: #1c1917;
|
||||
--tw-prose-counters: #78716c;
|
||||
--tw-prose-bullets: #d6d3d1;
|
||||
--tw-prose-hr: #e7e5e4;
|
||||
--tw-prose-quotes: #1c1917;
|
||||
--tw-prose-quote-borders: #e7e5e4;
|
||||
--tw-prose-captions: #78716c;
|
||||
--tw-prose-code: #1c1917;
|
||||
--tw-prose-pre-code: #e7e5e4;
|
||||
--tw-prose-pre-bg: #292524;
|
||||
--tw-prose-th-borders: #d6d3d1;
|
||||
--tw-prose-td-borders: #e7e5e4;
|
||||
--tw-prose-invert-body: #d6d3d1;
|
||||
--tw-prose-invert-headings: #fff;
|
||||
--tw-prose-invert-lead: #a8a29e;
|
||||
--tw-prose-invert-links: #fff;
|
||||
--tw-prose-invert-bold: #fff;
|
||||
--tw-prose-invert-counters: #a8a29e;
|
||||
--tw-prose-invert-bullets: #57534e;
|
||||
--tw-prose-invert-hr: #44403c;
|
||||
--tw-prose-invert-quotes: #f5f5f4;
|
||||
--tw-prose-invert-quote-borders: #44403c;
|
||||
--tw-prose-invert-captions: #a8a29e;
|
||||
--tw-prose-invert-code: #fff;
|
||||
--tw-prose-invert-pre-code: #d6d3d1;
|
||||
--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);
|
||||
--tw-prose-invert-th-borders: #57534e;
|
||||
--tw-prose-invert-td-borders: #44403c;
|
||||
}
|
||||
|
||||
.fixed {
|
||||
|
|
@ -1050,6 +1280,10 @@ video {
|
|||
top: 100%;
|
||||
}
|
||||
|
||||
.bottom-20 {
|
||||
bottom: 5rem;
|
||||
}
|
||||
|
||||
.z-50 {
|
||||
z-index: 50;
|
||||
}
|
||||
|
|
@ -1058,11 +1292,6 @@ video {
|
|||
z-index: 40;
|
||||
}
|
||||
|
||||
.mx-auto {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.my-0 {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 0px;
|
||||
|
|
@ -1078,6 +1307,11 @@ video {
|
|||
margin-bottom: 0px !important;
|
||||
}
|
||||
|
||||
.mx-auto {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mx-1 {
|
||||
margin-left: 0.25rem;
|
||||
margin-right: 0.25rem;
|
||||
|
|
@ -1096,16 +1330,12 @@ video {
|
|||
margin-right: 1.25rem;
|
||||
}
|
||||
|
||||
.mt-1 {
|
||||
margin-top: 0.25rem;
|
||||
.mb-0\.5 {
|
||||
margin-bottom: 0.125rem;
|
||||
}
|
||||
|
||||
.mb-2\.5 {
|
||||
margin-bottom: 0.625rem;
|
||||
}
|
||||
|
||||
.mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
.mb-0 {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.mt-20 {
|
||||
|
|
@ -1164,6 +1394,26 @@ video {
|
|||
margin-right: -2rem;
|
||||
}
|
||||
|
||||
.mb-24 {
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
|
||||
.mt-24 {
|
||||
margin-top: 6rem;
|
||||
}
|
||||
|
||||
.mt-1 {
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
.mb-3 {
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.-mt-4 {
|
||||
margin-top: -1rem;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
|
|
@ -1172,8 +1422,8 @@ video {
|
|||
display: flex;
|
||||
}
|
||||
|
||||
.\!h-20 {
|
||||
height: 5rem !important;
|
||||
.\!h-16 {
|
||||
height: 4rem !important;
|
||||
}
|
||||
|
||||
.h-\[5rem\] {
|
||||
|
|
@ -1192,12 +1442,16 @@ video {
|
|||
height: 2rem;
|
||||
}
|
||||
|
||||
.\!h-20 {
|
||||
height: 5rem !important;
|
||||
}
|
||||
|
||||
.min-h-\[calc\(100\%-10rem\)\] {
|
||||
min-height: calc(100% - 10rem);
|
||||
}
|
||||
|
||||
.\!w-20 {
|
||||
width: 5rem !important;
|
||||
.\!w-16 {
|
||||
width: 4rem !important;
|
||||
}
|
||||
|
||||
.w-1\/2 {
|
||||
|
|
@ -1216,6 +1470,10 @@ video {
|
|||
width: 2rem;
|
||||
}
|
||||
|
||||
.\!w-20 {
|
||||
width: 5rem !important;
|
||||
}
|
||||
|
||||
.max-w-3xl {
|
||||
max-width: 48rem;
|
||||
}
|
||||
|
|
@ -1292,15 +1550,61 @@ video {
|
|||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.bg-zinc-100 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(244 244 245 / var(--tw-bg-opacity));
|
||||
.border {
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.border-2 {
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.border-black\/10 {
|
||||
border-color: rgb(0 0 0 / 0.1);
|
||||
}
|
||||
|
||||
.border-black\/20 {
|
||||
border-color: rgb(0 0 0 / 0.2);
|
||||
}
|
||||
|
||||
.border-purple-600 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(147 51 234 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-purple-200 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(233 213 255 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-purple-400 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(192 132 252 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-black\/5 {
|
||||
border-color: rgb(0 0 0 / 0.05);
|
||||
}
|
||||
|
||||
.bg-black\/\[3\%\] {
|
||||
background-color: rgb(0 0 0 / 3%);
|
||||
}
|
||||
|
||||
.bg-white\/80 {
|
||||
background-color: rgb(255 255 255 / 0.8);
|
||||
}
|
||||
|
||||
.p-6 {
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.p-3 {
|
||||
padding: 0.75rem;
|
||||
}
|
||||
|
||||
.p-2 {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.px-8 {
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem;
|
||||
|
|
@ -1316,6 +1620,10 @@ video {
|
|||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.pb-1 {
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.pt-16 {
|
||||
padding-top: 4rem;
|
||||
}
|
||||
|
|
@ -1324,10 +1632,6 @@ video {
|
|||
padding-bottom: 10rem;
|
||||
}
|
||||
|
||||
.pb-1 {
|
||||
padding-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.pb-2 {
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
|
|
@ -1344,13 +1648,25 @@ video {
|
|||
padding-bottom: 4rem;
|
||||
}
|
||||
|
||||
.pt-20 {
|
||||
padding-top: 5rem;
|
||||
}
|
||||
|
||||
.pb-20 {
|
||||
padding-bottom: 5rem;
|
||||
}
|
||||
|
||||
.pb-32 {
|
||||
padding-bottom: 8rem;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.text-9xl {
|
||||
font-size: 8rem;
|
||||
line-height: 1;
|
||||
.text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
}
|
||||
|
||||
.text-sm {
|
||||
|
|
@ -1358,9 +1674,9 @@ video {
|
|||
line-height: 1.25rem;
|
||||
}
|
||||
|
||||
.text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
.text-9xl {
|
||||
font-size: 8rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.text-\[0\.9em\] {
|
||||
|
|
@ -1393,16 +1709,47 @@ video {
|
|||
color: rgb(0 0 0 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-zinc-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(113 113 122 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.no-underline {
|
||||
-webkit-text-decoration-line: none;
|
||||
text-decoration-line: none;
|
||||
}
|
||||
|
||||
.opacity-70 {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.opacity-60 {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.shadow-lg {
|
||||
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
|
||||
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
||||
}
|
||||
|
||||
.shadow-2xl {
|
||||
--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
|
||||
--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
||||
}
|
||||
|
||||
.shadow-xl {
|
||||
--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
|
||||
--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
|
||||
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
||||
}
|
||||
|
||||
.drop-shadow-2xl {
|
||||
--tw-drop-shadow: drop-shadow(0 25px 25px rgb(0 0 0 / 0.15));
|
||||
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
||||
}
|
||||
|
||||
.drop-shadow-xl {
|
||||
--tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
|
||||
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
||||
}
|
||||
|
||||
.duration-200 {
|
||||
transition-duration: 200ms;
|
||||
}
|
||||
|
|
@ -1427,18 +1774,27 @@ video {
|
|||
background: var(--url) center center/cover no-repeat;
|
||||
}
|
||||
|
||||
.\[background\:url\(\.\/theme\.png\)_left_center\/_auto_theme\(\'spacing\.6\'\)_no-repeat\] {
|
||||
background: url(./theme.png) left center/ auto 1.5rem no-repeat;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:root {
|
||||
--light-bg: #fbfbfb;
|
||||
--dark-bg: #000;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
background: #fffefc;
|
||||
background: var(--light-bg);
|
||||
}
|
||||
|
||||
.dark body {
|
||||
background: #000;
|
||||
background: var(--dark-bg);
|
||||
}
|
||||
|
||||
.not-ready,
|
||||
|
|
@ -1512,7 +1868,7 @@ body {
|
|||
}
|
||||
|
||||
.nav-wrapper {
|
||||
background: #fffefc;
|
||||
background: var(--light-bg);
|
||||
}
|
||||
|
||||
.open {
|
||||
|
|
@ -1578,18 +1934,12 @@ article blockquote {
|
|||
--tw-prose-td-borders: var(--tw-prose-invert-td-borders);
|
||||
}
|
||||
|
||||
.dark .dark\:border {
|
||||
border-width: 1px;
|
||||
.dark .dark\:border-white\/20 {
|
||||
border-color: rgb(255 255 255 / 0.2);
|
||||
}
|
||||
|
||||
.dark .dark\:border-zinc-700 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(63 63 70 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:bg-zinc-800 {
|
||||
--tw-bg-opacity: 1;
|
||||
background-color: rgb(39 39 42 / var(--tw-bg-opacity));
|
||||
.dark .dark\:bg-white\/\[8\%\] {
|
||||
background-color: rgb(255 255 255 / 8%);
|
||||
}
|
||||
|
||||
.dark .dark\:bg-black {
|
||||
|
|
|
|||
|
|
@ -18,7 +18,6 @@ title = "Paper"
|
|||
twitter = 'nanxiaobei'
|
||||
github = 'nanxiaobei'
|
||||
instagram = 'nan.xiaobei'
|
||||
rss = true
|
||||
|
||||
avatar = 'nanxiaobei@gmail.com'
|
||||
name = 'Lee'
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
{{ define "main" }}
|
||||
<h1 class="absolute inset-x-8 top-0 bottom-16 flex items-center justify-center text-9xl">404</h1>
|
||||
<h1 class="absolute inset-x-8 top-0 bottom-20 flex items-center justify-center text-9xl">404</h1>
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@
|
|||
{{ partial "header.html" . }}
|
||||
|
||||
<main
|
||||
class="prose prose-zinc relative mx-auto min-h-[calc(100%-10rem)] max-w-3xl px-8 pt-16 pb-40 dark:prose-invert"
|
||||
class="prose prose-neutral relative mx-auto min-h-[calc(100%-10rem)] max-w-3xl px-8 pt-20 pb-32 dark:prose-invert"
|
||||
>
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
<!-- Main Title -->
|
||||
{{ if .Title }}
|
||||
<h1 class="mb-20">{{ .Title }}</h1>
|
||||
<h1 class="mb-24">{{ .Title }}</h1>
|
||||
{{ end }}
|
||||
|
||||
<!-- $pages -->
|
||||
|
|
@ -19,18 +19,18 @@
|
|||
|
||||
{{ $avatar_url := $.Scratch.Get `avatar_url` }}<!---->
|
||||
{{ if or $avatar_url site.Params.name }}
|
||||
<div class="mb-20 flex">
|
||||
<div class="-mt-4 mb-20 flex">
|
||||
{{ if $avatar_url }}
|
||||
<img
|
||||
class="my-0 mr-5 !h-20 !w-20 rounded-full bg-zinc-100 dark:border dark:border-zinc-700"
|
||||
class="my-0 mr-5 !h-20 !w-20 rounded-full border border-black/10 bg-white/80 p-3 shadow-xl"
|
||||
src="{{ $avatar_url }}"
|
||||
alt="avatar"
|
||||
/>
|
||||
{{ end }}<!---->
|
||||
{{ if site.Params.name }}
|
||||
<div>
|
||||
<h1 class="mt-1 mb-2.5 text-3xl font-bold">{{ site.Params.name }}</h1>
|
||||
<div>{{ site.Params.bio | default (print "Personal blog by " site.Params.name) }}</div>
|
||||
<h1 class="mt-1 mb-3 text-3xl font-bold">{{ site.Params.name }}</h1>
|
||||
<div class="">{{ site.Params.bio | default (print "Personal blog by " site.Params.name) }}</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
|
@ -40,14 +40,14 @@
|
|||
|
||||
<article class="relative my-10 first-of-type:mt-0 last-of-type:mb-0">
|
||||
<h2 class="!my-0 pb-1 !leading-none">{{ .Title }}</h2>
|
||||
<time class="text-sm text-zinc-500">{{ .Date | time.Format ":date_medium" }}</time>
|
||||
<time class="text-sm opacity-70">{{ .Date | time.Format ":date_medium" }}</time>
|
||||
<a class="absolute inset-0" href="{{ .Permalink }}"></a>
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
<!-- Main Nav -->
|
||||
{{ if gt $paginator.TotalPages 1 }}
|
||||
<nav class="mt-20 flex">
|
||||
<nav class="mt-24 flex">
|
||||
{{ if $paginator.HasPrev }}
|
||||
<a class="btn" href="{{ $paginator.Prev.URL }}">← {{ i18n "prev_page" }}</a>
|
||||
{{ end }}<!---->
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
{{ define "main" }}
|
||||
|
||||
<article>
|
||||
<header class="mb-16">
|
||||
<header class="mb-20">
|
||||
<h1 class="!my-0 pb-2">{{ .Title }}</h1>
|
||||
|
||||
{{ if ne .Type "page" }}
|
||||
<div class="text-[0.9em] text-zinc-500">
|
||||
<div class="text-[0.9em] opacity-70">
|
||||
{{ if .Date }}
|
||||
<time>{{ .Date | time.Format ":date_medium" }}</time>
|
||||
{{ end }}<!---->
|
||||
|
|
@ -24,7 +24,7 @@
|
|||
<footer class="mt-12 flex flex-wrap">
|
||||
{{ range .Params.tags }} {{ $href := print (absURL "tags/") (urlize .) }}
|
||||
<a
|
||||
class="mr-1.5 mb-1.5 rounded-lg bg-zinc-100 px-4 py-2 no-underline dark:bg-zinc-800"
|
||||
class="mr-1.5 mb-1.5 rounded-lg bg-black/[3%] px-4 py-2 no-underline dark:bg-white/[8%]"
|
||||
href="{{ $href }}"
|
||||
>{{ . }}</a
|
||||
>
|
||||
|
|
@ -35,7 +35,7 @@
|
|||
<!-- Post Nav -->
|
||||
{{ $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}<!---->
|
||||
{{ if and (gt (len $pages) 1) (in $pages . ) }}
|
||||
<nav class="mt-16 flex rounded-lg bg-zinc-100 text-lg dark:bg-zinc-800">
|
||||
<nav class="mt-24 flex rounded-lg bg-black/[3%] text-lg dark:bg-white/[8%]">
|
||||
{{ with $pages.Next . }}
|
||||
<a class="flex w-1/2 items-center p-6 pr-3 font-bold no-underline" href="{{ .Permalink }}"
|
||||
><span class="mr-1.5">←</span><span>{{ .Name }}</span></a
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<footer class="mx-auto flex h-[5rem] max-w-3xl items-center px-8 text-sm text-zinc-500">
|
||||
<footer class="opaco mx-auto flex h-[5rem] max-w-3xl items-center px-8 text-[0.9em] opacity-60">
|
||||
<div class="mr-auto">
|
||||
© {{ now.Year }}
|
||||
<a class="link" href="{{ `` | absURL }}">{{ site.Title }}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
>{{ site.Title }}</a
|
||||
>
|
||||
<a
|
||||
class="btn-dark ml-6 h-6 w-6 shrink-0 cursor-pointer {{ if site.Params.monoDarkIcon }}[background:url(./theme.svg)_left_center/cover_no-repeat] dark:invert dark:[background-position:right]{{ else }}[background:url(./theme.png)_left_/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)] dark:[background-position:right]{{ end }}"
|
||||
class="btn-dark ml-6 h-6 w-6 shrink-0 cursor-pointer {{ if site.Params.monoDarkIcon }}[background:url(./theme.svg)_left_center/cover_no-repeat] dark:invert{{ else }}[background:url(./theme.png)_left_center/_auto_theme('spacing.6')_no-repeat] [transition:_background-position_0.4s_steps(5)]{{ end }} dark:[background-position:right]"
|
||||
></a>
|
||||
</div>
|
||||
|
||||
|
|
@ -15,12 +15,10 @@
|
|||
<script>
|
||||
const metaTheme = document.querySelector('meta[name="theme-color"]');
|
||||
const htmlClass = document.documentElement.classList;
|
||||
requestAnimationFrame(() => {
|
||||
htmlClass.remove('not-ready');
|
||||
});
|
||||
setTimeout(() => htmlClass.remove('not-ready'), 10);
|
||||
|
||||
const setDark = (newDark) => {
|
||||
metaTheme.setAttribute('content', newDark ? '#000' : '#FCFAF9');
|
||||
metaTheme.setAttribute('content', newDark ? 'var(--dark-bg)' : 'var(--light-bg)');
|
||||
htmlClass[newDark ? 'add' : 'remove']('dark');
|
||||
localStorage.setItem('dark', newDark);
|
||||
};
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 1.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 764 B After Width: | Height: | Size: 971 B |
Loading…
Reference in a new issue