diff --git a/Chasing Adventure/sheet.css b/Chasing Adventure/sheet.css index 77ffb3b166..69933df84f 100644 --- a/Chasing Adventure/sheet.css +++ b/Chasing Adventure/sheet.css @@ -1,329 +1,329 @@ -.sheet-startingmoves, -.sheet-advancedmoves, -.sheet-adventuremoves, -.sheet-peripheralmoves, -.sheet-chasefavormoves{ - display: none; -} - -/* show the selected tab */ -input.sheet-tabstoggle[value="startingmoves"] ~ div.sheet-startingmoves, -.sheet-tabstoggle[value="advancedmoves"] ~ div.sheet-advancedmoves, -.sheet-tabstoggle[value="adventuremoves"] ~ div.sheet-adventuremoves, -.sheet-tabstoggle[value="peripheralmoves"] ~ div.sheet-peripheralmoves, -.sheet-tabstoggle[value="chasefavormoves"] ~ div.sheet-chasefavormoves{ - display: block; -} - -@import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap'); -@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap'); - -.charactersheet h2 { - font-size: 48px; - font-family: "Permanent Marker", sans-serif; - text-align: center; - color: #ef4035; - margin-bottom: 40px; -} - -.charactersheet label { - color: #ef4035; - font-weight: 400; - font-size: 24px; - font-family: "Permanent Marker", sans-serif; -} - -.character-info { - font-family: "Permanent Marker", sans-serif; - display: grid; - gap: 10px; - grid-template-columns: 42% 42% 16%; - justify-items: stretch; -} - -.character-info input[type="text"] { - padding: 4px 6px -} - -.character-info label { - display: inline; -} - -.character-playbook input { - width: 160px; -} - -.character-info input[type="number"] { - width: auto; - max-width: 50px; - text-align: center; -} - -.character-info > div { - justify-self: center; - display: inline-grid; - grid-template-columns: auto auto; - justify-items: center; - align-items: center; -} - -.character-info textarea { - height: 24px; - width: 202px; - margin: 0; -} - -.charactersheet input, .charactersheet textarea { - font-family: "Montserrat", sans-serif; -} - -.character-look, .character-drive { - justify-self: center; -} - -input::placeholder, textarea::placeholder { - opacity: 0.75; -} - -/* Stats */ - -.stats { - display: inline-grid; - grid-template-columns: 50% 50%; - grid-template-rows: 150px 150px 150px; - justify-content: start; -} - -.stats select { - font-family: "Permanent Marker", sans-serif; - font-size: 36px; - height: auto; - width: auto; - display: block; - text-align: center; - margin: 0 auto 5px; -} - -.charsheet .stats .stat-armor input[type="number"]{ - font-size: 24px; - width: 2em; - text-align: center; - font-family: "Permanent Marker", sans-serif; - height: 63px; -} - -.stat:not(.stat-armor) span { - display: none; -} - -.stat-armor>div { - width: 48%; - display: inline-block; -} - -.charactersheet .condition-label { - display: inline; - font-size: 12px; - font-family: "Montserrat", sans-serif; - color: #333; - font-weight: 500; - margin-left: 5px; -} - -.stat { - text-align: center; -} - -.stat label { - text-align: center; -} - -.character-choices { - display: grid; - grid-template-columns: 25% 41.66% 33.33%; - grid-template-rows: auto; - padding-top: 40px; - gap: 10px; -} - -.condition-description { - opacity: 0; - width: 100px; - font-size: 12px; - text-align: center; - display: block; - margin: 5px auto 0 auto; -} - -.stat input[type="checkbox"]:checked ~ .condition-description { - opacity: 1; -} - -.stat-armor span { - font-family: "Montserrat", sans-serif; - width: 50%; - font-size: 13px; -} - -/* Backgrounds */ - -.bg-name { - width: calc(69% - 11px); - margin-right: 10px; -} - -.bg-stats { - width: 30%; -} - -.bg-trigger { - width: 100%; - margin-bottom: 10px; -} - -.background { - position: relative; -} - -.backgrounds textarea { - height: 4em; - margin-top: 10px; - margin-bottom: 5px; - width: calc(100% - 10px); -} - -.backgrounds .background label { - color: #333; - font-family: "Montserrat", sans-serif; - font-weight: 600; - font-size: 14px; - margin-bottom: 0; - display: inline; -} - -.backgrounds button { - position: absolute; - right: 0; -} - -.backgrounds .bg-trigger { - margin-top: 10px; -} - -.bg-equipment-div, .bg-drive-div { - display: inline-grid; - grid-template-columns: 28% 72%; - align-items: center; - width: 100%; - margin-bottom: 10px; -} - -.bg-equipment-div input, .bg-drive-div input { - width: 100%; -} - -.bg-move-label { - width: calc(100% - 27px); - display: inline-block; - padding: 0; -} - -.bg-move-roll { - margin: 0; -} - -/* Equipment */ - -.equipment textarea { - width: calc(100% - 10px); - height: calc(100% - 57px); - margin-bottom: 0; -} - -/* Moves */ - -.character-moves { - background: #d1d2d4; -} - -.tab-menu { - display: grid; - grid-template-columns: auto auto auto auto auto; -} - -.tab-menu button { - background: #777777; - border: none; - color: white; - font-family: "Montserrat", sans-serif; - font-weight: 600; - font-size: 16px; - padding: 7px 10px; - transition: background 0.2s ease-in-out; -} - -.tab-menu button:hover, -.sheet-tabstoggle[value="startingmoves"] ~ .tab-menu button[name="act_startingmoves"], -.sheet-tabstoggle[value="advancedmoves"] ~ .tab-menu button[name="act_advancedmoves"], -.sheet-tabstoggle[value="adventuremoves"] ~ .tab-menu button[name="act_adventuremoves"], -.sheet-tabstoggle[value="peripheralmoves"] ~ .tab-menu button[name="act_peripheralmoves"], -.sheet-tabstoggle[value="chasefavormoves"] ~ .tab-menu button[name="act_chasefavormoves"] { - background: #ee4035; -} - -.sheet-startingmoves, .sheet-advancedmoves, .sheet-adventuremoves,.sheet-peripheralmoves, .sheet-chasefavormoves { - padding: 10px 10px; - grid-template-columns: 33.33% 33.33% 33.33%; -} - -.move-name { - width: calc(100% - 107px); -} - -.ui-dialog .charsheet .character-moves button[type=roll] { - margin: 0; -} - -.move-roll { - width: auto; -} - -.move-trigger { - width: 100%; - position: relative; - top: 1px; -} - -textarea.move-effect { - width: calc(100% - 29px); - margin-top: 10px; - margin-bottom: 0; -} - -.character-moves .repcontainer { - grid-template-columns: calc(33.33% - 7px) calc(33.33% - 7px) calc(33.33% - 7px); - display: grid; - gap: 10px; - padding: 0; -} - -/* Roll Template */ - -.sheet-rolltemplate-default caption { - background-color: #ef4035; - font-family: "Permanent Marker", sans-serif; - font-size: 1.5em; -} - -.sheet-rolltemplate-default td:first-child { - font-weight: 400; - text-align: left; -} - -.sheet-rolltemplate-default tr:first-child td { - font-weight: bold; -} - -.sheet-rolltemplate-default td { - font-family: "Montserrat", sans-serif; -} +.sheet-startingmoves, +.sheet-advancedmoves, +.sheet-adventuremoves, +.sheet-peripheralmoves, +.sheet-chasefavormoves{ + display: none; +} + +/* show the selected tab */ +input.sheet-tabstoggle[value="startingmoves"] ~ div.sheet-startingmoves, +.sheet-tabstoggle[value="advancedmoves"] ~ div.sheet-advancedmoves, +.sheet-tabstoggle[value="adventuremoves"] ~ div.sheet-adventuremoves, +.sheet-tabstoggle[value="peripheralmoves"] ~ div.sheet-peripheralmoves, +.sheet-tabstoggle[value="chasefavormoves"] ~ div.sheet-chasefavormoves{ + display: block; +} + +@import url('https://fonts.googleapis.com/css2?family=Permanent+Marker&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap'); + +.charactersheet h2 { + font-size: 48px; + font-family: "Permanent Marker", sans-serif; + text-align: center; + color: #ef4035; + margin-bottom: 40px; +} + +.charactersheet label { + color: #ef4035; + font-weight: 400; + font-size: 24px; + font-family: "Permanent Marker", sans-serif; +} + +.character-info { + font-family: "Permanent Marker", sans-serif; + display: grid; + gap: 10px; + grid-template-columns: 42% 42% 16%; + justify-items: stretch; +} + +.character-info input[type="text"] { + padding: 4px 6px +} + +.character-info label { + display: inline; +} + +.character-playbook input { + width: 160px; +} + +.character-info input[type="number"] { + width: auto; + max-width: 50px; + text-align: center; +} + +.character-info > div { + justify-self: center; + display: inline-grid; + grid-template-columns: auto auto; + justify-items: center; + align-items: center; +} + +.character-info textarea { + height: 24px; + width: 202px; + margin: 0; +} + +.charactersheet input, .charactersheet textarea { + font-family: "Montserrat", sans-serif; +} + +.character-look, .character-drive { + justify-self: center; +} + +input::placeholder, textarea::placeholder { + opacity: 0.75; +} + +/* Stats */ + +.stats { + display: inline-grid; + grid-template-columns: 50% 50%; + grid-template-rows: 150px 150px 150px; + justify-content: start; +} + +.stats select { + font-family: "Permanent Marker", sans-serif; + font-size: 36px; + height: auto; + width: auto; + display: block; + text-align: center; + margin: 0 auto 5px; +} + +.charsheet .stats .stat-armor input[type="number"]{ + font-size: 24px; + width: 2em; + text-align: center; + font-family: "Permanent Marker", sans-serif; + height: 63px; +} + +.stat:not(.stat-armor) span { + display: none; +} + +.stat-armor>div { + width: 48%; + display: inline-block; +} + +.charactersheet .condition-label { + display: inline; + font-size: 12px; + font-family: "Montserrat", sans-serif; + color: #333; + font-weight: 500; + margin-left: 5px; +} + +.stat { + text-align: center; +} + +.stat label { + text-align: center; +} + +.character-choices { + display: grid; + grid-template-columns: 25% 41.66% 33.33%; + grid-template-rows: auto; + padding-top: 40px; + gap: 10px; +} + +.condition-description { + opacity: 0; + width: 100px; + font-size: 12px; + text-align: center; + display: block; + margin: 5px auto 0 auto; +} + +.stat input[type="checkbox"]:checked ~ .condition-description { + opacity: 1; +} + +.stat-armor span { + font-family: "Montserrat", sans-serif; + width: 50%; + font-size: 13px; +} + +/* Backgrounds */ + +.bg-name { + width: calc(69% - 11px); + margin-right: 10px; +} + +.bg-stats { + width: 30%; +} + +.bg-trigger { + width: 100%; + margin-bottom: 10px; +} + +.background { + position: relative; +} + +.backgrounds textarea { + height: 4em; + margin-top: 10px; + margin-bottom: 5px; + width: calc(100% - 10px); +} + +.backgrounds .background label { + color: #333; + font-family: "Montserrat", sans-serif; + font-weight: 600; + font-size: 14px; + margin-bottom: 0; + display: inline; +} + +.backgrounds button { + position: absolute; + right: 0; +} + +.backgrounds .bg-trigger { + margin-top: 10px; +} + +.bg-equipment-div, .bg-drive-div { + display: inline-grid; + grid-template-columns: 28% 72%; + align-items: center; + width: 100%; + margin-bottom: 10px; +} + +.bg-equipment-div input, .bg-drive-div input { + width: 100%; +} + +.bg-move-label { + width: calc(100% - 27px); + display: inline-block; + padding: 0; +} + +.bg-move-roll { + margin: 0; +} + +/* Equipment */ + +.equipment textarea { + width: calc(100% - 10px); + height: calc(100% - 57px); + margin-bottom: 0; +} + +/* Moves */ + +.character-moves { + background: #d1d2d4; +} + +.tab-menu { + display: grid; + grid-template-columns: auto auto auto auto auto; +} + +.tab-menu button { + background: #777777; + border: none; + color: white; + font-family: "Montserrat", sans-serif; + font-weight: 600; + font-size: 16px; + padding: 7px 10px; + transition: background 0.2s ease-in-out; +} + +.tab-menu button:hover, +.sheet-tabstoggle[value="startingmoves"] ~ .tab-menu button[name="act_startingmoves"], +.sheet-tabstoggle[value="advancedmoves"] ~ .tab-menu button[name="act_advancedmoves"], +.sheet-tabstoggle[value="adventuremoves"] ~ .tab-menu button[name="act_adventuremoves"], +.sheet-tabstoggle[value="peripheralmoves"] ~ .tab-menu button[name="act_peripheralmoves"], +.sheet-tabstoggle[value="chasefavormoves"] ~ .tab-menu button[name="act_chasefavormoves"] { + background: #ee4035; +} + +.sheet-startingmoves, .sheet-advancedmoves, .sheet-adventuremoves,.sheet-peripheralmoves, .sheet-chasefavormoves { + padding: 10px 10px; + grid-template-columns: 33.33% 33.33% 33.33%; +} + +.move-name { + width: calc(100% - 107px); +} + +.ui-dialog .charsheet .character-moves button[type=roll] { + margin: 0; +} + +.move-roll { + width: auto; +} + +.move-trigger { + width: 100%; + position: relative; + top: 1px; +} + +textarea.move-effect { + width: calc(100% - 29px); + margin-top: 10px; + margin-bottom: 0; +} + +.character-moves .repcontainer { + grid-template-columns: calc(33.33% - 7px) calc(33.33% - 7px) calc(33.33% - 7px); + display: grid; + gap: 10px; + padding: 0; +} + +/* Roll Template */ + +.sheet-rolltemplate-default caption { + background-color: #ef4035; + font-family: "Permanent Marker", sans-serif; + font-size: 1.5em; +} + +.sheet-rolltemplate-default td:first-child { + font-weight: 400; + text-align: left; +} + +.sheet-rolltemplate-default tr:first-child td { + font-weight: bold; +} + +.sheet-rolltemplate-default td { + font-family: "Montserrat", sans-serif; +} diff --git a/Chasing Adventure/sheet.html b/Chasing Adventure/sheet.html index 731a9f3242..1f6635920e 100644 --- a/Chasing Adventure/sheet.html +++ b/Chasing Adventure/sheet.html @@ -1,289 +1,289 @@ -