[gnome-shell/wip/sass: 39/88] datetime/calendar popup
- From: Carlos Soriano Sánchez <csoriano src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell/wip/sass: 39/88] datetime/calendar popup
- Date: Thu, 19 Feb 2015 17:50:59 +0000 (UTC)
commit b4cdb506f96fc97bcd684a2724ce062c367c8b47
Author: Jakub Steiner <jimmac gmail com>
Date: Tue Nov 25 15:14:32 2014 +0100
datetime/calendar popup
- separator seems to have a semi-opaque top that interfers
with the bottom row of teh calendar
- current day can't have a blue brder on the bottom,
but $borders_color on the sides. Apparently cannot
use non-uniform border colors.
- month pager missing
data/theme/_common.scss | 95 ++++++++++++++
data/theme/_gnome-shell-old.scss | 213 -------------------------------
data/theme/gnome-shell.css | 261 ++++++++++++++------------------------
3 files changed, 190 insertions(+), 379 deletions(-)
---
diff --git a/data/theme/_common.scss b/data/theme/_common.scss
index 43bd225..19f695f 100644
--- a/data/theme/_common.scss
+++ b/data/theme/_common.scss
@@ -324,6 +324,101 @@ StScrollBar {
.screencast-indicator { color: $warning_color; }
}
+ // calendar popover
+ .calendar { padding: .4em 1.75em .8em 1.75em; }
+
+ .calendar-vertical-separator {
+ width: .3em;
+ -stipple-width: 1px;
+ -stipple-color: transparentize($fg_color,0.8);
+ }
+
+ .calendar-month-label {
+ color: darken($fg_color,5%);
+ font-weight: bold;
+ padding: 8px 0;
+ &:focus {}
+ }
+
+ .calendar-change-month-back { //arrow back
+ &:rtl {}
+ &:hover, &:focus {}
+ &:active {}
+ }
+ .calendar-change-month-forward { //arrow foreward
+ &:rtl {}
+ &:hover, &:focus {}
+ &:active {}
+ }
+ .datemenu-date-label {
+ padding: .4em 1.7em;
+ text-align: center;
+ color: darken($fg_color,10%);
+ font-size: 130%;
+ border-radius: 4px;
+ }
+
+ .calendar-day-base {
+ font-size: 80%;
+ text-align: center;
+ width: 2.4em; height: 2.4em;
+ &:hover,&:focus { background-color: lighten($bg_color,5%); }
+ &:active { color: lighten($fg_color,5%); background-color: darken($bg_color,5%);}
+ }
+ .calendar-day { //border collapse hack - see calendar.js
+ border: 1px solid $borders_color;
+ border-top-width: 0; border-left-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-today {
+ font-weight: bold;
+ color: lighten($fg_color,10%);
+ border-bottom-width: 2px;
+ border-color: $selected_bg_color; //FIXME sadly can't have a color per side.
+ }
+ .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);
+ opacity: 0.5;
+ }
+
+ .events-table {
+ width: 15em;
+ spacing-columns: 1em;
+ padding: 0 1.4em;
+ &:ltr { padding-right: 1.9em; }
+ &:rtl { padding-left: 1.9em; }
+ }
+ .events-day-header {
+ font-weight: bold;
+ color: darken($fg_color,10%);
+ padding-left: 0;
+ padding-top: 1.2em;
+ &:first-child { padding-top: 0; }
+ }
+ .events-day-dayname {
+ color: darken($fg_color,10%);
+ text-align: left;
+ min-width: 20px;
+ &:rtl { text-align: right; }
+ .events-day-time {
+ text-align: right;
+ &:rtl { text-align: left; }
+ }
+ .events-day-task {
+ color: darken($fg_color,10%);
+ &:ltr { padding-left: 8px; }
+ &:rtl { padding-right: 8px; }
+ }
+ }
+
// a little unstructured mess:
diff --git a/data/theme/_gnome-shell-old.scss b/data/theme/_gnome-shell-old.scss
index ec9a873..c9918d2 100644
--- a/data/theme/_gnome-shell-old.scss
+++ b/data/theme/_gnome-shell-old.scss
@@ -89,219 +89,6 @@
}
-
-
-
-/* Overview */
-
-/* Calendar popup */
-
-.calendar-vertical-separator {
- -stipple-width: 1px;
- -stipple-color: #505050;
- width: 0.3em;
-}
-
-.calendar {
- padding: .4em 1.75em .8em 1.75em;
-}
-
-.calendar-month-label {
- color: #888a85;
- font-size: 9.5pt;
- font-weight: bold;
- padding-bottom: 8px;
- padding-top: 8px;
-}
-
-.calendar-month-label:focus {
- background-color: #999999;
-}
-
-.calendar-change-month-back {
- width: 18px;
- height: 12px;
- background-image: url("calendar-arrow-left.svg");
- border-radius: 4px;
-}
-
-.calendar-change-month-back:rtl {
- background-image: url("calendar-arrow-right.svg");
-}
-
-.calendar-change-month-back:hover,
-.calendar-change-month-back:focus {
- background-color: #999999;
-}
-.calendar-change-month-back:active {
- background-color: #aaaaaa;
-}
-
-.calendar-change-month-forward {
- width: 18px;
- height: 12px;
- background-image: url("calendar-arrow-right.svg");
- border-radius: 4px;
-}
-
-.calendar-change-month-forward:rtl {
- background-image: url("calendar-arrow-left.svg");
-}
-
-.calendar-change-month-forward:hover,
-.calendar-change-month-forward:focus {
- background-color: #999999;
-}
-.calendar-change-month-forward:active {
- background-color: #aaaaaa;
-}
-
-.datemenu-date-label {
- padding: .4em 1.7em;
- font-weight: bold;
- text-align: center;
- color: #eeeeec;
- border-radius: 4px;
-}
-
-.datemenu-date-label:hover,
-.datemenu-date-label:focus {
- background-color: #999999;
-}
-
-.datemenu-date-label:active {
- background-color: #aaaaaa;
-}
-
-.calendar-day-base {
- font-size: 9pt;
- text-align: center;
- width: 2.4em;
- height: 2.4em;
-}
-
-.calendar-day-base:hover,
-.calendar-day-base:focus {
- background-color: #777777;
-}
-
-.calendar-day-base:active {
- font-size: 9pt;
- background-color: #555555;
- color: white;
-}
-
-.calendar-day-heading {
- color: #888a85;
- padding-top: .2em;
- height: 1.7em;
-}
-
-.calendar-week-number {
- color: #babdb6;
- font-weight: bold;
-}
-
-/* Hack used in lieu of border-collapse - see calendar.js */
-.calendar-day {
- border: 1px solid #505050;
- color: #babdb6;
- border-top-width: 0;
- border-left-width: 0;
-}
-
-.calendar-day-top {
- border-top-width: 1px;
-}
-
-.calendar-day-left {
- border-left-width: 1px;
-}
-
-.calendar-work-day {
-}
-
-.calendar-nonwork-day {
- background-color: rgba(128, 128, 128, .1);
-}
-
-.calendar-today {
- background-image: url("calendar-today.svg");
- text-shadow: black 0px 2px 2px;
- font-weight: bold;
-}
-
-.calendar-day-with-events {
- font-weight: bold;
- color: white;
-}
-
-.calendar-other-month-day {
- color: #333333;
-}
-
-.events-table {
- width: 320px;
- spacing-columns: 6pt;
- padding: 0 1.4em;
-}
-
-.events-table:ltr {
- padding-right: 1.9em;
-}
-
-.events-table:rtl {
- padding-left: 1.9em;
-}
-
-.events-day-header {
- font-weight: bold;
- color: #999999;
- padding-left: 0.4em;
- padding-top: 1.2em;
-}
-
-.events-day-header:first-child {
- padding-top: 0;
-}
-
-.events-day-header:rtl {
- padding-left: 0;
- padding-right: 0.4em;
-}
-
-.events-day-dayname {
- color: rgba(153, 153, 153, 1.0);
- text-align: left;
- min-width: 20px;
-}
-
-.events-day-dayname:rtl {
- text-align: right;
-}
-
-.events-day-time {
- color: #fff;
- text-align: right;
-}
-
-.events-day-time:rtl {
- text-align: left;
-}
-
-.events-day-task {
- color: rgba(153, 153, 153, 1.0);
- padding-left: 8pt;
-}
-
-.events-day-task:rtl {
- padding-left: 0px;
- padding-right: 8pt;
-}
-
-/* Message Tray */
-
-
/* OSD */
.osd-window {
text-align: center;
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 14b2e4c..bcded13 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -70,172 +70,6 @@
.no-networks-box {
spacing: 12px; }
-/* Overview */
-/* Calendar popup */
-.calendar-vertical-separator {
- -stipple-width: 1px;
- -stipple-color: #505050;
- width: 0.3em; }
-
-.calendar {
- padding: .4em 1.75em .8em 1.75em; }
-
-.calendar-month-label {
- color: #888a85;
- font-size: 9.5pt;
- font-weight: bold;
- padding-bottom: 8px;
- padding-top: 8px; }
-
-.calendar-month-label:focus {
- background-color: #999999; }
-
-.calendar-change-month-back {
- width: 18px;
- height: 12px;
- background-image: url("calendar-arrow-left.svg");
- border-radius: 4px; }
-
-.calendar-change-month-back:rtl {
- background-image: url("calendar-arrow-right.svg"); }
-
-.calendar-change-month-back:hover,
-.calendar-change-month-back:focus {
- background-color: #999999; }
-
-.calendar-change-month-back:active {
- background-color: #aaaaaa; }
-
-.calendar-change-month-forward {
- width: 18px;
- height: 12px;
- background-image: url("calendar-arrow-right.svg");
- border-radius: 4px; }
-
-.calendar-change-month-forward:rtl {
- background-image: url("calendar-arrow-left.svg"); }
-
-.calendar-change-month-forward:hover,
-.calendar-change-month-forward:focus {
- background-color: #999999; }
-
-.calendar-change-month-forward:active {
- background-color: #aaaaaa; }
-
-.datemenu-date-label {
- padding: .4em 1.7em;
- font-weight: bold;
- text-align: center;
- color: #eeeeec;
- border-radius: 4px; }
-
-.datemenu-date-label:hover,
-.datemenu-date-label:focus {
- background-color: #999999; }
-
-.datemenu-date-label:active {
- background-color: #aaaaaa; }
-
-.calendar-day-base {
- font-size: 9pt;
- text-align: center;
- width: 2.4em;
- height: 2.4em; }
-
-.calendar-day-base:hover,
-.calendar-day-base:focus {
- background-color: #777777; }
-
-.calendar-day-base:active {
- font-size: 9pt;
- background-color: #555555;
- color: white; }
-
-.calendar-day-heading {
- color: #888a85;
- padding-top: .2em;
- height: 1.7em; }
-
-.calendar-week-number {
- color: #babdb6;
- font-weight: bold; }
-
-/* Hack used in lieu of border-collapse - see calendar.js */
-.calendar-day {
- border: 1px solid #505050;
- color: #babdb6;
- border-top-width: 0;
- border-left-width: 0; }
-
-.calendar-day-top {
- border-top-width: 1px; }
-
-.calendar-day-left {
- border-left-width: 1px; }
-
-.calendar-nonwork-day {
- background-color: rgba(128, 128, 128, 0.1); }
-
-.calendar-today {
- background-image: url("calendar-today.svg");
- text-shadow: black 0px 2px 2px;
- font-weight: bold; }
-
-.calendar-day-with-events {
- font-weight: bold;
- color: white; }
-
-.calendar-other-month-day {
- color: #333333; }
-
-.events-table {
- width: 320px;
- spacing-columns: 6pt;
- padding: 0 1.4em; }
-
-.events-table:ltr {
- padding-right: 1.9em; }
-
-.events-table:rtl {
- padding-left: 1.9em; }
-
-.events-day-header {
- font-weight: bold;
- color: #999999;
- padding-left: 0.4em;
- padding-top: 1.2em; }
-
-.events-day-header:first-child {
- padding-top: 0; }
-
-.events-day-header:rtl {
- padding-left: 0;
- padding-right: 0.4em; }
-
-.events-day-dayname {
- color: #999999;
- text-align: left;
- min-width: 20px; }
-
-.events-day-dayname:rtl {
- text-align: right; }
-
-.events-day-time {
- color: #fff;
- text-align: right; }
-
-.events-day-time:rtl {
- text-align: left; }
-
-.events-day-task {
- color: #999999;
- padding-left: 8pt; }
-
-.events-day-task:rtl {
- padding-left: 0px;
- padding-right: 8pt; }
-
-/* Message Tray */
/* OSD */
.osd-window {
text-align: center;
@@ -1243,6 +1077,101 @@ StScrollBar {
#panel .screencast-indicator {
color: #f57900; }
+.calendar {
+ padding: .4em 1.75em .8em 1.75em; }
+
+.calendar-vertical-separator {
+ width: .3em;
+ -stipple-width: 1px;
+ -stipple-color: rgba(238, 238, 236, 0.2); }
+
+.calendar-month-label {
+ color: #e2e2df;
+ font-weight: bold;
+ padding: 8px 0; }
+
+.datemenu-date-label {
+ padding: .4em 1.7em;
+ text-align: center;
+ color: #d6d6d1;
+ font-size: 130%;
+ border-radius: 4px; }
+
+.calendar-day-base {
+ font-size: 80%;
+ text-align: center;
+ width: 2.4em;
+ height: 2.4em; }
+ .calendar-day-base:hover, .calendar-day-base:focus {
+ background-color: #454c4c; }
+ .calendar-day-base:active {
+ color: #fafaf9;
+ background-color: #2d3232; }
+
+.calendar-day {
+ border: 1px solid #1c1f1f;
+ border-top-width: 0;
+ border-left-width: 0; }
+
+.calendar-day-top {
+ border-top-width: 1px; }
+
+.calendar-day-left {
+ border-left-width: 1px; }
+
+.calendar-nonwork-day {
+ background-color: #343a3a;
+ color: #e2e2df; }
+
+.calendar-today {
+ font-weight: bold;
+ color: white;
+ border-bottom-width: 2px;
+ border-color: #215d9c; }
+
+.calendar-day-with-events {
+ color: white;
+ font-weight: bold; }
+
+.calendar-other-month-day {
+ color: #eeeeec;
+ background-color: #393f3f;
+ opacity: 0.5; }
+
+.events-table {
+ width: 15em;
+ spacing-columns: 1em;
+ padding: 0 1.4em; }
+ .events-table:ltr {
+ padding-right: 1.9em; }
+ .events-table:rtl {
+ padding-left: 1.9em; }
+
+.events-day-header {
+ font-weight: bold;
+ color: #d6d6d1;
+ padding-left: 0;
+ padding-top: 1.2em; }
+ .events-day-header:first-child {
+ padding-top: 0; }
+
+.events-day-dayname {
+ color: #d6d6d1;
+ text-align: left;
+ min-width: 20px; }
+ .events-day-dayname:rtl {
+ text-align: right; }
+ .events-day-dayname .events-day-time {
+ text-align: right; }
+ .events-day-dayname .events-day-time:rtl {
+ text-align: left; }
+ .events-day-dayname .events-day-task {
+ color: #d6d6d1; }
+ .events-day-dayname .events-day-task:ltr {
+ padding-left: 8px; }
+ .events-day-dayname .events-day-task:rtl {
+ padding-right: 8px; }
+
.system-switch-user-submenu-icon {
icon-size: 24px;
border: 1px solid rgba(238, 238, 236, 0.4); }
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]