Foundry/.dungeon
0
0
Fork 0
Code Issues 57 Pull requests Projects Releases 7 Packages Wiki Activity Actions

Begin getting a layout that has some semblance of a character sheet working.

Browse source
This commit is contained in:
Oliver-Akins 2023-11-25 00:32:53 -07:00
parent 0d19becd74
commit 89ccb742f8
10 changed files with 241 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

102
styles/root.scss
View file

@ -1,9 +1,101 @@
@use "./vars/_colours.scss" as *;
@use "./mixins/sr-only.scss" as *;
.screenreader {
background-color: $background;
color: $background;
.dotdungeon {
container-type: size;
@include sr-only;
&.actor {
&--pc {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(12, minmax(0, 1fr));
.panel {
&--avatar {
grid-row: 1 / span 2;
}
&--stats {
grid-column: 2 / span 2;
}
&--skills {
grid-column: 2 / span 2;
}
&--backpack {
grid-row: 3 / span 5;
}
&--sync {}
&--aspect {
grid-row: span 2;
}
&--weapons {
grid-row: span 2;
}
&--roles {
grid-row: span 3;
}
&--spells {
grid-row: span 2;
}
&--mounts {}
&--summons {}
&--notes {}
&--storage {}
}
}
}
.panel {
background: white;
border: 2px solid black;
&__header {
background: black;
color: white;
display: flex;
flex-direction: row;
h2 {
flex-grow: 1;
}
.icon {
$size: 32px;
height: $size;
width: $size;
aspect-ratio: 1;
}
}
}
}
@container (max-width: $breakpoint-medium) {
.dotdungeon {
&.actor {
&--pc {
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(12, minmax(0, 1fr));
}
}
}
}
@container (max-width: $breakpoint-small) {
.dotdungeon {
&.actor {
&--pc {
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(12, minmax(0, 1fr));
}
}
}
}
@container (max-width: $breakpoint-extra-small) {
.dotdungeon {
&.actor {
&--pc {
grid-template-columns: repeat(3, minmax(0, 1fr));
grid-template-rows: repeat(12, minmax(0, 1fr));
}
}
}
}