Gnome-shell.css

avatar
Apathetic
css
a year ago
10 kB
30
Indexable
/* SMOOTH43 */

/* colors */
/* accent_bg: #1a181e */
/* hover_bg: #4f5761 */
/* accent_fg: #ffffff */
/* slider_red: #bb6271 */

.workspace-background{
  border: 1px solid rgba(255, 255, 255, 0.03);
}

#panel{
  background-color: transparent;
  margin: 2px;
  height: 38px;
}
.workspace-animation{ background-color: #0f0f0f; }
.panel-button,
.clock,
.clock-display StIcon{
color: #e0def4;
  border-radius: 14px;
  border: 3px solid transparent;
  background-color: #191724;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.clock-display StIcon{
  padding: 8px;
  margin: 0;
}
.panel-button:hover,
.panel-button:hover .clock{
color: #000000;
  background-color: #c4a7e7;
}
.panel-button:active,
.panel-button:overview, /* #c4a7e7 activites */
.panel-button:active .clock{
  background-color: #c4a7e7;
  color: #000000;
}
/* clock fix */
.clock-display{
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
.clock{
  margin: 0 !important;
}

/* POPOVERS */
.popup-menu-content{
  padding: 16px;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.03);
}
.popup-menu-item{

  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.popup-menu-item:hover{
  background-color: #eb6f92;
  color: #eb6f92;
}

.popup-menu-item:active{
  background-color: #c4a7e7;
  color: #ffffff;
}
.popup-sub-menu{
background-color: #eb6f92;
  color: black;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.popup-sub-menu .popup-menu-item{
background-color: #eb6f92;
  color: black;
  box-shadow: none;
}

/* calendar */
#calendarArea{ padding: 0; }
.datemenu-calendar-column{ margin: 0px; }
.pager-button:hover,
.pager-button:focus{
  background-color: #595959;
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
/* calendar-days */
.calendar-day-base{ 
color: #f0ead2;
border-radius: 10px; }
.calendar-month-label{
  color: #eb6f92;
  }
.calendar-day-base:hover,
.calendar-day-base:focus,
.calendar-day-base:active:hover,
.calendar-day-base:selected:hover{
  background-color: #eb6f92;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.calendar-day-base:active,
.calendar-day-base:selected{
  
  background-color: #d2869b;
  color: black;
}
.calendar-today,
.calendar-today:selected{
  box-shadow: inset 0 0 0 2px #c4a7e7;
  background-color: #c4a7e7;
  
}
.calendar-day-with-events{ font-weight: 800; }
/* events */
.calendar{
  border-radius: 11px;
  background-color: #27243A;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03) !important;
}
.events-button,
.world-clocks-button,
.weather-button{
background-color: #27243A;
color: #f0ead2;
  border-radius: 11px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.events-button:active,
.world-clock-button:active,
.weather-button:active{
  background-color: #c4a7e7;
  color: #ffffff;
}

/* message-list */
.message-list{
  border: none;
  padding: 5px 0 0 5px;
}
.message{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.message-close-button{
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.message-close-button:active{
  background-color: #000000;
  color: #ffffff;
}

.message-media-control:hover{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.message-media-control:active{
  background-color: #000000;
  color: #ffffff;
}

.toggle-switch{
  background-image: url("./toggle10-on.svg");
  background-color: transparent;
  border-radius: 10px;
}
.toggle-switch:checked{
  background-image: url("./toggle10-off.svg");
  background-color: #000000;
}
.dnd-button:hover{
  background-color: #595959 !important;
  border: 1px solid transparent !important;
}
.dnd-button{
  width: 48px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.03);
  background-color: #474747;
  /* box-shadow: 0 2px 5px -4px black !important; */
  box-shadow: none !important;
}

.button{
color: #C3C7D1;
  background-color: #282828;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03); 
}
.button:insensitive{
  box-shadow: none;
}
.button:inactive{
 
}
.button:active{
  background-color: #2A243A;
  color: #C3C7D1;
}
.message-list-clear-button{ border-radius: 10px; }

/* quick-settings */
.icon-button{ box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03); }
.quick-settings{
  padding: 20px;
  border-radius: 24px;
}
.quick-toggle{ 
color: #f0ead2;
border-radius: 12px; }
.quick-toggle-arrow { border-radius: 0 12px 12px 0; }
.quick-slider .icon-button{ box-shadow: none; }
.quick-slider .icon-button:hover{ 
  background-color: #191724;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.quick-slider .icon-button:active{
  background-color: #c4a7e7;
  color: #ffffff;
}
.quick-toggle-menu{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}


/* NOTIFICATIONS */
.notification-banner{
background-color: #1c2021;
color: #f0ead2;

  
}
.notification-button{
background-color: #c4a7e7;
  border-radius: 10px !important;
  margin: 6px !important;
 
}
.notification-button:active{
  background-color: #c4a7e7;
  color: #ffffff;
}

.slider,
.level {
  height: 16px;
  -barlevel-height: 16px;
  -barlevel-background-color: #595959;
  /* fill */
  -barlevel-active-background-color: #c4a7e7;
  /* overfill */
  -barlevel-overdrive-color: #bb6271;
  -barlevel-overdrive-separator-width: 2px;
  -slider-handle-radius: 7px;
}

/* overview-ws-thumbnail */
.workspace-thumbnail{
  background-color: #595959;
  border: none;
  border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, 0.03);
  background-image: url('/home/demeter/.config/background');
  background-size: cover;
}
.workspace-thumbnail-indicator {
  border-color: #c4a7e7;
  border-width: 3px;
  border-radius: 12px;
}

/* APP-GRID */
.app-well-app:hover .overview-icon,
.app-well-app:focus .overview-icon,
.app-well-app:selected .overview-icon,
.app-well-app.app-folder .overview-icon{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.app-well-app.app-folder:active .overview-icon,
.app-well-app:active .overview-icon{
  background-color: #c4a7e7;
  color: #ffffff;
}

/* DASH */
#dash .dash-background{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.dash-label {
  background-color: #303030;
  border-radius: 11px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.app-well-app-running-dot{
  width: 10px;
  height: 5px;
  border-radius: 4px;
}
.show-apps:hover .overview-icon,
.show-apps:focus .overview-icon,
.show-apps:selected .overview-icon{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.show-apps:active .overview-icon,
.show-apps:checked .overview-icon,
#dash .app-well-app:active .overview-icon{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  background-color: #c4a7e7;
  color: #ffffff;
}

/* folder */
.app-folder-dialog{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.edit-folder-button{
  border-radius: 12px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.edit-folder-button:active{
  background-color: #c4a7e7;
  color: #ffffff;
}

/* SEARCH */
StEntry{
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.03);
}
StEntry:hover, StEntry:focus, StEntry:active{
  border: 1px solid #c4a7e7;
  box-shadow: inset 0 0 0 1px #c4a7e7;
}

.search-section-content{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  border-radius: 17px;
}

.list-search-result:focus, .search-provider-icon:focus,
.list-search-result:hover, .search-provider-icon:hover,
.list-search-result:selected, .search-provider-icon:selected{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.list-search-result:active, .search-provider-icon:active{
  background-color:#c4a7e7;
  color: #ffffff;
}

/* OSD */
.modal-dialog{
  border-radius: 16px;
  background-color: #272727;
  border: 1px solid rgba(255, 255, 255, 0.03);
  color: #f0ead2;
}
.switcher-list,
.resize-popup,
.workspace-switcher,
.osd-window{
  border-radius: 22px;
  box-shadow: 0 8px 8px 0 rgba(0,0,0,0.1);
  border: 1px solid rgba(255, 255, 255, 0.03);
}
.ws-switcher-indicator{
  height: 10px;
  width: 10px;
}
.switcher-list .item-box:hover,
.switcher-list .item-box:focus,
.switcher-list .item-box:selected{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.modal-dialog-linked-button {
  padding: 10px 0 !important;
  margin: 12px !important;
  border-radius: 10px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
  background-color: #eb6f92;
  
}
.modal-dialog-linked-button:focus{
  box-shadow: inset 0 0 0 2px #c4a7e7;
  background-color: #c4a7e7;
}
.modal-dialog-linked-button:active{
  background-color: #c4a7e7;
  color: #ffffff;
}
.nm-dialog-scroll-view{
  border: 1px solid rgba(255, 255, 255, 0.03);
}
.nm-dialog-item:selected{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

/*  */
.level-bar{ background-color: #595959; }
/*  ------------------------------------------------------------ */

.popup-menu-content {
 color: #f0ead2;
  background: #17181a;
 }
  
  .system-menu-action {
  color: #C3C7D1;
  border-radius: 32px;
  /* wish we could do 50% */
  border: 1px solid #1b1c24;
  background: #191724;
  padding: 13px; }
  
  .window-close {
  background-color: #191724;
  color: #cfd2da;
  border-radius: 21px;
  border: 2px solid #1b1c24;
  padding: 3px;
  height: 28px;
  width: 28px;
  box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.5);
  transition-duration: 300ms; }
  
  .window-caption {
  spacing: 20px;
  color: #c4a7e7;
  background-color: #191724;
  border: 1px solid #1b1c24;
  padding: 4px 8px; }
  
  .dash-background {
  background-color: #191724; }
  
  .app-folder-dialog {
  background-color: #191724;
  border: none; }
  
   #dashtodockContainer #dash .dash-background {
    background: #191724 !important;
    border: none; }
    
 





.icon-button:active{ 
color: #191724;
background-color: #eb6f92; }



.quick-toggle:checked{ 
color: #191724;
background-color: #eb6f92; }



.quick-slider .icon-button:active{
color: #191724;
background-color: #ed8796; }


.icon-button{
  background-color: #e78284;
}
.icon-button:hover{ background-color: #d2869b; }




.quick-slider .icon-button:hover{ 
  background-color: #e78284;
  color: white;
}

.quick-toggle-menu{
 
  background-color: #e78284;
  color: white;
}
.quick-toggle-menu .header .icon{ background-color: #d2869b; box-shadow: inset 0 0 0 2px black; }
Editor is loading...
Leave a Comment