Skip to content

Commit

Permalink
Improvement: Cinnamon - aditional calendar support
Browse files Browse the repository at this point in the history
  • Loading branch information
@thekomer
thekomer committed Dec 7, 2021
1 parent c76a0bb commit f524729
Show file tree
Hide file tree
Showing 2 changed files with 191 additions and 69 deletions.
122 changes: 83 additions & 39 deletions cinnamon/cinnamon.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -640,13 +640,17 @@ StScrollBar {
/* * * * * * *
* Calendar *
* * * * * * */
.calendar {
spacing-rows: 0;
spacing-columns: 0; }

.calendar-main-box {
padding: 0 1.0em; }
margin: 0 .8em .5em .8em; }

.calendar-events-main-box {
height: 300px;
margin-right: .5em;
padding: .75em;
padding: .5em;
min-width: 350px;
border: 1px solid #040508;
background-color: #131727; }
Expand All @@ -665,25 +669,66 @@ StScrollBar {
padding: 0; }

.calendar-event-button {
margin: 0; }
border: 1px solid rgba(0, 0, 0, 0); }
.calendar-event-button .calendar-event-time-past {
color: rgba(191, 195, 205, 0.4);
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-time-present {
color: #BFC3CD;
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-time-present:all-day {
color: #ff6a00; }
.calendar-event-button .calendar-event-time-future {
color: #BFC3CD;
font-weight: bold;
text-align: left;
margin-bottom: .2em; }
.calendar-event-button .calendar-event-summary {
color: #BFC3CD;
text-align: left;
width: 200px; }
.calendar-event-button .calendar-event-countdown {
text-align: right;
margin-bottom: .6em;
color: #BFC3CD; }
.calendar-event-button .calendar-event-countdown:soon {
font-weight: bold; }
.calendar-event-button .calendar-event-countdown:imminent {
font-weight: bold;
color: #cc5500; }
.calendar-event-button .calendar-event-countdown:current {
font-weight: bold;
color: #ff6a00; }
.calendar-event-button:hover {
background-color: rgba(191, 195, 205, 0.3); }

.calendar-event-row-content {
margin: 0 7px; }

.calendar-event-time {
color: #BFC3CD;
font-weight: bold;
text-align: left;
margin-bottom: .2em;
padding-top: 4px; }

.calendar-event-summary {
color: #BFC3CD;
text-align: left;
width: 200px;
padding-bottom: 4px; }
background-color: #ff6a00;
border: 1px solid #040508; }
.calendar-event-button:hover .calendar-event-time-past,
.calendar-event-button:hover .calendar-event-time-present,
.calendar-event-button:hover .calendar-event-time-future,
.calendar-event-button:hover .calendar-event-summary {
color: #fefefe; }
.calendar-event-button:hover .calendar-event-countdown {
text-align: right;
margin-bottom: .6em;
color: #fefefe; }
.calendar-event-button:hover .calendar-event-countdown:soon {
font-weight: bold; }
.calendar-event-button:hover .calendar-event-countdown:imminent {
font-weight: bold; }
.calendar-event-button:hover .calendar-event-countdown:current {
font-weight: bold; }

.calendar-event-color-strip {
width: 2px; }

.calendar-today-home-button {
padding: 6px; }
.calendar-today-home-button:hover {
background-color: rgba(255, 106, 0, 0.6); }

.calendar-today-day-label {
font-size: 1.75em;
Expand All @@ -698,11 +743,6 @@ StScrollBar {
font-weight: bold;
text-align: center; }

.calendar {
padding: .4em 1.75em;
spacing-rows: 0px;
spacing-columns: 0px; }

.calendar-month-label {
color: #BFC3CD;
font-weight: bold;
Expand Down Expand Up @@ -740,8 +780,8 @@ StScrollBar {
background-image: url("common-assets/misc/calendar-arrow-left.svg"); }

.calendar-day-event-dot-box {
margin-top: 24px;
max-rows: 2; }
margin-top: 22px;
max-rows: 1; }

.calendar-day-event-dot {
margin: 1px;
Expand All @@ -754,8 +794,11 @@ StScrollBar {
text-align: center;
width: 2.2em;
height: 2.2em;
padding: 0.1em;
border-radius: 999px; }
padding: 0.1em; }
.calendar-day-base:hover {
font-weight: bold;
color: #fefefe;
background-color: #ff6a00; }

.calendar-day-heading {
color: rgba(191, 195, 205, 0.85);
Expand All @@ -778,28 +821,29 @@ StScrollBar {
font-weight: bold; }

.calendar-today {
font-weight: bold;
color: #BFC3CD;
background-color: black;
border-width: 0; }
background-color: rgba(255, 106, 0, 0.4);
border: 1px solid #ff6a00; }
.calendar-today:selected {
color: #fefefe;
background-gradient-direction: horizontal;
background-gradient-start: #ff3300;
background-gradient-end: #ffa100; }
color: #fefefe; }

.calendar-not-today {
color: #BFC3CD; }
.calendar-not-today:selected {
color: #fefefe;
background-gradient-direction: horizontal;
background-gradient-start: #ff3300;
background-gradient-end: #ffa100; }
background-color: rgba(191, 195, 205, 0.4); }
.calendar-not-today:selected:hover {
font-weight: bold;
color: #fefefe; }

.calendar-other-month-day {
color: rgba(191, 195, 205, 0.3);
opacity: 1; }

.calendar-other-month-day:hover {
color: #fefefe;
opacity: 1; }

.calendar-week-number {
color: rgba(191, 195, 205, 0.85);
font-size: 0.8em;
Expand Down
138 changes: 108 additions & 30 deletions cinnamon/sass/_common.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -729,14 +729,19 @@ StScrollBar {
* Calendar *
* * * * * * */

.calendar {
spacing-rows: 0;
spacing-columns: 0;
}

.calendar-main-box {
padding: 0 1.0em;
margin: 0 .8em .5em .8em;
}

.calendar-events-main-box {
height: 300px;
margin-right: .5em;
padding: .75em;
padding: .5em;
min-width: 350px;
border: 1px solid $borders_color;
background-color: $base_color;
Expand All @@ -759,30 +764,93 @@ StScrollBar {
}

.calendar-event-button {
margin: 0;
border: 1px solid rgba(0,0,0,0);

.calendar-event-time-past {
color: transparentize($fg_color, 0.6);
font-weight: bold;
text-align: left;
margin-bottom: .2em;
}
.calendar-event-time-present {
color: $fg_color;
font-weight: bold;
text-align: left;
margin-bottom: .2em;

&:all-day {
color: $selected_bg_color;
}
}
.calendar-event-time-future {
color: $fg_color;
font-weight: bold;
text-align: left;
margin-bottom: .2em;
}

.calendar-event-summary {
color: $fg_color;
text-align: left;
width: 200px;
}

.calendar-event-countdown {
text-align: right;
margin-bottom: .6em;
color: $fg_color;
&:soon {
font-weight: bold;
}
&:imminent {
font-weight: bold;
color: $warning_color;
}
&:current {
font-weight: bold;
color: $selected_bg_color;
}
}

&:hover {
background-color: transparentize($fg_color, 0.7);
background-color: $selected_bg_color;
border: 1px solid $borders_color;
.calendar-event-time-past,
.calendar-event-time-present,
.calendar-event-time-future,
.calendar-event-summary {
color: $selected_fg_color
}

.calendar-event-countdown {
text-align: right;
margin-bottom: .6em;
color: $selected_fg_color;
&:soon {
font-weight: bold;
}
&:imminent {
font-weight: bold;
}
&:current {
font-weight: bold;
}
}
}
}

.calendar-event-row-content {
margin: 0 7px;
}

.calendar-event-time {
color: $fg_color;
font-weight: bold;
text-align: left;
margin-bottom: .2em;
padding-top: 4px;
.calendar-event-color-strip {
width: 2px;
}

.calendar-event-summary {
color: $fg_color;
text-align: left;
width: 200px;
padding-bottom: 4px;
.calendar-today-home-button {
padding: 6px;
&:hover {
background-color: transparentize($selected_bg_color, .4);
}
}

.calendar-today-day-label {
Expand All @@ -800,12 +868,6 @@ StScrollBar {
text-align: center;
}

.calendar {
padding: .4em 1.75em;
spacing-rows: 0px;
spacing-columns: 0px;
}

.calendar-month-label {
color: $fg_color;
font-weight: bold;
Expand Down Expand Up @@ -853,8 +915,8 @@ StScrollBar {
}

.calendar-day-event-dot-box {
margin-top: 24px;
max-rows: 2;
margin-top: 22px;
max-rows: 1;
}

.calendar-day-event-dot {
Expand All @@ -870,7 +932,12 @@ StScrollBar {
width: 2.2em;
height: 2.2em;
padding: 0.1em;
border-radius: 999px;

&:hover {
font-weight: bold;
color: $selected_fg_color;
background-color: $selected_bg_color;
}
}

.calendar-day-heading {
Expand Down Expand Up @@ -899,21 +966,27 @@ StScrollBar {
}

.calendar-today {
font-weight: bold;
color: $fg_color;
background-color: darken($bg_color, 10%);
border-width: 0;
background-color: if($variant == 'light', transparentize($selected_bg_color, 0.6), transparentize($selected_bg_color, 0.6));
//border-width: 0;
border: 1px solid $orange;
&:selected {
color: $selected_fg_color;
@include bg_gradient(horizontal, $orange_gradient_start, $orange_gradient_end, 1);
//@include bg_gradient(horizontal, $orange_gradient_start, $orange_gradient_end, 1);
}
}

.calendar-not-today {
color: $fg_color;
&:selected {
color: $selected_fg_color;
@include bg_gradient(horizontal, $orange_gradient_start, $orange_gradient_end, 1);
//@include bg_gradient(horizontal, $orange_gradient_start, $orange_gradient_end, 1);
background-color: if($variant == 'light', transparentize($fg_color, 0.7), transparentize($fg_color, 0.6));
&:hover {
font-weight: bold;
color: $selected_fg_color;
}

}
}

Expand All @@ -922,6 +995,11 @@ StScrollBar {
opacity: 1;
}

.calendar-other-month-day:hover {
color: $selected_fg_color;
opacity: 1;
}

.calendar-week-number {
color: transparentize($fg_color, 0.15);
font-size: 0.8em;
Expand Down

0 comments on commit f524729

Please sign in to comment.