Change from flex to grid, for the header

Flex is just too… flexible, I need something more rigid like grid
This commit is contained in:
Lim Chee Aun 2022-12-19 19:24:39 +08:00
parent da19e7ad02
commit 943c017928

View file

@ -78,17 +78,18 @@ a.mention span {
backdrop-filter: blur(12px); backdrop-filter: blur(12px);
border-bottom: 1px solid var(--divider-color); border-bottom: 1px solid var(--divider-color);
z-index: 1; z-index: 1;
display: flex;
align-items: center;
cursor: default; cursor: default;
z-index: 10; z-index: 10;
} display: grid;
.deck header > *:not(button) { grid-template-columns: 1fr 1fr 1fr;
flex-grow: 1; align-items: center;
min-width: 44px;
} }
.deck header > .header-side:last-of-type { .deck header > .header-side:last-of-type {
text-align: right; text-align: right;
grid-column: 3;
}
.deck header :is(button, .button).plain {
backdrop-filter: none;
} }
.deck header h1 { .deck header h1 {
margin: 0 8px; margin: 0 8px;