From 369de95fb449313a8ad17eef038970b0bc017ada Mon Sep 17 00:00:00 2001 From: Felix Niklas Date: Wed, 24 Jun 2015 15:16:13 +0200 Subject: [PATCH] sla list: inline controls, make filters and times stay in line on smaller screens, let business hours slip into the same line as filters on big screens --- .../app/views/layout_ref/sla.jst.eco | 54 ++++++++++--------- app/assets/stylesheets/zammad.css.scss | 37 ++++++------- 2 files changed, 48 insertions(+), 43 deletions(-) diff --git a/app/assets/javascripts/app/views/layout_ref/sla.jst.eco b/app/assets/javascripts/app/views/layout_ref/sla.jst.eco index 39c5cf4cb..63903522e 100644 --- a/app/assets/javascripts/app/views/layout_ref/sla.jst.eco +++ b/app/assets/javascripts/app/views/layout_ref/sla.jst.eco @@ -77,19 +77,21 @@
-
-

Filters

- Where Organization equals to Deutsche Bank.
- Where Priority is high. -
-
- -
-
-

Repsonse Times

- 00:30 Stunden First Response Time
- 02:00 Stunden Update Time
- 48:00 Stunden Solution Time +
+
+

Filters

+ Where Organization equals to Deutsche Bank.
+ Where Priority is high. +
+
+ +
+
+

Repsonse Times

+ 00:30 hours First Response Time
+ 02:00 hours Update Time
+ 48:00 hours Solution Time +

Business Hours in European Central Time

@@ -102,18 +104,20 @@
-
-

Filters

- Where Organization equals to Deutsche Bank.
- Where Priority is high. -
-
- -
-
-

Repsonse Times

- 00:30 Stunden First Response Time
- 01:00 Stunden Update Time +
+
+

Filters

+ Where Organization equals to Deutsche Bank.
+ Where Priority is high. +
+
+ +
+
+

Repsonse Times

+ 00:30 hours First Response Time
+ 01:00 hours Update Time +

Business Hours in European Central Time

diff --git a/app/assets/stylesheets/zammad.css.scss b/app/assets/stylesheets/zammad.css.scss index 46dba6f0c..ff9a434a0 100644 --- a/app/assets/stylesheets/zammad.css.scss +++ b/app/assets/stylesheets/zammad.css.scss @@ -5525,28 +5525,37 @@ output { background: white; border: 1px solid hsl(199,44%,93%); color: hsl(206,7%,28%); + box-shadow: 0 2px hsl(210,7%,94%); display: flex; flex-wrap: wrap; - padding: 20px; - box-shadow: 0 2px hsl(210,7%,94%); + padding: 10px; & + .sla { margin-top: 17px; } &.is-inactive { + background: none; box-shadow: none; position: relative; top: 2px; - background: none; + border-color: hsl(199,44%,94%); & > *:not(.sla-controls) { opacity: 0.33; } + } - .sla-controls .btn { - background: none; - } + .sla-flow { + display: flex; + } + + .sla-filters, + .sla-arrow, + .sla-times, + .sla-businessHours, + .sla-controls { + padding: 10px; } h3 { @@ -5554,9 +5563,9 @@ output { margin-top: 0; } - .arrow { + .sla-arrow { align-self: center; - margin: 22px 50px 0; + margin: 22px 20px 0; .icon { width: 15px; @@ -5565,18 +5574,10 @@ output { } } - .sla-businessHours { - flex-basis: 100%; - margin: 20px 0; - } - .sla-controls { - flex-basis: 100%; display: flex; - - .sla-edit { - margin-left: auto; - } + margin-left: auto; + align-items: flex-end; } }