improvements to relative panel sizing
This commit is contained in:
parent
fe8b5b62ae
commit
5d203e93ae
|
@ -2,7 +2,7 @@
|
||||||
@import './_variables.scss';
|
@import './_variables.scss';
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--navbar-height: 3.5em;
|
--navbar-height: 3.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
|
|
|
@ -34,6 +34,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.panel-heading {
|
.panel-heading {
|
||||||
|
--panel-heading-height: 3.2em;
|
||||||
|
--panel-heading-height-padding: 0.6em;
|
||||||
|
--__panel-heading-height-inner: calc(var(--panel-heading-height) - 2 * var(--panel-heading-height-padding));
|
||||||
|
|
||||||
position: relative;
|
position: relative;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -43,7 +47,7 @@
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
padding: 0.6em 0.6em;
|
padding: 0.6em 0.6em;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
line-height: calc(var(--panel-heading-height) / 2);
|
line-height: var(--__panel-heading-height-inner);
|
||||||
color: var(--panelText);
|
color: var(--panelText);
|
||||||
background-color: $fallback--bg;
|
background-color: $fallback--bg;
|
||||||
background-color: var(--bg, $fallback--bg);
|
background-color: var(--bg, $fallback--bg);
|
||||||
|
@ -51,8 +55,6 @@
|
||||||
height: var(--panel-heading-height);
|
height: var(--panel-heading-height);
|
||||||
z-index: -2;
|
z-index: -2;
|
||||||
|
|
||||||
--panel-heading-height: 3.2em;
|
|
||||||
|
|
||||||
&.-flexible-height {
|
&.-flexible-height {
|
||||||
--panel-heading-height: auto;
|
--panel-heading-height: auto;
|
||||||
|
|
||||||
|
@ -120,14 +122,12 @@
|
||||||
|
|
||||||
.button-default,
|
.button-default,
|
||||||
.alert {
|
.alert {
|
||||||
// height: 100%;
|
height: var(--__panel-heading-height-inner);
|
||||||
line-height: 21px;
|
|
||||||
min-height: 0;
|
min-height: 0;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-left: 0.5em;
|
margin-left: 0.5em;
|
||||||
min-width: 1px;
|
min-width: 1px;
|
||||||
align-self: stretch;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button-default {
|
.button-default {
|
||||||
|
|
Loading…
Reference in New Issue