.dungeon/styles/sheets/actor/char-sheet/pages/inventory.scss
2024-03-08 21:14:30 -07:00

58 lines
No EOL
1 KiB
SCSS

@use "../../../../mixins/material" as material;
.dotdungeon .actor--pc-v2 .active.inventory-page {
padding-bottom: 50px;
height: 100%;
}
.dotdungeon .actor--pc-v2 .inventory-page .active.tab[data-tab="player"] {
display: grid;
gap: 16px;
grid-template-columns: 1fr 2fr;
grid-template-rows: 1fr repeat(3, min-content);
height: 100%;
color: white;
.item-list {
grid-row: 1 / -1;
grid-column: 2;
display: flex;
flex-direction: column;
}
.panel {
padding: 8px;
border-radius: 4px;
}
.bytes-panel {
display: grid;
grid-template-columns: 1fr min-content 50px min-content;
gap: 8px;
align-items: center;
label {
justify-self: left;
}
input {
@include material.elevate(3);
border: none;
border-radius: 4px;
text-align: center;
color: white;
&:hover {
@include material.elevate(6);
background: hsl( from currentColor / 50% ); // probably gonna need color-mix
}
&:focus-visible {
border-width: 2px;
border-color: currentColor;
background: var(--elevation-8dp-bg);
}
}
}
}