diff --git a/UI/WebServerResources/scss/components/button/button.scss b/UI/WebServerResources/scss/components/button/button.scss index bd5cc75d3..2f1860a34 100644 --- a/UI/WebServerResources/scss/components/button/button.scss +++ b/UI/WebServerResources/scss/components/button/button.scss @@ -21,7 +21,7 @@ md-sidenav md-list .md-button { } .md-sidenav-left .md-button [class^="md-icon"] { - margin-right: 1em; + //margin-right: 1em; } md-sidenav .md-button.iconButton.sg-button-navicon [class^="md-icon"] { margin: 0; @@ -66,7 +66,7 @@ $button-fab-height: 56px; // z-index provides a stacking context that prevent ripple-effect from overflowing z-index: 1; overflow: hidden; - padding: $iconButton-padding 0; + //padding: $iconButton-padding 0; border-radius: 50%; color: inherit; min-width: $iconButton-size; @@ -76,18 +76,19 @@ $button-fab-height: 56px; &:active { background-color: transparent; - [class ^= md-icon], - [class *= md-icon-] { + [class^=md-icon], + [class*=md-icon-] { transform: scale($iconButton-hover-scale); } } - [class ^= md-icon], - [class *= md-icon-] { + [class^=md-icon], + [class*=md-icon-] { padding: $iconButton-icon-padding; color: currentColor; font-size: $iconButton-icon-size; transition: $iconButton-transition; + vertical-align: middle; } .md-icon-arrow-back { font-size: sg-size('headline') diff --git a/UI/WebServerResources/scss/components/list/list.scss b/UI/WebServerResources/scss/components/list/list.scss index fad31d853..ad2a222fb 100644 --- a/UI/WebServerResources/scss/components/list/list.scss +++ b/UI/WebServerResources/scss/components/list/list.scss @@ -23,14 +23,14 @@ // List item label md-list { - .sg-item-name { - font-size: sg-size(button); - text-transform: initial; - overflow: hidden; - text-align: left; - text-overflow: ellipsis; - white-space: nowrap; - } + .sg-item-name { + font-size: sg-size(button); + text-transform: initial; + overflow: hidden; + text-align: left; + text-overflow: ellipsis; + white-space: nowrap; + } } // The right tile for a list item. diff --git a/UI/WebServerResources/scss/components/sidenav/sidenav.scss b/UI/WebServerResources/scss/components/sidenav/sidenav.scss index 367168deb..c3ad2afd2 100644 --- a/UI/WebServerResources/scss/components/sidenav/sidenav.scss +++ b/UI/WebServerResources/scss/components/sidenav/sidenav.scss @@ -80,15 +80,5 @@ $i: 1; &.sg-loading { color: sg-color($sogoBlue, 200); } - .sg-item-name, .md-label { - font-size: sg-size(button); - overflow: hidden; - text-align: left; - text-overflow: ellipsis; - white-space: nowrap; - } - .md-label { - display: inline; - } } } diff --git a/UI/WebServerResources/scss/components/subheader/subheader.scss b/UI/WebServerResources/scss/components/subheader/subheader.scss index 3e5b08f11..8b03fe99d 100644 --- a/UI/WebServerResources/scss/components/subheader/subheader.scss +++ b/UI/WebServerResources/scss/components/subheader/subheader.scss @@ -1,11 +1,19 @@ -/// subheader.scss -*- Mode: text; indent-tabs-mode: nil; basic-offset: 2 -*- +/// subheader.scss -*- Mode: scss; indent-tabs-mode: nil; basic-offset: 2 -*- @import 'extends'; +.md-subheader { + .md-subheader-inner { + padding: 0 0 0 $layout-gutter-width; + } +} + .sg-md-subheader { - position: fixed; - z-index: auto; - padding: $baseline-grid $baseline-grid $baseline-grid $layout-gutter-width; - background-color: transparent; + &--fixed { + position: fixed; + z-index: auto; + padding: $baseline-grid $baseline-grid $baseline-grid $layout-gutter-width; + background-color: transparent; + } &--static { position: static; z-index: auto; diff --git a/UI/WebServerResources/scss/views/ContactsUI.scss b/UI/WebServerResources/scss/views/ContactsUI.scss index 0739e0384..8aaee82b0 100644 --- a/UI/WebServerResources/scss/views/ContactsUI.scss +++ b/UI/WebServerResources/scss/views/ContactsUI.scss @@ -1,6 +1,6 @@ -/// ContactsUI.scss -*- Mode: text; indent-tabs-mode: nil; basic-offset: 2 -*- +/// ContactsUI.scss -*- Mode: scss; indent-tabs-mode: nil; basic-offset: 2 -*- -[id = "contactsList"] .sg-md-subheader { +[id="contactsList"] .sg-md-subheader { transform: translateY(-100%); // Compensate the container top-margin }