dbroqua/MusicTopus
dbroqua/MusicTopus
1
1
Fork 0
Code Issues 10 Pull Requests Releases 14 Activity

Ajout d'une nouvelle couleur pour les listes

This commit is contained in:
Damien Broqua 2022-03-08 09:42:20 +01:00
parent b0e6964205
commit e0a8fa42c2
2 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sass/colors.scss
View File

@ -38,6 +38,7 @@ $pagination-hover-color: rgb(115, 151, 186);
:root { :root {
--default-color: #{$white}; --default-color: #{$white};
--bg-color: #{darken($white, 5%)}; --bg-color: #{darken($white, 5%)};
--bg-alternate-color: #{darken($white, 8%)};
--font-color: #{$nord3}; --font-color: #{$nord3};
--footer-color: #{$darken-white}; --footer-color: #{$darken-white};
--link-color: #{$nord1}; --link-color: #{$nord1};
@ -74,6 +75,7 @@ $pagination-hover-color: rgb(115, 151, 186);
[data-theme="dark"] { [data-theme="dark"] {
--default-color: #{$nord3}; --default-color: #{$nord3};
--bg-color: #{lighten($nord0, 2%)}; --bg-color: #{lighten($nord0, 2%)};
--bg-alternate-color: #{lighten($nord0, 4%)};
--font-color: #{$nord6}; --font-color: #{$nord6};
--footer-color: #{$nord1}; --footer-color: #{$nord1};
--link-color: #{$nord4}; --link-color: #{$nord4};

13
sass/list.scss
View File

@ -3,16 +3,19 @@
.item{ .item{
padding: 0.5rem 0.75rem; padding: 0.5rem 0.75rem;
border-bottom: 1px solid var(--border-color); border-bottom: 2px solid var(--border-color);
background-color: var(--bg-alternate-color);
@include transition() {} @include transition() {}
@include respond-to("medium") { @include respond-to("medium") {
&:nth-child(2n) { &:nth-child(2n) {
background-color: var(--default-color); background-color: var(--default-color);
} }
border: none;
} }
@include respond-to("medium-up") { @include respond-to("medium-up") {
border-left: 1px solid var(--border-color); border-left: 2px solid var(--border-color);
&:nth-child(4n), &:nth-child(4n),
&:nth-child(4n-1) &:nth-child(4n-1)
@ -22,13 +25,13 @@
&:first-child, &:first-child,
&:nth-child(2) { &:nth-child(2) {
border-top: 1px solid var(--border-color); border-top: 2px solid var(--border-color);
} }
&:nth-child(2n), &:nth-child(2n),
&:last-child { &:last-child {
border-right: 1px solid var(--border-color); border-right: 2px solid var(--border-color);
margin-right: -1px; margin-right: -2px;
} }
} }