hyprcrux/.config/ags/scss/_lib_classes.scss

.test {
    background-image: linear-gradient(
        45deg, #f4d609 0%, #f4d609 10%, #212121 10%, #212121 20%, #f4d609 20%, #f4d609 30%, #212121 30%, 
        #212121 40%, #f4d609 40%, #f4d609 50%, #212121 50%, #212121 60%, #f4d609 60%, 
        #f4d609 70%, #212121 70%, #212121 80%, #f4d609 80%, #f4d609 90%, #212121 90%, #212121 100%
    );
    background-repeat: repeat;
}

.test-size {
    min-height: 3rem;
    min-width: 3rem;
}

.txt-title {
    @include titlefont;
    font-size: 2.045rem;
}

.txt-title-small {
    @include titlefont;
    font-size: 1.364rem;
}

.techfont {
    @include techfont;
}

.txt-reading {
    @include readingfont;
}

.no-anim {
    @include noanim;
}

.txt {
    color: $onBackground;
}

.txt-primary {
    color: $primary;
}

.txt-onSecondaryContainer {
    color: $onSecondaryContainer;
}

.txt-onSurfaceVariant {
    color: $onSurfaceVariant;
}

.txt-onLayer1 {
    color: $onLayer1;
}

.txt-shadow {
    text-shadow: 1px 2px 8px rgba(0, 0, 0, 0.69);
    margin: 10px;
}

.txt-gigantic {
    @include mainfont;
    font-size: 3rem;
}

.txt-massive {
    @include mainfont;
    font-size: 2.7273rem;
}

.txt-hugerass {
    @include mainfont;
    font-size: 2.045rem;
}

.txt-hugeass {
    @include mainfont;
    font-size: 1.8182rem;
}

.txt-larger {
    @include mainfont;
    font-size: 1.6363rem;
}

.txt-large {
    //16pt
    @include mainfont;
    font-size: 1.4545rem;
}

.txt-norm {
    //14pt
    @include mainfont;
    font-size: 1.2727rem;
}

.txt-small {
    //12pt
    @include mainfont;
    font-size: 1.0909rem;
}

.txt-smallie {
    //11pt
    @include mainfont;
    font-size: 1rem;
}

.txt-smaller {
    //10pt
    @include mainfont;
    font-size: 0.9091rem;
}

.txt-tiny {
    @include mainfont;
    font-size: 0.7273rem;
}

.txt-poof {
    font-size: 0px;
}

.txt-subtext {
    @include subtext;
}

.txt-action {
    @include actiontext;
}

.txt-thin {
    font-weight: 300;
}

.txt-semibold {
    font-weight: 500;
}

.txt-bold {
    font-weight: bold;
}

.txt-italic {
    font-style: italic;
}

.btn-primary {
    @include full-rounding;
    background-color: $primary;
    color: $onPrimary;
    padding: 0.682rem 1.023rem;
}

.titlefont {
    @include titlefont;
}

.mainfont {
    @include mainfont;
}

.icon-material {
    @include icon-material;
}

.icon-nerd {
    @include icon-nerd;
}

.separator-line {
    background-color: mix($subtext, $surface, 50%);
    min-width: 0.068rem;
    min-height: 0.068rem;
}

.separator-circle {
    @include full-rounding;
    background-color: $outline;
    margin: 0rem 0.682rem;
    min-width: 0.273rem;
    min-height: 0.273rem;
}

.spacing-h-3 > * {
    margin-right: 0.205rem;
}

.spacing-h-3 > *:last-child {
    margin-right: 0rem;
}

.spacing-v-3 > * {
    margin-bottom: 0.205rem;
}

.spacing-v-3 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-v-15 > * {
    margin-bottom: 1.023rem;
}

.spacing-v-15 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-h-15 > * {
    margin-right: 1.023rem;
}

.spacing-h-15 > *:last-child {
    margin-right: 0rem;
}

.spacing-h-15 > revealer > * {
    margin-right: 1.023rem;
}

.spacing-h-15 > revealer:last-child > * {
    margin-right: 0rem;
}

.spacing-h-15 > scrolledwindow > * {
    margin-right: 1.023rem;
}

.spacing-h-15 > scrolledwindow: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 > * {
    margin-bottom: 0.341rem;
}

.spacing-v-5 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-v-5-revealer > revealer > * {
    margin-bottom: 0.341rem;
}

.spacing-v-5-revealer > revealer:last-child > * {
    margin-bottom: 0rem;
}

.spacing-v-5-revealer > scrolledwindow > * {
    margin-bottom: 0.341rem;
}

.spacing-v-5-revealer > scrolledwindow:last-child > * {
    margin-bottom: 0rem;
}

.spacing-h-4 > * {
    margin-right: 0.273rem;
}

.spacing-h-4 > *:last-child {
    margin-right: 0rem;
}

.spacing-h-4 > overlay > *:first-child {
    margin-right: 0.273rem;
}

.spacing-h-4 > overlay:last-child > * {
    margin-right: 0rem;
}

.spacing-h-5 > * {
    margin-right: 0.341rem;
}

.spacing-h-5 > *:last-child {
    margin-right: 0rem;
}

.spacing-h-5 > widget > * {
    margin-right: 0.341rem;
}

.spacing-h-5 > widget:last-child > * {
    margin-right: 0rem;
}

.spacing-h-5 > revealer > * {
    margin-right: 0.341rem;
}

.spacing-h-5 > revealer:last-child > * {
    margin-right: 0rem;
}

.spacing-h-5 > scrolledwindow > * {
    margin-right: 0.341rem;
}

.spacing-h-5 > scrolledwindow:last-child > * {
    margin-right: 0rem;
}

.spacing-v-minus5 > * {
    margin-bottom: -0.341rem;
}

.spacing-v-minus5 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-h-10 > * {
    margin-right: 0.682rem;
}

.spacing-h-10 > *:last-child {
    margin-right: 0rem;
}

.spacing-h-10 > revealer > * {
    margin-right: 0.682rem;
}

.spacing-h-10 > revealer:last-child > * {
    margin-right: 0rem;
}

.spacing-h-10 > scrolledwindow > * {
    margin-right: 0.682rem;
}

.spacing-h-10 > scrolledwindow:last-child > * {
    margin-right: 0rem;
}

.spacing-h-10 > flowboxchild > * {
    margin-right: 0.682rem;
}

.spacing-h-10 > flowboxchild:last-child > * {
    margin-right: 0rem;
}

.spacing-v-10 > * {
    margin-bottom: 0.682rem;
}

.spacing-v-10 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-h-20 > * {
    margin-right: 1.364rem;
}

.spacing-h-20 > *:last-child {
    margin-right: 0rem;
}

.spacing-v-20 > * {
    margin-bottom: 1.364rem;
}

.spacing-v-20 > *:last-child {
    margin-bottom: 0rem;
}

.anim-enter {
    @include anim-enter;
}

.anim-exit {
    @include anim-exit;
}

.button-minsize {
    @include button-minsize;
}

.margin-right-5 {
    margin-right: 0.341rem;
}

.margin-left-5 {
    margin-left: 0.341rem;
}

.margin-top-5 {
    margin-top: 0.341rem;
}

.margin-bottom-5 {
    margin-bottom: 0.341rem;
}

.margin-right-10 {
    margin-right: 0.682rem;
}

.margin-left-10 {
    margin-left: 0.682rem;
}

.margin-top-10 {
    margin-top: 0.682rem;
}

.margin-bottom-10 {
    margin-bottom: 0.682rem;
}

.margin-bottom-8 { // wtf
    margin-bottom: 0.545rem;
}

.margin-right-15 {
    margin-right: 1.023rem;
}

.margin-left-15 {
    margin-left: 1.023rem;
}

.margin-top-15 {
    margin-top: 1.023rem;
}

.margin-bottom-15 {
    margin-bottom: 1.023rem;
}

.width-10 {
    min-width: 0.682rem;
}

.height-10 {
    min-width: 0.682rem;
}

.invisible {
    opacity: 0;
    background-color: transparent;
    color: transparent;
}

.spacing-h--5 > box {
    margin-right: -0.341rem;
}

.spacing-h--5 > box:last-child {
    margin-right: 0rem;
}

.spacing-v--5 > * {
    margin-bottom: -0.341rem;
}

.spacing-v--5 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-h--10 > * {
    margin-left: -1.364rem;
}

.spacing-h--10 > *:first-child {
    margin-left: 0rem;
}

.spacing-v--10 > * {
    margin-bottom: -0.682rem;
}

.spacing-v--10 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-v--10 > * {
    margin-bottom: -0.682rem;
}

.spacing-v--10 > *:last-child {
    margin-bottom: 0rem;
}

.spacing-h--20 > * {
    margin-left: -1.364rem;
}

.spacing-h--20 > *:first-child {
    margin-left: 0rem;
}

.instant {
    transition: 0ms;
}

.menu-decel {
    @include menu_decel;
}
.element-show {
    @include element_easeInOut;
}
.element-hide {
    @include element_easeInOut;
}
.element-move {
    @include element_easeInOut;
}
.element-decel {
    @include element_decel;
}
.element-bounceout {
    @include element_bounceOut;
}
.element-accel {
    @include element_accel;
}