css fixes

This commit is contained in:
Bodo Hüsemann
2022-01-20 23:47:42 +01:00
parent 087961387f
commit b4820f591d
2 changed files with 52 additions and 55 deletions
+25 -28
View File
@@ -33,14 +33,25 @@
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif, sans-serif;
font-weight: normal;
}
.charsheet {
/* Define CSS variables */
--red: rgb(176, 33, 30);
--gray: rgb(104, 104, 104);
--solidborder: 1px solid var(--gray);
--borderred: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
--borderbrown: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png');
--background: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/background1.webp');
padding: 0px;
}
/*Configure the tab buttons*/
.charsheet :is(.sheet-pc,.sheet-adversary) {
display: none;
position: relative;
background: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/background1.webp');
background: var(--background);
background-color: #FEFCF0;
border: 8px solid transparent;
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
border-image-source: var(--borderred);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
padding-right: 10px;
@@ -57,15 +68,6 @@
.charsheet .sheet-tabstoggle[value="isAdversary"] ~ div.sheet-adversary {
display: block;
}
.charsheet {
/* Define CSS variables */
--red: rgb(176, 33, 30);
--gray: rgb(104, 104, 104);
--solidborder: 1px solid var(--gray);
--borderred: https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png;
--borderbrown: https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png;
padding: 0px;
}
/* Generic element styls */
.charsheet :is(h1,h2,h3){
font-family: "Aniron", "Palatino Linotype", "Book Antiqua", Palatino, serif, sans-serif;
@@ -284,7 +286,7 @@ input[type='radio'] {
justify-self: center;
border: 4px solid transparent;
background-color: var(--bg-color);
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png');
border-image-source: var(--borderbrown);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
width: 35px;
@@ -292,7 +294,7 @@ input[type='radio'] {
transform: rotate(45deg);
}
.charsheet span.diamond-red {
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
border-image-source: var(--borderred);
}
.charsheet span[class|="diamond"] input[type="number"]{
border-bottom: 0;
@@ -311,7 +313,7 @@ input[type='radio'] {
justify-content: center;
border: 4px solid transparent;
background-color: var(--bg-color);
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png');
border-image-source: var(--borderbrown);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
width: 20px;
@@ -319,7 +321,7 @@ input[type='radio'] {
transform: rotate(45deg);
}
.charsheet span.diamond-small-red {
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
border-image-source: var(--borderred);
}
.charsheet :is(span.diamond-small-red,span.diamond-small) span {
background-color: var(--bg-color);
@@ -330,7 +332,7 @@ input[type='radio'] {
.charsheet #content :is(#strength,#wits,#skill-strength,#skill-heart,#skill-wits,#conditions,#mount) {
border: 5px solid transparent;
/* background-color: var(--bg-color); */
border-image-source: url(https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png);
border-image-source: var(--borderbrown);
border-image-repeat: repeat;
margin: 0;
box-sizing: border-box;
@@ -596,12 +598,6 @@ input[type='radio'] {
.charsheet div.attribute input {
text-align: center;
}
.charsheet div.attribute .span2 {
column-span: 2;
}
.charsheet div.attribute .span3 {
column-span: 3;
}
/* Skills */
.charsheet #skill-strength{
@@ -863,8 +859,9 @@ input[type='radio'] {
--color-gray: rgb(104, 104, 104);
--solidborder: 1px solid var(--gray);
--bg-color: #FEFCF0;
--borderred: https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png;
--borderbrown: https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png;
--borderred: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
--borderbrown: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png');
--background: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/background1.webp');
}
.sheet-rolltemplate-tor * {
font-family: Papyrus, 'Book Antiqua', Palatino, serif, sans-serif;
@@ -874,10 +871,10 @@ input[type='radio'] {
margin-left: -7px;
}
.sheet-rolltemplate-tor .sheet-container {
background: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/background1.webp');
background: var(--background);
background-color: #FEFCF0;
border: 5px solid transparent;
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
border-image-source: var(--borderred);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
}
@@ -957,7 +954,7 @@ input[type='radio'] {
justify-self: center;
border: 4px solid transparent;
background-color: var(--bg-color);
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-brown.png');
border-image-source: var(--borderbrown);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
width: 30px;
@@ -1002,7 +999,7 @@ input[type='radio'] {
width: 45px !important;
height: 45px !important;
border: 5px solid transparent;
border-image-source: url('https://raw.githubusercontent.com/bhuesemann/roll20-character-sheets/tor2e_02-00-00/The%20One%20Ring%202e/assets/boxline-border-red.png');
border-image-source: var(--borderred);
border-image-slice: 8 8 8 8;
border-image-repeat: repeat;
}
+27 -27
View File
@@ -1882,53 +1882,53 @@
<rolltemplate class="sheet-rolltemplate-tor">
<div class="sheet-container sheet-color-{{color}}">
<div class="sheet-header">
{{#character-name}}<div class="sheet-title charname text-center">{{character-name}}</div>{{/character-name}}
{{#roll-name}}<div class="sheet-subtitle rollname text-center">{{roll-name}}</div>{{/roll-name}}
{{#character-name}}<div class="sheet-title sheet-text-center">{{character-name}}</div>{{/character-name}}
{{#roll-name}}<div class="sheet-subtitle sheet-text-center">{{roll-name}}</div>{{/roll-name}}
</div>
<div class="sheet-content">
<div class="full-col center die-title target-number">Target Number</div>
<div class="full-col center die-result target-number">
<span class="rotated-box"><span class="die-result">{{computed::target}}</span></span>
<div class="sheet-full-col sheet-center sheet-die-title sheet-target-number">Target Number</div>
<div class="sheet-full-col sheet-center sheet-die-result sheet-target-number">
<span class="sheet-rotated-box"><span class="sheet-die-result">{{computed::target}}</span></span>
</div>
<div class="half-col die-title feat-label">Feat Die</div>
<div class="half-col die-title success-label">Success<br /> Dice</div>
<div class="sheet-half-col sheet-die-title sheet-feat-label">Feat Die</div>
<div class="sheet-half-col sheet-die-title sheet-success-label">Success<br /> Dice</div>
{{#rollWasCrit() feat}}
<div class="half-col die-result feat-die">
<span class="rotated-box fullcrit">{{feat}}</span><span class="gandalf"></span>
<div class="sheet-half-col sheet-die-result sheet-feat-die">
<span class="sheet-rotated-box sheet-fullcrit">{{feat}}</span><span class="sheet-gandalf"></span>
</div>
{{/rollWasCrit() feat}}
{{#rollWasFumble() feat}}
<div class="half-col die-result feat-die">
<span class="rotated-box fullfail">{{feat}}</span><span class="eye"></span>
<div class="sheet-half-col sheet-die-result sheet-feat-die">
<span class="sheet-rotated-box sheet-fullfail">{{feat}}</span><span class="sheet-eye"></span>
</div>
{{/rollWasFumble() feat}}
{{#rollBetween() feat 1 10}}
<div class="half-col die-result feat-die">
<span class="rotated-box">{{feat}}</span>
<div class="sheet-half-col sheet-die-result sheet-feat-die">
<span class="sheet-rotated-box">{{feat}}</span>
</div>
{{/rollBetween() feat 1 10}}{{^feat}}
<div class="half-col die-result feat-die"><span class="rotated-box"><span>-</span></span></div>
<div class="sheet-half-col sheet-die-result sheet-feat-die"><span class="sheet-rotated-box"><span>-</span></span></div>
{{/feat}}
<div class="half-col die-result success-die"><span class="rotated-box">{{r1}}</span></div>
<div class="half-col die-comment favoured">
<div class="sheet-half-col sheet-die-result sheet-success-die"><span class="sheet-rotated-box">{{r1}}</span></div>
<div class="sheet-half-col sheet-die-comment sheet-favoured">
{{#favoured}}{{favoured}}{{/favoured}}
</div>
<div class="half-col die-comment modification">
<div class="sheet-half-col sheet-die-comment sheet-modification">
{{#modification}}Bonus {{modification}}{{/modification}}
</div>
<div class="half-col die-comment favoured red">
<div class="sheet-half-col sheet-die-comment sheet-favoured sheet-red">
{{#miserable}}{{miserable}}{{/miserable}}
</div>
<div class="half-col die-comment weary red">
<div class="sheet-half-col sheet-die-comment sheet-weary sheet-red">
{{#weary}}{{weary}}{{/weary}}
</div>
<div class="full-col center die-result roll-total"><span class="rotated-box">{{computed::total}}</span>
<div class="sheet-full-col sheet-center sheet-die-result sheet-roll-total"><span class="sheet-rotated-box">{{computed::total}}</span>
</div>
<div class="full-col center die-title roll-total">Total</div>
<div class="sheet-full-col sheet-center sheet-die-title sheet-roll-total">Total</div>
<!-- <div class="full-col center die-result roll-diff"><span class="rotated-box">{{computed::diff}}</span></div>
<div class="full-col center die-title roll-diff">Diff</div> -->
<div class="full-col center roll-outcome">
<div class="center die-title">
<div class="sheet-full-col sheet-center sheet-roll-outcome">
<div class="sheet-center sheet-die-title">
{{#rollLess() computed::outcome 1}}
{{#rollTotal() computed::outcome -2}}Miserable&nbsp;&nbsp;{{/rollTotal() computed::outcome -2}}
{{#rollTotal() computed::outcome -1}}Weary&nbsp;&nbsp;{{/rollTotal() computed::outcome -1}}
@@ -1948,15 +1948,15 @@
</div>
<div class="sheet-footer">
{{#weaponinfo}}
<div class="full-col center additional">
<div class="center">
<div class="sheet-full-col sheet-center sheet-additional">
<div class="sheet-center">
{{weaponinfo}}
</div>
</div>
{{/weaponinfo}}
{{#additional}}
<div class="full-col center additional">
<div class="center">
<div class="sheet-full-col sheet-center sheet-additional">
<div class="sheet-center">
{{additional}}
</div>
</div>