Skip to content

Commit 0d6e698

Browse files
davidroll20davidroll20
authored
Merge pull request #14528 from AxonXona/master
[Legend Werx] New Sheet
2 parents 4f9aa62 + 43637b3 commit 0d6e698

File tree

4 files changed

+513
-0
lines changed

4 files changed

+513
-0
lines changed

‎Legend Werx/Werx.jpg‎

196 KB
Loading

‎Legend Werx/sheet.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"html": "werx.html",
3+
"css": "styles.css",
4+
"authors": "Axon S.",
5+
"roll20userid": "10872012",
6+
"preview": "Werx.jpg",
7+
"instructions": "Rough draft of the character sheet being used for the Legend Werx game system, will be updating over time"
8+
9+
}

‎Legend Werx/styles.css‎

Lines changed: 369 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,369 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
2+
3+
.sheet-maindiv{
4+
width: 4000px;
5+
height: 4000px;
6+
}
7+
8+
h1, h2, h3, h4{
9+
color: white;
10+
}
11+
12+
.border{
13+
font-family: 'Press Start 2p';
14+
color: white;
15+
text-shadow: 3px 3px 1px black, -3px -1px 0 black;
16+
width: 80%;
17+
background-image: url(https://i.imgur.com/PtkYwSB.png);
18+
--padding: 25px;
19+
float: left;
20+
padding: var(--padding);
21+
border: 7px solid black;
22+
box-shadow: inset 0 0 0 var(--padding) rgba(92, 62, 169, 100%);
23+
}
24+
25+
.legend{
26+
position: absolute;
27+
left: 305px;
28+
top: 70px;
29+
}
30+
31+
.werx{
32+
text-align: center;
33+
}
34+
/* setting input text style */
35+
input[type=text]{
36+
font-family: Arial, Helvetica, sans-serif;
37+
border: 2px solid black;
38+
}
39+
40+
input[type=textarea]{
41+
font-family: Arial, Helvetica, sans-serif;
42+
border: 2px solid black;
43+
}
44+
45+
input[type=number]{
46+
font-family: Arial, Helvetica, sans-serif;
47+
border: 2px solid black;
48+
}
49+
/* setting up styling grids */
50+
.player{
51+
display: grid;
52+
grid-template-rows: auto;
53+
grid-template-columns: 1fr;
54+
padding: 15px;
55+
}
56+
57+
.topplayer{
58+
display: grid;
59+
grid-template-rows: repeat(4, 1fr);
60+
grid-template-columns: 1fr 2fr;
61+
padding: 15px;
62+
63+
}
64+
65+
.playername{
66+
grid-area: 1 / 1 / 1/ 1
67+
}
68+
69+
.charactername{
70+
justify-self: center;
71+
}
72+
73+
.inputcharacter{
74+
justify-self: center;
75+
}
76+
77+
.race input{
78+
width: 145px;
79+
}
80+
81+
.class{
82+
justify-self: center;
83+
}
84+
85+
.class input{
86+
width: 132px;
87+
}
88+
89+
.NextLevel{
90+
grid-area: 4 / 2 / 4 / 2;
91+
margin-left: 92px;
92+
}
93+
94+
.NextLevel input{
95+
width: 100px;
96+
}
97+
/* styling character skill and general skills */
98+
.center{
99+
justify-self: center;
100+
}
101+
102+
.playerskills{
103+
display: grid;
104+
grid-template-rows: repeat(4, 1fr);
105+
grid-template-columns: repeat(4, 1fr);
106+
padding: 10px;
107+
gap: 1px 20px;
108+
font-size: 8.5px;
109+
}
110+
111+
.stealthiness{
112+
justify-self: start;
113+
}
114+
115+
116+
.playergen{
117+
display: grid;
118+
grid-template-rows: repeat(4, 1fr);
119+
grid-template-columns: repeat(5, 1fr);
120+
padding: 15px;
121+
}
122+
123+
124+
.playergen input{
125+
width: 100px;
126+
}
127+
128+
/* configure the tab buttons */
129+
.charsheet .sheet-character,
130+
.charsheet .sheet-actions {
131+
display: none;
132+
}
133+
134+
/* style the active button */
135+
.charsheet .sheet-tabstoggle[value="character"] ~ div .sheet-button0 {outline: 2px solid rgba(92, 62, 169, 70%); }
136+
.charsheet .sheet-tabstoggle[value="actions"] ~ div .sheet-button1 {outline: 2px solid rgba(92, 62, 169, 70%); }
137+
138+
/* show the selected tab */
139+
.charsheet .sheet-tabstoggle[value="character"] ~ div.sheet-character,
140+
.charsheet .sheet-tabstoggle[value="actions"] ~ div.sheet-actions {
141+
display: block;
142+
}
143+
144+
145+
/* positioning tab buttons */
146+
147+
button{
148+
color: black;
149+
}
150+
151+
152+
.button-position{
153+
margin-left: 400px;
154+
}
155+
156+
/* styling the player skill buttons */
157+
158+
.charsheet button[type=roll].no-roll::before{
159+
content: '';
160+
}
161+
162+
.playerskills button, .playergen button{
163+
font-family: 'press start 2p';
164+
font-size: 5px;
165+
color: white;
166+
background-image: none;
167+
border: none;
168+
background-color: transparent;
169+
text-shadow: 3px 3px 1px black, -3px -1px 0 black;
170+
box-shadow: none;
171+
}
172+
173+
.playerskills button:hover, .playergen button:hover{
174+
font-family: 'press start 2p';
175+
font-size: 5px;
176+
color: white;
177+
background-image: none;
178+
border: none;
179+
background-color: transparent;
180+
text-shadow: 3px 3px 1px black, -3px -1px 0 black;
181+
color: orange;
182+
box-shadow: none;
183+
}
184+
185+
.ui-dialog .charsheet .playergen button{
186+
font-size: 1em;
187+
}
188+
189+
.playergen .onset{
190+
position:relative;
191+
bottom: 9px;
192+
}
193+
194+
/* Options on the skills tab */
195+
196+
.charsheet .testname,
197+
.charsheet input.show:checked ~ div.opt-select{
198+
display: block;
199+
}
200+
201+
.charsheet .opt-select,
202+
.charsheet input.show:checked ~ .testname{
203+
display: none;
204+
}
205+
206+
207+
.charsheet input.toggle-type-a:not(:checked) ~ .show-type-a{
208+
display:none;
209+
}
210+
211+
.charsheet input.toggle-type-b:not(:checked) ~ .show-type-b{
212+
display:none;
213+
}
214+
215+
216+
.testname{
217+
color: white;
218+
background-image: none;
219+
border: none;
220+
background-color: transparent;
221+
text-shadow: 3px 3px 1px black, -3px -1px 0 black;
222+
box-shadow: none;
223+
}
224+
225+
.testname:hover{
226+
font-family: 'press start 2p';
227+
font-size: 5px;
228+
color: white;
229+
background-image: none;
230+
border: none;
231+
background-color: transparent;
232+
text-shadow: 3px 3px 1px black, -3px -1px 0 black;
233+
color: orange;
234+
box-shadow: none;
235+
}
236+
237+
238+
.desc {
239+
font-family: Arial, Helvetica, sans-serif;
240+
font-size: 20px;
241+
resize: none;
242+
box-sizing: border-box;
243+
width: 100px;
244+
height: 231px;
245+
}
246+
247+
option{
248+
font-family: Arial, Helvetica, sans-serif;
249+
}
250+
251+
select{
252+
font-family: Arial, Helvetica, sans-serif;
253+
}
254+
255+
256+
/* Styling the rows and columns of the skills tab */
257+
258+
.sheet-actions-style{
259+
display: grid;
260+
grid-template-rows: 50px, 100px,50px, 100px,50px, 100px,50px, 100px;
261+
grid-template-columns: repeat(2, 1fr);
262+
column-gap: 20px;
263+
}
264+
265+
.skill-level0{
266+
grid-area: 1/1/1/1;
267+
}
268+
269+
.skill-level1{
270+
grid-area: 3/1/3/1;
271+
align-self:end;
272+
}
273+
274+
.skill-level2{
275+
grid-area: 5/1/5/1;
276+
align-self:end;
277+
}
278+
279+
.skill-level3{
280+
grid-area: 7/1/7/1;
281+
align-self:end;
282+
}
283+
284+
.skill-level4{
285+
grid-area: 2/2/2/2;
286+
align-self:end;
287+
}
288+
289+
.skill-level5{
290+
grid-area: 4/2/4/2;
291+
align-self:end;
292+
}
293+
294+
.skill-level6{
295+
grid-area: 6/2/6/2;
296+
align-self:end;
297+
}
298+
299+
.skill-container0{
300+
grid-area: 2/1/2/1;
301+
}
302+
303+
.skill-container1{
304+
grid-area: 4/1/4/1;
305+
}
306+
307+
.skill-container2{
308+
grid-area: 6/1/6/1;
309+
}
310+
311+
.skill-container3{
312+
grid-area: 8/1/8/1;
313+
}
314+
315+
.skill-container4{
316+
grid-area: 3/2/3/2;
317+
}
318+
319+
.skill-container5{
320+
grid-area: 5/2/5/2;
321+
}
322+
323+
.skill-container6{
324+
grid-area: 7/2/7/2;
325+
}
326+
327+
/* Adjusting skill detail checkbox position */
328+
329+
.details{
330+
position: relative;
331+
top: 10px !important;
332+
left: 275px !important;
333+
width: 18px !important;
334+
height: 18px !important;
335+
margin-bottom: -10px !important;
336+
}
337+
338+
.charsheet input.details:checked{
339+
top: 10px !important;
340+
left: 290px !important;
341+
width: 18px !important;
342+
height: 18px !important;
343+
}
344+
345+
.repcontrol{
346+
display:flex;
347+
gap: 1%;
348+
}
349+
350+
/* Styling the rolltemplate */
351+
352+
.sheet-rolltemplate-werx {
353+
display: grid;
354+
grid-template-columns: 45% 45%;
355+
column-gap: 10%;
356+
background-color: white;
357+
line-height: 1.9em;
358+
}
359+
.sheet-rolltemplate-werx .sheet-template-title {
360+
grid-column: 1 / -1;
361+
background-color: rgba(92, 62, 169, 70%);
362+
}
363+
364+
.sheet-rolltemplate-simple-roll div:nth-child(even) {
365+
text-align: right;
366+
}
367+
.sheet-rolltemplate-simple-roll div:nth-child(1) {
368+
text-align: center;
369+
}

0 commit comments

Comments
 (0)