From 183cb6b590e3b72f3c977484d18deb3adfeff0f2 Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Mon, 21 Sep 2020 10:17:08 +0200 Subject: [PATCH 1/8] Several improvements to solve issues . Remove display:grid for top and bottom positions . Move rtl definition for footer to _footer.scss ([dir=rtl] & ) . Add margin to form control-group . Add underline for links without class (e.g. in text) . Change padding and position for mod-list on sidebar . Improve links in mod-menu on sidebar --- .../cassiopeia/scss/blocks/_css-grid.scss | 21 --------------- templates/cassiopeia/scss/blocks/_footer.scss | 9 +++++++ templates/cassiopeia/scss/blocks/_form.scss | 4 +++ templates/cassiopeia/scss/blocks/_global.scss | 4 +++ .../cassiopeia/scss/blocks/_modifiers.scss | 27 +++++++++++++++++++ templates/cassiopeia/scss/template-rtl.scss | 8 ------ 6 files changed, 44 insertions(+), 29 deletions(-) diff --git a/templates/cassiopeia/scss/blocks/_css-grid.scss b/templates/cassiopeia/scss/blocks/_css-grid.scss index 8f09dca89549b..cab5c8e0800ad 100644 --- a/templates/cassiopeia/scss/blocks/_css-grid.scss +++ b/templates/cassiopeia/scss/blocks/_css-grid.scss @@ -135,24 +135,3 @@ .system-debug { grid-area: debug; } - -.container-top-a, -.container-top-b, -.container-bottom-a, -.container-bottom-b { - display: grid; - grid-gap: $cassiopeia-grid-gutter; - grid-template-columns: 1fr; - - > * { - margin: 0; - } - - @include media-breakpoint-up(sm) { - grid-template-columns: 1fr 1fr; - } - - @include media-breakpoint-up(md) { - grid-template-columns: repeat(auto-fit, minmax(24%, 1fr)); - } -} diff --git a/templates/cassiopeia/scss/blocks/_footer.scss b/templates/cassiopeia/scss/blocks/_footer.scss index 1259e8bd246bb..5e071cfd5be46 100644 --- a/templates/cassiopeia/scss/blocks/_footer.scss +++ b/templates/cassiopeia/scss/blocks/_footer.scss @@ -23,4 +23,13 @@ background: $white; border-radius: $border-radius; } + + [dir=rtl] & { + background-image: $cassiopeia-header-grad-rtl; + + .back-top { + margin-right: auto; + margin-left: 0; + } + } } diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 9a77b1e533e48..8bc814525c909 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -112,3 +112,7 @@ td .form-control { top: 100%; bottom: auto; } + +.control-group { + margin-top: $cassiopeia-grid-gutter*2; +} diff --git a/templates/cassiopeia/scss/blocks/_global.scss b/templates/cassiopeia/scss/blocks/_global.scss index 021df806bb6e5..1b571e4a72ec7 100644 --- a/templates/cassiopeia/scss/blocks/_global.scss +++ b/templates/cassiopeia/scss/blocks/_global.scss @@ -26,6 +26,10 @@ h6 { a { color: var(--cassiopeia-color-primary); + &:not([class]) { + text-decoration: underline; + } + &:hover, &:focus { color: var(--cassiopeia-color-hover); diff --git a/templates/cassiopeia/scss/blocks/_modifiers.scss b/templates/cassiopeia/scss/blocks/_modifiers.scss index d85dc22825f85..531fb4104f8a1 100644 --- a/templates/cassiopeia/scss/blocks/_modifiers.scss +++ b/templates/cassiopeia/scss/blocks/_modifiers.scss @@ -275,3 +275,30 @@ } } } + +.mod-list { + padding-left: 0; + list-style-position: inside; + + [dir=rtl] & { + padding-right: 0; + } +} + +.mod-menu.nav { + li { + padding: ($cassiopeia-grid-gutter/2) 0; + + a { + text-decoration: none; + } + + &.active > a { + text-decoration: underline; + } + + .mod-menu__sub { + padding-left: $cassiopeia-grid-gutter; + } + } +} diff --git a/templates/cassiopeia/scss/template-rtl.scss b/templates/cassiopeia/scss/template-rtl.scss index 400ac4f69797f..614c80c8e8003 100644 --- a/templates/cassiopeia/scss/template-rtl.scss +++ b/templates/cassiopeia/scss/template-rtl.scss @@ -116,11 +116,3 @@ dd { .btn-group > .btn-group:not(:first-child) { @include border-right-radius(0); } - -.footer { - background-image: $cassiopeia-header-grad-rtl; - .back-top { - margin-right: auto; - margin-left: 0; - } -} From 9fd947c3d64b2331635c03c286f8eeb4f80bf6ea Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Mon, 21 Sep 2020 10:22:29 +0200 Subject: [PATCH 2/8] Underlines in metismenu --- templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss index 0df81599022bc..4a659ac00810d 100644 --- a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss +++ b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss @@ -31,8 +31,13 @@ > a { flex: 1 0 0%; overflow: hidden; + text-decoration: none; text-overflow: ellipsis; white-space: nowrap; + + &:hover { + text-decoration: underline; + } } } From 1805cf1f5f5e4a0813e31eca13ee064a89f3a440 Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Mon, 21 Sep 2020 10:29:02 +0200 Subject: [PATCH 3/8] Resolve issue #97 --- templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss index 4a659ac00810d..b7bc32e76e347 100644 --- a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss +++ b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss @@ -23,7 +23,7 @@ @include media-breakpoint-down(md) { width: 100%; } - .active a { + .active > a { text-decoration: underline; } } From 6707bfa6349c6e89de8039140088ceaa7ef0c933 Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Mon, 21 Sep 2020 15:52:20 +0200 Subject: [PATCH 4/8] Correct margin fieldset Issue #92 --- templates/cassiopeia/scss/blocks/_form.scss | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 8bc814525c909..1cb89fb8bb797 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -108,6 +108,10 @@ td .form-control { bottom: 100%; } +fieldset + fieldset { + margin-top: $cassiopeia-grid-gutter*2; +} + .container-popup [id="filter[search]-desc"] { top: 100%; bottom: auto; @@ -116,3 +120,7 @@ td .form-control { .control-group { margin-top: $cassiopeia-grid-gutter*2; } + +.com-users-login__options { + margin-top: $cassiopeia-grid-gutter*2; +} From e16597b493ba331dc4d03ef5f92f00931ded46d1 Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Tue, 22 Sep 2020 11:55:28 +0200 Subject: [PATCH 5/8] Margin for fieldset, correct underline for metismenu --- templates/cassiopeia/scss/blocks/_form.scss | 4 ++++ .../cassiopeia/scss/vendor/metismenu/_metismenu.scss | 9 +++++---- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 1cb89fb8bb797..881f76f837039 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -112,6 +112,10 @@ fieldset + fieldset { margin-top: $cassiopeia-grid-gutter*2; } +fieldset:only-child { + margin-top: $cassiopeia-grid-gutter*2; +} + .container-popup [id="filter[search]-desc"] { top: 100%; bottom: auto; diff --git a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss index b7bc32e76e347..5f84000808712 100644 --- a/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss +++ b/templates/cassiopeia/scss/vendor/metismenu/_metismenu.scss @@ -26,6 +26,11 @@ .active > a { text-decoration: underline; } + + span:hover, + a:hover { + text-decoration: underline; + } } > span, > a { @@ -34,10 +39,6 @@ text-decoration: none; text-overflow: ellipsis; white-space: nowrap; - - &:hover { - text-decoration: underline; - } } } From d60f3eb9ab5f0ec6f8cf46979f2c75e4be1cc33b Mon Sep 17 00:00:00 2001 From: Hans Kuijpers Date: Wed, 23 Sep 2020 09:00:31 +0200 Subject: [PATCH 6/8] apply lobotomized owl inspector on fieldsets and fields --- templates/cassiopeia/scss/blocks/_form.scss | 16 +++++++--------- 1 file changed, 7 insertions(+), 9 deletions(-) diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 881f76f837039..788705b34b997 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -108,12 +108,14 @@ td .form-control { bottom: 100%; } -fieldset + fieldset { - margin-top: $cassiopeia-grid-gutter*2; -} +fieldset { + + fieldset { + margin-top: $cassiopeia-grid-gutter*2; + } -fieldset:only-child { - margin-top: $cassiopeia-grid-gutter*2; + > * + * { + margin-top: $cassiopeia-grid-gutter*2; + } } .container-popup [id="filter[search]-desc"] { @@ -121,10 +123,6 @@ fieldset:only-child { bottom: auto; } -.control-group { - margin-top: $cassiopeia-grid-gutter*2; -} - .com-users-login__options { margin-top: $cassiopeia-grid-gutter*2; } From dd1f1c192b872d16f4cd148d8f6ba51988d22110 Mon Sep 17 00:00:00 2001 From: Hans Kuijpers Date: Wed, 23 Sep 2020 09:35:22 +0200 Subject: [PATCH 7/8] rest margin-bottom on direct children of fieldset --- templates/cassiopeia/scss/blocks/_form.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index 788705b34b997..ef2f221f7b46c 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -112,6 +112,10 @@ fieldset { + fieldset { margin-top: $cassiopeia-grid-gutter*2; } + + > * { + margin-bottom: 0 + } > * + * { margin-top: $cassiopeia-grid-gutter*2; From 5ea9acf7aab7cf4bd1530a7f71fd540ded1d3359 Mon Sep 17 00:00:00 2001 From: Viviana Menzel Date: Thu, 24 Sep 2020 10:29:21 +0200 Subject: [PATCH 8/8] Add margin to fieldset and control-group --- templates/cassiopeia/scss/blocks/_form.scss | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/templates/cassiopeia/scss/blocks/_form.scss b/templates/cassiopeia/scss/blocks/_form.scss index ef2f221f7b46c..18df393e0234a 100644 --- a/templates/cassiopeia/scss/blocks/_form.scss +++ b/templates/cassiopeia/scss/blocks/_form.scss @@ -109,10 +109,11 @@ td .form-control { } fieldset { + margin-bottom: $cassiopeia-grid-gutter*2; + fieldset { margin-top: $cassiopeia-grid-gutter*2; } - + > * { margin-bottom: 0 } @@ -122,6 +123,9 @@ fieldset { } } +.control-group { + margin: $cassiopeia-grid-gutter 0; +} .container-popup [id="filter[search]-desc"] { top: 100%; bottom: auto;