- -
Languages
-
Professions
-
diff --git a/Shadow of the Weird Wizard/readme.md b/Shadow of the Weird Wizard/readme.md index 18a0d5d00c..674cf84de7 100644 --- a/Shadow of the Weird Wizard/readme.md +++ b/Shadow of the Weird Wizard/readme.md @@ -1,11 +1,11 @@ -# Roll20 Character sheet for 'Shadow of the Weird Wizard' by [Robert Schwalb](http://schwalbentertainment.com) - -## Changelog - -### 07/09/2024: Version 1 -* Created Main Character Shet -* Created NPC/Companion Character Sheet in the NPC tab -* Obtained Permission from Schwalb Entertainment to upload sheet to Roll20 - -### CSS PAIN +# Roll20 Character sheet for 'Shadow of the Weird Wizard' by [Robert Schwalb](http://schwalbentertainment.com) + +## Changelog + +### 07/09/2024: Version 1 +* Created Main Character Shet +* Created NPC/Companion Character Sheet in the NPC tab +* Obtained Permission from Schwalb Entertainment to upload sheet to Roll20 + +### CSS PAIN * Flexbox is mean, figure out a better way to present the main sheet \ No newline at end of file diff --git a/Shadow of the Weird Wizard/shadowoftheweirdwizard.css b/Shadow of the Weird Wizard/shadowoftheweirdwizard.css index 79dd726f6a..1ce52d40f3 100644 --- a/Shadow of the Weird Wizard/shadowoftheweirdwizard.css +++ b/Shadow of the Weird Wizard/shadowoftheweirdwizard.css @@ -1,349 +1,349 @@ -/*----------------- Main Layout ------------------*/ - -/* A CSS Grid example using "grid-template-areas" - https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas -*/ -main { - display: grid; - width: 1076px; - height: 900px; - grid-gap: 0px; - grid-template-columns: 269px 1fr 1fr 1fr; - grid-template-rows: 90px 1fr 1fr 1fr 20px; - grid-template-areas:"header header header power" - "common skill defence power" - "common attack attack power" - "common inv inv power" - "common inv inv power"; - -} - - -/*----------------- GENERAL CSS ------------------*/ - -section { - padding: 2px; - border-style: solid; -} - -/* CSS Flexbox styling, used for adjusting how content inside section behaves */ -.f-col { - display: flex; - flex-direction: column; -} -.f-row { - display: flex; - flex-direction: row; -} -.wrap { - display: flex; - flex-wrap: wrap; -} -.nowrap { - display: flex; - flex-wrap: nowrap; -} -.f-center { - align-items: center; - justify-content: center; -} - - -/*----------------- Text & Input styling -----------------*/ - -@import url("https://fonts.googleapis.com/css?family=Lexend&display=swap"); - - -/* these are for overwriting default CSS that comes from Roll20 */ - -.charsheet * { - font-family: "Arial", "Helvetica", "sans-serif"; -} - -.charsheet h3{ - text-align: center; - font-family: "Arial", "Helvetica", "sans-serif"; -} -.charsheet label{ - margin: 3px; - padding: 3px 0 0 0; - font-family: "Arial", "Helvetica", "sans-serif"; -} - -.charsheet input[type="text"], input[type="number"]{ - margin: 2px 4px; -} - -.charsheet textarea { - width: 95%; - height: 85%; -} - -/*------------- Section-specific CSS -------------*/ - -.header { - grid-area: header; - background-color: #f5f6fa; - flex-direction: column; -} - -.logo { - grid-area: logo; - background-color: #a396ad; - flex-direction: row; - justify-content: space-evenly; -} - -.skill { - grid-area: skill; - background-color: #f5f6fa; - justify-content: space-evenly; -} - -.defence { - grid-area: defence; - background-color: #f5f6fa; - justify-content: space-evenly; -} - -.common { - grid-area: common; - background-color: #f5f6fa; -} - -.power { - grid-area: power; - background-color: #DBD3DC; - flex-direction: column; -} - -.power .repcontainer[data-groupname="repeating_power"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_power"] .repitem{ - margin: 4px 0px; -} - -.attack { - grid-area: attack; - background-color: #f5f6fa; -} - -.inv { - grid-area: inv; - background-color: #f5f6fa; -} - -.misc { - grid-area: misc; - background-color: #f5f6fa; -} - -.footer { - grid-area: footer; - background-color: #f5f6fa; -} - -.magic { - background-color: #f5f6fa; - width: 860px; -} - -.notes { - background-color: #f5f6fa; - width: 860px; -} - -.power .repcontainer[data-groupname="repeating_spellAttack"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_spellAttack"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_spellCard"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_spellCard"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_magicTalent"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_magicTalent"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_ExtraDamage"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_ExtraDamage"] .repitem{ - margin: 4px 0px; -} - -.magic .magicSub { - background-color: #DBD3DC; - align-items: center; - -} - -.power .repcontainer[data-groupname="repeating_Ancestry"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Ancestry"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_Novice"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Novice"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_Expert"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Expert"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_Master"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Master"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_Attack"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Attack"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_Notes"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_Notes"] .repitem{ - margin: 4px 0px; -} - -.mainSub { - background-color: #D3D3D3; -} - -.detailDropdown { - background-color: #DBD3DC; -} -/*---------------------------------------- NPC STYLING ------------------------------*/ - -.npc { - background-color: #F1F1F1; - display: inline-block; - width: 860px; -} - -.npc .npcName { - background-color: #48234f; - align-items: center; -} - -.npc .npcType { - background-color: #DBD3DC; - align-items: center; - -} -.npc .npcSub { - background-color: #D3D3D3; -} - -.power .repcontainer[data-groupname="repeating_npcTalent"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_npcTalent"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_npcAction"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_npcAction"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_npcOther"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_npcOther"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_npcReaction"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_npcReaction"] .repitem{ - margin: 4px 0px; -} - -.power .repcontainer[data-groupname="repeating_npcSpell"]{ - padding-bottom: 0.2em; -} - -.power .repcontainer[data-groupname="repeating_npcSpell"] .repitem{ - margin: 4px 0px; -} - - -/* configure the tab buttons */ -.charsheet .sheet-character, -.charsheet .sheet-magic, -.charsheet .sheet-notes, -.charsheet .sheet-npc { - display: none; -} - -/* style the active button */ -.charsheet .sheet-tabstoggle[value="character"] ~ div .sheet-button0 {outline: 2px solid purple;} -.charsheet .sheet-tabstoggle[value="magic"] ~ div .sheet-button1 {outline: 2px solid purple;} -.charsheet .sheet-tabstoggle[value="notes"] ~ div .sheet-button2 {outline: 2px solid purple;} -.charsheet .sheet-tabstoggle[value="npc"] ~ div .sheet-button3 {outline: 2px solid purple;} - -/* show the selected tab */ -.charsheet .sheet-tabstoggle[value="character"] ~ div.sheet-character, -.charsheet .sheet-tabstoggle[value="magic"] ~ div.sheet-magic, -.charsheet .sheet-tabstoggle[value="notes"] ~ div.sheet-notes, -.charsheet .sheet-tabstoggle[value="npc"] ~ div.sheet-npc { - display: block; -} - -/* Hiding Objects Toggles */ -.charsheet .sheet-columns { - display: flex; - justify-content: space-between; - width: 400px; -} -.charsheet .sheet-columns > * { - flex: 1; -} - -.charsheet input.sheet-toggle-show:not(:checked) ~ div.sheet-body, -.charsheet input.sheet-toggle-hide:checked ~ div.sheet-body { - display: none; -} +/*----------------- Main Layout ------------------*/ + +/* A CSS Grid example using "grid-template-areas" + https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-areas +*/ +main { + display: grid; + width: 1076px; + height: 900px; + grid-gap: 0px; + grid-template-columns: 269px 1fr 1fr 1fr; + grid-template-rows: 90px 1fr 1fr 1fr 20px; + grid-template-areas:"header header header power" + "common skill defence power" + "common attack attack power" + "common inv inv power" + "common inv inv power"; + +} + + +/*----------------- GENERAL CSS ------------------*/ + +section { + padding: 2px; + border-style: solid; +} + +/* CSS Flexbox styling, used for adjusting how content inside section behaves */ +.f-col { + display: flex; + flex-direction: column; +} +.f-row { + display: flex; + flex-direction: row; +} +.wrap { + display: flex; + flex-wrap: wrap; +} +.nowrap { + display: flex; + flex-wrap: nowrap; +} +.f-center { + align-items: center; + justify-content: center; +} + + +/*----------------- Text & Input styling -----------------*/ + +@import url("https://fonts.googleapis.com/css?family=Lexend&display=swap"); + + +/* these are for overwriting default CSS that comes from Roll20 */ + +.charsheet * { + font-family: "Arial", "Helvetica", "sans-serif"; +} + +.charsheet h3{ + text-align: center; + font-family: "Arial", "Helvetica", "sans-serif"; +} +.charsheet label{ + margin: 3px; + padding: 3px 0 0 0; + font-family: "Arial", "Helvetica", "sans-serif"; +} + +.charsheet input[type="text"], input[type="number"]{ + margin: 2px 4px; +} + +.charsheet textarea { + width: 95%; + height: 85%; +} + +/*------------- Section-specific CSS -------------*/ + +.header { + grid-area: header; + background-color: #f5f6fa; + flex-direction: column; +} + +.logo { + grid-area: logo; + background-color: #a396ad; + flex-direction: row; + justify-content: space-evenly; +} + +.skill { + grid-area: skill; + background-color: #f5f6fa; + justify-content: space-evenly; +} + +.defence { + grid-area: defence; + background-color: #f5f6fa; + justify-content: space-evenly; +} + +.common { + grid-area: common; + background-color: #f5f6fa; +} + +.power { + grid-area: power; + background-color: #DBD3DC; + flex-direction: column; +} + +.power .repcontainer[data-groupname="repeating_power"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_power"] .repitem{ + margin: 4px 0px; +} + +.attack { + grid-area: attack; + background-color: #f5f6fa; +} + +.inv { + grid-area: inv; + background-color: #f5f6fa; +} + +.misc { + grid-area: misc; + background-color: #f5f6fa; +} + +.footer { + grid-area: footer; + background-color: #f5f6fa; +} + +.magic { + background-color: #f5f6fa; + width: 860px; +} + +.notes { + background-color: #f5f6fa; + width: 860px; +} + +.power .repcontainer[data-groupname="repeating_spellAttack"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_spellAttack"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_spellCard"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_spellCard"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_magicTalent"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_magicTalent"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_ExtraDamage"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_ExtraDamage"] .repitem{ + margin: 4px 0px; +} + +.magic .magicSub { + background-color: #DBD3DC; + align-items: center; + +} + +.power .repcontainer[data-groupname="repeating_Ancestry"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Ancestry"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_Novice"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Novice"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_Expert"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Expert"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_Master"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Master"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_Attack"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Attack"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_Notes"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_Notes"] .repitem{ + margin: 4px 0px; +} + +.mainSub { + background-color: #D3D3D3; +} + +.detailDropdown { + background-color: #DBD3DC; +} +/*---------------------------------------- NPC STYLING ------------------------------*/ + +.npc { + background-color: #F1F1F1; + display: inline-block; + width: 860px; +} + +.npc .npcName { + background-color: #48234f; + align-items: center; +} + +.npc .npcType { + background-color: #DBD3DC; + align-items: center; + +} +.npc .npcSub { + background-color: #D3D3D3; +} + +.power .repcontainer[data-groupname="repeating_npcTalent"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_npcTalent"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_npcAction"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_npcAction"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_npcOther"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_npcOther"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_npcReaction"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_npcReaction"] .repitem{ + margin: 4px 0px; +} + +.power .repcontainer[data-groupname="repeating_npcSpell"]{ + padding-bottom: 0.2em; +} + +.power .repcontainer[data-groupname="repeating_npcSpell"] .repitem{ + margin: 4px 0px; +} + + +/* configure the tab buttons */ +.charsheet .sheet-character, +.charsheet .sheet-magic, +.charsheet .sheet-notes, +.charsheet .sheet-npc { + display: none; +} + +/* style the active button */ +.charsheet .sheet-tabstoggle[value="character"] ~ div .sheet-button0 {outline: 2px solid purple;} +.charsheet .sheet-tabstoggle[value="magic"] ~ div .sheet-button1 {outline: 2px solid purple;} +.charsheet .sheet-tabstoggle[value="notes"] ~ div .sheet-button2 {outline: 2px solid purple;} +.charsheet .sheet-tabstoggle[value="npc"] ~ div .sheet-button3 {outline: 2px solid purple;} + +/* show the selected tab */ +.charsheet .sheet-tabstoggle[value="character"] ~ div.sheet-character, +.charsheet .sheet-tabstoggle[value="magic"] ~ div.sheet-magic, +.charsheet .sheet-tabstoggle[value="notes"] ~ div.sheet-notes, +.charsheet .sheet-tabstoggle[value="npc"] ~ div.sheet-npc { + display: block; +} + +/* Hiding Objects Toggles */ +.charsheet .sheet-columns { + display: flex; + justify-content: space-between; + width: 400px; +} +.charsheet .sheet-columns > * { + flex: 1; +} + +.charsheet input.sheet-toggle-show:not(:checked) ~ div.sheet-body, +.charsheet input.sheet-toggle-hide:checked ~ div.sheet-body { + display: none; +} diff --git a/Shadow of the Weird Wizard/shadowoftheweirdwizard.html b/Shadow of the Weird Wizard/shadowoftheweirdwizard.html index 618d991e79..4c53ee9b94 100644 --- a/Shadow of the Weird Wizard/shadowoftheweirdwizard.html +++ b/Shadow of the Weird Wizard/shadowoftheweirdwizard.html @@ -1,604 +1,604 @@ - -
-
+