From b01e979d77199949ad5648f22561c20c5ea2ebef Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Fri, 3 Nov 2017 15:00:36 +0100
Subject: [PATCH] Improve timepicker design, align to datepicker
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
core/css/header.scss | 3 +-
core/css/styles.scss | 66 ++++++++++++++++++++++++++++++++++++++++++++
2 files changed, 68 insertions(+), 1 deletion(-)
diff --git a/core/css/header.scss b/core/css/header.scss
index 1e5e2846723..42f64a42edc 100644
--- a/core/css/header.scss
+++ b/core/css/header.scss
@@ -206,7 +206,8 @@ nav {
}
#navigation,
-.ui-datepicker {
+.ui-datepicker,
+.ui-timepicker.ui-widget {
position: relative;
left: -100%;
width: 160px;
diff --git a/core/css/styles.scss b/core/css/styles.scss
index d74840fe444..262cf283895 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -1070,6 +1070,72 @@ code {
background: $color-main-background;
}
+
+/* ---- jQuery UI timepicker ---- */
+.ui-widget.ui-timepicker {
+ margin-top: 10px !important;
+ width: auto !important;
+ border-radius: $border-radius;
+
+ .ui-widget-content {
+ border: none !important;
+ }
+
+ .ui-state-default,
+ .ui-widget-content .ui-state-default,
+ .ui-widget-header .ui-state-default {
+ border: 1px solid transparent;
+ background: inherit;
+ }
+ .ui-widget-header {
+ padding: 7px;
+ font-size: 13px;
+ border: none;
+ background-color: $color-main-background;
+ color: $color-main-text;
+
+ .ui-timepicker-title {
+ line-height: 1;
+ font-weight: 300;
+ }
+ }
+ .ui-timepicker-table {
+ th {
+ font-weight: normal;
+ color: nc-lighten($color-main-text, 33%);
+ opacity: .8;
+ }
+ tr:hover {
+ background-color: inherit;
+ }
+ td {
+ > * {
+ border-radius: 50%;
+ text-align: center;
+ font-weight: normal;
+ color: $color-main-text;
+ padding: 8px 7px;
+ font-size: .9em;
+ line-height: 12px;
+ }
+
+ &.ui-timepicker-hour-cell a.ui-state-active,
+ &.ui-timepicker-minute-cell a.ui-state-active,
+ .ui-state-hover,
+ .ui-state-focus {
+ background-color: $color-primary;
+ color: $color-primary-text;
+ font-weight: bold;
+ }
+
+ &.ui-timepicker-minutes:not(.ui-state-hover) {
+ color: nc-lighten($color-main-text, 33%);
+ opacity: .8;
+ }
+ }
+ }
+}
+
/* ---- DIALOGS ---- */
#oc-dialog-filepicker-content {
--
GitLab