generated from wm-packages/pika-hyprland-settings
599 lines
12 KiB
CSS
599 lines
12 KiB
CSS
* {
|
|
all: unset; }
|
|
|
|
@keyframes flyin-top {
|
|
from {
|
|
margin-top: -2.795rem; }
|
|
to {
|
|
margin-top: 0rem; } }
|
|
|
|
@keyframes flyin-bottom {
|
|
from {
|
|
margin-top: 4.841rem;
|
|
margin-bottom: -4.841rem; }
|
|
to {
|
|
margin-bottom: 0rem;
|
|
margin-top: 0rem; } }
|
|
|
|
.no-anim {
|
|
transition: 0ms; }
|
|
|
|
.txt {
|
|
color: #e5e1e6; }
|
|
|
|
.txt-shadow {
|
|
text-shadow: 1px 2px 8px rgba(0, 0, 0, 0.69);
|
|
margin: 10px; }
|
|
|
|
.txt-badonkers {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 3rem; }
|
|
|
|
.txt-tiddies {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 2.7273rem; }
|
|
|
|
.txt-hugeass {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1.8182rem; }
|
|
|
|
.txt-larger {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1.6363rem; }
|
|
|
|
.txt-large {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1.4545rem; }
|
|
|
|
.txt-norm {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1.2727rem; }
|
|
|
|
.txt-small {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1.0909rem; }
|
|
|
|
.txt-smallie {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 1rem; }
|
|
|
|
.txt-smaller {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 0.9091rem; }
|
|
|
|
.txt-smaller-offset {
|
|
margin-top: -0.136rem; }
|
|
|
|
.txt-tiny {
|
|
font-family: 'Torus', 'Product Sans', 'Bahnschrift', 'Inter';
|
|
font-size: 0.7273rem; }
|
|
|
|
.txt-subtxt {
|
|
color: #bdb9be; }
|
|
|
|
.txt-bold {
|
|
font-weight: 500; }
|
|
|
|
.icon-material {
|
|
font-family: 'Material Symbols Rounded'; }
|
|
|
|
.separator {
|
|
border-radius: 50rem;
|
|
background-color: #e5e1e6;
|
|
margin: 0rem 0.682rem;
|
|
min-width: 0.545rem;
|
|
min-height: 0.545rem; }
|
|
|
|
tooltip {
|
|
background-color: #47464e;
|
|
color: #c9c5d0;
|
|
border-radius: 50rem;
|
|
border: 1px solid #c9c5d0; }
|
|
|
|
.spacing-v-15 > box {
|
|
margin-bottom: 1.023rem; }
|
|
|
|
.spacing-v-15 > box:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-15 > scrolledwindow {
|
|
margin-bottom: 1.023rem; }
|
|
|
|
.spacing-v-15 > scrolledwindow:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-15 > revealer {
|
|
margin-bottom: 1.023rem; }
|
|
|
|
.spacing-v-15 > revealer:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-15 > label {
|
|
margin-bottom: 1.023rem; }
|
|
|
|
.spacing-v-15 > label:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-h-15 > box {
|
|
margin-right: 1.023rem; }
|
|
|
|
.spacing-h-15 > box:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-15 > label {
|
|
margin-right: 1.023rem; }
|
|
|
|
.spacing-h-15 > label:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-15 > button {
|
|
margin-right: 1.023rem; }
|
|
|
|
.spacing-h-15 > button:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-v-5 > box {
|
|
margin-bottom: 0.341rem; }
|
|
|
|
.spacing-v-5 > box:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-5 > label {
|
|
margin-bottom: 0.341rem; }
|
|
|
|
.spacing-v-5 > label:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-5 > button {
|
|
margin-bottom: 0.341rem; }
|
|
|
|
.spacing-v-5 > button:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-h-5 > box {
|
|
margin-right: 0.341rem; }
|
|
|
|
.spacing-h-5 > box:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-5 > label {
|
|
margin-right: 0.341rem; }
|
|
|
|
.spacing-h-5 > label:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-5 > widget > box {
|
|
margin-right: 0.341rem; }
|
|
|
|
.spacing-h-5 > widget:last-child > box {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-v-minus5 > box {
|
|
margin-bottom: -0.341rem; }
|
|
|
|
.spacing-v-minus5 > box:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-v-minus5 > label {
|
|
margin-bottom: -0.341rem; }
|
|
|
|
.spacing-v-minus5 > label:last-child {
|
|
margin-bottom: 0rem; }
|
|
|
|
.spacing-h-10 > box {
|
|
margin-right: 0.682rem; }
|
|
|
|
.spacing-h-10 > box:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-10 > label {
|
|
margin-right: 0.682rem; }
|
|
|
|
.spacing-h-10 > label:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.spacing-h-10 > widget {
|
|
margin-right: 0.682rem; }
|
|
|
|
.spacing-h-10 > widget:last-child {
|
|
margin-right: 0rem; }
|
|
|
|
.anim-enter {
|
|
transition: 200ms cubic-bezier(0.05, 0.7, 0.1, 1); }
|
|
|
|
.anim-exit {
|
|
transition: 150ms cubic-bezier(0.3, 0, 0.8, 0.15); }
|
|
|
|
.bar-bg {
|
|
min-height: 3.81818181817rem;
|
|
margin: 0.27272727272rem 0.546rem;
|
|
border-radius: 26px;
|
|
background-color: #141418;
|
|
background-image: linear-gradient(135deg, #191823 18%, rgba(0, 0, 0, 0) 18%, rgba(0, 0, 0, 0) 37%, #191823 37%, #191823 63%, rgba(0, 0, 0, 0) 63%, rgba(0, 0, 0, 0) 85%, #191823 85%);
|
|
box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.5);
|
|
animation-name: flyin-top;
|
|
animation-duration: 250ms;
|
|
animation-timing-function: cubic-bezier(0.05, 0.7, 0.1, 1);
|
|
animation-iteration-count: 1; }
|
|
|
|
.bar-sidespace {
|
|
min-width: 1.5rem; }
|
|
|
|
.bar-group-margin {
|
|
padding: 0.2rem; }
|
|
|
|
.bar-group {
|
|
background-color: rgba(48, 47, 51, 0.59);
|
|
border-top: 1px solid rgba(68, 67, 71, 0.59);
|
|
border-left: 1px solid rgba(68, 67, 71, 0.59);
|
|
border-right: 1px solid rgba(58, 57, 61, 0.59);
|
|
border-bottom: 1px solid rgba(58, 57, 61, 0.59); }
|
|
|
|
.bar-group-pad {
|
|
padding: 0rem 1.023rem; }
|
|
|
|
.bar-group-pad-less {
|
|
padding: 0rem 0.681rem; }
|
|
|
|
.bar-group-pad-system {
|
|
padding-left: 1.023rem;
|
|
padding-right: 0.547rem; }
|
|
|
|
.bar-group-pad-music {
|
|
padding-right: 1.023rem;
|
|
padding-left: 0.273rem;
|
|
margin-left: 1.023rem; }
|
|
|
|
.bar-group-pad-left {
|
|
padding-left: 1.364rem;
|
|
padding-right: 0.681rem; }
|
|
|
|
.bar-group-pad-right {
|
|
padding-left: 0.681rem;
|
|
padding-right: 1.364rem; }
|
|
|
|
.bar-group-pad-leftonly {
|
|
padding-left: 0.681rem; }
|
|
|
|
.bar-group-pad-rightonly {
|
|
padding-right: 0.681rem; }
|
|
|
|
.bar-group-standalone {
|
|
border-radius: 1.364rem; }
|
|
|
|
.bar-group-round {
|
|
border-radius: 10rem; }
|
|
|
|
.bar-group-middle {
|
|
border-radius: 0.477rem; }
|
|
|
|
.bar-group-left {
|
|
border-radius: 0.477rem;
|
|
border-top-left-radius: 1.364rem;
|
|
border-bottom-left-radius: 1.364rem;
|
|
margin-left: 1.092rem; }
|
|
|
|
.bar-group-right {
|
|
border-radius: 0.477rem;
|
|
border-top-right-radius: 1.364rem;
|
|
border-bottom-right-radius: 1.364rem;
|
|
margin-right: 1.092rem; }
|
|
|
|
.bar-ws-width {
|
|
min-width: 18.382rem; }
|
|
|
|
.bar-separator {
|
|
min-width: 0.341rem;
|
|
min-height: 0.341rem;
|
|
background-color: rgba(48, 47, 51, 0.59);
|
|
border-radius: 999px;
|
|
margin: 0rem 0.341rem; }
|
|
|
|
.bar-ws {
|
|
min-height: 1.770rem;
|
|
min-width: 1.770rem;
|
|
font-size: 1.091rem; }
|
|
|
|
.bar-ws-button:hover .bar-ws-empty {
|
|
color: #c6c0ff; }
|
|
|
|
.bar-ws-button:hover .bar-ws-occupied {
|
|
background-color: #3e31ad;
|
|
color: #e5dfff; }
|
|
|
|
.bar-ws-button:hover .bar-ws-active {
|
|
background-color: #c6c0ff;
|
|
color: #260f98; }
|
|
|
|
.bar-ws-empty {
|
|
color: #e5e1e6; }
|
|
|
|
.bar-ws-occupied {
|
|
background-color: #464459;
|
|
color: #e3dff8; }
|
|
|
|
.bar-ws-active {
|
|
background-color: #c6c0ff;
|
|
color: #260f98;
|
|
border-radius: 999px;
|
|
transition: 100ms cubic-bezier(0, 1, 0, 1); }
|
|
|
|
.bar-ws-left {
|
|
border-top-left-radius: 999px;
|
|
border-bottom-left-radius: 999px; }
|
|
|
|
.bar-ws-right {
|
|
border-top-right-radius: 999px;
|
|
border-bottom-right-radius: 999px; }
|
|
|
|
.bar-batt {
|
|
border-radius: 999px;
|
|
padding: 0rem 0.341rem;
|
|
background-color: #e5dfff;
|
|
color: #3e31ad; }
|
|
|
|
.bar-sidemodule {
|
|
min-width: 25.227rem; }
|
|
|
|
.bar-batt-low {
|
|
background-color: #ffb4a9;
|
|
color: #680003; }
|
|
|
|
.bar-batt-prog-low {
|
|
background-color: #ffb4a9;
|
|
color: #680003; }
|
|
|
|
.bar-music-playstate {
|
|
min-height: 1.5rem;
|
|
min-width: 1.5rem;
|
|
border-radius: 10rem;
|
|
background-color: rgba(28, 27, 31, 0.59);
|
|
color: #e5e1e6;
|
|
margin-left: 2rem; }
|
|
|
|
.bar-music {
|
|
margin-left: 2rem; }
|
|
|
|
.bar-music-label-container {
|
|
min-width: 18.770rem; }
|
|
|
|
.bar-music-playstate-playing {
|
|
min-height: 1.5rem;
|
|
min-width: 1.5rem;
|
|
border-radius: 10rem;
|
|
background-color: rgba(28, 27, 31, 0.59);
|
|
color: #e5e1e6;
|
|
margin-left: 2rem; }
|
|
|
|
.bar-music-playstate-txt {
|
|
font-family: 'Material Symbols Rounded';
|
|
font-size: 1.4545rem;
|
|
margin: -0.1rem 0rem; }
|
|
|
|
.bar-music-coverbox {
|
|
box-shadow: #260f98 0px 0px 2rem -0.3rem;
|
|
border: #190b5f 2px solid;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
background-size: 125%;
|
|
min-height: 3rem;
|
|
min-width: 3rem;
|
|
border-radius: 0.75rem; }
|
|
|
|
.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-bottom-bg {
|
|
border-radius: 1.364rem;
|
|
min-width: 34.091rem; }
|
|
|
|
.bar-music-bottom-ctl-bg {
|
|
border-radius: 1.364rem;
|
|
background-color: rgba(30, 30, 30, 0.6); }
|
|
|
|
.bar-music-extended-textbox {
|
|
margin: 1.023rem; }
|
|
|
|
.bar-music-bottom-cover {
|
|
border-radius: 10rem; }
|
|
|
|
.bar-music-hide-false {
|
|
transition: 250ms cubic-bezier(0.05, 0.7, 0.1, 1);
|
|
transition-duration: 100ms;
|
|
opacity: 1; }
|
|
|
|
.bar-music-hide-true {
|
|
transition: 180ms cubic-bezier(0.3, 0, 0.8, 0.15);
|
|
transition-duration: 100ms;
|
|
opacity: 0; }
|
|
|
|
.bar-music-btn {
|
|
font-size: 1.364rem;
|
|
border-radius: 10rem;
|
|
min-height: 2.591rem;
|
|
min-width: 2.591rem; }
|
|
|
|
.bar-music-btn:hover {
|
|
background-color: rgba(128, 128, 128, 0.4); }
|
|
|
|
.bar-prog-batt {
|
|
min-height: 0.955rem;
|
|
min-width: 0.068rem;
|
|
padding: 0rem;
|
|
border-radius: 10rem; }
|
|
.bar-prog-batt trough {
|
|
min-height: 0.954rem;
|
|
min-width: 0.068rem;
|
|
border-radius: 10rem;
|
|
background-color: #e5dfff; }
|
|
.bar-prog-batt progress {
|
|
min-height: 0.680rem;
|
|
min-width: 0.680rem;
|
|
margin: 0rem 0.137rem;
|
|
border-radius: 10rem;
|
|
background-color: #3e31ad; }
|
|
|
|
.bar-prog-batt-low {
|
|
min-height: 0.954rem;
|
|
min-width: 0.068rem;
|
|
padding: 0rem;
|
|
border-radius: 10rem; }
|
|
.bar-prog-batt-low trough {
|
|
min-height: 0.954rem;
|
|
min-width: 0.068rem;
|
|
border-radius: 10rem;
|
|
background-color: #ffb4a9; }
|
|
.bar-prog-batt-low progress {
|
|
min-height: 0.680rem;
|
|
min-width: 0.680rem;
|
|
margin: 0rem 0.137rem;
|
|
border-radius: 10rem;
|
|
background-color: #930006; }
|
|
|
|
.bar-batt-chargestate {
|
|
border-radius: 10rem;
|
|
background-color: transparent;
|
|
background-color: #3e31ad; }
|
|
|
|
.bar-batt-chargestate-charging {
|
|
border-radius: 10rem;
|
|
min-width: 0.681rem;
|
|
min-height: 0.681rem; }
|
|
|
|
.bar-batt-chargestate-low {
|
|
background-color: #930006; }
|
|
|
|
.bar-batt-percentage {
|
|
font-size: 1rem;
|
|
margin-top: -0.068rem;
|
|
font-weight: 500; }
|
|
|
|
.corner {
|
|
background-color: rgba(28, 27, 31, 0.9);
|
|
border-radius: 1.5rem; }
|
|
|
|
.bar-space-button {
|
|
padding: 0.341rem; }
|
|
.bar-space-button box {
|
|
border-radius: 999px;
|
|
padding: 0rem 0.682rem; }
|
|
|
|
.bar-space-button:hover box {
|
|
background-color: rgba(128, 128, 128, 0.4); }
|
|
|
|
.bar-space-button:active box {
|
|
background-color: rgba(128, 128, 128, 0.7); }
|
|
|
|
.bar-space-button-leftmost box {
|
|
margin: 0rem 1.5rem; }
|
|
|
|
.bar-space-area-rightmost > box {
|
|
padding-right: 2.386rem; }
|
|
|
|
.progicon {
|
|
margin-right: 0.75rem; }
|
|
|
|
.progiconicon {
|
|
font-size: 32px; }
|
|
|
|
.calendar {
|
|
background-color: #1c1b1f;
|
|
border: 0.2rem solid rgba(70, 68, 89, 0.9);
|
|
border-radius: 1rem;
|
|
color: #e5e1e6;
|
|
padding: .2em;
|
|
font-family: 'Torus';
|
|
margin: 1rem; }
|
|
|
|
calendar {
|
|
padding: 0.5rem; }
|
|
calendar * {
|
|
padding: 0.1rem;
|
|
color: #c6c0ff; }
|
|
calendar :selected {
|
|
color: #260f98;
|
|
font-weight: bolder;
|
|
background-color: #c6c0ff;
|
|
border-radius: 0.5rem; }
|
|
calendar .header {
|
|
color: #e5e1e6; }
|
|
calendar .button {
|
|
color: #e5e1e6; }
|
|
calendar :indeterminate {
|
|
color: #e5e1e6; }
|
|
|
|
.bar-system .bar-sides {
|
|
transition: 500ms cubic-bezier(0.05, 0.7, 0.1, 1);
|
|
margin: 0.25rem;
|
|
border-radius: 1.5rem;
|
|
padding: 0 1rem; }
|
|
|
|
.hovered.bar-system .bar-sides {
|
|
background-image: linear-gradient(45deg, rgba(0, 0, 0, 0) 60%, #585860 60%);
|
|
background-size: 400% auto;
|
|
background-color: #47464e;
|
|
background-position: 60% 50%; }
|
|
|
|
tooltip {
|
|
background-color: transparent;
|
|
border: none; }
|
|
tooltip > * > * {
|
|
background-color: #1c1b1f;
|
|
border-radius: 1.5rem;
|
|
color: #e5e1e6;
|
|
padding: 1rem;
|
|
margin: 0.5rem;
|
|
box-shadow: 0.25rem 0 0.25rem 0 #1c1b1f; }
|
|
|
|
.musicbox {
|
|
margin-top: -5rem;
|
|
margin-bottom: 0.01rem;
|
|
margin-left: 1rem; }
|
|
|
|
.musicbox-bar {
|
|
min-height: 0.155rem;
|
|
min-width: 1rem;
|
|
padding: 0rem;
|
|
border-radius: 10rem; }
|
|
.musicbox-bar trough {
|
|
background-color: transparent; }
|
|
.musicbox-bar progress {
|
|
min-height: 0.155rem;
|
|
min-width: 2rem;
|
|
margin: 0rem 0.137rem;
|
|
border-top-left-radius: 10rem;
|
|
border-top-right-radius: 10rem;
|
|
background-color: #464459; }
|
|
|
|
.systray-icon {
|
|
margin-right: 0.5rem;
|
|
margin-left: 0.25rem; }
|
|
|
|
menu {
|
|
background: #080809;
|
|
border-radius: 12px;
|
|
border: 2px solid #2a2935;
|
|
margin-top: 2rem;
|
|
padding: 1rem 0;
|
|
color: #e5e1e6; }
|
|
|
|
menu > menuitem {
|
|
padding: 0.4em 1.5rem;
|
|
background: transparent;
|
|
transition: 0.2s ease background; }
|
|
|
|
menu > menuitem:hover {
|
|
background: rgba(255, 255, 255, 0.4); }
|
|
|
|
menu > menuitem check:checked ~ label {
|
|
color: #e5e1e6;
|
|
font-weight: 600; }
|
|
|
|
menubar > menuitem {
|
|
margin-left: 0.6rem; }
|