diff --git a/TheyCameFromBeyondTheGrave/tcfbtg.css b/TheyCameFromBeyondTheGrave/tcfbtg.css index ef9f2ae636..8ba6503c64 100644 --- a/TheyCameFromBeyondTheGrave/tcfbtg.css +++ b/TheyCameFromBeyondTheGrave/tcfbtg.css @@ -83,6 +83,53 @@ input[type="checkbox"].readonly { content: " "; } +.charsheet button[type="roll"].dice-roll { + border-style: none; + border-radius: 10px; + text-shadow: none !important; + box-shadow: none !important; + background-image: none; + background: transparent; + padding: 0px; + margin-right: 0px; +} + +input.dot[value="0"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "J"; +} + +input.dot[value="1"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "A"; +} + +input.dot[value="2"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "B"; +} + +input.dot[value="3"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "C"; +} + +input.dot[value="4"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "D"; +} + +input.dot[value="5"] ~ button.dice-roll::before { + font-family: dicefontd10; + font-size: 2.6rem; + content: "E"; +} + input[type="text"], .input-display { width: 100%; @@ -202,7 +249,7 @@ textarea { .skill-list .left .dots, .skill-list .right .dots { - width: 100px; + width: 120px; margin: 0px 0px 0px 3px; } @@ -352,12 +399,13 @@ textarea { .paths > div .value { width: auto; + min-width: 100px; flex-grow: 2; margin: 0px 0px 0px 3px; } .paths > div .dots { - width: 100px; + width: 120px; margin: 0px 0px 0px 3px; } @@ -473,9 +521,10 @@ textarea { /* Style the dots */ .dots { display: flex; + align-items: center; } -/* Configure the button styling. This example makes it look like a radio. */ +/* Configure the button styling to make it look like a radio button. */ button.dot { padding: 0; border: solid 1px #a8a8a8; @@ -719,6 +768,8 @@ input.toggle-more[value="0"] + button > span.less { /* Roll template styling */ .sheet-rolltemplate-skillroll .sheet-outer, +.sheet-rolltemplate-path .sheet-outer, +.sheet-rolltemplate-custompath .sheet-outer, .sheet-rolltemplate-drawquip .sheet-outer, .sheet-rolltemplate-drawcinematic .sheet-outer { background: url('https://github.com/LongShadowGames/roll20-character-sheets/blob/they-came-from-beyond-the-grave/TheyCameFromBeyondTheGrave/images/churchyard.png?raw=true'); @@ -729,22 +780,30 @@ input.toggle-more[value="0"] + button > span.less { } .sheet-rolltemplate-skillroll .sheet-inner, +.sheet-rolltemplate-path .sheet-inner, +.sheet-rolltemplate-custompath .sheet-inner, .sheet-rolltemplate-drawcinematic .sheet-inner { background-color: rgba(255,255,255,0.7); padding: 10px 5px; } -.sheet-rolltemplate-skillroll .sheet-results { +.sheet-rolltemplate-skillroll .sheet-results, +.sheet-rolltemplate-path .sheet-results, +.sheet-rolltemplate-custompath .sheet-results { display: grid; grid-template-rows: auto; grid-template-columns: 1fr 1fr; } -.sheet-rolltemplate-skillroll .sheet-inner p:last-child { +.sheet-rolltemplate-skillroll .sheet-inner p:last-child, +.sheet-rolltemplate-path .sheet-inner p:last-child, +.sheet-rolltemplate-custompath .sheet-inner p:last-child { margin-bottom: 0px; } .sheet-rolltemplate-skillroll .sheet-outer .sheet-header, +.sheet-rolltemplate-path .sheet-outer .sheet-header, +.sheet-rolltemplate-custompath .sheet-outer .sheet-header, .sheet-rolltemplate-drawquip .sheet-outer .sheet-header, .sheet-rolltemplate-drawcinematic .sheet-outer .sheet-header { background: url('https://github.com/LongShadowGames/roll20-character-sheets/blob/they-came-from-beneath-the-sea/TheyCameFromBeneathTheSea/images/clapperboard.png?raw=true'); @@ -764,6 +823,8 @@ input.toggle-more[value="0"] + button > span.less { } .sheet-rolltemplate-skillroll .sheet-outer .sheet-header h4, +.sheet-rolltemplate-path .sheet-outer .sheet-header h4, +.sheet-rolltemplate-custompath .sheet-outer .sheet-header h4, .sheet-rolltemplate-drawquip .sheet-outer .sheet-header h4, .sheet-rolltemplate-drawcinematic .sheet-outer .sheet-header h4 { font-family: 'Montserrat', sans-serif;