ui/style/style.css
2024-09-25 11:09:57 -07:00

321 lines
9.1 KiB
CSS

.lock-ready > box box {
background: #161616;
padding: 20px;
border: 10px solid #33B1FF;
min-width: 300px;
margin: 15px; }
.lock-ready > box .img {
background: url("/home/catalie/.config/wallpaper");
min-width: 300px;
min-height: 300px;
background-position: 25% 12.5%;
background-size: cover; }
.lock-ready > box box > entry {
background: #262626;
font-size: 14px;
padding: 5px;
margin: 10px; }
.lock {
background: transparent; }
* :not(selection) :not(tooltip) {
all: unset; }
#status-bar {
background-color: #161616;
border-radius: 0 10px 10px 0; }
#status-bar .dial-container {
margin-top: 10px; }
#status-bar .dial-container .battery-dial {
color: #42be65;
background-color: #161616;
margin: 0px;
padding: 0px;
font-size: 5px; }
#status-bar .dial-container .battery-dial .dial-icon {
font-family: 'Symbols Nerd Font Mono';
font-size: 16px;
color: #f2f4f8; }
#status-bar .dial-container .volume-dial {
color: #33B1FF;
background-color: #161616;
margin: 0px;
padding: 0px;
font-size: 5px; }
#status-bar .dial-container .volume-dial .dial-icon {
font-family: 'Symbols Nerd Font Mono';
font-size: 16px;
color: #f2f4f8; }
#status-bar .dial-container .brightness-dial {
color: #33B1FF;
background-color: #161616;
margin: 0px;
padding: 0px;
font-size: 5px; }
#status-bar .dial-container .brightness-dial .dial-icon {
font-family: 'Symbols Nerd Font Mono';
font-size: 16px;
color: #f2f4f8; }
#status-bar .workspace-container {
background-color: #262626;
border-radius: 10px;
padding: 6px 0px;
margin: 0px 12px;
border: none; }
#status-bar .workspace-container .ws-norm {
min-width: 15px;
border-radius: 10px;
margin: 2px 5px;
padding: 6px 10px;
background-color: #161616;
color: #f2f4f8; }
#status-bar .workspace-container .ws-active {
color: #161616;
background-color: #FF7EB6; }
#status-bar .menu-visibility-button {
border-radius: 0px 10px 10px 0px;
padding: 10px 0px 10px 2px;
background-color: #262626; }
#status-bar .clock {
background-color: #262626;
margin: 8px;
margin-bottom: 10px;
padding: 6px 2px;
border-radius: 10px; }
#status-bar .mpd-controls .button {
font-size: 14px;
margin: 2px;
margin-bottom: 8px;
font-family: 'Symbols Nerd Font Mono'; }
#status-bar .mpd-controls .button:hover {
color: #FF7EB6; }
#status-bar {
background: transparent; }
#status-bar .workspaces {
min-height: 50px;
background: #161616;
padding: 5px;
padding-top: 15px; }
#status-bar .workspaces .workspace {
min-width: 10px;
min-height: 10px;
margin: 5px;
background-color: #262626; }
#status-bar .workspaces .occupied {
background-color: #393939; }
#status-bar .workspaces .focused {
background-color: #FF7EB6; }
#status-bar .media-controls {
margin-top: 20px;
min-width: 220px; }
#status-bar .media-controls .button {
font-size: 20px; }
#status-bar .progress-bar {
margin-top: 20px;
min-width: 200px;
min-height: 2px;
background: transparent; }
#status-bar .progress-bar trough {
min-height: 2px;
background: #262626; }
#status-bar .progress-bar highlight {
min-height: 2px;
background: #FF7Eb6; }
#status-bar .right {
min-height: 50px;
background: #161616; }
#status-bar .right .battery-container {
padding-left: 10px;
padding-right: 10px; }
#status-bar .right .battery-container .battery-dial {
color: #42be65;
background-color: #161616;
margin: 0px;
padding: 0px;
font-size: 5px; }
#status-bar .right .battery-container .battery-dial .dial-icon {
font-family: 'Symbols Nerd Font Mono';
font-size: 16px;
color: #f2f4f8; }
#status-bar .right .sliderbox {
margin: 5px; }
#status-bar .right .sliderbox .volume .slider trough {
min-height: 10px;
min-width: 120px;
background: #262626; }
#status-bar .right .sliderbox .volume .slider highlight {
background: #33B1FF; }
#status-bar .right .sliderbox .volume button {
font-size: 20px;
margin: 5px; }
#status-bar .right .sliderbox .brightness .slider trough {
min-height: 10px;
min-width: 120px;
background: #262626; }
#status-bar .right .sliderbox .brightness .slider highlight {
background: #33B1FF; }
#status-bar .right .sliderbox .brightness button {
font-size: 20px;
margin: 5px; }
#status-bar .right separator {
background: #262626;
padding: 1px;
margin-top: 10px;
margin-bottom: 10px; }
#status-bar .right .clock {
background: #161616; }
#status-bar .right .clock .datetime {
margin: 1px;
font-size: 10pt; }
#status-bar .Menu {
background-color: #262626;
min-width: 640px; }
#status-bar .Menu .mpd-controls {
background-color: #161616;
border-radius: 10px;
margin: 10px; }
#status-bar .Menu .mpd-controls .button {
font-size: 24px;
padding: 10px;
margin: 10px;
background-color: #262626;
border-color: #262626;
border-radius: 10px; }
#status-bar .Menu .mpd-controls .cover {
min-width: 250px;
min-height: 250px;
border-radius: 10px;
margin: 10px;
background: #161616;
background-size: cover; }
#status-bar .Menu .mpd-controls .title {
padding-top: 10px;
font-size: 20px;
font-weight: bold; }
#status-bar .Menu .mpd-controls .position {
margin: 10px;
margin-right: 20px;
min-height: 10px;
border-radius: 5px; }
#status-bar .Menu .mpd-controls .position trough {
background: #262626;
border-radius: 5px;
min-height: 10px; }
#status-bar .Menu .mpd-controls .position slider {
min-height: 10px;
border-radius: 5px;
background: #FF7Eb6; }
#status-bar .Menu .mpd-controls .position-label {
margin-top: 75px; }
#status-bar .Menu .dial-parent {
color: #FF7eb6;
background-color: #161616;
margin: 0px;
padding: 10px;
font-size: 8px;
margin-left: 10px;
border-radius: 10px;
border-radius: 10px; }
#status-bar .Menu .dial-parent .dial-icon {
font-family: 'Symbols Nerd Font Mono';
font-size: 32px;
color: #f2f4f8; }
#status-bar .Menu .dial-parent .resource-dial {
min-width: 96px;
min-height: 96px; }
#status-bar .Menu .dial-parent .dial-icon {
color: #f2f4f8; }
#notifications {
background: transparent; }
.notifications {
opacity: 1;
min-width: 24rem; }
.notifications .revealer + .revealer > * > box {
margin-top: 0; }
.notifications .revealer .notification {
margin-bottom: 25px;
min-width: 24rem;
padding: 0px;
border: 1px solid #f2f4f8;
border-right: none;
background: #161616; }
.notifications .revealer .urgency-indicator {
min-width: 15px;
margin-bottom: 25px; }
.notifications .revealer .urgency-indicator.normal, .notifications .revealer .urgency-indicator.low {
background: #42be65;
border: 1px solid #42be65; }
.notifications .revealer .urgency-indicator.urgent {
background: #FF7EB6;
border: 1px solid #FF7EB6; }
.notifications .revealer .body {
margin-right: 1em; }
.notifications .revealer .timeout-bar {
background: #262626; }
.notifications .revealer .timeout-bar > trough > progress {
background-image: none;
background-color: #33B1FF; }
.notifications .revealer .button {
font-size: 20px;
margin-left: 5px;
margin-right: 5px; }
.notifications .revealer .button:hover {
color: #FF7EB6; }
.notifications .revealer .icon {
min-width: 68px;
min-height: 68px;
margin: 5px; }
.notifications .revealer .icon image {
font-size: 58px;
margin: 5px;
color: #f2f4f8; }
.notifications .revealer .icon box {
min-width: 68px;
min-height: 68px; }
.notifications .revealer .title {
font-size: 28px;
padding-right: 5px; }
.notifications .revealer .actions .action-button {
margin: 0 .4em;
margin-top: .8em;
border: 2px solid #f2f4f8; }
.notifications .revealer .actions .action-button:first-child {
margin-left: .5em; }
.notifications .revealer .actions .action-button:last-child {
margin-right: .5em; }
.launcher {
min-width: 640px;
background: #262626; }
.launcher .search > image {
margin-left: 10px; }
.launcher .search > entry {
padding: 5px;
margin: 10px;
background: #161616;
border: 5px solid #161616;
border-radius: 10px;
font-size: 32px; }
.launcher .entry {
margin: 0 10px 0 10px;
border: 10px solid #161616;
border-radius: 10px;
background: #161616; }
.launcher .entry > box > image {
padding: 5px;
margin: 5px 10px 5px 10px;
background: #262626;
border-radius: 5px; }
.launcher > scrolledwindow > * > box:last-child {
margin-bottom: 10px; }
* :not(selection) :not(tooltip) {
all: unset; }