kaholaz/hello-friend-ng
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improve tables and blockquotes

Browse source
This commit is contained in:
Djordje Atlialp 2021-01-10 22:57:19 +01:00
parent 833de605e3
commit f43bf66f28
3 changed files with 39 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

11
assets/scss/_main.scss
View file

@ -57,6 +57,7 @@ h1 {
h2 { h2 {
font-size: 1.625rem; font-size: 1.625rem;
margin-top: 2.5em;
} }
h3 { h3 {
@ -171,6 +172,14 @@ figure {
} }
} }
em, i, strong {
color: black;
.dark-theme & {
color: white;
}
}
code { code {
font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace; font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
font-display: auto; font-display: auto;
@ -212,7 +221,7 @@ pre {
} }
blockquote { blockquote {
border-left: 2px solid; border-left: 3px solid #3eb0ef;
margin: 40px; margin: 40px;
padding: 10px 20px; padding: 10px 20px;

26
assets/scss/_tables.scss
View file

@ -1,33 +1,41 @@
.post-content { .post-content {
table { table {
display: inline-block;
border-collapse: collapse; border-collapse: collapse;
margin: 25px auto; margin: 25px auto;
font-size: 0.9em; font-size: 0.9em;
min-width: 400px; min-width: 400px;
max-width: 100%; max-width: 100%;
overflow-x: auto;
th,
td {
padding: 12px 15px;
border: 1px solid $light-table-color;
.dark-theme & {
border: 1px solid $dark-table-color;
}
} }
table thead tr { thead {
tr {
background-color: $light-table-color; background-color: $light-table-color;
color: $light-color; color: $light-color;
text-align: left; text-align: left;
.dark-theme & { .dark-theme & {
background-color: $dark-table-color; background-color: $dark-table-color;
color: $dark-color color: $dark-color;
}
} }
} }
th, td { tbody {
padding: 12px 15px; tr {
}
tbody tr {
border: 1px solid $light-table-color; border: 1px solid $light-table-color;
.dark-theme & { .dark-theme & {
border: 1px solid $dark-table-color; border: 1px solid $dark-table-color;
} }
} }
}
}
} }

6
assets/scss/_variables.scss
View file

@ -11,10 +11,10 @@ $light-table-color: #dcdcdc;
/* Dark theme colors */ /* Dark theme colors */
$dark-background: #232425; $dark-background: #232425;
$dark-background-secondary: #3b3d42; $dark-background-secondary: #3b3d42;
$dark-color: #e2e2e2; $dark-color: #dfdfdf;
$dark-color-secondary: #b3b3bd; $dark-color-secondary: #b3b3bd;
$dark-border-color: #73747b; $dark-border-color: #4e4e57;
$dark-table-color: #73747b; $dark-table-color: #4e4e57;
$media-size-phone: "(max-width: 684px)"; $media-size-phone: "(max-width: 684px)";
$media-size-tablet: "(max-width: 900px)"; $media-size-tablet: "(max-width: 900px)";