Files
apex/templates/sherlock/apex.css.j2

130 lines
3.1 KiB
Django/Jinja

{% macro rgb(hex) -%}
{%- set value = hex|replace('#', '') -%}
{{ value[0:2]|int(base=16) }}, {{ value[2:4]|int(base=16) }}, {{ value[4:6]|int(base=16) }}
{%- endmacro %}
/* {{ scheme }} - Sherlock Theme (Parser Compliant) */
/* 1. PALETTE DEFINITIONS */
@define-color apex_base {{ palette.background }};
@define-color apex_surface {{ ui.panel }};
@define-color apex_overlay {{ ui.border }};
@define-color apex_muted {{ ui.stealth }};
@define-color apex_text {{ palette.foreground }};
@define-color apex_love {{ palette.cursor }};
@define-color apex_foam {{ palette.info }};
@define-color apex_gold {{ palette.warning }};
/* 2. WINDOW & INPUT */
window {
background-color: @apex_base;
color: @apex_text;
border: 2px solid @apex_love;
border-radius: 10px;
padding: 6px;
}
entry {
background-color: @apex_surface;
color: @apex_text;
caret-color: @apex_love;
border: 1px solid @apex_overlay;
border-radius: 7px;
padding: 6px 9px;
margin-bottom: 6px;
}
entry:focus {
border-color: @apex_love;
box-shadow: 0 0 10px rgba({{ rgb(palette.cursor) }}, 0.2);
}
entry selection {
background-color: @apex_foam;
color: {{ palette.selection_fg }};
}
/* 3. LIST & SELECTION */
listview {
background-color: transparent;
}
/* The actual row selection - Informational */
listview > row:selected {
background-color: @apex_foam;
color: {{ palette.selection_fg }};
border-radius: 7px;
border: none;
outline: none;
}
/* 4. TILES (The Items) */
.tile, .launcher-tile, .launcher-item, .item {
background-color: @apex_surface;
color: @apex_text;
border-radius: 7px;
padding: 4px 10px;
margin-bottom: 4px;
}
/* When the ROW is selected, make the TILE transparent so info shows through */
listview > row:selected .tile,
listview > row:selected .launcher-tile,
listview > row:selected .item {
background-color: transparent;
color: {{ palette.selection_fg }};
}
/* Force TEXT on selection */
listview > row:selected label,
listview > row:selected .title,
listview > row:selected .description,
listview > row:selected .subtitle {
color: {{ palette.selection_fg }};
}
/* Force ICONS on selection */
listview > row:selected image,
listview > row:selected .icon {
color: {{ palette.selection_fg }};
}
/* 5. WIDGETS (Weather Fix without !important) */
.widget, .weather-widget, .music-widget {
background-color: @apex_surface;
border: 1px solid @apex_overlay;
color: @apex_text;
border-radius: 7px;
}
/* Specific overrides for weather internals */
.weather-widget box {
background-color: transparent;
}
.weather-widget label {
color: @apex_text;
}
/* Temperature info */
.weather-widget .temperature {
color: @apex_foam;
font-weight: 800;
}
.weather-widget .condition {
color: @apex_muted;
}
/* 6. SCROLLBARS */
scrollbar slider {
background-color: @apex_overlay;
min-width: 6px;
border-radius: 10px;
}
scrollbar slider:hover { background-color: @apex_love; }
progressbar progress {
background-color: @apex_love;
border-radius: 4px;
}