forked from Shinonome/dots-hyprland
stuff
This commit is contained in:
end-4
@@ -0,0 +1,36 @@
|
||||
.bg-decor-dow {
|
||||
font-family: Gabarito;
|
||||
font-size: 64pt;
|
||||
color : rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
.bg-decor-date {
|
||||
font-family: Gabarito;
|
||||
font-size: 26pt;
|
||||
color : rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
.bg-decor-input-left {
|
||||
border-top-left-radius: 999px;
|
||||
border-bottom-left-radius: 999px;
|
||||
margin-top: 30px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
font-size: 15pt;
|
||||
min-height: 50px;
|
||||
background-color : rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
.bg-decor-input-right {
|
||||
border-top-right-radius: 999px;
|
||||
border-bottom-right-radius: 999px;
|
||||
margin-top: 30px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
// padding-top: 5px;
|
||||
// padding-bottom: 5px;
|
||||
font-size: 15pt;
|
||||
min-height: 50px;
|
||||
background-color : rgba(255, 255, 255, 0.2);
|
||||
color : rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
@@ -0,0 +1,51 @@
|
||||
.calendar-win {
|
||||
@include window;
|
||||
background-color: $colorbg;
|
||||
border: 3px solid $color7;
|
||||
color: $colortext;
|
||||
padding: .2em;
|
||||
font-family: 'Gabarito';
|
||||
}
|
||||
|
||||
calendar {
|
||||
//padding: 5px;
|
||||
// padding-top: 4px;
|
||||
// padding-left: 4px;
|
||||
padding: 7px;
|
||||
|
||||
|
||||
:selected {
|
||||
color: $colortext;
|
||||
font-weight: bolder;
|
||||
background-color: $overlay0;
|
||||
border-radius: 8px;
|
||||
font-family: 'Gabarito';
|
||||
}
|
||||
|
||||
.header {
|
||||
font-family: 'Gabarito';
|
||||
color: $color6;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
font-family: 'Gabarito';
|
||||
color: $color0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.button {
|
||||
font-family: 'Gabarito';
|
||||
color: $colortext;
|
||||
}
|
||||
|
||||
:indeterminate {
|
||||
color: $overlay0;
|
||||
}
|
||||
}
|
||||
|
||||
.date-clock{
|
||||
font-family: 'Gabarito';
|
||||
background: transparent;
|
||||
color: $color6;
|
||||
padding-left: 5px;
|
||||
}
|
||||
@@ -0,0 +1,73 @@
|
||||
|
||||
|
||||
$rosewater: #f5e0dc;
|
||||
$flamingo: #f2cdcd;
|
||||
$pink: #f5c2e7;
|
||||
$mauve: #cba6f7;
|
||||
$red: #f38ba8;
|
||||
// $red: #EF738A;
|
||||
$maroon: #eba0ac;
|
||||
$peach: #fab387;
|
||||
$yellow: #f9e2af;
|
||||
$green: #a6e3a1;
|
||||
$teal: #94e2d5;
|
||||
$sky: #89dceb;
|
||||
$sapphire: #74c7ec;
|
||||
$blue: #89b4fa;
|
||||
$lavender: #b4befe;
|
||||
$true: #EF738A;
|
||||
$false: #A9B1D6;
|
||||
|
||||
|
||||
$forestgreen: #A8B468;
|
||||
$forestyellow : #8e8370;
|
||||
$foresttext : #d3c6ab;
|
||||
$forestblack : #1e201f;
|
||||
$forestred : #e76c69;
|
||||
$forestpink : #d698b5;
|
||||
$forestorange : #e59576;
|
||||
$forestgray : #75817b;
|
||||
$forestgraylight: #495156;
|
||||
$forestgreendark: #7fba90;
|
||||
$forestblue: #77AEA7;
|
||||
|
||||
$tokyobluedark: #1A1B26;
|
||||
$tokyobluelessdark: #1f212e;
|
||||
$tokyotext: #a9b1d6;
|
||||
$tokyopink: #ff79b1; //nah theres no pink in tokyonight, but i need one so added
|
||||
$tokyored: #EF738A;
|
||||
$tokyoorange: #FF9E64;
|
||||
$tokyoyellow: #E0AF68;
|
||||
$tokyogreen: #9ECE6A;
|
||||
$tokyoturquoise: #73daca;
|
||||
$tokyoice: #b4f9f8;
|
||||
$tokyocyan: #0DB9D7;
|
||||
$tokyoblue: #7AA2F7;
|
||||
$tokyopurple: #9778D0;
|
||||
$tokyogrey: #444B6A;
|
||||
$catbg: #1E1E2E;
|
||||
|
||||
$text: $tokyotext;
|
||||
$subtext1: #868dac;
|
||||
$subtext0: #a6adc8;
|
||||
$overlay2: #9399b2;
|
||||
$overlay1: #7f849c;
|
||||
$overlay0: rgba(108, 112, 134, 0.5);
|
||||
|
||||
$surface2: #585b70;
|
||||
$surface1: #45475a;
|
||||
$surface0: rgba(28, 28, 48, 0.5); //Needs dynamic change
|
||||
|
||||
$base: #1E201F;
|
||||
$mantle: #181825;
|
||||
$crust: #121415;
|
||||
|
||||
$fg: $tokyotext;
|
||||
$bg: #171726;
|
||||
$barbg: #131426;
|
||||
$bg1: $surface0;
|
||||
$shadow: $crust;
|
||||
|
||||
// $battcolor: $tokyogreen;
|
||||
// $memcolor: $tokyoorange;
|
||||
// $cpucolor: $tokyoblue;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/OdasYzoN7TQ/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCYFcwiVGbaXXSPIUCHH7RG7dYbMQ
|
||||
$colorbg: #1b1938;
|
||||
$colortext: #BCE2FD;
|
||||
$color0: #C9B1FC;
|
||||
$color1: #9CC6FB;
|
||||
$color2: #B1D1FB;
|
||||
$color3: #BCE2FD;
|
||||
$color4: #CDD3FA;
|
||||
$color5: #E2D6FA;
|
||||
$color6: #e0eaf5;
|
||||
$color7: #BCE2FD;
|
||||
@@ -0,0 +1,11 @@
|
||||
$colorbg: #171726; //Get from color0
|
||||
$colortext: #a9b1d6; //Get from color4
|
||||
$color0: #ff79b1;
|
||||
$color1: #EF738A;
|
||||
$color2: #FF9E64;
|
||||
$color3: #E0AF68;
|
||||
$color4: #9ECE6A;
|
||||
$color5: #7AA2F7;
|
||||
$color6: #0DB9D7;
|
||||
$color7: #9778D0; //Get from color4 (border)
|
||||
$colormusic: #EF738A;
|
||||
@@ -0,0 +1,107 @@
|
||||
.song-cover-art {
|
||||
@include rounding;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
margin: 4px 5px 4px 0;
|
||||
min-height: 24px;
|
||||
min-width: 24px;
|
||||
}
|
||||
|
||||
.music-window {
|
||||
@include window;
|
||||
background-color: $colorbg;
|
||||
border: 3px solid;
|
||||
color: $colortext;
|
||||
padding: 3px;
|
||||
margin: 3px;
|
||||
}
|
||||
|
||||
.music-cover-art {
|
||||
@include rounding;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
// border-radius: 5px;
|
||||
margin: 1em;
|
||||
min-height: 200px;
|
||||
min-width: 200px;
|
||||
// background-image: url("/home/end/.config/eww/images/LinageTrack.png");
|
||||
}
|
||||
|
||||
.music-box {
|
||||
margin: 1rem 1rem 1rem 0;
|
||||
}
|
||||
|
||||
.music-title {
|
||||
// font-weight: bold;
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.music-artist {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
color: $color1;
|
||||
}
|
||||
|
||||
.music-button label {
|
||||
font-family: 'Material Symbols Rounded';
|
||||
// color: $text;
|
||||
font-size: 2rem;
|
||||
font-family: SF Mono Nerd Font;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.music-time {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
color: $color1;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
|
||||
.music-bar scale {
|
||||
font-family: 'Material Symbols Rounded';
|
||||
font-family: SF Mono Nerd Font;
|
||||
|
||||
highlight {
|
||||
background-color: $color1;
|
||||
border-radius: 24px;
|
||||
}
|
||||
|
||||
trough {
|
||||
background-color: $surface0;
|
||||
border-radius: 24px;
|
||||
margin-top: 0;
|
||||
min-height: 10px;
|
||||
min-width: 170px;
|
||||
}
|
||||
}
|
||||
|
||||
.music-ctl {
|
||||
border-radius: 0px;
|
||||
color: $color1;
|
||||
// padding-right: 10px;
|
||||
min-height: 32px;
|
||||
}
|
||||
|
||||
.music-icon {
|
||||
padding-top: 5px; //Because the music icon is a bit high
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
color: $color1;
|
||||
background-image: url("images/LinageMusic.png");
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.music-ctl-revealer {
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.song-button {
|
||||
color: $color1;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.music-button-box {
|
||||
font-family: 'Material Symbols Rounded';
|
||||
}
|
||||
@@ -0,0 +1,62 @@
|
||||
.notifications-box {
|
||||
@include window;
|
||||
background: $bg;
|
||||
padding: 1rem;
|
||||
font-family: 'Gabarito';
|
||||
}
|
||||
|
||||
.notification {
|
||||
font-family: 'Gabarito';
|
||||
background-color: $surface0;
|
||||
border-bottom: 3px solid $bg;
|
||||
padding: .5rem;
|
||||
|
||||
box { margin-bottom: .5rem; }
|
||||
|
||||
label { font-size: 1rem; }
|
||||
|
||||
&:hover {
|
||||
border: 3px solid $color7;
|
||||
}
|
||||
|
||||
.appname {
|
||||
color: $color0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.summary {
|
||||
color: $colortext;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.body { color: $colortext; }
|
||||
}
|
||||
|
||||
.container {
|
||||
&:first-child { border-radius: 8px 8px 0 0; };
|
||||
&:last-child { border-radius: 0 0 8px 8px; };
|
||||
}
|
||||
|
||||
.notification-header {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.notification-label {
|
||||
color: $color6;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.notification-action {
|
||||
border-radius: 50%;
|
||||
margin-bottom: .2rem;
|
||||
padding: 0 .3rem;
|
||||
|
||||
label {
|
||||
color: $colortext;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $surface0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,64 @@
|
||||
.overview-window {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
@include rounding;
|
||||
background-color: $colorbg;
|
||||
border: 3px solid $color7;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.overview-window-top {
|
||||
@include rounding;
|
||||
background-color: transparent;
|
||||
border: 3px solid transparent;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.overview-ws {
|
||||
border-radius: 11px;
|
||||
background-color: $surface0;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.overview-ws-window {
|
||||
border: 2px solid $color0;
|
||||
border-radius: 11px;
|
||||
margin: 3px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.overview-icon {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
padding-left: 17px;
|
||||
padding-right: 17px;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.overview-ws-text {
|
||||
padding-left: 5px;
|
||||
font-size: 13pt;
|
||||
}
|
||||
.overview-ws-subtext {
|
||||
padding-left: 5px;
|
||||
font-size: 9pt;
|
||||
}
|
||||
|
||||
.overview-ws-number { //Note: height 100px width 356px
|
||||
font-size: 25pt;
|
||||
border-radius: 11px;
|
||||
background-color: $overlay0;
|
||||
color: $colortext;
|
||||
margin: 10px;
|
||||
min-height: 40px;
|
||||
min-width: 40px;
|
||||
}
|
||||
|
||||
.overview-title {
|
||||
font-weight: bold;
|
||||
font-size: 15pt;
|
||||
padding-top: .6rem;
|
||||
padding-bottom: .6rem;
|
||||
}
|
||||
@@ -0,0 +1,157 @@
|
||||
.system-menu-box {
|
||||
@include window;
|
||||
background-color: $colorbg;
|
||||
border: 3px solid $border;
|
||||
// color: $colortext;
|
||||
}
|
||||
|
||||
.separator {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.top-row {
|
||||
margin: 1rem 1.5rem 0;
|
||||
|
||||
.time {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.date-box {
|
||||
margin: 0 1rem;
|
||||
|
||||
label {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.date {
|
||||
background: unset;
|
||||
margin: 0 .5rem 0 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.system-row {
|
||||
font-family: Gabarito;
|
||||
margin: .5rem .7rem;
|
||||
|
||||
.airplane-box button {
|
||||
padding: 1rem 3rem;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 1rem;
|
||||
margin: 0 .1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.element {
|
||||
font-family: 'Gabarito';
|
||||
@include rounding;
|
||||
background: $surface0;
|
||||
margin: .3rem;
|
||||
|
||||
button {
|
||||
@include rounding;
|
||||
padding: 1rem;
|
||||
|
||||
label {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $overlay0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sliders {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
@include rounding;
|
||||
background-color: $surface0;
|
||||
margin: .5rem 1rem;
|
||||
padding: .6rem 1rem;
|
||||
|
||||
scale {
|
||||
margin-right: -1rem;
|
||||
min-width: 25.8rem;
|
||||
}
|
||||
scale trough {
|
||||
background-color: $bg1;
|
||||
border-radius: 24px;
|
||||
margin: 0 1rem;
|
||||
min-height: 10px;
|
||||
min-width: 70px;
|
||||
}
|
||||
|
||||
box {
|
||||
margin: .2rem 0;
|
||||
}
|
||||
|
||||
label {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.sliderbg {
|
||||
background-color: transparent;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.volume-bar highlight {
|
||||
font-family: SF Mono Nerd Font;
|
||||
@include rounding;
|
||||
background: $color6;
|
||||
// background-image: linear-gradient(to right, $tokyocyan 30%, $tokyopurple 100%);
|
||||
}
|
||||
|
||||
.volume-slider-box scale highlight {
|
||||
@include rounding;
|
||||
background: $color6;
|
||||
// background-image: linear-gradient(to right, $tokyocyan 30%, $tokyopurple 100%);
|
||||
// border: 2px solid;
|
||||
min-height: 0.9rem;
|
||||
}
|
||||
|
||||
// .volume-slider-box scale {
|
||||
// @include rounding;
|
||||
// background-color: #1A1B26;
|
||||
// border: 2px solid;
|
||||
// }
|
||||
|
||||
.bottom-row {
|
||||
margin: .5rem 1rem;
|
||||
|
||||
.battery-icon {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.battery-wattage {
|
||||
color: $color7;
|
||||
}
|
||||
|
||||
.battery-status {
|
||||
color: $colortext;
|
||||
margin: 0 .5rem;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: $surface0;
|
||||
border-radius: 50%;
|
||||
margin-bottom: .1rem;
|
||||
padding: 0 .5rem;
|
||||
|
||||
label {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $overlay0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.power-button {
|
||||
min-height: 2.5rem;
|
||||
// min-width: 2.5rem;
|
||||
}
|
||||
@@ -0,0 +1,169 @@
|
||||
.membar {
|
||||
color: $memcolor;
|
||||
}
|
||||
|
||||
.cpubar {
|
||||
color: $cpucolor;
|
||||
}
|
||||
|
||||
.batbar {
|
||||
color: $battcolor;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
// .batbar-circle {
|
||||
// color: $battcolor;
|
||||
// padding-right: 4px;
|
||||
// }
|
||||
|
||||
// .membar,
|
||||
// .cpubar,
|
||||
// .batbar {
|
||||
// // background-color: transparent;
|
||||
// padding: 0px;
|
||||
// }
|
||||
|
||||
.membar:hover,
|
||||
.cpubar:hover,
|
||||
.batbar:hover {
|
||||
border-top: 2px solid;
|
||||
}
|
||||
|
||||
.batt-percentage {
|
||||
padding-right: 5px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.batt-low {
|
||||
background-color: #B5E8E0;
|
||||
color: #161320;
|
||||
animation-name: blink;
|
||||
animation-duration: 0.5s;
|
||||
animation-timing-function: linear;
|
||||
animation-iteration-count: infinite;
|
||||
animation-direction: alternate;
|
||||
}
|
||||
|
||||
.sys-menu-charge {
|
||||
padding-left: 2px;
|
||||
}
|
||||
|
||||
.iconmem {
|
||||
color: $memcolor;
|
||||
}
|
||||
|
||||
.iconcpu {
|
||||
color: $cpucolor;
|
||||
}
|
||||
|
||||
.icon-text {
|
||||
font-size: 3rem;
|
||||
padding: .7rem;
|
||||
}
|
||||
|
||||
.sys-text-sub {
|
||||
color: $colortext;
|
||||
}
|
||||
|
||||
.sys-text-mem,
|
||||
.sys-text-cpu {
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.sys-icon-mem,
|
||||
.sys-icon-cpu {
|
||||
font-size: 1.5rem;
|
||||
margin: 1.5rem;
|
||||
}
|
||||
|
||||
.system-info-box {
|
||||
@include rounding;
|
||||
background-color: $surface0;
|
||||
margin: .5rem 1rem;
|
||||
padding: .5rem;
|
||||
}
|
||||
|
||||
.sys-mem,
|
||||
.sys-cpu {
|
||||
background-color: $colorbg;
|
||||
}
|
||||
|
||||
.sys-icon-mem,
|
||||
.sys-text-mem,
|
||||
.sys-mem {
|
||||
color: $memcolor;
|
||||
}
|
||||
|
||||
.sys-icon-cpu,
|
||||
.sys-text-cpu,
|
||||
.sys-cpu {
|
||||
color: $cpucolor;
|
||||
}
|
||||
|
||||
.sys-box {
|
||||
margin: .3em;
|
||||
|
||||
box {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.cpu-menu {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
color: $cpucolor;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.mem-menu {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
color: $memcolor;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.mem-menu-left {
|
||||
color: $memcolor;
|
||||
padding-left: 5px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.mem-menu-mid {
|
||||
color: $memcolor;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
|
||||
.mem-menu-right {
|
||||
color: $memcolor;
|
||||
padding-left: 0px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
.sys-menu {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
color: $battcolor;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.sys-menu-button {
|
||||
color: $color1;
|
||||
margin: 0px;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
background-image: url("images/LinageSettings.png");
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
// .volume-bar, .brightness-slider, .slider {
|
||||
// background-color: #16161E;
|
||||
// border: 2px solid #7C9FF5;
|
||||
// border-radius: 99px;
|
||||
// }
|
||||
|
||||
.sys-toggle {
|
||||
font-size: 3pt;
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
.themer-menu-box {
|
||||
@include window;
|
||||
background-color: $colorbg;
|
||||
border: 3px solid $border;
|
||||
// color: $colortext;
|
||||
}
|
||||
|
||||
.themer-title {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-weight: bold;
|
||||
font-size: 15pt;
|
||||
padding: .6rem;
|
||||
}
|
||||
|
||||
.themer-prompt {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-size: 12pt;
|
||||
padding: .6rem;
|
||||
}
|
||||
|
||||
.themer-input {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
background-color: $surface0;
|
||||
border-radius: 10px;
|
||||
padding: 3px;
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
border: 2px solid $overlay0;
|
||||
}
|
||||
.themer-input:focus {
|
||||
border: 2px solid $colortext;
|
||||
}
|
||||
|
||||
.themer-color-preview {
|
||||
min-height: 25px;
|
||||
min-width: 25px;
|
||||
border-radius: 5px;
|
||||
border-width: 55px;
|
||||
}
|
||||
|
||||
.preview-0 { background-color: $color0; }
|
||||
.preview-1 { background-color: $color1; }
|
||||
.preview-2 { background-color: $color2; }
|
||||
.preview-3 { background-color: $color3; }
|
||||
.preview-4 { background-color: $color4; }
|
||||
.preview-5 { background-color: $color5; }
|
||||
.preview-6 { background-color: $color6; }
|
||||
.preview-7 { background-color: $color7; }
|
||||
@@ -0,0 +1,29 @@
|
||||
.vol-icon {
|
||||
color: $color6;
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
// .vol-icon {
|
||||
// color: $tokyocyan;
|
||||
// padding-right: 2px;
|
||||
// }
|
||||
|
||||
.volbar highlight {
|
||||
background-image: linear-gradient(to right, $teal 30%, $sky 100%);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
|
||||
.vol-menu {
|
||||
font-size: 1pt;
|
||||
color: $color6;
|
||||
padding-right: 2px;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.vol-menu:hover {
|
||||
border-top: 2px solid;
|
||||
}
|
||||
.vol-icon:hover {
|
||||
border-top: 2px solid;
|
||||
}
|
||||
@@ -0,0 +1,55 @@
|
||||
.winctl {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
padding-left: 3px;
|
||||
padding-right: 3px;
|
||||
color: $color0;
|
||||
padding-top: 4px;
|
||||
}
|
||||
|
||||
.winctl:hover {
|
||||
border-top: 2px solid;
|
||||
}
|
||||
|
||||
.winws {
|
||||
@include rounding;
|
||||
background-color: $surface0;
|
||||
margin: .4rem .8rem;
|
||||
padding: .3rem .5rem;
|
||||
min-width: 31rem;
|
||||
}
|
||||
|
||||
.winws-title {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-weight: bold;
|
||||
font-size: 15pt;
|
||||
padding-top: .6rem;
|
||||
padding-bottom: .6rem;
|
||||
}
|
||||
|
||||
.wintext {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-size: 13pt;
|
||||
}
|
||||
.winsubtext {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-size: 10pt;
|
||||
}
|
||||
|
||||
.winws-workspace {
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
.appicon {
|
||||
background-size: 90%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
padding-left: 22px;
|
||||
padding-right: 22px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.wschoose {
|
||||
font-family: 'Gabarito', 'Material Symbols Rounded';
|
||||
font-size: 14pt;
|
||||
}
|
||||
@@ -0,0 +1,207 @@
|
||||
.osettings-window {
|
||||
padding-top: 50px;
|
||||
background-color: #302E38;
|
||||
color: #F8F8F8;
|
||||
font-family: Rubik;
|
||||
}
|
||||
|
||||
.osettings-separator {
|
||||
background-color: #18171C;
|
||||
min-height: 6px;
|
||||
margin-top: 27px;
|
||||
}
|
||||
|
||||
.osettings-content {
|
||||
padding-top: 13px;
|
||||
padding-bottom: 10px;
|
||||
background-color: #302E38;
|
||||
color: #F8F8F8;
|
||||
font-family: Rubik;
|
||||
}
|
||||
|
||||
.osettings-heading {
|
||||
padding-left: 28px;
|
||||
padding-right: 28px;
|
||||
background-color: #302E38;
|
||||
color: #F8F8F8;
|
||||
font-family: Rubik;
|
||||
}
|
||||
|
||||
.osettings-title {
|
||||
background-color: #302E38;
|
||||
color: #F8F8F8;
|
||||
font-family: Rubik;
|
||||
font-size: 30pt;
|
||||
}
|
||||
|
||||
.osettings-subtitle {
|
||||
background-color: #302E38;
|
||||
color: #DCD7EC;
|
||||
font-family: Rubik;
|
||||
font-size: 14pt;
|
||||
}
|
||||
|
||||
.osettings-section {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 9px;
|
||||
background-color: #302E38;
|
||||
color: #FAFAFA;
|
||||
font-family: Rubik;
|
||||
font-size: 20pt;
|
||||
}
|
||||
|
||||
.osettings-text {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
color: #F7F7F7;
|
||||
font-family: Rubik;
|
||||
font-size: 14pt;
|
||||
}
|
||||
|
||||
.osettings-search {
|
||||
margin-left: 28px;
|
||||
margin-right: 28px;
|
||||
margin-top: 65px;
|
||||
background-color: #24222A;
|
||||
color: #FAFAFA;
|
||||
border-radius: 6px;
|
||||
font-size: 11pt;
|
||||
min-height: 45px;
|
||||
}
|
||||
|
||||
.osettings-search-text {
|
||||
color: #EBEBEC;
|
||||
padding: 10px;
|
||||
font-size: 13pt;
|
||||
min-width: 420px;
|
||||
|
||||
cursor {
|
||||
color: #7F7E83;
|
||||
}
|
||||
|
||||
highlight {
|
||||
color: green;
|
||||
background-color: green;
|
||||
}
|
||||
}
|
||||
|
||||
.osettings-search-icon {
|
||||
color: #FAFAFA;
|
||||
padding: 6px;
|
||||
padding-left: 0px;
|
||||
font-size: 20pt;
|
||||
}
|
||||
|
||||
.osettings-scroll-bg {
|
||||
padding-left: 28px;
|
||||
padding-right: 28px;
|
||||
}
|
||||
|
||||
.osettings-settings {}
|
||||
|
||||
.osettings-btn {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 9999px;
|
||||
min-height: 50px;
|
||||
font-weight: bold;
|
||||
font-size: 13pt;
|
||||
}
|
||||
|
||||
.osettings-btn-destructive {
|
||||
background-color: #CC3378;
|
||||
}
|
||||
|
||||
.osettings-btn-neutral {
|
||||
background-color: #5933CC;
|
||||
}
|
||||
|
||||
.osettings-btn-informative {
|
||||
background-color: #EEAA00;
|
||||
}
|
||||
|
||||
.osettings-btn-neutral:hover,
|
||||
.osettings-btn-neutral:focus {
|
||||
background-color: #8C66FF;
|
||||
}
|
||||
|
||||
.osettings-btn-destructive:hover,
|
||||
.osettings-btn-destructive:focus {
|
||||
background-color: #F53D90;
|
||||
}
|
||||
|
||||
.osettings-btn-informative:hover,
|
||||
.osettings-btn-informative:focus {
|
||||
background-color: #FFCC00;
|
||||
}
|
||||
|
||||
.rounder {
|
||||
border-radius: 9999px;
|
||||
}
|
||||
|
||||
.osettings-slider {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
min-height: 6px;
|
||||
border-radius: 9999px;
|
||||
background-image: linear-gradient(to right, #8C66FF 50%, #24222A 50%);
|
||||
padding: 0px;
|
||||
|
||||
trough {
|
||||
border-radius: 9999px;
|
||||
background-color: #24222A;
|
||||
min-height: 6px;
|
||||
margin-left: 32px;
|
||||
margin-right: 32px;
|
||||
// min-width: 70px;
|
||||
}
|
||||
|
||||
highlight {
|
||||
border-radius: 9999px;
|
||||
background-color: #8C66FF;
|
||||
}
|
||||
|
||||
slider {
|
||||
border-radius: 9999px;
|
||||
min-height: 20px;
|
||||
// min-height: 6px;
|
||||
min-width: 65px;
|
||||
background-color: #8C66FF;
|
||||
margin: -8px;
|
||||
}
|
||||
|
||||
slider:hover {
|
||||
background-color: #A87AFF;
|
||||
}
|
||||
|
||||
slider:focus {
|
||||
background-color: #A87AFF;
|
||||
}
|
||||
}
|
||||
|
||||
.osettings-checkbox {
|
||||
border-radius: 9999px;
|
||||
// min-height: 20px;
|
||||
// min-height: 6px;
|
||||
min-width: 60px;
|
||||
background-color: transparent;
|
||||
color: transparent;
|
||||
border: 3px solid #8C66FF;
|
||||
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.osettings-checkbox:checked {
|
||||
border-radius: 9999px;
|
||||
background-color: #8C66FF;
|
||||
color: #8C66FF;
|
||||
}
|
||||
|
||||
.scrollbar { //whyyyyyyy
|
||||
background-color: red;
|
||||
|
||||
trough {
|
||||
background-color: red;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #000101;
|
||||
$colortext: #28BABD;
|
||||
$color0: #1D9194;
|
||||
$color1: #12B0B3;
|
||||
$color2: #2DAEB0;
|
||||
$color3: #28BABD;
|
||||
$color4: #568587;
|
||||
$color5: #16CFD1;
|
||||
$color6: #87e5e6;
|
||||
$color7: #28BABD;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/eW5kCVkBBP0/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCvqcy7AEqsLJWnbvruHbqHtyXMjA
|
||||
$colorbg: #060308;
|
||||
$colortext: #7256AA;
|
||||
$color0: #30148F;
|
||||
$color1: #3615A1;
|
||||
$color2: #4D22AC;
|
||||
$color3: #7256AA;
|
||||
$color4: #6626D0;
|
||||
$color5: #8E46DE;
|
||||
$color6: #c5a6ea;
|
||||
$color7: #7256AA;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #0E3055;
|
||||
$colortext: #10A997;
|
||||
$color0: #216F89;
|
||||
$color1: #4F7085;
|
||||
$color2: #0F908B;
|
||||
$color3: #10A997;
|
||||
$color4: #23A59F;
|
||||
$color5: #5DA2A6;
|
||||
$color6: #8edfd5;
|
||||
$color7: #10A997;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/OdasYzoN7TQ/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLCYFcwiVGbaXXSPIUCHH7RG7dYbMQ
|
||||
$colorbg: #1b1938;
|
||||
$colortext: #BCE2FD;
|
||||
$color0: #C9B1FC;
|
||||
$color1: #9CC6FB;
|
||||
$color2: #B1D1FB;
|
||||
$color3: #BCE2FD;
|
||||
$color4: #CDD3FA;
|
||||
$color5: #E2D6FA;
|
||||
$color6: #e0eaf5;
|
||||
$color7: #BCE2FD;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/YPdCyC-H_v0/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLB_SQ40d0_Pmw0rZtCRQ6_ggVShIg
|
||||
$colorbg: #000000;
|
||||
$colortext: #995A92;
|
||||
$color0: #6A4776;
|
||||
$color1: #8A4579;
|
||||
$color2: #765487;
|
||||
$color3: #995A92;
|
||||
$color4: #CA5AA8;
|
||||
$color5: #DBA1A8;
|
||||
$color6: #e1c9d2;
|
||||
$color7: #995A92;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #1f2228;
|
||||
$colortext: #60D5E8;
|
||||
$color0: #59A6B8;
|
||||
$color1: #21A1D8;
|
||||
$color2: #20D5E6;
|
||||
$color3: #60D5E8;
|
||||
$color4: #A1A4B3;
|
||||
$color5: #9FE6EB;
|
||||
$color6: #dde4e5;
|
||||
$color7: #60D5E8;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/oKOsXdB_C0Q/hqdefault.jpg?sqp=-oaymwE2CNACELwBSFXyq4qpAygIARUAAIhCGAFwAcABBvABAfgB_gmAAtAFigIMCAAQARgTIEcofzAP&rs=AOn4CLAcG9PBSsh7MtP-PmSBee046IVFXQ
|
||||
$colorbg: #02070D;
|
||||
$colortext: #65A3D5;
|
||||
$color0: #37669A;
|
||||
$color1: #1F62A7;
|
||||
$color2: #5C9AB8;
|
||||
$color3: #65A3D5;
|
||||
$color4: #88B6D5;
|
||||
$color5: #A0D4E8;
|
||||
$color6: #ddeef2;
|
||||
$color7: #65A3D5;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/0CuTOGKMWW0/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBkQ9ETNGNv538s2qddDWjrEvW4-A
|
||||
$colorbg: #09040A;
|
||||
$colortext: #1AEDAB;
|
||||
$color0: #11988A;
|
||||
$color1: #04B190;
|
||||
$color2: #05CB99;
|
||||
$color3: #1AEDAB;
|
||||
$color4: #5FD0AC;
|
||||
$color5: #9FD2BF;
|
||||
$color6: #e1ede5;
|
||||
$color7: #1AEDAB;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/VR1H9njDd9w/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLDVltG4xzVCF5FVl8ywZqwwNepufg
|
||||
$colorbg: #091414;
|
||||
$colortext: #37B6AF;
|
||||
$color0: #1C8E6F;
|
||||
$color1: #47AE6C;
|
||||
$color2: #1BA19B;
|
||||
$color3: #37B6AF;
|
||||
$color4: #22D5DC;
|
||||
$color5: #2CF2F8;
|
||||
$color6: #9cf2f2;
|
||||
$color7: #37B6AF;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #021336;
|
||||
$colortext: #147AC5;
|
||||
$color0: #335B8D;
|
||||
$color1: #1A63A8;
|
||||
$color2: #126BB3;
|
||||
$color3: #147AC5;
|
||||
$color4: #2696D8;
|
||||
$color5: #58BAE8;
|
||||
$color6: #c6e6ee;
|
||||
$color7: #147AC5;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/pgrUT_Vg5g8/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLAewmIHWJ2J7GYT2oj0_XMMPAHsnQ
|
||||
$colorbg: #12052d;
|
||||
$colortext: #D035F7;
|
||||
$color0: #7324F3;
|
||||
$color1: #902CFB;
|
||||
$color2: #A831FC;
|
||||
$color3: #D035F7;
|
||||
$color4: #AD56EE;
|
||||
$color5: #DD67EF;
|
||||
$color6: #e9bfeb;
|
||||
$color7: #D035F7;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #0c041c;
|
||||
$colortext: #6B50A1;
|
||||
$color0: #85826F;
|
||||
$color1: #57309A;
|
||||
$color2: #5338B7;
|
||||
$color3: #6B50A1;
|
||||
$color4: #A05BA9;
|
||||
$color5: #B053B0;
|
||||
$color6: #c4afe4;
|
||||
$color7: #6B50A1;
|
||||
@@ -0,0 +1,11 @@
|
||||
$colorbg: #171726; //Get from color0
|
||||
$colortext: #a9b1d6; //Get from color4
|
||||
$color0: #ff79b1;
|
||||
$color1: #EF738A;
|
||||
$color2: #FF9E64;
|
||||
$color3: #E0AF68;
|
||||
$color4: #9ECE6A;
|
||||
$color5: #7AA2F7;
|
||||
$color6: #0DB9D7;
|
||||
$color7: #9778D0; //Get from color4 (border)
|
||||
$colormusic: #EF738A;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at: https://i.ytimg.com/vi/TJB0vBURJu8/hqdefault.jpg?sqp=-oaymwEcCNACELwBSFXyq4qpAw4IARUAAIhCGAFwAcABBg==&rs=AOn4CLBSn25aezZvjIetBF8GVsTMPat0Zw
|
||||
$colorbg: #1f133f;
|
||||
$colortext: #B592D1;
|
||||
$color0: #B26CB9;
|
||||
$color1: #AB8FB2;
|
||||
$color2: #AD9ED3;
|
||||
$color3: #B592D1;
|
||||
$color4: #CFA2D9;
|
||||
$color5: #DCCFE8;
|
||||
$color6: #ebe2ee;
|
||||
$color7: #B592D1;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #0C1012;
|
||||
$colortext: #6240A2;
|
||||
$color0: #405865;
|
||||
$color1: #51108E;
|
||||
$color2: #681AA7;
|
||||
$color3: #6240A2;
|
||||
$color4: #9E21D9;
|
||||
$color5: #BE3DDF;
|
||||
$color6: #acbebe;
|
||||
$color7: #6240A2;
|
||||
@@ -0,0 +1,11 @@
|
||||
//Auto generated color theme for image at:
|
||||
$colorbg: #0f1212;
|
||||
$colortext: #9A906B;
|
||||
$color0: #956267;
|
||||
$color1: #8B7F7F;
|
||||
$color2: #BDAC54;
|
||||
$color3: #9A906B;
|
||||
$color4: #A09F95;
|
||||
$color5: #CAAB99;
|
||||
$color6: #e0ddd1;
|
||||
$color7: #9A906B;
|
||||
Reference in New Issue
Block a user