diff --git a/PokemonTabletopAdventures_v3/PTA3.css b/PokemonTabletopAdventures_v3/PTA3.css index d3f1a9e5199a..f1be0b5a8e85 100644 --- a/PokemonTabletopAdventures_v3/PTA3.css +++ b/PokemonTabletopAdventures_v3/PTA3.css @@ -4,7 +4,8 @@ .sheet-rolltemplate-ten-hit-move-roll, .sheet-rolltemplate-multi-hit-move-roll, .sheet-rolltemplate-triple-hit-move-roll, -.sheet-rolltemplate-feature-output { +.sheet-rolltemplate-feature-output, +.sheet-rolltemplate-inline-skill-roll { --poke-bug: #c6d16e; --poke-bug-background: #ffffb280; --poke-bug-shaded: #828d2a; @@ -98,6 +99,7 @@ --stat-ro-spd: #ff99ff80; } +.sheet-rolltemplate-inline-skill-roll, .sheet-rolltemplate-skill-roll { --atk-gradient: #bb5555; --atk-header: #ff9999; @@ -583,11 +585,19 @@ div.sheet-pokemon-move span.sheet-readonly-field input[type="number"] { font-style: italic; } -div.sheet-wrapper, +div.sheet-collapsible-feature, +div.sheet-feature-container, div.sheet-pokemon-move, -div.sheet-collapsible-feature { +div.sheet-wrapper { background-color: var(--background-color); border-color: var(--foreground-color); + display: grid; + grid-template: "top-left" 1fr / 1fr; + position: relative; +} + +div.sheet-no-background { + background-color: #00000000; } div.sheet-pokemon-move, @@ -653,11 +663,10 @@ div.sheet-skill-selection .sheet-no-dropdown { } .sheet-logo { - width: 280px; - height: 150px; - margin-left: auto; - margin-right: auto; - margin-top: -15px; + min-height: 150px; + background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/PokemonTabletopAdventures_v3/images/PTA3SmallLogo.png"); + background-position: center top; + background-repeat: no-repeat; } .sheet-form-buttons { @@ -1222,27 +1231,151 @@ button[type="roll"].sheet-stat-roller:hover { /* Roll Templates */ -.sheet-rolltemplate-move-roll, -.sheet-rolltemplate-dual-hit-move-roll, -.sheet-rolltemplate-ten-hit-move-roll, -.sheet-rolltemplate-multi-hit-move-roll, -.sheet-rolltemplate-triple-hit-move-roll, -.sheet-rolltemplate-feature-output { - --header-text: black; +/* Inline Skill Roll */ + +.sheet-rolltemplate-inline-skill-roll { + --header-text: #000000; + --main-text: #000000; + --odd-row-bg: #d9d9d6; + --row-bg: #e9e9e9; } -.sheet-rolltemplate-skill-roll { - --header-text: black; +.sheet-rolltemplate-darkmode.sheet-rolltemplate-inline-skill-roll { + --header-text: #dddddd; + --main-text: #dddddd; + --odd-row-bg: #303030; + --row-bg: #404040; +} + +.sheet-rolltemplate-inline-skill-roll .sheet-labelled-table-wrapper { + display: grid; + grid-column-gap: 0px; + grid-template-columns: 5% 95%; +} + +.sheet-rolltemplate-inline-skill-roll .sheet-labelled-table-wrapper span.sheet-border-label { + background: var(--header-bg); + border: 1px solid var(--border-color); + border-left: none; + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; + border-collapse: separate; + color: var(--main-text); + font-size: 12px; + height: auto; + padding-right: 2px; + text-align: center; + text-transform: uppercase; + font-weight: bold; + transform: scale(-1, -1); + width: 100%; + writing-mode: vertical-lr; + -webkit-text-stroke: 0.5px var(--poke-all-dark-background); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-container table.sheet-inline-skill-template { + background: var(--row-bg); + border: 1px solid var(--border-color); + border-left: none; + border-bottom-right-radius: 4px; + border-top-right-radius: 4px; + border-collapse: separate; + box-sizing: border-box; + color: var(--main-text); + font-size: 12px; + height: 100%; + line-height: 2em; + overflow: clip; + padding-left: 2px; + width: 100%; +} + +.sheet-rolltemplate-inline-skill-roll .sheet-container table.sheet-inline-skill-template td.sheet-label { + font-weight: bold; + padding-left: 4px; +} + +.sheet-rolltemplate-inline-skill-roll .sheet-container table.sheet-inline-skill-template td.sheet-subhead { + border-bottom: 1px solid var(--odd-row-bg); + font-size: 12px; + font-style: italic; + padding-left: 4px; +} + +.sheet-rolltemplate-inline-skill-roll .sheet-container table.sheet-inline-skill-template a { + color: var(--header-text); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-container table.sheet-inline-skill-template .sheet-skill-roll .inlinerollresult { + background: inherit; + border: none; + font-size: inherit; + padding: 0px; } +.sheet-rolltemplate-inline-skill-roll .sheet-rolltemplate-color-setting-atk-skill { + --border-color: var(--poke-all-dark-background); + --header-bg: var(--atk-gradient); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-rolltemplate-color-setting-def-skill { + --border-color: var(--poke-all-dark-background); + --header-bg: var(--def-gradient); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-rolltemplate-color-setting-spatk-skill { + --border-color: var(--poke-all-dark-background); + --header-bg: var(--spatk-gradient); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-rolltemplate-color-setting-spdef-skill { + --border-color: var(--poke-all-dark-background); + --header-bg: var(--spdef-gradient); +} + +.sheet-rolltemplate-inline-skill-roll .sheet-rolltemplate-color-setting-spd-skill { + --border-color: var(--poke-all-dark-background); + --header-bg: var(--spd-gradient); +} + + +.sheet-rolltemplate-inline-skill-roll.sheet-rolltemplate-darkmode .sheet-rolltemplate-color-setting-atk-skill { + --border-color: var(--atk-gradient); + --header-bg: var(--atk-header-dark); +} + +.sheet-rolltemplate-inline-skill-roll.sheet-rolltemplate-darkmode .sheet-rolltemplate-color-setting-def-skill { + --border-color: var(--def-gradient); + --header-bg: var(--def-header-dark); +} + +.sheet-rolltemplate-inline-skill-roll.sheet-rolltemplate-darkmode .sheet-rolltemplate-color-setting-spatk-skill { + --border-color: var(--spatk-gradient); + --header-bg: var(--spatk-header-dark); +} + +.sheet-rolltemplate-inline-skill-roll.sheet-rolltemplate-darkmode .sheet-rolltemplate-color-setting-spdef-skill { + --border-color: var(--spdef-gradient); + --header-bg: var(--spdef-header-dark); +} + +.sheet-rolltemplate-inline-skill-roll.sheet-rolltemplate-darkmode .sheet-rolltemplate-color-setting-spd-skill { + --border-color: var(--spd-gradient); + --header-bg: var(--spd-header-dark); +} + + +/* Other Templates */ + .sheet-rolltemplate-move-roll, .sheet-rolltemplate-dual-hit-move-roll, .sheet-rolltemplate-ten-hit-move-roll, .sheet-rolltemplate-multi-hit-move-roll, .sheet-rolltemplate-triple-hit-move-roll, -.sheet-rolltemplate-skill-roll, -.sheet-rolltemplate-feature-output { - --main-text: black; +.sheet-rolltemplate-feature-output, +.sheet-rolltemplate-skill-roll { + --header-text: #000000; + --main-text: #000000; --odd-row-bg: #d9d9d6; --row-bg: #e9e9e9; text-transform: capitalize; @@ -1259,6 +1392,7 @@ button[type="roll"].sheet-stat-roller:hover { --main-text: #dddddd; --odd-row-bg: #303030; --row-bg: #404040; + text-transform: capitalize; } .sheet-rolltemplate-color-setting-bug-move { @@ -1521,8 +1655,12 @@ button[type="roll"].sheet-stat-roller:hover { .sheet-rolltemplate-triple-hit-move-roll .sheet-container table.sheet-move-template, .sheet-rolltemplate-skill-roll .sheet-container table.sheet-skill-template, .sheet-rolltemplate-feature-output .sheet-container table.sheet-feature-template { - border: 1px solid; - border-color: var(--border-color); + border: 1px solid var(--border-color); + border-radius: 4px; + border-collapse: separate; + border-spacing: 0px; + box-sizing: border-box; + overflow: clip; color: var(--main-text); font-size: 12px; line-height: 1em; @@ -1738,8 +1876,8 @@ button[type="roll"].sheet-stat-roller:hover { .sheet-rolltemplate-ten-hit-move-roll .sheet-container table.sheet-move-template td.sheet-subhead, .sheet-rolltemplate-multi-hit-move-roll .sheet-container table.sheet-move-template td.sheet-subhead, .sheet-rolltemplate-triple-hit-move-roll .sheet-container table.sheet-move-template td.sheet-subhead, -.sheet-rolltemplate-skill-roll .sheet-container table.sheet-skill-template td.sheet-subhead, -.sheet-rolltemplate-feature-output .sheet-container table.sheet-feature-template td.sheet-subhead { +.sheet-rolltemplate-feature-output .sheet-container table.sheet-feature-template td.sheet-subhead, +.sheet-rolltemplate-skill-roll .sheet-container table.sheet-skill-template td.sheet-subhead { padding: 4px; background: var(--box-bg); font-size: 12px; @@ -1782,12 +1920,40 @@ button[type="roll"].sheet-stat-roller:hover { .sheet-options-flag:not(:checked) ~ div.sheet-display, .sheet-options-flag:checked ~ div.sheet-options { - display: block; + max-height: 1200px; + opacity: 1; + overflow: scroll; + transition-property: max-height, opacity, visibility; + transition-duration: 400ms; + transition-timing-function: cubic-bezier(.55,.06,.68,.19); + visibility: visible; +} + +.sheet-extra-max-height .sheet-options-flag:not(:checked) ~ div.sheet-display, +.sheet-extra-max-height .sheet-options-flag:checked ~ div.sheet-options { + max-height: 1800px; } .sheet-options-flag:checked ~ div.sheet-display, .sheet-options-flag:not(:checked) ~ div.sheet-options { - display: none; + max-height: 0px; + opacity: 0; + overflow: hidden; + transition-property: max-height, opacity, visibility; + transition-duration: 400ms; + transition-timing-function: cubic-bezier(.22,.61,.36,1); + visibility: hidden; +} + +div.sheet-collapsible-feature div.sheet-display, +div.sheet-collapsible-feature div.sheet-options, +div.sheet-feature-container div.sheet-display, +div.sheet-feature-container div.sheet-options, +div.sheet-pokemon-move div.sheet-display, +div.sheet-pokemon-move div.sheet-options, +div.sheet-wrapper div.sheet-display, +div.sheet-wrapper div.sheet-options { + grid-area: top-left; } button[type="roll"].sheet-inline-roller:hover { @@ -1840,6 +2006,13 @@ h3.sheet-section-header { padding-left: 40px; } +b.sheet-subsection-header { + display: block; + line-height: 24px; + margin-bottom: 8px; + padding-left: 32px; +} + .sheet-options-flag { height: 18px; opacity: 0; @@ -2058,6 +2231,15 @@ input.sheet-capitalize { grid-template-columns: 1fr 5fr 1fr 1fr; } + .sheet-feature-container > .sheet-options-flag, + .sheet-feature-container > .sheet-options-flag + span, + .sheet-feature-container > .sheet-options-flag:checked, + .sheet-feature-container > .sheet-options-flag:checked + span { + left: 8px; + top: 22px; + } + + .sheet-rolltemplate-move-roll .sheet-container table.sheet-move-template, .sheet-rolltemplate-dual-hit-move-roll .sheet-container table.sheet-move-template, .sheet-rolltemplate-ten-hit-move-roll .sheet-container table.sheet-move-template, diff --git a/PokemonTabletopAdventures_v3/PTA3.html b/PokemonTabletopAdventures_v3/PTA3.html index 8cc504f7d9dd..5df962054df9 100644 --- a/PokemonTabletopAdventures_v3/PTA3.html +++ b/PokemonTabletopAdventures_v3/PTA3.html @@ -2,25 +2,31 @@
+ + +
+ + +
+
- + + + -
@@ -53,298 +59,333 @@
+ +
-
-
- Name - - - Honors - - Origin - - Honors - - Credits - - -


+
+ + - +
+

the (Level )

- -
- Class - - Level - - Class - - Level - - Class - - Level - - Class - - Level - +
+

the (Level )

+
+
+ Name + + + Honors + + Origin + + Honors + + Credits + + +


+
+ +
+ Class + + Level + + Class + + Level + + Class + + Level + + Class + + Level + +
+
-
-
- Name - - Species - - -
- Type -
-
- Type Shift -
-
- - - + - +
+

the

+
+
+ +

the

+
+
+ Name + + Species + + +
+ Type +
+
+ Type Shift +
+
+ + + + +
+
+ + + + + + +
+ Nature + - -
-
- - + + + + + + + + + + + + + + + + + + + + + + + + + + - - - -
- Nature - - - Held Item - - -


-
+ + Held Item + + +


+
-
- - Size -
- -
-
- -
- Weight -
- -
-
- +
+ + Size +
+ +
+
+ +
+ Weight +
+ +
+
+ +
+ Sex + + Diet + + + Held Item + + Egg Group + +
- Sex - - Diet - - - Held Item - - Egg Group -
-
-
- Name - - Species - - Nature - - Origin - - Level / Honors - - - - - Advanced Class - - Credits - +
+ + - +
+

the (Level )

+
+ +

the (Level )

+
+
+ Name + + Species + + Nature + + Origin + + Level / Honors + + + + + Advanced Class + + Credits + +
-
- Type - - - - - Size / Weight - - - - - Sex - - Egg Group - - Diet - - Held Item - +
+ Type + + + + + Size / Weight + + + + + Sex + + Egg Group + + Diet + + Held Item + +
+
-
+ +
-
+
-
@@ -359,7 +400,7 @@ Attack


@@ -369,7 +410,7 @@ Defense


@@ -379,7 +420,7 @@ Special Attack


@@ -389,7 +430,7 @@ Special Defense


@@ -399,7 +440,7 @@ Speed


@@ -423,7 +464,7 @@ Attack


@@ -433,7 +474,7 @@ Defense


@@ -443,7 +484,7 @@ Special Attack


@@ -453,7 +494,7 @@ Special Defense


@@ -463,7 +504,7 @@ Speed


@@ -475,8 +516,10 @@
+ +
-
+
-
@@ -564,8 +607,10 @@
+ +
-
+
-
@@ -686,6 +731,8 @@
+ +

@@ -705,7 +752,7 @@ @@ -714,7 +761,7 @@ @@ -723,7 +770,7 @@ @@ -732,7 +779,7 @@ @@ -741,7 +788,7 @@ @@ -750,7 +797,7 @@ @@ -759,7 +806,7 @@ @@ -768,7 +815,7 @@ @@ -777,7 +824,7 @@ @@ -788,7 +835,7 @@ @@ -797,7 +844,7 @@ @@ -806,7 +853,7 @@ @@ -815,7 +862,7 @@ @@ -824,7 +871,7 @@ @@ -833,7 +880,7 @@ @@ -841,7 +888,7 @@ - @@ -850,7 +897,7 @@ @@ -859,7 +906,7 @@ @@ -869,6 +916,8 @@
+ +

@@ -878,7 +927,7 @@ @@ -933,7 +982,7 @@ -

Origin Feature

- -
- - - + + + +
+ + -
-
- - - - - - Feature Usage - - - - -
+

Origin Feature

-
- - - - - - - Feature Usage - - - - +

Origin Feature

+ +
+ + - +
+
+ + + + + + Feature Usage + + + + +
+
+
+
+ + + + + + + Feature Usage + + + + +
+
+ + Select a Feature Color: + + + +
+ +
-
- - Select a Feature Color: - - - -
-

-
+ + + +
-
@@ -1144,282 +1208,353 @@

Class Features


-
- Skills - - - Stat Passives - - - Other Passives - -
- - Modifiers for All Moves -
- - - Accuracy Modifier - - - - - Critical Threshold - - - - - Attack Damage Bonus - - - - - Special Attack Damage Bonus - - - - -
+ -

Moves

-
- - -
- - - +
+
+ + -
-
- - - - - - - - - - - - Move Usage - - - - -
-
- - Accuracy Roll: - - - - - - Damage Roll: - - - - -
+

Passives

-
-
- - - - - - +

Passives

+ Skills + + Stat Passives + + Other Passives + +
+
+
+
+ + +
+ + - +
+

Moves

+
+
+

Moves

+ Modifiers for All Moves +
+ - Move Usage - - - + Accuracy Modifier + + -
- -
- - - - - - Damage - - + Critical Threshold + + -
- -
- Accuracy Modifier - + Attack Damage Bonus + + - - Extra Damage - + Special Attack Damage Bonus + + + +
+
+ + +
+ + - +
+
+ + + + + + + + + + + + Move Usage + + + + +
+
+ + Accuracy Roll: + + + + + + Damage Roll: + + + - - Scatter - - - - - - - +
+
- - Effect Threshold - - - +
+
+ + + + + + + + + Move Usage + + + + +
- - - - - +
+ + + + + + + Damage + + + +
- - Effect Threshold - - +
+ + Accuracy Modifier + + + + + Extra Damage + + + + + Scatter + + + + + + + + + + Effect Threshold + + + + + + + + + + + + Effect Threshold + + + + + + + +
- - - - +
+ + Accuracy Roll: + + + + + + Damage Roll: + + + + +
+ +
+ + +
+
+
+
+
+
-
- - Accuracy Roll: - - - - - - Damage Roll: - - - + -
+
+ + - +
+

Notes

+
+
+ +

Notes

+
+
+ + . +
+ Inventory +
+
+ Inventory + +
+
-
- - +
+ + . +
+ Honors +
+
+ Honors + +
-
-
- -
- Inventory - - Honors - -
+
+
+ + . +
+ Owned Pokémon +
+
+ Owned Pokémon + +
+
+
-
- Owned Pokémon - +
+ + . +
+ General Notes +
+
+ General Notes + +
+
+
- - Notes - +
@@ -3336,6 +3471,26 @@