em/mixtape
1
0
Fork 0
Code Issues Pull Requests Actions Activity

Song styling in SCSS

Browse Source
This commit is contained in:
Emil Miler
2024-02-06 18:04:50 +01:00
parent ed49c101d3
commit 9a64cb55a6
1 changed files with 24 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
static/chordpro.css → sass/chordpro.scss
View File

@@ -1,7 +1,15 @@
$col-white: #fff;
$col-black: #181818;
body { body {
margin: 0; margin: 0;
background-color: #d8d8d8; background-color: $col-white;
color: #181818; color: $col-black;
}
table {
white-space: nowrap;
} }
.song { .song {
@@ -24,16 +32,16 @@ body {
.chorus { .chorus {
position: relative; position: relative;
}
.chorus:before { &:before {
content: ""; content: "";
position: absolute; position: absolute;
left: -1em; left: -1em;
display: block; display: block;
height: 100%; height: 100%;
width: 2px; width: 2px;
background-color: #181818; background-color: $col-black;
}
} }
.tab { .tab {
@@ -46,21 +54,21 @@ body {
display: inline-block; display: inline-block;
padding: .25em .5em; padding: .25em .5em;
background-color: #bbb; background-color: #bbb;
color: #181818; color: $col-black;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
body { body {
background-color: #181818; background-color: $col-black;
color: #d8d8d8; color: $col-white;
} }
.chorus:before { .chorus:before {
background-color: #d8d8d8; background-color: $col-white;
} }
.comment { .comment {
background-color: #585858; background-color: #585858;
color: #d8d8d8; color: $col-white;
} }
} }