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

Made description fields expand to fit content, remove default language, fix attribute names, add helpful inputs and remove useless ones for inventory

Browse Source
This commit is contained in:
artinkel
2020-12-31 18:47:53 -08:00
parent dbbffb261f
commit b2756f4567
4 changed files with 129 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Wildsea/wildsea-character-preview.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 116 KiB

After

Width:  |  Height:  |  Size: 125 KiB

Wildsea/wildsea-crew-preview.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 75 KiB

After

Width:  |  Height:  |  Size: 117 KiB

Wildsea/wildsea.css
+68 -14
View File
@@ -24,7 +24,7 @@
.sheet-character {
grid-area: main;
display: none;
display: grid;
width: 820px;
height: 1200px;
background-color: #ADD2AD;
@@ -240,7 +240,7 @@
}
.sheet-shorterBox {
width: 150px;
width: 130px;
}
/*************************/
@@ -251,14 +251,56 @@
width: 804px;
}
.sheet-aspectDesc {
width: 410px;
font-size: 14px;
/*******************/
.sheet-auto-expand {
position: relative;
cursor: text;
word-wrap: break-word;
box-shadow: 1px;
width: 420px;
min-height: 25px;
display: inline-block;
vertical-align: top;
margin-bottom: 5px;
padding-top: 3px;
padding-left: 3px;
}
.sheet-auto-expand span {
visibility: hidden;
white-space: pre-wrap;
display: block;
}
.sheet-auto-expand textarea {
position: absolute;
z-index: 1;
top: 0;
left: 0;
margin: 0;
overflow: hidden;
resize: none;
height: 100%;
width: 100%;
display: block;
box-sizing: border-box;
color: inherit;
font: inherit;
letter-spacing: inherit;
padding: inherit;
text-align: inherit;
text-transform: inherit;
}
/*******************/
.sheet-aspectTitle {
font-weight: 700;
width: 200px;
width: 180px;
height: 25px;
vertical-align: top;
}
.sheet-bold {
@@ -321,7 +363,6 @@
}
.sheet-skills span {
display: inline-block;
text-align: right;
float: right;
}
@@ -389,8 +430,14 @@
"whispers charts";
}
.sheet-inv input[type=text] {
.sheet-inv-name {
width: 250px;
display: inline;
}
.sheet-inv-tag {
width: 120px;
display: inline;
}
.sheet-salvage {
@@ -684,16 +731,23 @@ input[type=number] {
width: 392px;
}
.sheet-design label {
display: inline-block;
.sheet-design-name {
float: left;
clear: left;
width: 50px;
margin-top: 5px;
text-align: left;
}
.sheet-design input[type="text"] {
display: inline-block;
width: 330px;
.sheet-design-description {
width: 190px;
float: left;
}
.sheet-design-effects {
width: 140px;
float: right;
margin-top: -5px;
margin-left: 2px;
}
.sheet-ratings {
Wildsea/wildsea.html
+61 -33
View File
@@ -13,7 +13,7 @@
<div class="character">
<div class="common section">
<div class="name sectionNoBorder">
<label>Name <input class="bold" type="text" name="attr_name"/></label>
<label>Name <input class="bold" type="text" name="attr_character_name"/></label>
</div>
<div class="bloodline sectionNoBorder">
@@ -141,35 +141,35 @@
<div class="drivmir drivmirSection">
<div class="drives section">
<label>Drives</label>
<input type="text" name="attr_drive1">
<input type="text" name="attr_drive1" placeholder="Drive 1">
<!-- blank space -->
<div style="height:3px;"></div>
<input type="text" name="attr_drive2">
<input type="text" name="attr_drive2" placeholder="Drive 2">
<!-- blank space -->
<div style="height:3px;"></div>
<input type="text" name="attr_drive3">
<input type="text" name="attr_drive3" placeholder="Drive 3">
</div>
<div class="mires section">
<label>Mires</label>
<input type="text" name="attr_mire1">
<input type="text" name="attr_mire1" placeholder="Mire 1">
<input type="checkbox" name="attr_mire1Charge1"><span></span>
<input type="checkbox" name="attr_mire1Charge2"><span></span>
<!-- blank space -->
<div style="height:3px;"></div>
<input type="text" name="attr_mire2">
<input type="text" name="attr_mire2" placeholder="Mire 2">
<input type="checkbox" name="attr_mire2Charge1"><span></span>
<input type="checkbox" name="attr_mire2Charge2"><span></span>
<!-- blank space -->
<div style="height:3px;"></div>
<input type="text" name="attr_mire3">
<input type="text" name="attr_mire3" placeholder="Mire 3">
<input type="checkbox" name="attr_mire3Charge1"><span></span>
<input type="checkbox" name="attr_mire3Charge2"><span></span>
</div>
@@ -177,16 +177,13 @@
<div class="lang section">
<label>Languages</label>
<input class="shorterBox" type="text" name="attr_lowSour" value="Low Sour">
<input type="text" name="attr_langDescription" value="A mongrel language. Common.">
<input type="number" name="attr_lowSour" value=3>
<fieldset class="repeating_lang">
<input class="shorterBox" type="text" name="attr_lang" placeholder="Language">
<input type="text" name="attr_langDescription" placeholder="Description">
<input style="width:230px; font-size: 12px;" type="text" name="attr_langDescription" placeholder="Description/Spoken By">
<input type="number" name="attr_langRating" placeholder="0">
<!-- blank space -->
<div style="height:10px; display:block;"></div>
<div style="height:5px; display:block;"></div>
</fieldset>
</div>
@@ -195,7 +192,7 @@
<div class="major sectionNoBorder">
<label>Major</label>
<fieldset class="repeating_majorMilestones">
<input type="text" name="attr_majorMilestone">
<input type="text" name="attr_majorMilestone" placeholder="Major Milestone">
<!-- blank space -->
<div style="height:3px;"></div>
@@ -204,7 +201,7 @@
<div class="minor sectionNoBorder">
<label>Minor</label>
<fieldset class="repeating_minorMilestones">
<input type="text" name="attr_minorMilestone">
<input type="text" name="attr_minorMilestone" placeholder="Minor Milestone">
<!-- blank space -->
<div style="height:3px;"></div>
@@ -216,7 +213,11 @@
<label>Aspects</label>
<fieldset class="repeating_aspects">
<input class="aspectTitle" type="text" name="attr_aspect" placeholder="Aspect">
<input class="aspectDesc" type="text" name="attr_aspectDescription" placeholder="Rule">
<div class="sheet-auto-expand">
<span name="attr_aspect_description"></span>
<textarea name="attr_aspect_description" placeholder="Description"></textarea>
</div>
<select name="attr_aspectLength">
<option value="1">1</option>
@@ -272,8 +273,12 @@
<div class="temp section">
<label>Temp Aspects</label>
<fieldset class="repeating_tempAspects">
<input class="aspectTitle" type="text" name="attr_aspect" placeholder="Aspect">
<input class="aspectDesc" type="text" name="attr_aspectDescription" placeholder="Rule">
<input class="aspectTitle" type="text" name="attr_temp_aspect" placeholder="Aspect">
<div class="sheet-auto-expand">
<span name="attr_temp_description"></span>
<textarea name="attr_temp_description" placeholder="Description"></textarea>
</div>
<select name="attr_tempAspectLength">
<option value="1">1</option>
@@ -331,8 +336,8 @@
<div class="salvage skillSection">
<label>Salvage</label>
<fieldset class="repeating_salvage">
<input style="width:120px;" type="test" name="attr_savageName" placeholder="Name">
<input type="text" name="attr_salvageDesc" placeholder="Description">
<input class="inv-name" type="test" name="attr_salvageName" placeholder="Name">
<input class="inv-tag" type="text" name="attr_salvageTags" placeholder="Tags"
<!-- blank space -->
<div style="height:3px;"></div>
@@ -341,8 +346,8 @@
<div class="specimens skillSection">
<label>Specimens</label>
<fieldset class="repeating_specimens">
<input style="width:120px;" type="text" name="attr_specimenName" placeholder="Name">
<input type="text" name="attr_specimenDesc" placeholder="Description">
<input class="inv-name" type="text" name="attr_specimenName" placeholder="Name">
<input class="inv-tag" type="text" name="attr_specimenTags" placeholder="Tags"
<!-- blank space -->
<div style="height:3px;"></div>
@@ -351,8 +356,8 @@
<div class="whispers skillSection">
<label>Whispers</label>
<fieldset class="repeating_whispers">
<input style="width:120px;" type="text" name="attr_whisperName" placeholder="Name">
<input type="text" name="attr_whisperDesc" placeholder="Description">
<input class="inv-name" type="text" name="attr_whisperName" placeholder="Name">
<input class="inv-tag" type="text" name="attr_whisperTags" placeholder="Tags"
<!-- blank space -->
<div style="height:3px;"></div>
@@ -361,8 +366,8 @@
<div class="charts skillSection">
<label>Charts</label>
<fieldset class="repeating_charts">
<input style="width:120px;" type="text" name="attr_chartName" placeholder="Name">
<input type="text" name="attr_chartDesc" placeholder="Description">
<input class="inv-name" type="text" name="attr_chartName" placeholder="Name">
<input class="inv-tag" type="text" name="attr_chartTags" placeholder="Tags"
<!-- blank space -->
<div style="height:3px;"></div>
@@ -385,17 +390,31 @@
<!-- CREW SHEET -->
<div class="crew">
<div class="crew-common section">
<label>Name <input style="font-weight:bold; width:250px;" type="text" name="attr_crew_name"/></label>
<label>Name <input style="font-weight:bold; width:250px;" type="text" name="attr_character_name"/></label>
<label>Description <input style="width:390px;" type="text" name="attr_crew_description"></label>
</div>
<div class="design section">
<label>Design</label>
<label>Size <input type="text" name="attr_crew_size"></label>
<label>Frame <input type="text" name="attr_crew_frame"></label>
<label>Hull <input type="text" name="attr_crew_hull"></label>
<label>Bite <input type="text" name="attr_crew_bite"></label>
<label>Engine <input type="text" name="attr_crew_engine"></label>
<label class="design-name">Size </label>
<input class="design-description" type="text" name="attr_crew_size" placeholder="Name">
<input class="design-effects" type="text" name="attr_crew_size_effects" placeholder="Ratings increased">
<label class="design-name">Frame </label>
<input class="design-description" type="text" name="attr_crew_frame" placeholder="Name">
<input class="design-effects" type="text" name="attr_crew_frame_effects" placeholder="Ratings increased">
<label class="design-name">Hull </label><input class="design-description" type="text" name="attr_crew_hull" placeholder="Name">
<input class="design-effects" type="text" name="attr_crew_hull_effects" placeholder="Ratings increased">
<label class="design-name">Bite </label>
<input class="design-description" type="text" name="attr_crew_bite" placeholder="Name">
<input class="design-effects" type="text" name="attr_crew_bite_effects" placeholder="Ratings increased">
<label class="design-name">Engine </label>
<input class="design-description" type="text" name="attr_crew_engine" placeholder="Name">
<input class="design-effects" type="text" name="attr_crew_engine_effects" placeholder="Ratings increased">
</div>
<div class="ratings section">
@@ -745,7 +764,12 @@
<option value="room">Room</option>
</select>
<input class="bold" type="text" name="attr_crew_adjustment_title" placeholder="Name">
<input style="width:450px;" type="text" name="attr_crew_adjustment_desc" placeholder="Description">
<div class="sheet-auto-expand">
<span name="attr_temp_description"></span>
<textarea name="attr_temp_description"></textarea>
</div>
</fieldset>
</div>
@@ -775,7 +799,11 @@
<label>Undercrew</label>
<fieldset class="repeating_crewUndercrew">
<input class="undercrewTitle" type="text" name="attr_crew_undercrew_title" placeholder="Name">
<input class="undercrewDesc" type="text" name="attr_crew_undercrew_description" placeholder="Description">
<div class="sheet-auto-expand">
<span name="attr_undercrew_description"></span>
<textarea name="attr_undercrew_description"></textarea>
</div>
<select name="attr_crew_undercrew_length">
<option value="1">1</option>