1
0
mirror of https://github.com/kuohuanhuan/x-markdown-css.git synced 2024-11-25 06:18:19 +00:00

refactor!: deprecate .prose class and lint

This commit is contained in:
2023-03-05 17:39:51 +08:00
parent e54282e5f8
commit 63a6fc2072
20 changed files with 77 additions and 118 deletions

9
src/partials/_all.scss Normal file
View File

@ -0,0 +1,9 @@
@use 'title';
@use 'text';
@use 'link';
@use 'code';
@use 'quote';
@use 'figure';
@use 'list';
@use 'table';
@use 'media';

View File

@ -0,0 +1,10 @@
@mixin container {
max-width: fit-content;
color: var(--xm-c-regular);
font-size: 1rem;
font-family: var(--xm-font-display) !important;
line-height: 1.75;
&:first-child {
margin-top: 1rem;
}
}

52
src/partials/code.scss Normal file
View File

@ -0,0 +1,52 @@
code {
color: var(--xm-c-deep);
font-weight: 600;
font-size: .875rem;
font-family: var(--xm-font-code);
&::before,
&::after {
content: '`';
}
}
pre {
overflow-x: auto;
margin-top: 1.75rem;
margin-bottom: 1.75rem;
padding-top: .875rem, 1.15rem;
border-radius: .375rem;
color: var(--xm-c-pre);
font-size: .875rem;
line-height: 1.75;
code {
padding: 0;
border-width: 0;
border-radius: 0;
background: transparent;
color: inherit;
font-weight: 400;
font-size: inherit;
font-family: inherit;
line-height: inherit;
&::before,
&::after {
content: none;
}
}
&:not(.shiki) {
margin: 0;
padding: 0;
background: transparent;
}
}
.shiki {
margin: .5rem 0;
font-size: 1.05rem;
font-family: var(--xm-font-code) !important;
line-height: 1.4;
&.shiki-light {
background: var(--xm-c-shiki-light) !important;
}
&.shiki-dark {
background: var(--xm-c-shiki-dark) !important;
}
}

14
src/partials/figure.scss Normal file
View File

@ -0,0 +1,14 @@
figure {
margin-top: 2rem;
margin-bottom: 2rem;
figcaption {
margin-top: .875rem;
color: var(--xm-c-figcaption);
font-size: .875rem;
line-height: 1.45;
}
> * {
margin-top: 0;
margin-bottom: 0;
}
}

13
src/partials/link.scss Normal file
View File

@ -0,0 +1,13 @@
a {
border-bottom: 1px solid var(--xm-c-link-border);
color: var(--xm-c-deeper);
font-weight: 500;
text-decoration: none;
transition: border .3s ease-in-out;
code {
color: var(--xm-c-code);
}
&:hover {
border-bottom: 1px solid var(--xm-c-regular);
}
}

46
src/partials/list.scss Normal file
View File

@ -0,0 +1,46 @@
li {
margin-top: .5rem;
margin-bottom: .5rem;
}
ol {
margin-top: 1.25rem;
margin-bottom: 1.25rem;
list-style-type: none;
> li {
position: relative;
padding-left: 1.75rem;
&::before {
content: counter(list-item, decimal) '.';
position: absolute;
left: 0;
color: var(--xm-c-ol-counter);
font-weight: 400;
}
}
}
ul {
margin-top: 1.25rem;
margin-bottom: 1.25rem;
list-style-type: none;
> li {
position: relative;
padding-left: 1.75rem;
&::before {
content: '';
position: absolute;
top: .675rem;
left: .25rem;
width: .375rem;
height: .375rem;
border-radius: 50%;
background-color: var(--xm-c-ul-counter);
}
}
}
ul ul,
ul ol,
ol ul,
ol ol {
margin-top: .75rem;
margin-bottom: .75rem;
}

6
src/partials/media.scss Normal file
View File

@ -0,0 +1,6 @@
img,
video {
width: 100%;
margin-top: 2rem;
margin-bottom: 2rem;
}

29
src/partials/quote.scss Normal file
View File

@ -0,0 +1,29 @@
blockquote,
q {
margin-top: 1.65rem;
margin-bottom: 1.65rem;
padding: .6rem 1.2rem;
border-left: .25rem solid var(--xm-c-quote-border);
color: inherit;
font-weight: 500;
font-style: italic;
line-height: 1.5rem;
quotes: '\201C''\201D''\2018''\2019';
opacity: .8;
p {
&:first-of-type::before {
content: open-quote;
}
&:last-of-type::after {
content: close-quote;
}
}
> * {
&:first-child {
margin-top: 0;
}
&:last-child {
margin-bottom: 0;
}
}
}

44
src/partials/table.scss Normal file
View File

@ -0,0 +1,44 @@
table {
width: 100%;
margin-top: 2rem;
margin-bottom: 2rem;
table-layout: auto;
font-size: .875rem;
line-height: 1.75;
text-align: left;
}
thead {
border-bottom-width: 1px;
border-bottom-color: var(--xm-c-thead-border);
color: var(--xm-c-thead);
font-weight: 600;
th {
vertical-align: bottom;
padding-left: auto .575rem .575rem;
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
}
}
}
tbody {
tr {
border-bottom-width: 1px;
border-bottom-color: var(--xm-c-tr-border);
&:last-child {
border-bottom-width: 0;
}
}
td {
vertical-align: top;
padding: .575rem;
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
}
}
}

14
src/partials/text.scss Normal file
View File

@ -0,0 +1,14 @@
p {
margin-top: 1.25rem;
margin-bottom: 1.25rem;
}
strong {
color: var(--xm-c-deep);
font-weight: 600;
}
b {
color: var(--xm-c-deep);
}
em {
color: inherit;
}

89
src/partials/title.scss Normal file
View File

@ -0,0 +1,89 @@
h1 {
margin-top: 0;
margin-bottom: .875rem;
color: var(--xm-c-deeper);
font-weight: 800;
font-size: 2.25rem;
line-height: 1.15;
}
h2 {
margin-top: 2rem;
margin-bottom: 1rem;
color: var(--xm-c-deep);
font-weight: 700;
font-size: 1.5rem;
line-height: 1.35;
code {
font-size: .875rem;
}
+ * {
margin-top: 0;
}
}
h3 {
margin-top: 1.6rem;
margin-bottom: .6rem;
color: inherit;
font-weight: 600;
font-size: 1.25rem;
line-height: 1.6;
opacity: .7;
code {
font-size: .9rem;
}
+ * {
margin-top: 0;
}
}
h4 {
margin-top: 1.5rem;
margin-bottom: .5rem;
color: inherit;
font-weight: 600;
line-height: 1.5;
+ * {
margin-top: 0;
}
}
h5,
h6 {
margin-top: 20px;
margin-bottom: 10px;
font-weight: 500;
letter-spacing: 2px;
text-transform: uppercase;
opacity: .5;
}
hr {
width: 50px;
margin-top: 2rem;
margin-bottom: 2rem;
border-color: var(--xm-c-hr-border);
+ * {
margin-top: 0;
}
}
.header-anchor {
float: left;
margin-top: .125rem;
margin-left: -1.25rem;
padding-right: .5rem;
border: 0 !important;
font-size: .875rem;
text-decoration: none;
opacity: 0;
&:hover,
&:focus {
text-decoration: none;
}
}
@for $i from 1 through 6 {
h#{$i} {
&:hover,
&:focus {
.header-anchor {
opacity: .35 + $i * .025;
}
}
}
}