mirror of https://github.com/lissy93/dashy
207 lines
6.8 KiB
SCSS
207 lines
6.8 KiB
SCSS
|
|
html[data-theme='callisto'] {
|
|
--background: #141b33;
|
|
--background-darker: #060913;
|
|
--item-group-background: #0b1021;
|
|
--item-background: #141b33;
|
|
--item-background-hover: #060913;
|
|
--item-hover-shadow: 0 1px 3px #00ccb4b3, 0 1px 2px #00ccb4bf;
|
|
--primary: #00CCB4;
|
|
}
|
|
|
|
html[data-theme='thebe'] {
|
|
--background: #141b33;
|
|
--background-darker: #060913;
|
|
--item-group-background: #0b1021;
|
|
--item-background: #141b33;
|
|
--item-background-hover: #060913;
|
|
--item-hover-shadow: 0 1px 3px #9660ecb3, 0 1px 2px #9660ecbf;
|
|
--primary: #9660ec;
|
|
--item-group-outer-background: #9660EC
|
|
linear-gradient(45deg, #9660ec 2%,#5f60ea 51%,#9660ec 100%);
|
|
}
|
|
|
|
html[data-theme='dracula'] {
|
|
--background: #44475a;
|
|
--background-darker: #282a36;
|
|
--item-group-background: #282a36;
|
|
--item-background: none;
|
|
--item-background-hover: #191b22;
|
|
--item-shadow: none;
|
|
--item-hover-shadow: none;
|
|
--settings-text-color: #98ace9;
|
|
--primary: #6272a4;
|
|
.collapsable:nth-child(1n) { background: #8be9fd; .item { border: 1px solid #8be9fd; color: #8be9fd; }}
|
|
.collapsable:nth-child(2n) { background: #50fa7b; .item { border: 1px solid #50fa7b; color: #50fa7b; }}
|
|
.collapsable:nth-child(3n) { background: #ffb86c; .item { border: 1px solid #ffb86c; color: #ffb86c; }}
|
|
.collapsable:nth-child(4n) { background: #ff79c6; .item { border: 1px solid #ff79c6; color: #ff79c6; }}
|
|
.collapsable:nth-child(4n) { background: #bd93f9; .item { border: 1px solid #bd93f9; color: #bd93f9; }}
|
|
}
|
|
|
|
html[data-theme='bee'] {
|
|
--primary: #c3eb5c;
|
|
--item-background: #1c2636;
|
|
--item-group-background: #0b1021;
|
|
--nav-link-background-color: #0b1021;
|
|
}
|
|
|
|
html[data-theme='raspberry-jam'] {
|
|
--primary: #eb2d6c;
|
|
--item-background: #1c2636;
|
|
--item-group-background: #0b1021;
|
|
--nav-link-background-color: #0b1021;
|
|
}
|
|
|
|
html[data-theme='tiger'] {
|
|
--primary: #f58233;
|
|
--item-background: #1c2636;
|
|
--item-group-background: #0b1021;
|
|
--nav-link-background-color: #0b1021;
|
|
}
|
|
|
|
html[data-theme='matrix-red'] {
|
|
--background: #000;
|
|
--background-darker: #000;
|
|
--primary: red;
|
|
--outline-color: red;
|
|
--curve-factor: 0px;
|
|
}
|
|
|
|
html[data-theme='matrix'] {
|
|
--background: #000;
|
|
--background-darker: #000;
|
|
--primary: #2bca2b;
|
|
--outline-color: #2bca2b;
|
|
--curve-factor: 0px;
|
|
}
|
|
|
|
html[data-theme='hacker-girl'] {
|
|
--background: #000;
|
|
--background-darker: #000;
|
|
--primary: #e435f1;
|
|
--outline-color: #e435f1;
|
|
--curve-factor: 0px;
|
|
}
|
|
|
|
html[data-theme='high-contrast-light'] {
|
|
--background: #fff;
|
|
--background-darker: #fff;
|
|
--item-group-background: #fff;
|
|
--item-background: #fff;
|
|
--primary: #000;
|
|
--outline-color: #000;
|
|
--curve-factor: 0px;
|
|
}
|
|
|
|
html[data-theme='high-contrast-dark'] {
|
|
--background: #000;
|
|
--background-darker: #000;
|
|
--item-group-background: #000;
|
|
--primary: #fff;
|
|
--outline-color: #fff;
|
|
--curve-factor: 0px;
|
|
}
|
|
|
|
html[data-theme='nord'] {
|
|
--primary: #D8DEE9;
|
|
--background: #3B4252;
|
|
--background-darker: #2E3440;
|
|
--item-background: #434C5E;
|
|
--item-background-hover: #4C566A;
|
|
.collapsable:nth-child(1n) { background: #BF616A; }
|
|
.collapsable:nth-child(2n) { background: #D08770; }
|
|
.collapsable:nth-child(3n) { background: #EBCB8B; }
|
|
.collapsable:nth-child(4n) { background: #A3BE8C; }
|
|
}
|
|
|
|
html[data-theme='nord-frost'] {
|
|
--primary: #D8DEE9;
|
|
--background: #3B4252;
|
|
--background-darker: #2E3440;
|
|
--item-background: #434C5E;
|
|
--item-background-hover: #4C566A;
|
|
.collapsable:nth-child(1n) { background: #8FBCBB; }
|
|
.collapsable:nth-child(2n) { background: #88C0D0; }
|
|
.collapsable:nth-child(3n) { background: #81A1C1; }
|
|
.collapsable:nth-child(4n) { background: #5E81AC; }
|
|
}
|
|
|
|
html[data-theme='material'] {
|
|
--primary: #29B6F6;
|
|
--settings-text-color: #01579b;
|
|
--background: #e2e1e0;
|
|
--background-darker: #01579B;
|
|
--settings-background: #01579B;
|
|
--item-group-background: #f8f8f8;
|
|
--item-background: #fff;
|
|
--item-background-hover: #fff;
|
|
--settings-background: #29B6F6;
|
|
--search-container-background: #29B6F6;
|
|
--curve-factor: 2px;
|
|
--curve-factor-navbar: 0;
|
|
--item-group-padding: 5px 0 0;
|
|
--item-shadow: 0 1px 3px #0000001f, 0 1px 2px #0000003d;
|
|
--item-hover-shadow: 0 1px 4px #00000029, 0 2px 4px #0000002a;
|
|
--item-icon-transform: drop-shadow(1px 2px 1px var(--transparent-30)) saturate(0.65);
|
|
--item-icon-transform-hover: drop-shadow(1px 3px 2px var(--transparent-30)) saturate(2);
|
|
--settings-container-shadow: 0 1px 3px #0000005e, 0 1px 2px #00000085;
|
|
--welcome-popup-background: #01579b;
|
|
--welcome-popup-text-color: #ffffff;
|
|
}
|
|
|
|
html[data-theme='material-dark'] {
|
|
--primary: #08B0BB;
|
|
--settings-text-color: #08B0BB;
|
|
--background: #39434C;
|
|
--background-darker: #08B0BB;
|
|
--settings-background: #092b3a;
|
|
--item-group-background: #333C43;
|
|
--item-background: #414B55;
|
|
--item-background-hover: #414B55;
|
|
--settings-background: #131a1f;
|
|
--search-container-background: #131a1f;
|
|
--search-field-background: #39434c;
|
|
--heading-text-color: #131a1f;
|
|
--nav-link-text-color: #08B0BB;
|
|
--nav-link-background-color: #131a1f;
|
|
--nav-link-text-color-hover: #08B0BB;
|
|
--nav-link-background-color-hover: #131a1fc7;
|
|
--nav-link-border-color-hover: transparent;
|
|
--curve-factor: 2px;
|
|
--curve-factor-navbar: 0;
|
|
--item-group-padding: 5px 0 0;
|
|
--item-shadow: 2px 2px 3px #00000082, 0 1px 10px #00000040;
|
|
--item-hover-shadow: 4px 4px 3px #00000082, 0 1px 10px #00000040;
|
|
--item-icon-transform: drop-shadow(1px 2px 1px var(--transparent-30)) saturate(0.65);
|
|
--item-icon-transform-hover: drop-shadow(1px 3px 2px var(--transparent-30)) saturate(2);
|
|
--welcome-popup-background: #131a1f;
|
|
--welcome-popup-text-color: var(--primary);
|
|
}
|
|
|
|
html[data-theme='colorful'] {
|
|
--primary: #e8eae1;
|
|
--background: #0b1021;
|
|
--item-background: #05070e;
|
|
--item-background-hover: #0b1021;
|
|
--item-group-background: transparent;
|
|
--item-group-outer-background: #05070e;
|
|
--item-group-heading-text-color: #e8eae1;
|
|
--item-group-heading-text-color-hover: #fff;
|
|
.item:nth-child(1n) { color: #eb5cad; border: 1px solid #eb5cad; }
|
|
.item:nth-child(2n) { color: #985ceb; border: 1px solid #985ceb; }
|
|
.item:nth-child(3n) { color: #5c90eb; border: 1px solid #5c90eb; }
|
|
.item:nth-child(4n) { color: #5cdfeb; border: 1px solid #5cdfeb; }
|
|
.item:nth-child(5n) { color: #5ceb8d; border: 1px solid #5ceb8d; }
|
|
.item:nth-child(6n) { color: #afeb5c; border: 1px solid #afeb5c; }
|
|
.item:nth-child(7n) { color: #ebb75c; border: 1px solid #ebb75c; }
|
|
.item:nth-child(8n) { color: #eb615c; border: 1px solid #eb615c; }
|
|
.tile-title span.text { transition: none; }
|
|
.item:hover, .item:focus {
|
|
opacity: 0.85;
|
|
outline: none;
|
|
background: currentColor;
|
|
span { color: #05070e; }
|
|
svg path { fill: #05070e; }
|
|
i.fas, i.fab, i.far, i.fal, i.fad { color: #05070e; }
|
|
}
|
|
} |