mirror of
https://github.com/vinceliuice/WhiteSur-gtk-theme.git
synced 2025-06-06 07:23:02 +00:00
update
This commit is contained in:
parent
d84b269e76
commit
4899be27a7
@ -21,7 +21,7 @@ $large-font-family: Roboto, "M+ 1c", Cantarell, Sans-Serif;
|
||||
// font sizes
|
||||
$root-font-size: if($laptop == 'false', 15px, 13px);
|
||||
$subheading-size: if($laptop == 'false', 17px, 15px);
|
||||
$base_font_size: if($laptop == 'false', 11, 10);
|
||||
$base_font_size: 11pt;
|
||||
|
||||
// opacities
|
||||
$higher_opacity: 0.9;
|
||||
|
@ -33,47 +33,47 @@ stage {
|
||||
|
||||
%large_title {
|
||||
font-weight: 300;
|
||||
@include fontsize(24);
|
||||
@include fontsize(24pt);
|
||||
}
|
||||
|
||||
%title_1 {
|
||||
font-weight: 800;
|
||||
@include fontsize(20);
|
||||
@include fontsize(20pt);
|
||||
}
|
||||
|
||||
%title_2 {
|
||||
font-weight: 800;
|
||||
@include fontsize(15);
|
||||
@include fontsize(15pt);
|
||||
}
|
||||
|
||||
%title_3 {
|
||||
font-weight: 700;
|
||||
@include fontsize(15);
|
||||
@include fontsize(15pt);
|
||||
}
|
||||
|
||||
%title_4 {
|
||||
font-weight: 700;
|
||||
@include fontsize(13);
|
||||
@include fontsize(13pt);
|
||||
}
|
||||
|
||||
%heading {
|
||||
font-weight: 700;
|
||||
@include fontsize(11);
|
||||
@include fontsize(11pt);
|
||||
}
|
||||
|
||||
%caption_heading {
|
||||
font-weight: 700;
|
||||
@include fontsize(9);
|
||||
@include fontsize(9pt);
|
||||
}
|
||||
|
||||
%caption {
|
||||
font-weight: 400;
|
||||
@include fontsize(9);
|
||||
@include fontsize(9pt);
|
||||
}
|
||||
|
||||
%smaller {
|
||||
font-weight: 400;
|
||||
@include fontsize(8);
|
||||
@include fontsize(8pt);
|
||||
}
|
||||
|
||||
%monospace { font-family: monospace; }
|
||||
|
@ -17,10 +17,13 @@
|
||||
@return round($em_value) / 1000 * 1em;
|
||||
}
|
||||
|
||||
// provide font size in rem, with px fallback
|
||||
@mixin fontsize($size: 24, $base: 16) {
|
||||
font-size: round($size) + pt;
|
||||
//font-size: ($size / $base) * 1rem;
|
||||
// Mixin to convert provided font size in pt to em units
|
||||
@mixin fontsize($size, $base: 16px, $unit: pt) {
|
||||
// if pt, convert into unitless value with the assumption: 1pt = 1.091px
|
||||
$adjusted_size: if($unit == pt, $size * 1.091, $size) * 1000;
|
||||
$rounded_size: round($adjusted_size / $base) / 1000;
|
||||
font-size: $rounded_size * 1em;
|
||||
// font-size: round($size) + pt;
|
||||
}
|
||||
|
||||
// Typography
|
||||
|
@ -33,7 +33,6 @@
|
||||
@import 'common/workspace-switcher';
|
||||
@import 'widgets-40-0/app-grid';
|
||||
@import 'widgets-40-0/dash';
|
||||
@import 'widgets-40-0/misc';
|
||||
@import 'widgets-40-0/overview';
|
||||
@import 'widgets-40-0/osd';
|
||||
@import 'widgets-40-0/panel';
|
||||
|
@ -33,7 +33,6 @@
|
||||
@import 'common/workspace-switcher';
|
||||
@import 'widgets-42-0/app-grid';
|
||||
@import 'widgets-40-0/dash';
|
||||
@import 'widgets-40-0/misc';
|
||||
@import 'widgets-40-0/overview';
|
||||
@import 'widgets-42-0/osd';
|
||||
@import 'widgets-40-0/panel';
|
||||
|
@ -33,7 +33,6 @@
|
||||
@import 'common/workspace-switcher';
|
||||
@import 'widgets-44-0/app-grid';
|
||||
@import 'widgets-40-0/dash';
|
||||
@import 'widgets-40-0/misc';
|
||||
@import 'widgets-40-0/overview';
|
||||
@import 'widgets-42-0/osd';
|
||||
@import 'widgets-40-0/panel';
|
||||
|
@ -31,7 +31,6 @@
|
||||
@import 'common/workspace-switcher';
|
||||
@import 'widgets-46-0/app-grid';
|
||||
@import 'widgets-46-0/dash';
|
||||
@import 'widgets-40-0/misc';
|
||||
@import 'widgets-46-0/message-list';
|
||||
@import 'widgets-46-0/notifications';
|
||||
@import 'widgets-40-0/overview';
|
||||
|
@ -102,13 +102,12 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
|
||||
// weekday label
|
||||
.day-label {
|
||||
@include font(title);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// date label
|
||||
.date-label {
|
||||
@include font(headline);
|
||||
@extend %title_2;
|
||||
}
|
||||
}
|
||||
|
||||
@ -124,12 +123,11 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
|
||||
// month
|
||||
.calendar-month-label {
|
||||
@extend %heading;
|
||||
margin: 0;
|
||||
padding: $base_padding 0;
|
||||
color: $fg_color !important;
|
||||
background-color: transparent !important;
|
||||
font-weight: bold;
|
||||
font-size: 1em !important;
|
||||
text-align: center;
|
||||
text-shadow: none;
|
||||
|
||||
@ -160,10 +158,11 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
|
||||
.calendar-day,
|
||||
.calendar-day-base {
|
||||
@include font(caption);
|
||||
@extend %numeric;
|
||||
@extend %smaller;
|
||||
text-align: center;
|
||||
width: $menuitem_size !important;
|
||||
height: $menuitem_size !important;
|
||||
width: 3em !important;
|
||||
height: 3em !important;
|
||||
padding: 2px !important;
|
||||
margin: 2px !important;
|
||||
border-radius: $circular_radius;
|
||||
@ -261,6 +260,7 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
}
|
||||
|
||||
.calendar-week-number {
|
||||
@extend %smaller;
|
||||
width: 22px;
|
||||
height: 16px;
|
||||
margin: 6px 6px 6px 4px;
|
||||
@ -268,12 +268,14 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
border-radius: $bt_radius;
|
||||
background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.05));
|
||||
color: $hint_fg_color;
|
||||
font-size: inherit;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-feature-settings: "tnum";
|
||||
}
|
||||
|
||||
.calendar-day-heading { //day of week heading
|
||||
@extend %numeric;
|
||||
@extend %smaller;
|
||||
width: $menuitem_size !important;
|
||||
height: $menuitem_size - 6px !important;
|
||||
margin: $base_margin;
|
||||
@ -281,7 +283,6 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
// border-radius: $circular_radius;
|
||||
background-color: transparent !important;
|
||||
color: $hint_fg_color !important;
|
||||
@include font(caption);
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
@ -309,30 +310,49 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
}
|
||||
|
||||
.events-title {
|
||||
@extend %heading;
|
||||
color: $hint_fg_color;
|
||||
font-weight: bold;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.event-summary {
|
||||
@extend %heading;
|
||||
}
|
||||
|
||||
.event-time {
|
||||
color: $hint_fg_color;
|
||||
font-feature-settings: "tnum";
|
||||
@include fontsize($base_font_size - 2);
|
||||
@extend %numeric;
|
||||
@extend %caption;
|
||||
}
|
||||
|
||||
.event-placeholder {
|
||||
color: $disabled_fg_color;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
// World Clock
|
||||
.world-clocks-button {
|
||||
// title
|
||||
.world-clocks-header {
|
||||
@extend %heading;
|
||||
color: $disabled_fg_color;
|
||||
|
||||
// change style when no world clocks are configured
|
||||
&.no-world-clocks {
|
||||
color: $fg_color;
|
||||
}
|
||||
}
|
||||
|
||||
.world-clocks-city {
|
||||
color: $hint_fg_color;
|
||||
font-weight: bold;
|
||||
@include fontsize($base_font_size - 1);
|
||||
}
|
||||
|
||||
.world-clocks-time {
|
||||
@extend %numeric;
|
||||
font-weight: bold;
|
||||
color: $hint_fg_color;
|
||||
font-feature-settings: "tnum";
|
||||
@include fontsize($base_font_size - 1);
|
||||
|
||||
&:ltr { text-align: right; }
|
||||
&:rtl { text-align: left; }
|
||||
@ -340,8 +360,8 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
|
||||
.world-clocks-timezone {
|
||||
color: $hint_fg_color;
|
||||
font-feature-settings: "tnum";
|
||||
@include fontsize($base_font_size - 2);
|
||||
@extend %numeric;
|
||||
@extend %caption;;
|
||||
}
|
||||
}
|
||||
|
||||
@ -362,13 +382,12 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
}
|
||||
|
||||
.weather-header {
|
||||
@extend %heading;
|
||||
color: $alt_fg_color;
|
||||
font-weight: bold;
|
||||
|
||||
&.location {
|
||||
font-weight: normal;
|
||||
color: $hint_fg_color;
|
||||
@include fontsize($base_font_size - 2);
|
||||
}
|
||||
}
|
||||
|
||||
@ -378,9 +397,9 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
}
|
||||
|
||||
.weather-forecast-time {
|
||||
@extend %numeric;
|
||||
@include fontsize(10pt);
|
||||
color: $alt_fg_color;
|
||||
font-feature-settings: "tnum";
|
||||
@include fontsize($base_font_size - 3);
|
||||
font-weight: normal;
|
||||
padding-top: 0.2em;
|
||||
padding-bottom: 0.4em;
|
||||
@ -391,6 +410,7 @@ $popover_bubble_bg: if($variant == 'light', rgba(white, 0.95), rgba(lighten($bas
|
||||
}
|
||||
|
||||
.weather-forecast-temp {
|
||||
@extend %numeric;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
@ -3,8 +3,6 @@
|
||||
$dash_placeholder_size: 32px;
|
||||
|
||||
#dash {
|
||||
@include fontsize($base_font_size - 2);
|
||||
|
||||
.empty-dash-drop-target {
|
||||
width: $dash_placeholder_size;
|
||||
height: $dash_placeholder_size;
|
||||
|
@ -34,7 +34,7 @@
|
||||
}
|
||||
|
||||
.headline {
|
||||
@include font(title);
|
||||
@extend %title_4;
|
||||
}
|
||||
|
||||
// modal dialog
|
||||
@ -92,12 +92,10 @@
|
||||
|
||||
.message-dialog-title {
|
||||
text-align: center;
|
||||
font-size: 18pt;
|
||||
font-weight: 800;
|
||||
@extend %title_2;
|
||||
|
||||
&.lightweight {
|
||||
font-size: 13pt;
|
||||
font-weight: 800;
|
||||
@extend %title_4;
|
||||
}
|
||||
}
|
||||
|
||||
@ -110,7 +108,7 @@
|
||||
|
||||
.dialog-list-title {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
@extend %heading;
|
||||
}
|
||||
|
||||
.dialog-list-scrollview { max-height: 200px; }
|
||||
@ -123,7 +121,7 @@
|
||||
.dialog-list-item-title { font-weight: bold; }
|
||||
.dialog-list-item-description {
|
||||
color: $alt_fg_color;
|
||||
@include font(title);
|
||||
@extend %caption;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -140,7 +138,7 @@
|
||||
.run-dialog-description {
|
||||
text-align: center;
|
||||
color: $alt_fg_color;
|
||||
@include font(title);
|
||||
@extend %caption;
|
||||
}
|
||||
}
|
||||
|
||||
@ -193,8 +191,7 @@
|
||||
.prompt-dialog-info-label,
|
||||
.prompt-dialog-null-label {
|
||||
text-align: center;
|
||||
@include font(title);
|
||||
margin: 6px;
|
||||
@extend %caption;
|
||||
}
|
||||
|
||||
.prompt-dialog-error-label {
|
||||
@ -249,3 +246,8 @@
|
||||
height: 300px;
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
/* Access portal dialog */
|
||||
.access-dialog {
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -23,8 +23,7 @@
|
||||
}
|
||||
|
||||
.message-list-placeholder {
|
||||
font-weight: 800;
|
||||
@include fontsize(15);
|
||||
@extend %title_2;
|
||||
color: $disabled_fg_color;
|
||||
|
||||
// icon size and color
|
||||
@ -99,7 +98,7 @@
|
||||
|
||||
> .event-time {
|
||||
color: $hint_fg_color;
|
||||
font-size: 1em;
|
||||
@extend %caption;
|
||||
/* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */
|
||||
padding-bottom: 0.13em;
|
||||
|
||||
|
@ -30,6 +30,14 @@
|
||||
border: none;
|
||||
box-shadow: inset 0 0 0 1px transparentize($light_alt_fg_color, 0.9);
|
||||
}
|
||||
|
||||
.popup-menu & {
|
||||
color: $alt_fg_color;
|
||||
|
||||
StIcon {
|
||||
background-color: $track_color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.user-widget.vertical .user-icon {
|
||||
@ -53,6 +61,12 @@
|
||||
.caps-lock-warning-label {
|
||||
text-align: center;
|
||||
padding-bottom: 8px;
|
||||
@include font(body-1);
|
||||
color: $warning_color;
|
||||
@extend %caption;
|
||||
}
|
||||
|
||||
/* Workspace animation */
|
||||
|
||||
.workspace-animation {
|
||||
background-color: rgba($osd_bg_color, 1);
|
||||
}
|
||||
|
@ -12,7 +12,6 @@
|
||||
border: 1px solid if($variant=='light', rgba(black, 0), rgba(black, 0.75));
|
||||
text-shadow: none;
|
||||
box-shadow: 0 3px 5px rgba(black, 0.15);
|
||||
@include font(body-1);
|
||||
|
||||
&:hover { background-color: rgba($menu_bg, 1); }
|
||||
|
||||
|
@ -69,7 +69,6 @@ $popop_menuitem_radius: $po_radius - $base_padding;
|
||||
.popup-menu {
|
||||
min-width: 12em;
|
||||
color: $alt_fg_color;
|
||||
@include font(body-1);
|
||||
|
||||
//.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is
|
||||
&.panel-menu {
|
||||
@ -98,7 +97,6 @@ $popop_menuitem_radius: $po_radius - $base_padding;
|
||||
border-radius: $po_radius;
|
||||
border: solid if($variant=='light', rgba(black, 0), rgba(black, 0.75));
|
||||
border-width: if($variant=='light', 0, 1px);
|
||||
@include font(body-1);
|
||||
}
|
||||
|
||||
.popup-menu-item {
|
||||
|
@ -25,7 +25,6 @@
|
||||
#searchResultsContent {
|
||||
max-width: 1024px;
|
||||
spacing: $base_margin * 2;
|
||||
@include font(body-1);
|
||||
}
|
||||
|
||||
// search results sections "the boxes"
|
||||
|
@ -14,8 +14,6 @@
|
||||
/* App Icons */
|
||||
.show-apps,
|
||||
.app-well-app {
|
||||
@include font(body-1);
|
||||
|
||||
.overview-icon.overview-icon-with-label {
|
||||
padding: 10px 12px 14px;
|
||||
|
||||
|
@ -1,12 +0,0 @@
|
||||
// Workspace animation
|
||||
.workspace-animation {
|
||||
background-color: rgba($osd_bg_color, 1);
|
||||
}
|
||||
|
||||
// reset prev/next month icons
|
||||
.calendar {
|
||||
.calendar-change-month-back,
|
||||
.calendar-change-month-forward {
|
||||
padding: 0 2px;
|
||||
}
|
||||
}
|
@ -14,8 +14,6 @@
|
||||
/* App Icons */
|
||||
.show-apps,
|
||||
.app-well-app {
|
||||
@include font(body-1);
|
||||
|
||||
.overview-icon.overview-icon-with-label {
|
||||
padding: 10px 12px 14px;
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user