slaguru666/roll20-character-sheets-tester
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[WFRP4CharSheet] Dark Mode Fix

Browse Source 
Update CSS for Dark Mode compatibility.
This commit is contained in:
zedafty
2022-11-23 17:29:55 +01:00
parent a67d5edfd1
commit c358d98f28
2 changed files with 37 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
WFRP4CharSheet/WFRP4Charsheet.css
+31 -35
View File
@@ -51,8 +51,8 @@ div {
color: #000;
text-align: center;
border: 30px solid transparent;
border-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/border-sheet.png") 30 round;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-sheet.jpg");
border-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/border-sheet.png") 30 round;
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-sheet.jpg");
background-size: 100%;
box-sizing: border-box;
}
@@ -124,14 +124,14 @@ textarea::selection {
/* Normal Cursor */
label,
.charsheet {
cursor: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/cursor-normal.png") 11 11, auto;
cursor: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/cursor-normal.png") 11 11, auto;
}
/* Write Cursor */
textarea,
input[type=number],
.sheet-wrapper input[type=text] {
cursor: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/cursor-write.png") 11 11, auto;
cursor: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/cursor-write.png") 11 11, auto;
}
/* Focus Cursor */
@@ -142,7 +142,7 @@ input.sheet-tab,
.sheet-has-title:hover,
.sheet-wrapper select:hover,
.sheet-wrapper button[type="roll"]:hover {
cursor: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/cursor-focus.png") 11 11, auto;
cursor: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/cursor-focus.png") 11 11, auto;
}
/* Disabled Cursor */
@@ -152,7 +152,7 @@ input.sheet-tab,
.sheet-wrapper input[disabled],
.sheet-wrapper select[disabled],
.sheet-wrapper textarea[disabled] {
cursor: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/cursor-disabled.png") 11 11, auto;
cursor: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/cursor-disabled.png") 11 11, auto;
}
/* ========================================================================== */
@@ -260,10 +260,10 @@ input[type="checkbox"].sheet-toggle:focus + span + label {
}
.sheet-wrapper .sheet-table-header h4 {
color: #b29a6b;
border-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/border-header-box.jpg");
border-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/border-header-box.jpg");
border-image-slice: 3;
background-color: #2f3338;
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-dark.jpg");
background: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-dark.jpg");
}
.sheet-wrapper .sheet-table-wrapper h4 {
margin-bottom: 0;
@@ -321,7 +321,7 @@ input[type="checkbox"].sheet-toggle:focus + span + label {
border: 1px solid #0004;
border-radius: 5px;
background-color: #a39a8c44;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-text.png");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-text.png");
background-repeat: no-repeat;
background-size: cover;
box-sizing: border-box;
@@ -386,7 +386,7 @@ input[type="checkbox"].sheet-toggle:focus + span + label {
text-align: center;
text-align-last: center;
border: 3px solid transparent;
border-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/border-header-box.jpg");
border-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/border-header-box.jpg");
border-image-slice: 3;
background-color: #a39a8c;
appearance: none;
@@ -444,7 +444,7 @@ input[type="checkbox"] + span::before {
font-size: 10px;
border: none;
border-radius: 3px;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/checkbox.png");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/checkbox.png");
background-size: 100%;
background-repeat: no-repeat;
background-position: center;
@@ -453,7 +453,7 @@ input[type="checkbox"] + span::before {
input[type="checkbox"]:checked + span::before {
content: "";
border: none;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/checkbox-mark.png");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/checkbox-mark.png");
background-size: 100%;
background-repeat: repeat;
background-position: center;
@@ -482,7 +482,7 @@ input[type="checkbox"]:focus + span {
border: 0;
border-radius: 4px;
background-color: transparent;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/button-box.jpg");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/button-box.jpg");
background-size: auto 24px;
background-repeat: repeat-x;
box-shadow: none;
@@ -501,12 +501,12 @@ input[type="checkbox"]:focus + span {
}
.sheet-wrapper button[type="roll"]::before {
left: 0;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/button-boxl.jpg");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/button-boxl.jpg");
background-size: 10px 24px;
}
.sheet-wrapper button[type="roll"]::after {
right: 0;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/button-boxr.jpg");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/button-boxr.jpg");
background-size: 10px 24px;
}
.sheet-wrapper button[type="roll"] span {
@@ -564,7 +564,7 @@ input[type="checkbox"]:focus + span {
.sheet-wrapper button:hover {
color: #fff;
border-width: 1px;
background-image: url ("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/button-hover.jpg");
background-image: url ("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/button-hover.jpg");
background-position: 0 center;
background-repeat: no-repeat;
background-size: 100% 100%;
@@ -783,7 +783,7 @@ input[type="checkbox"]:focus + span {
.sheet-wrapper .sheet-table-repeat .repcontrol {
background-color: #2f3338;
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-dark.jpg");
background: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-dark.jpg");
}
/* ========================================================================== */
@@ -819,14 +819,14 @@ input.sheet-desc[type="checkbox"] + span {
input.sheet-desc[type="checkbox"] + span::before {
content: "";
margin: 2px;
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/skull-yellow-full.png");
background: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/skull-yellow-full.png");
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center;
}
input.sheet-desc[type="checkbox"]:checked + span::before {
content: "";
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/skull-green.png");
background: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/skull-green.png");
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center;
@@ -834,7 +834,7 @@ input.sheet-desc[type="checkbox"]:checked + span::before {
input.sheet-desc[type="checkbox"]:hover + span::before {
content: "";
display: inline-block;
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/skull-yellow.png");
background: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/skull-yellow.png");
background-size: 20px 20px;
background-repeat: no-repeat;
background-position: center;
@@ -863,7 +863,7 @@ div.sheet-desc textarea {
position: relative;
width: 300px;
height: 340px;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-armour.png");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-armour.png");
background-size: 180px 320px;
background-repeat: no-repeat;
background-position: 85px 20px;
@@ -899,7 +899,7 @@ div.sheet-desc textarea {
.sheet-shield {
top: 234px;
left: 20px;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-shield.png");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-shield.png");
background-size: 50px;
background-repeat: no-repeat;
background-position: center 2px;
@@ -912,15 +912,11 @@ div.sheet-desc textarea {
/* ========================================================================== */
h4,
label {
.sheet-wfrp label {
color: #332;
opacity: .875;
}
.sheet-darkmode .characterviewer label, .sheet-darkmode .options .row {
--dark-secondarytext: #332;
}
/* ========================================================================== */
/* -------------------------------------------------------------------------- */
/* # Aligning */
@@ -960,7 +956,7 @@ label.sheet-tab {
text-align: center;
vertical-align: middle;
border: 3px solid transparent;
border-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/border-header-box.jpg");
border-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/border-header-box.jpg");
border-image-slice: 3;
background: #a39a8c;
appearance: none;
@@ -987,7 +983,7 @@ input.sheet-tab:checked + label {
}
input.sheet-tab:checked + label {
border-color: #000;
background-image: url ("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/button-hover.jpg");
background-image: url ("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/button-hover.jpg");
background-size: 100% 100%;
background-repeat: no-repeat;
background-position: center;
@@ -1033,9 +1029,9 @@ input.sheet-tabExperience:checked ~ div.sheet-tabExperience {
color: #cebbb3;
border: 10px solid transparent;
border-collapse: separate;
border-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/border-large-box.jpg") 10 round;
border-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/border-large-box.jpg") 10 round;
border-image-width: 10px;
background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/WFRP4CharSheet/images/background-dark.jpg");
background-image: url("https://raw.githubusercontent.com/zedafty/wfrp4/master/images/background-dark.jpg");
box-sizing: border-box;
}
.sheet-rolltemplate-wfrp4 table a {
@@ -1054,10 +1050,10 @@ input.sheet-tabExperience:checked ~ div.sheet-tabExperience {
font-size: 1.1875em;
font-style: italic;
}
.sheet-rolltemplate-wfrp4 .inlinerollresult,
.sheet-rolltemplate-wfrp4 .inlinerollresult.fullcrit,
.sheet-rolltemplate-wfrp4 .inlinerollresult.fullfail,
.sheet-rolltemplate-wfrp4 .inlinerollresult.importantroll {
.sheet-rolltemplate-wfrp4 .sheet-rolltemplate .inlinerollresult,
.sheet-rolltemplate-wfrp4 .sheet-rolltemplate .inlinerollresult.fullcrit,
.sheet-rolltemplate-wfrp4 .sheet-rolltemplate .inlinerollresult.fullfail,
.sheet-rolltemplate-wfrp4 .sheet-rolltemplate .inlinerollresult.importantroll {
display: inline;
min-width: auto;
padding: 0;
WFRP4CharSheet/WFRP4Charsheet.html
+6 -5
View File
@@ -3,7 +3,7 @@
<!-- Version 1.8 -->
<!-- CHARACTER SHEET -->
<div>
<div class="sheet-wfrp">
<!-- HIDDENS -->
<input type="hidden" name="attr_modifier" value="">
@@ -31,7 +31,7 @@
<div class="sheet-col">
<table>
<tr>
<td><label class="sheet-right" data-i18n="Character-name">Name</label></td>
<td><label class="sheet-right" data-i18n="Name">Name</label></td>
<td colspan="3"><input type="text" name="attr_character_name" /></td>
<td><label class="sheet-right" data-i18n="Species">Species</label></td>
<td><input type="text" name="attr_character_Species" /></td>
@@ -1539,7 +1539,7 @@
<div class="sheet-col" style="width: 49%; margin-right: 1%;">
<div class="sheet-table-wrapper">
<div class="sheet-table-repeat">
<div class="sheet-table-header"><h4 data-i18n="GROUPED-&-ADVANCED-SKILLS"><label>GROUPED & ADVANCED SKILLS</h4></div>
<div class="sheet-table-header"><h4 data-i18n="GROUPED-&-ADVANCED-SKILLS">GROUPED & ADVANCED SKILLS</h4></div>
<div class="sheet-row">
<div style="width: 40%;"><label data-i18n="Name">Name</label></div>
<div style="width: 8%;"></div>
@@ -1598,6 +1598,7 @@
</div>
</fieldset>
</div>
</div>
</div>
@@ -1922,7 +1923,7 @@
<td style="width: 25%;"><input type="text" name="attr_advancement2" placeholder="Advancement name…" data-i18n-placeholder="advancement-name-pl" /></td>
<td style="width: 5%;"><input type="number" placeholder="Advancement cost…" data-i18n-placeholder="advancement-cost-pl" value="0" name="attr_advancement2xp" /></td>
<td style="width: 5%;"></td>
<td style="width: 25%;"><input type="text" name="attr_advancement3" pplaceholder="Advancement name…" data-i18n-placeholder="advancement-name-pl"" /></td>
<td style="width: 25%;"><input type="text" name="attr_advancement3" pplaceholder="Advancement name…" data-i18n-placeholder="advancement-name-pl" /></td>
<td style="width: 5%;"><input type="number" placeholder="Advancement cost…" data-i18n-placeholder="advancement-cost-pl" value="0" name="attr_advancement3xp" /></td>
</tr>
</table>
@@ -1944,7 +1945,7 @@
<!-- Rolltemplate wfrp4 -->
<rolltemplate class="sheet-rolltemplate-wfrp4">
<table>
<table class="sheet-rolltemplate">
<th>
<div class="sheet-rollcharacter">{{name}}</div>
<div class="sheet-rolltitle">{{title}}</div>