brl/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

theme: Simplify .message styling

Browse Source 
- Use fewer properties for layout.
- Use .message-body instead of .message-content to change the body
  color, and remove some color overrides.
- Fix border-radius for last .message-media-control, not only on hover.

https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/957
This commit is contained in:
nana-4 2020-02-05 01:15:27 +09:00 committed by Florian Müllner
parent cbced1ce28
commit fa915ff7ea
1 changed files with 14 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
data/theme/gnome-shell-sass/widgets/_message-list.scss
View File

@ -36,21 +36,16 @@
// icon container // icon container
.message-icon-bin { .message-icon-bin {
padding: $base_padding; padding: ($base_padding * 3) 0 ($base_padding * 3) ($base_padding * 2);
margin:$base_padding 0;
&:rtl { &:rtl {
// padding: $base_padding; padding: ($base_padding * 3) ($base_padding * 2) ($base_padding * 3) 0;
} }
// icon size and color // icon size and color
> StIcon { > StIcon {
color: $fg_color;
icon-size: $base_icon_size*2; // 32px icon-size: $base_icon_size*2; // 32px
-st-icon-style: symbolic; -st-icon-style: symbolic;
padding:0;
margin:$base_padding;
} }
// fallback // fallback
@ -62,38 +57,26 @@
// content // content
.message-content { .message-content {
color: darken($fg_color, 10%); padding: $base_padding + $base_margin * 2;
padding: $base_padding 0; spacing: 4px;
margin:$base_margin * 2;
&:ltr {
margin-left: $base_margin;
padding-right:$base_padding;
}
&:rtl {
margin-right: $base_margin;
padding-left:$base_padding;
}
} }
// title // title
.message-title { .message-title {
color: $fg_color;
font-weight: bold; font-weight: bold;
margin-bottom:4px;
} }
// secondary container in title box // secondary container in title box
.message-secondary-bin { .message-secondary-bin {
padding: 0; padding: 0 $base_margin * 2;
// notification time stamp // notification time stamp
> .event-time { > .event-time {
color: transparentize($fg_color, 0.5); color: transparentize($fg_color, 0.5);
@include fontsize($base_font_size - 2); @include fontsize($base_font_size - 2);
text-align: right; text-align: right;
margin: 0 $base_margin * 2;
/* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */ /* HACK: the label should be baseline-aligned with a 1em label, fake this with some bottom padding */
padding-bottom: $base_padding; padding-bottom: 0.13em;
} }
} }
@ -103,6 +86,11 @@
&:hover { color: if($variant=='light', lighten($fg_color, 30%), darken($fg_color, 10%)); } &:hover { color: if($variant=='light', lighten($fg_color, 30%), darken($fg_color, 10%)); }
&:active { color: if($variant=='light', lighten($fg_color, 40%), darken($fg_color, 20%)); } &:active { color: if($variant=='light', lighten($fg_color, 40%), darken($fg_color, 20%)); }
} }
// body
.message-body {
color: darken($fg_color, 10%);
}
} }
/* Media Controls */ /* Media Controls */
@ -123,9 +111,9 @@
&:insensitive { color: darken($fg_color,40%); } &:insensitive { color: darken($fg_color,40%); }
// fix border-radius for last button on hover // fix border-radius for last button
&:last-child:ltr { &:hover {border-radius: 0 $base_border_radius+2 $base_border_radius+2 0;} } &:last-child:ltr { border-radius: 0 $base_border_radius+2 $base_border_radius+2 0; }
&:last-child:rtl { &:hover {border-radius: $base_border_radius+2 0 0 $base_border_radius+2;} } &:last-child:rtl { border-radius: $base_border_radius+2 0 0 $base_border_radius+2; }
} }
// album-art // album-art
@ -140,6 +128,5 @@
border: 1px solid transparent; border: 1px solid transparent;
border-radius: $base_border_radius; border-radius: $base_border_radius;
icon-size: $base_icon_size * 2 !important; icon-size: $base_icon_size * 2 !important;
padding: $base_padding * 2;
} }
} }