51 lines
No EOL
1.2 KiB
CSS
51 lines
No EOL
1.2 KiB
CSS
.layout {
|
|
display: grid;
|
|
grid: auto minmax(0, 1fr) / 100%;
|
|
inline-size: 100%;
|
|
block-size: 100%;
|
|
overflow: clip;
|
|
background-color: var(--surface-1);
|
|
|
|
.menu {
|
|
display: grid;
|
|
grid-template-columns: auto minmax(0, 1fr) auto;
|
|
grid-auto-flow: column;
|
|
justify-content: start;
|
|
justify-items: start;
|
|
position: relative;
|
|
z-index: 10;
|
|
|
|
gap: .5em;
|
|
padding-inline: 1em;
|
|
block-size: calc(env(titlebar-area-height, 2em) + .5px);
|
|
inline-size: env(titlebar-area-width, 100%);
|
|
-webkit-app-region: drag;
|
|
|
|
background-color: var(--surface-3);
|
|
color: var(--text-1);
|
|
|
|
& > * {
|
|
-webkit-app-region: no-drag;
|
|
}
|
|
|
|
& > .logo {
|
|
inline-size: 3em;
|
|
block-size: 3em;
|
|
padding: .75em;
|
|
margin-block-end: -1em;
|
|
background-color: inherit;
|
|
color: inherit;
|
|
border-radius: .25em;
|
|
|
|
& > svg {
|
|
inline-size: 100%;
|
|
block-size: 100%;
|
|
}
|
|
}
|
|
|
|
& .right {
|
|
display: grid;
|
|
align-content: center;
|
|
}
|
|
}
|
|
} |