61 lines
934 B
CSS
61 lines
934 B
CSS
|
.widget-wrapper {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: var(--wowp-gap);
|
||
|
|
}
|
||
|
|
|
||
|
|
.top-widgets {
|
||
|
|
order: 1;
|
||
|
|
grid-area: 1 / 2 / 2 / 3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.top-title {
|
||
|
|
order: 1;
|
||
|
|
grid-area: 1 / 2 / 2 / 3;
|
||
|
|
@apply bg-glass shadow text-4xl font-bold text-center p-2;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content {
|
||
|
|
order: 3;
|
||
|
|
grid-area: 2 / 2 / 4 / 3;
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
#main {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
gap: var(--wowp-gap);
|
||
|
|
}
|
||
|
|
|
||
|
|
.left-widgets {
|
||
|
|
order: 4;
|
||
|
|
grid-area: 1 / 1 / 3 / 2;
|
||
|
|
@media screen(xl){
|
||
|
|
padding-left: var(--wowp-gap);
|
||
|
|
min-width: 420px;
|
||
|
|
max-width: 420px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.right-widgets {
|
||
|
|
order:0;
|
||
|
|
grid-area: 1 / 3 / 3 / 6;
|
||
|
|
@media screen(xl){
|
||
|
|
padding-right: var(--wowp-gap);
|
||
|
|
min-width: 420px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.bottom-widgets {
|
||
|
|
order: 5;
|
||
|
|
grid-area: 4 / 2 / 4 / 3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.widget{
|
||
|
|
@apply bg-glass p-2 shadow text-center;
|
||
|
|
|
||
|
|
h3{
|
||
|
|
font-size: 1.3em;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
}
|