diff --git a/src/styles/base/main.scss b/src/styles/base/main.scss index 7b459ab..283f1be 100644 --- a/src/styles/base/main.scss +++ b/src/styles/base/main.scss @@ -20,11 +20,12 @@ $breakpoints: (phone: 480px, background-color: $color-210-25-95; color: $color-213-4-50; font-size: 1.6rem; - overflow-y: scroll; - } - - html { - overflow-y: scroll; + overflow: hidden; + overflow-wrap: break-word; + display: flex; + flex-direction: column; + height: 100vh; + overflow: hidden; } main { @@ -101,7 +102,7 @@ h5 { flex: 1; font-size: 1.6rem; margin: 0 auto; - min-height: 100%; + min-height: calc(100vh - 84px); } &.with-padding { diff --git a/src/styles/base/menu-left.scss b/src/styles/base/menu-left.scss index a3b7ac9..35409ef 100644 --- a/src/styles/base/menu-left.scss +++ b/src/styles/base/menu-left.scss @@ -2,8 +2,8 @@ background-color: $color-233-18-29; color: $color-0-0-100; display: block; - height: auto; - max-width: 250px; + overflow: auto; + flex: 0 0 16em; transition: flex-basis 0.5s ease-in-out; &.open { @@ -90,41 +90,6 @@ } .sub-menu { - - sib-set-default[name='project'] { - padding: 1rem 1rem 1rem 3.2rem; - - .project-customer, - .project-name { - display: inline-block; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - - .project-customer { - font-weight: bold; - width: 150px; - } - - .project-name { - padding-left: 14px; - width: calc(150px - 10px); /* 10px = padding of the sib-set-default = better alignment */ - } - - &:hover { - background-color: $color-233-20-17; - box-shadow: 0 0 7px 0 rgba(0, 0, 0, 0.26); - color: $color-218-100-98; - /* transition: all 0.6s cubic-bezier(0.39, 0.575, 0.565, 1); Need better animation */ - width: auto; - - .project-customer, - .project-name { - width: auto; - } - } - } sib-display>div { @@ -143,10 +108,20 @@ color: $color-244-10-70; cursor: pointer; padding: 10px 10px 10px 32px; - } - - &[fields="project(customer.name, name), badge"]>div { - padding: 0; + } + + sib-route[name='project'] { + display: flex; + flex: 3; + + sib-display-value { + display: block; + height: 20px; + } + + sib-display-value[name='dash'] { + margin: 0 0.4em; + } } } @@ -190,4 +165,3 @@ } } } -