diff --git a/Maximum Apocalypse/MaximumApocalypse.css b/Maximum Apocalypse/MaximumApocalypse.css index 09eb398948..4e2c5093da 100644 --- a/Maximum Apocalypse/MaximumApocalypse.css +++ b/Maximum Apocalypse/MaximumApocalypse.css @@ -1,14 +1,46 @@ @import url('https://fonts.googleapis.com/css?family=Blinker|Bangers'); +/* ---------------- encum section --------------*/ + +.sheet-experience-banner { grid-area: experience-banner; font-family: 'Bangers'; font-size: 16px; justify-self: center;} +.sheet-experience-unused-label { grid-area: experience-unused-label; } +.sheet-experience-total-label { grid-area: experience-total-label; } +.sheet-experience-unused { grid-area: experience-unused; } +.sheet-experience-total { grid-area: experience-total; } + +/* ---------------- encum section --------------*/ + +.sheet-encum-table { + grid-area: encum-table; + display: grid; + grid-template-columns: 5fr 3fr 1fr; + grid-template-rows: 1fr min-content min-content min-content; + grid-template-areas: "encum-banner encum-banner encum-banner" + "encum-head encum-head encum-head" + "encum-max-label encum-current-label encum-exceeded-label" + "encum-max encum-current encum-exceeded"; + align-items: self-end; + margin-left: 6px; +} + +.sheet-encum-banner { grid-area: encum-banner; } +.sheet-encum-head { grid-area: encum-head; } +.sheet-encum.sheet-max-label { grid-area: encum-max-label; background: #FFFFFF; border: 2px solid #000000; font-size: 12px;} +.sheet-encum.sheet-current-label { grid-area: encum-current-label; background: #FFFFFF; border: 2px solid #000000; font-size: 12px;} +.sheet-encum.sheet-exceeded-label { grid-area: encum-exceeded-label; background: #FFFFFF; border: 2px solid #000000; font-size: 12px;} +.sheet-encum.sheet-max { grid-area: encum-max; background: #FFFFFF; border: 2px solid #000000;} +.sheet-encum.sheet-current { grid-area: encum-current; background: #FFFFFF; border: 2px solid #000000;} +.sheet-encum.sheet-exceeded { grid-area: encum-exceeded; background: #FFFFFF; border: 2px solid #000000; padding: 5px;} + /* ---------------- build section --------------*/ .sheet-build-table { grid-area: build-table; display: grid; - grid-template-columns: min-content 23px 45px 45px 45px; + grid-template-columns: min-content 26px 45px 45px 45px; grid-template-rows: auto; - grid-template-areas: "build-banner build-banner build-input build-input build-input" + grid-template-areas: "build-banner build-banner build-banner build-banner build-banner" "head-desc head-prof head-thresh head-thresh-h head-thresh-q" "crafting-desc crafting-prof crafting-thresh crafting-thresh-h crafting-thresh-q" "mechanics-desc mechanics-prof mechanics-thresh mechanics-thresh-h mechanics-thresh-q" @@ -1161,7 +1193,7 @@ input[type=number].sheet-table-cell { "sp-stats sp-stats sp-stats sp-stats" "defense attacks attacks attacks" "gear abilities cp resolve-infection" - "gear build-encum cp experience"; + "gear build-encum build-encum experience"; } /* ------------------- SIMPLE GRID AREAS ---------------------*/ @@ -1287,12 +1319,19 @@ input[type=number].sheet-table-cell { display: grid; grid-template-columns: auto; grid-template-rows: auto; - grid-template-areas: "build-table encumbrance-table"; + grid-template-areas: "build-table encum-table"; } .sheet-experience { grid-area: experience; - background-color: green; + display: grid; + grid-template-columns: 65px 65px; + grid-template-rows: min-content min-content min-content; + grid-template-areas: "experience-banner experience-banner" + "experience-unused-label experience-total-label" + "experience-unused experience-total"; + align-self: flex-end; + justify-self: center; } .sheet-character-name-input { grid-area: character-name-input;} diff --git a/Maximum Apocalypse/MaximumApocalypse.html b/Maximum Apocalypse/MaximumApocalypse.html index 7f94372cba..a0c677bda4 100644 --- a/Maximum Apocalypse/MaximumApocalypse.html +++ b/Maximum Apocalypse/MaximumApocalypse.html @@ -241,10 +241,10 @@