many changed, added nixos-hardware
This commit is contained in:
parent
f4f1c5bba7
commit
2accd81424
149 changed files with 19124 additions and 238 deletions
321
modules/styling/config/scss/_bar.scss
Normal file
321
modules/styling/config/scss/_bar.scss
Normal file
|
|
@ -0,0 +1,321 @@
|
|||
// Made to be pixel-perfect with 11pt font size
|
||||
// 1rem = 11pt = 14.6666666667px
|
||||
|
||||
$black: black;
|
||||
$white: white;
|
||||
$bar_ws_width: 1.774rem;
|
||||
$bar_subgroup_bg: $surfaceVariant;
|
||||
|
||||
@mixin bar-group-rounding {
|
||||
@include small-rounding;
|
||||
}
|
||||
|
||||
.bar-height {
|
||||
min-height: 2.727rem;
|
||||
}
|
||||
|
||||
.bar-bg {
|
||||
background-color: $t_background;
|
||||
min-height: 2.727rem;
|
||||
}
|
||||
|
||||
.bar-sidespace {
|
||||
min-width: 1.5rem;
|
||||
}
|
||||
|
||||
.bar-group-margin {
|
||||
padding: 0.273rem 0rem;
|
||||
}
|
||||
|
||||
.bar-group {
|
||||
background-color: $l_l_t_surfaceVariant;
|
||||
}
|
||||
|
||||
.bar-group-pad {
|
||||
padding: 0.205rem;
|
||||
}
|
||||
|
||||
.bar-group-pad-less {
|
||||
padding: 0rem 0.681rem;
|
||||
}
|
||||
|
||||
.bar-group-pad-system {
|
||||
padding: 0rem 0.341rem;
|
||||
}
|
||||
|
||||
.bar-group-pad-music {
|
||||
padding-right: 1.023rem;
|
||||
padding-left: 0.341rem;
|
||||
}
|
||||
|
||||
.bar-group-standalone {
|
||||
@include bar-group-rounding;
|
||||
-gtk-outline-radius: 1.364rem;
|
||||
}
|
||||
|
||||
.bar-group-round {
|
||||
border-radius: 10rem;
|
||||
-gtk-outline-radius: 10rem;
|
||||
}
|
||||
|
||||
.bar-group-middle {
|
||||
border-radius: 0.477rem;
|
||||
-gtk-outline-radius: 0.477rem;
|
||||
}
|
||||
|
||||
.bar-group-left {
|
||||
border-radius: 0.477rem;
|
||||
-gtk-outline-radius: 0.477rem;
|
||||
border-top-left-radius: 1.364rem;
|
||||
border-bottom-left-radius: 1.364rem;
|
||||
}
|
||||
|
||||
.bar-group-right {
|
||||
border-radius: 0.477rem;
|
||||
-gtk-outline-radius: 0.477rem;
|
||||
border-top-right-radius: 1.364rem;
|
||||
border-bottom-right-radius: 1.364rem;
|
||||
}
|
||||
|
||||
.bar-ws-width {
|
||||
min-width: 18.341rem;
|
||||
}
|
||||
|
||||
.bar-ws {
|
||||
min-width: $bar_ws_width;
|
||||
color: mix($onBackground, $background, 40%);
|
||||
@if $darkmode ==true {
|
||||
color: mix($onBackground, $background, 45%);
|
||||
}
|
||||
}
|
||||
|
||||
.bar-ws-active {
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-ws-occupied {
|
||||
background-color: $bar_subgroup_bg;
|
||||
color: $onSurfaceVariant;
|
||||
}
|
||||
|
||||
.bar-separator {
|
||||
@include full-rounding;
|
||||
min-width: 0.341rem;
|
||||
min-height: 0.341rem;
|
||||
background-color: mix($t_surface, $t_onSurface, 90%);
|
||||
margin: 0rem 0.341rem;
|
||||
}
|
||||
|
||||
.bar-clock-box {
|
||||
margin: 0rem 0.682rem;
|
||||
}
|
||||
|
||||
.bar-clock {
|
||||
@include titlefont;
|
||||
font-size: 1.2727rem;
|
||||
}
|
||||
|
||||
.bar-date {
|
||||
@include titlefont;
|
||||
font-size: 1rem;
|
||||
color: $onBackground;
|
||||
}
|
||||
|
||||
.bar-batt {
|
||||
@include full-rounding;
|
||||
@include element_decel;
|
||||
min-height: 1.77rem;
|
||||
min-width: 1.77rem;
|
||||
border-radius: 10rem;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-sidemodule {
|
||||
min-width: 26rem;
|
||||
}
|
||||
|
||||
.bar-batt-low {
|
||||
background-color: $error;
|
||||
color: $errorContainer;
|
||||
}
|
||||
|
||||
.bar-batt-full {
|
||||
background-color: $successContainer;
|
||||
color: $onSuccessContainer;
|
||||
}
|
||||
|
||||
.bar-batt-circprog {
|
||||
@include fluent_decel_long;
|
||||
min-width: 0.068rem; // line width
|
||||
min-height: 1.636rem;
|
||||
padding: 0rem;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-batt-circprog-low {
|
||||
background-color: $error;
|
||||
color: $errorContainer;
|
||||
}
|
||||
|
||||
.bar-batt-circprog-full {
|
||||
background-color: $successContainer;
|
||||
color: $onSuccessContainer;
|
||||
}
|
||||
|
||||
.bar-music-playstate {
|
||||
@include element_decel;
|
||||
min-height: 1.77rem;
|
||||
min-width: 1.77rem;
|
||||
border-radius: 10rem;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-music-circprog {
|
||||
@include fluent_decel_long;
|
||||
min-width: 0.068rem; // line width
|
||||
min-height: 1.636rem;
|
||||
padding: 0rem;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-music-playstate-playing {
|
||||
min-height: 1.77rem;
|
||||
min-width: 1.77rem;
|
||||
border-radius: 10rem;
|
||||
background-color: $secondaryContainer;
|
||||
color: $onSecondaryContainer;
|
||||
}
|
||||
|
||||
.bar-music-playstate-txt {
|
||||
transition: 100ms cubic-bezier(0.05, 0.7, 0.1, 1);
|
||||
@include icon-material;
|
||||
}
|
||||
|
||||
.bar-music-cover {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% auto;
|
||||
min-width: 11.932rem;
|
||||
}
|
||||
|
||||
.bar-music-extended-bg {
|
||||
border-radius: 1.364rem;
|
||||
min-width: 34.091rem;
|
||||
}
|
||||
|
||||
.bar-music-extended-ctl-bg {
|
||||
border-radius: 1.364rem;
|
||||
background-color: rgba(30, 30, 30, 0.6);
|
||||
}
|
||||
|
||||
.bar-music-hide-false {
|
||||
@include menu_decel;
|
||||
transition-duration: 100ms;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.bar-music-hide-true {
|
||||
@include menu_accel;
|
||||
transition-duration: 100ms;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.bar-corner-spacing {
|
||||
min-width: $rounding_large;
|
||||
min-height: $rounding_large;
|
||||
}
|
||||
|
||||
.corner {
|
||||
background-color: $t_background;
|
||||
@include large-rounding;
|
||||
}
|
||||
|
||||
.corner-black {
|
||||
background-color: $black; // Hard code: fake screen corner
|
||||
@include large-rounding;
|
||||
}
|
||||
|
||||
.bar-topdesc {
|
||||
margin-top: -0.136rem;
|
||||
margin-bottom: -0.341rem;
|
||||
color: $subtext;
|
||||
}
|
||||
|
||||
.bar-space-button {
|
||||
padding: 0.341rem;
|
||||
}
|
||||
|
||||
.bar-space-button > box:first-child {
|
||||
@include full-rounding;
|
||||
padding: 0rem 0.682rem;
|
||||
}
|
||||
|
||||
.bar-space-button:hover > box:first-child,
|
||||
.bar-space-button:focus > box:first-child {
|
||||
background-color: $hovercolor;
|
||||
}
|
||||
|
||||
.bar-space-button:active > box:first-child {
|
||||
background-color: $activecolor;
|
||||
}
|
||||
|
||||
.bar-space-button-leftmost {
|
||||
box {
|
||||
margin: 0rem 0.682rem;
|
||||
}
|
||||
}
|
||||
|
||||
.bar-space-area-rightmost > box {
|
||||
padding-right: 2.386rem;
|
||||
}
|
||||
|
||||
.bar-systray {
|
||||
@include full-rounding;
|
||||
margin: 0.137rem 0rem;
|
||||
padding: 0rem 0.682rem;
|
||||
}
|
||||
|
||||
.bar-systray-item {
|
||||
@include full-rounding;
|
||||
@include element_decel;
|
||||
min-height: 1.032rem;
|
||||
min-width: 1.032rem;
|
||||
font-size: 1.032rem;
|
||||
}
|
||||
|
||||
.bar-statusicons {
|
||||
@include full-rounding;
|
||||
@include element_decel;
|
||||
margin: 0.273rem;
|
||||
padding: 0rem 0.614rem;
|
||||
}
|
||||
|
||||
.bar-statusicons-hover {
|
||||
background-color: mix($t_background, $t_onBackground, 90%);
|
||||
}
|
||||
|
||||
.bar-statusicons-active {
|
||||
background-color: mix($t_background, $t_onBackground, 80%);
|
||||
}
|
||||
|
||||
.bar-util-btn {
|
||||
@include full-rounding;
|
||||
@include element_decel;
|
||||
min-height: 1.77rem;
|
||||
min-width: 1.77rem;
|
||||
background-color: $bar_subgroup_bg;
|
||||
}
|
||||
|
||||
.bar-util-btn:hover,
|
||||
.bar-util-btn:focus {
|
||||
background-color: mix($bar_subgroup_bg, $onSurfaceVariant, 90%);
|
||||
}
|
||||
|
||||
.bar-util-btn:active {
|
||||
background-color: mix($bar_subgroup_bg, $onSurfaceVariant, 80%);
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue