pho-earth-adaptive/gtk-4.0/gtk.css

@import "../gtk-common/common.css";


* {
  padding: 0;
/*  -GtkToolButton-icon-spacing: 4;
  -GtkTextView-error-underline-color: @error_color_breeze;
  -GtkScrolledWindow-scrollbar-spacing: 0;
  -GtkToolItemGroup-expander-size: 11;
  -GtkWidget-text-handle-width: 20;
  -GtkWidget-text-handle-height: 24;
  -GtkDialog-button-spacing: 4;
  -GtkDialog-action-area-border: 0;
  outline-color: alpha(currentColor,0.4);
  outline-style: dashed;
  outline-offset: -3px;
  outline-width: 1px;
  -gtk-outline-radius: 2px;
  -gtk-secondary-caret-color: @theme_selected_bg_color_breeze;*/ }



/***************
 * Base States *
 ***************/
*:disabled {
  -gtk-icon-filter: opacity(0.5); }


/**********************
 * General Typography *
 **********************/
.large-title {
  font-weight: 300;
  font-size: 24pt; }

.title-1 {
  font-weight: 800;
  font-size: 20pt; }

.title-2 {
  font-weight: 800;
  font-size: 15pt; }

.title-3 {
  font-weight: 700;
  font-size: 15pt; }

.title-4 {
  font-weight: 700;
  font-size: 13pt; }

.heading {
  font-weight: 700;
  font-size: 11pt; }

.body {
  font-weight: 400;
  font-size: 11pt; }

.caption-heading {
  font-weight: 700;
  font-size: 9pt; }

.caption {
  font-weight: 400;
  font-size: 9pt; }

/****************
 * Text Entries *
 ****************/

/***********
 * Buttons *
 ***********/
@keyframes needs_attention {
  from {
    background-image: radial-gradient(@theme_selected_bg_color_breeze, @theme_selected_bg_color_breeze 1%, alpha(@theme_selected_bg_color_breeze, 0)); }
  to {
    background-image: radial-gradient(@theme_selected_bg_color_breeze, @theme_selected_bg_color_breeze 70%, alpha(@theme_selected_bg_color_breeze, 0)); } }


notebook > header > tabs > arrow:hover,
  button:hover {
    -gtk-icon-filter: brightness(1.2); 
  }



/************
 * Toolbars *
 ************/


/***************
 * Header bars *
 ***************/

 

window.csd > .titlebar:not(headerbar) {
  padding: 0;
  background-color: transparent;
  background-image: none;
  border-style: none;
  border-color: transparent;
  box-shadow: none; }





/**************
 * Tree Views *
 **************/


/*********
 * Menus *
 *********/


/**************
 * Scrollbars *
 **************/

/*how to prevent autohide in GTK4?
  and how to force scroll buttons? This last thing may not be possible... CSS nodes don't show buttons anymore

/**********
 * Switch *
 **********/


/************
 * GtkScale and some common progressbar parts*
 ************/


/**********
 * Frames *
 **********/



/***********
 * Dialogs *
 ***********/








/****************
 * File chooser *
 ****************/




/********
 * Misc *
 ********/

  .content-view:hover {
    -gtk-icon-filter: brightness(1.2); }






/**********************
 * Window Decorations *
 *********************/

/* this part still needs a lot of work */

/* disabled: gtk3 to gtk4
decoration {
  border-radius: 5px 5px 5px 5px;
  border-width: 0px;
  box-shadow: 0px 15px 38px -15px alpha(black, 0.9), 
  			0px 10px 20px -5px alpha(black, 0.9), 
  			0px 0px 0px 1px alpha(black, 0.2),
  			0 0 0 1px @theme_header_bg;
  margin: 10px; }
  decoration:backdrop {
    box-shadow: 0px 15px 38px -15px alpha(black, 0.2), 
    		0px 10px 20px -5px alpha(black, 0.6), 
    		0px 0px 0px 1px alpha(black, 0.2),
    		0 0 0 1px transparent;
    transition: 80ms ease-out; }
    
*/
window.csd {
        border-radius: 5px 5px 5px 5px;
        border-width: 0px;
  box-shadow: 0px 7px 19px -7px alpha(black, 0.9), 
  		0px 5px 10px -3px alpha(black, 0.9), 
  		0px 0px 0px 1px alpha(black, 0.2),
  		0 0 0 1px @theme_titlebar_background_breeze;
}

window.csd:backdrop {
    box-shadow: 0px 7px 19px -7px alpha(black, 0.2), 
    		0px 5px 10px -3px alpha(black, 0.6), 
    		0px 0px 0px 1px alpha(black, 0.2),
    		0 0 0 1px transparent;
        transition: 80ms ease-out;
}

/* disabled: gtk3 to gtk4
  .maximized decoration,
  .fullscreen decoration,
  .tiled decoration,
  .tiled-top decoration,
  .tiled-right decoration,
  .tiled-bottom decoration,
  .tiled-left decoration {
    border-radius: 0; }
*/

window.maximized,
window.fullscreen,
window.tiled, window.tiled-top,
window.tiled-left,
window.tiled-right,
window.tiled-bottom {
  border-radius: 0;
}


  window.csd.popup, window.csd.dialog.message, window.csd.solid-csd
   { 
    box-shadow: 0 4px 8px 0px alpha(black, 0.7); }

/*
  .csd.popup decoration {
    border-radius: 0;
    box-shadow: 0px 0px 12px 0px alpha(black, 0.1), 0px 0px 4px 0px alpha(black, 0.4), 0px 0px 0px 1px alpha(black, 0.1); }
  tooltip.csd decoration {
    border-radius: 5px;
    box-shadow: 0 4px 8px -4px alpha(black, 0.23); }
  messagedialog.csd decoration {
    border-radius: 5px;
    box-shadow: 0px 0px 12px 0px alpha(black, 0.1), 0px 0px 4px 0px alpha(black, 0.4), 0px 0px 0px 1px alpha(black, 0.1); }
  .solid-csd decoration {
    margin: 0;
    padding: 4px;
    background-color: @borders;
    border: solid 1px @borders;
    border-radius: 0;
    box-shadow: inset 0 0 0 3px @theme_base_color_breeze, inset 0 1px @wm_highlight; }
    .solid-csd decoration:backdrop {
      box-shadow: inset 0 0 0 3px @theme_bg_color_breeze, inset 0 1px @wm_highlight; }

*/
/*.background.csd {
  border-bottom-left-radius: 1px;
  border-bottom-right-radius: 1px; }*/

button.titlebutton {
  /*text-shadow: 0 1px alpha(white, 0.769231);
  -gtk-icon-shadow: 0 1px alpha(@text_shadow_color, 0.769231); */}
  button.titlebutton:backdrop {
    -gtk-icon-shadow: none; }

headerbar.selection-mode button.titlebutton,
.titlebar.selection-mode button.titlebutton {
  /*text-shadow: 0 1px alpha(black, 0.428024);
  -gtk-icon-shadow: 0 1px alpha(black, 0.428024);*/ }
  headerbar.selection-mode button.titlebutton:backdrop,
  .titlebar.selection-mode button.titlebutton:backdrop {
    -gtk-icon-shadow: none; }