forked from AkkomaGang/akkoma-fe
panels now have shadow-overlay so that it's possible to have inset shadow all
over the panel, without header overlapping it
This commit is contained in:
parent
a79d9d9774
commit
3d6547001e
1 changed files with 21 additions and 4 deletions
17
src/App.scss
17
src/App.scss
|
@ -317,17 +317,34 @@ main-router {
|
||||||
|
|
||||||
.panel {
|
.panel {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin: 0.5em;
|
margin: 0.5em;
|
||||||
|
|
||||||
background-color: $fallback--bg;
|
background-color: $fallback--bg;
|
||||||
background-color: var(--bg, $fallback--bg);
|
background-color: var(--bg, $fallback--bg);
|
||||||
|
|
||||||
|
&::after, & {
|
||||||
border-radius: $fallback--panelRadius;
|
border-radius: $fallback--panelRadius;
|
||||||
border-radius: var(--panelRadius, $fallback--panelRadius);
|
border-radius: var(--panelRadius, $fallback--panelRadius);
|
||||||
|
}
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
box-shadow: 1px 1px 4px rgba(0,0,0,.6);
|
box-shadow: 1px 1px 4px rgba(0,0,0,.6);
|
||||||
box-shadow: var(--panelShadow);
|
box-shadow: var(--panelShadow);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.panel-body:empty::before {
|
.panel-body:empty::before {
|
||||||
content: "¯\\_(ツ)_/¯"; // Could use words but it'd require translations
|
content: "¯\\_(ツ)_/¯"; // Could use words but it'd require translations
|
||||||
|
|
Loading…
Reference in a new issue