muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-28 14:16:41 +07:00
Code Packages Activity Actions

added milkdown, but its not working

Browse source
This commit is contained in:
Fedor Katurov 2023-03-26 17:03:45 +06:00
parent 6230a769e0
commit fd55a1db62
9 changed files with 5620 additions and 172 deletions
Download patch file Download diff file Expand all files Collapse all files

95
src/styles/_markdown.scss Normal file
View file

@ -0,0 +1,95 @@
@use 'sass:math';
@import './variables.scss';
$margin: 1em;
@mixin markdown {
blockquote {
border-left: 4px solid $color_primary;
padding: $margin * 0.5 0;
margin-bottom: $margin;
color: $color_primary;
font-size: 0.9em;
background-color: $content_bg_success;
p {
margin: 0 $margin;
}
& + blockquote {
margin-top: -$margin;
}
}
pre {
background-color: $content_bg_info;
font-family: monospace;
font-size: 0.8em;
border-radius: 2px;
width: 100%;
overflow: auto;
padding: $gap;
box-sizing: border-box;
margin-bottom: $margin;
code {
color: $gray_50;
font-family: monospace;
white-space: pre-wrap;
}
}
p,
li {
code {
background-color: $content_bg_info;
padding: 2px 4px;
border-radius: 0.3em;
color: $gray_25;
font-size: 0.8em;
}
}
img {
max-width: 100%;
margin-bottom: $margin;
}
h5,
h4,
h3,
h2,
h1 {
line-height: 1.2em;
margin: $margin * 1.5 0 $margin * 0.5;
&:first-child {
margin-top: $margin * 0.25;
}
}
ul {
list-style: disc;
padding-left: 20px;
margin-bottom: $margin;
li {
margin: math.div($margin, 3) 0;
}
}
strong {
font-weight: bold;
color: white;
}
em {
font-style: italic;
}
:global(.grey) {
color: #666666;
white-space: pre-line;
}
}

93
src/styles/common/markdown.module.scss
View file

@ -1,95 +1,6 @@
@use 'sass:math';
@import '../variables';
$margin: 1em;
@import '../markdown';
.wrapper {
blockquote {
border-left: 4px solid $color_primary;
padding: $margin * 0.5 0;
margin-bottom: $margin;
color: $color_primary;
font-size: 0.9em;
background-color: $content_bg_success;
p {
margin: 0 $margin;
}
& + blockquote {
margin-top: -$margin;
}
}
pre {
background-color: $content_bg_info;
font-family: monospace;
font-size: 0.8em;
border-radius: 2px;
width: 100%;
overflow: auto;
padding: $gap;
box-sizing: border-box;
margin-bottom: $margin;
code {
color: $gray_50;
font-family: monospace;
white-space: pre-wrap;
}
}
p,
li {
code {
background-color: $content_bg_info;
padding: 2px 4px;
border-radius: 0.3em;
color: $gray_25;
font-size: 0.8em;
}
}
img {
max-width: 100%;
margin-bottom: $margin;
}
h5,
h4,
h3,
h2,
h1 {
line-height: 1.2em;
margin: $margin * 1.5 0 $margin * 0.5;
&:first-child {
margin-top: $margin * 0.25;
}
}
ul {
list-style: disc;
padding-left: 20px;
margin-bottom: $margin;
li {
margin: math.div($margin, 3) 0;
}
}
strong {
font-weight: bold;
color: white;
}
em {
font-style: italic;
}
:global(.grey) {
color: #666666;
white-space: pre-line;
}
@include markdown;
}