diff options
author | Marin Treselj <marin@pixelipo.com> | 2017-07-13 15:15:29 +0200 |
---|---|---|
committer | Roeland Jago Douma <roeland@famdouma.nl> | 2017-07-23 14:06:04 +0200 |
commit | 586eb3ed0a3bdd8750f92fcc67d378989413c2bd (patch) | |
tree | a2a00855c0a46efe8d86645be2e65854bcf4d100 /core/css | |
parent | 46332b0d8e111a3df3efd7fc7081afa7eade3ade (diff) | |
download | nextcloud-server-586eb3ed0a3bdd8750f92fcc67d378989413c2bd.tar.gz nextcloud-server-586eb3ed0a3bdd8750f92fcc67d378989413c2bd.zip |
Redesign jQuery UI datepicker
Signed-off-by: Marin Treselj <marin@pixelipo.com>
Diffstat (limited to 'core/css')
-rw-r--r-- | core/css/apps.scss | 3 | ||||
-rw-r--r-- | core/css/inputs.scss | 5 | ||||
-rw-r--r-- | core/css/styles.scss | 79 |
3 files changed, 84 insertions, 3 deletions
diff --git a/core/css/apps.scss b/core/css/apps.scss index fd26f46bcdb..e4592ad9489 100644 --- a/core/css/apps.scss +++ b/core/css/apps.scss @@ -595,7 +595,8 @@ kbd { .bubble, .app-navigation-entry-menu, -.popovermenu { +.popovermenu, +.ui-datepicker { position: absolute; background-color: $color-main-background; color: nc-lighten($color-main-text, 20%); diff --git a/core/css/inputs.scss b/core/css/inputs.scss index 13a164e13f2..3ea90d322bb 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -492,8 +492,9 @@ input { } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { - border: none; - background: nc-darken($color-main-background, 3%); + border: 1px solid transparent; + background: inherit; + color: $color-primary; } /* Animation */ diff --git a/core/css/styles.scss b/core/css/styles.scss index 35fc300eafe..8cb3033be51 100644 --- a/core/css/styles.scss +++ b/core/css/styles.scss @@ -964,6 +964,85 @@ code { background-image: url('../img/actions/play-previous.svg?v=1'); } +/* ---- 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, + .ui-widget-header .ui-state-default { + border: 1px solid transparent; + background: inherit; + } + + .ui-state-hover, + .ui-state-focus { + background: inherit; + color: $color-primary; + } + + .ui-widget-header { + margin: 3px 3px 3px 0; + padding: 7px 6px; + font-size: 13px; + border: none; // 1px solid #dbdbdb; + border-radius: 3px; + background-color: $color-main-background; + color: $color-main-text; + + .ui-datepicker-title { + line-height: 1; + } + + .ui-icon { + opacity: .5; + } + + .ui-state-hover .ui-icon { + opacity: 1; + } + + .ui-icon.ui-icon-circle-triangle-e { + background: url("../img/actions/arrow-right.svg") center center no-repeat; + } + + .ui-icon.ui-icon-circle-triangle-w { + background: url("../img/actions/arrow-left.svg") center center no-repeat; + } + } + + .ui-datepicker-calendar { + th.ui-datepicker-week-end { + color: $color-primary; + } + + td { + padding: 0; + + a { + border-radius: 3px; + text-align: center; + } + + &.ui-datepicker-week-end a { + color: $color-primary; + } + + &.ui-datepicker-today a { + background-color: nc-lighten($color-main-text, 86%); + } + + &.ui-datepicker-current-day .ui-state-active { + background-color: $color-primary; + color: $color-primary-text; + } + } + } +} + + .ui-datepicker-prev, .ui-datepicker-next { border: nc-lighten($color-main-text, 86%); background: $color-main-background; |