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

theme: calendar widget visual cleanup

Browse Source 
- clean up visual noise
- some typos in selectors & properties I missed
- misused opacify instead of transparentize
This commit is contained in:
Jakub Steiner 2015-02-04 13:03:46 +01:00 committed by Florian Müllner
parent fc1849b475
commit 7b3eeefc85
3 changed files with 58 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
data/theme/_common.scss
View File

@ -685,7 +685,10 @@ StScrollBar {
.screencast-indicator { color: $warning_color; }
}
// calendar popover
.calendar { padding: .4em 1.75em .8em 1.75em; }
.calendar {
padding: .4em 1.75em .8em 1.75em;
margin-bottom: 2em;
}
.datemenu-date-label { //topmost date label
padding: .4em 1.7em;
@ -713,7 +716,7 @@ StScrollBar {
background-color: transparent;
width: 32px;
background-position: center;
boder-radius: 4px;
border-radius: 4px;
&:hover, &:focus { background-color: transparentize($fg_color,0.95); }
&:active { background-color: transparentize($bg_color,0.95); }
}
@ -731,35 +734,45 @@ StScrollBar {
font-size: 80%;
text-align: center;
width: 2.4em; height: 2.4em;
padding: 0.1em;
margin: 2px;
&:hover,&:focus { background-color: lighten($bg_color,5%); }
&:active { color: lighten($fg_color,5%); background-color: darken($bg_color,5%);}
&:active {
color: lighten($fg_color,5%);
background-color: $selected_bg_color;
border-color: transparent; //avoid jumparound due to today
}
&.calendar-day-heading { //day of week heading
color: darken($fg_color,40%);
margin-top: 1em;
font-size: 90%;
font-size: 70%;
}
}
.calendar-day { //border collapse hack - see calendar.js
border: 1px solid $borders_color;
border-top-width: 0; border-left-width: 0;
border-width: 0;
}
.calendar-day-top { border-top-width: 1px; }
.calendar-day-left { border-left-width: 1px; }
.calendar-work-day {}
.calendar-nonwork-day { background-color: darken($bg_color, 2%); color: darken($fg_color,5%); }
.calendar-work-day {
border-radius: 1.4em;
}
.calendar-nonwork-day {
background-color: darken($bg_color, 2%);
color: darken($fg_color,5%);
}
.calendar-today {
font-weight: bold;
color: lighten($fg_color,10%);
border-bottom-width: 2px;
border-bottom-color: $selected_bg_color; //FIXME sadly can't have a color per side.
//color: lighten($fg_color,10%);
//background-color: darken($bg_color,5%);
border: 1px solid transparentize($borders_color,0.5);
}
.calendar-day-with-events {
color: white;
font-weight: bold;
}
.calendar-other-month-day {
color: opacify($fg_color,0.5);
background-color: opacify($bg_color,0.5);
color: transparentize($fg_color,0.7);
background-color: transparentize($bg_color,0.7);
opacity: 0.5;
}

29
data/theme/gnome-shell-high-contrast.css
View File

@ -861,7 +861,8 @@ StScrollBar {
color: #f57900; }
.calendar {
padding: .4em 1.75em .8em 1.75em; }
padding: .4em 1.75em .8em 1.75em;
margin-bottom: 2em; }
.datemenu-date-label {
padding: .4em 1.7em;
@ -885,7 +886,7 @@ StScrollBar {
background-color: transparent;
width: 32px;
background-position: center;
boder-radius: 4px; }
border-radius: 4px; }
.pager-button:hover, .pager-button:focus {
background-color: rgba(255, 255, 255, 0.05); }
.pager-button:active {
@ -905,21 +906,22 @@ StScrollBar {
font-size: 80%;
text-align: center;
width: 2.4em;
height: 2.4em; }
height: 2.4em;
padding: 0.1em;
margin: 2px; }
.calendar-day-base:hover, .calendar-day-base:focus {
background-color: #0d0d0d; }
.calendar-day-base:active {
color: white;
background-color: black; }
background-color: #215d9c;
border-color: transparent; }
.calendar-day-base.calendar-day-heading {
color: #999999;
margin-top: 1em;
font-size: 90%; }
font-size: 70%; }
.calendar-day {
border: 1px solid black;
border-top-width: 0;
border-left-width: 0; }
border-width: 0; }
.calendar-day-top {
border-top-width: 1px; }
@ -927,23 +929,24 @@ StScrollBar {
.calendar-day-left {
border-left-width: 1px; }
.calendar-work-day {
border-radius: 1.4em; }
.calendar-nonwork-day {
background-color: black;
color: #f2f2f2; }
.calendar-today {
font-weight: bold;
color: white;
border-bottom-width: 2px;
border-bottom-color: #215d9c; }
border: 1px solid rgba(0, 0, 0, 0.5); }
.calendar-day-with-events {
color: white;
font-weight: bold; }
.calendar-other-month-day {
color: white;
background-color: black;
color: rgba(255, 255, 255, 0.3);
background-color: rgba(0, 0, 0, 0.3);
opacity: 0.5; }
.events-table {

29
data/theme/gnome-shell.css
View File

@ -861,7 +861,8 @@ StScrollBar {
color: #f57900; }
.calendar {
padding: .4em 1.75em .8em 1.75em; }
padding: .4em 1.75em .8em 1.75em;
margin-bottom: 2em; }
.datemenu-date-label {
padding: .4em 1.7em;
@ -885,7 +886,7 @@ StScrollBar {
background-color: transparent;
width: 32px;
background-position: center;
boder-radius: 4px; }
border-radius: 4px; }
.pager-button:hover, .pager-button:focus {
background-color: rgba(238, 238, 236, 0.05); }
.pager-button:active {
@ -905,21 +906,22 @@ StScrollBar {
font-size: 80%;
text-align: center;
width: 2.4em;
height: 2.4em; }
height: 2.4em;
padding: 0.1em;
margin: 2px; }
.calendar-day-base:hover, .calendar-day-base:focus {
background-color: #454c4c; }
.calendar-day-base:active {
color: #fafaf9;
background-color: #2d3232; }
background-color: #215d9c;
border-color: transparent; }
.calendar-day-base.calendar-day-heading {
color: #8e8e80;
margin-top: 1em;
font-size: 90%; }
font-size: 70%; }
.calendar-day {
border: 1px solid #1c1f1f;
border-top-width: 0;
border-left-width: 0; }
border-width: 0; }
.calendar-day-top {
border-top-width: 1px; }
@ -927,23 +929,24 @@ StScrollBar {
.calendar-day-left {
border-left-width: 1px; }
.calendar-work-day {
border-radius: 1.4em; }
.calendar-nonwork-day {
background-color: #343a3a;
color: #e2e2df; }
.calendar-today {
font-weight: bold;
color: white;
border-bottom-width: 2px;
border-bottom-color: #215d9c; }
border: 1px solid rgba(28, 31, 31, 0.5); }
.calendar-day-with-events {
color: white;
font-weight: bold; }
.calendar-other-month-day {
color: #eeeeec;
background-color: #393f3f;
color: rgba(238, 238, 236, 0.3);
background-color: rgba(57, 63, 63, 0.3);
opacity: 0.5; }
.events-table {