.control { @include rounding; background: $background; padding: 1rem; } .sliders { @include rounding; background: $background-alt; padding: 2rem; } .volscale trough { min-width: 8rem; min-height: 16px; background: rgba($comment, 0.4); @include rounding; } .volscale trough highlight { @include rounding; background: $green; } .brightscale trough { min-width: 8rem; min-height: 16px; background: rgba($comment, 0.4); @include rounding; } .brightscale trough highlight { @include rounding; background: $yellow; } .profile { padding: 0.5rem; } .profiletime { font-family: "Rubik"; font-size: 16px; } .music { @include rounding; min-height: 10rem; background-size: cover; background-position: center; } .music-g { background-image: linear-gradient(to right, rgba($background, 0.95) 30%, rgba($background, 0.5)); } .musicbutton { font-family: "Iosevka Nerd Font"; padding: 1rem; font-size: 30px; } .musicbuttons { background: $background-alt; padding: 0.5rem 1rem; @include rounding; } .profileexit { color: $red; font-size: 28px; border-radius: 10px; padding: 1rem 2rem 1rem 1.6rem; background: linear-gradient(to bottom right, rgba($red, 0.05), rgba($red, 0.03)); } .music-scale trough { min-width: 8rem; min-height: 10px; background: rgba($background-alt, 0); } .music-scale trough highlight { background: $magenta; } .musicinfo { font-family: "Rubik"; font-size: 16px; padding: 1rem; } .musicname { font-size: 18px; } .setbtn { font-family: Material Design Icons; background: rgba($comment, 0.2); @include rounding; padding: 1.7rem; font-size: 24px; } .active { background: $accent; color: $background; } .scaleicon { font-family: Material Design Icons; font-size: 18px; } .mono { font-size: 16px; font-family: "Iosevka Nerd Font"; } .buttons { background: $background-alt; padding: 16px; @include rounding; }