Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

improvements to relative panel sizing

Browse source
This commit is contained in:
Henry Jameson 2022-04-10 22:37:08 +03:00
parent fe8b5b62ae
commit 5d203e93ae
2 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/App.scss
View file

@ -2,7 +2,7 @@
@import './_variables.scss'; @import './_variables.scss';
:root { :root {
--navbar-height: 3.5em; --navbar-height: 3.5rem;
} }
html { html {

12
src/panel.scss
View file

@ -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 {