Fixes issues mentioned in comments.
- [x] Highlight for selected date should be bold text. - [x] Hover highlight for day should be the same as for the selected date. - [x] Remove hover effect on the week. - [x] Row for days of the week should indeed stay, but non-bold and at 50% opacity so it doesn't take away the focus. - [x] Dates of previous and next months a bit lighter. - [x] Remove marking the weekend blue. - [x] The box centered below the date field, with triangle in the middle. Signed-off-by: Marin Treselj <marin@pixelipo.com>
This commit is contained in:
parent
586eb3ed0a
commit
82a52a8f17
|
@ -211,7 +211,8 @@ nav {
|
|||
margin-left: -54px;
|
||||
}
|
||||
|
||||
#navigation {
|
||||
#navigation,
|
||||
.ui-datepicker {
|
||||
position: relative;
|
||||
left: -100%;
|
||||
width: 160px;
|
||||
|
|
|
@ -966,9 +966,7 @@ code {
|
|||
|
||||
/* ---- jQuery UI datepicker ---- */
|
||||
.ui-widget.ui-datepicker {
|
||||
margin-left: -110px !important;
|
||||
margin-top: 10px;
|
||||
border-radius: 3px;
|
||||
|
||||
.ui-state-default,
|
||||
.ui-widget-content .ui-state-default,
|
||||
|
@ -977,12 +975,6 @@ code {
|
|||
background: inherit;
|
||||
}
|
||||
|
||||
.ui-state-hover,
|
||||
.ui-state-focus {
|
||||
background: inherit;
|
||||
color: $color-primary;
|
||||
}
|
||||
|
||||
.ui-widget-header {
|
||||
margin: 3px 3px 3px 0;
|
||||
padding: 7px 6px;
|
||||
|
@ -1014,8 +1006,13 @@ code {
|
|||
}
|
||||
|
||||
.ui-datepicker-calendar {
|
||||
th.ui-datepicker-week-end {
|
||||
color: $color-primary;
|
||||
th {
|
||||
font-weight: normal;
|
||||
color: nc-lighten($color-main-text, 33%);
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: inherit;
|
||||
}
|
||||
|
||||
td {
|
||||
|
@ -1024,19 +1021,25 @@ code {
|
|||
a {
|
||||
border-radius: 3px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
color: $color-main-text;
|
||||
}
|
||||
|
||||
&.ui-datepicker-week-end a {
|
||||
color: $color-primary;
|
||||
&.ui-datepicker-week-end a:not(.ui-state-hover),
|
||||
.ui-priority-secondary {
|
||||
color: nc-lighten($color-main-text, 33%);
|
||||
}
|
||||
|
||||
&.ui-datepicker-today a {
|
||||
&.ui-datepicker-today a:not(.ui-state-hover) {
|
||||
background-color: nc-lighten($color-main-text, 86%);
|
||||
}
|
||||
|
||||
&.ui-datepicker-current-day .ui-state-active {
|
||||
&.ui-datepicker-current-day .ui-state-active,
|
||||
.ui-state-hover,
|
||||
.ui-state-focus {
|
||||
background-color: $color-primary;
|
||||
color: $color-primary-text;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue