makes talents more subtle also adds tooltips to rollable on the skill sheet.
parent
cfc5bc15b1
commit
811806a68b
|
|
@ -9,17 +9,17 @@ $talent-text-color: #000;
|
||||||
$kampftalent-color: #cc0000;
|
$kampftalent-color: #cc0000;
|
||||||
$kampftalent-text-color: #FFF;
|
$kampftalent-text-color: #FFF;
|
||||||
|
|
||||||
$talent-body-color: #16bd6c;
|
$talent-body-color: #45d18c;
|
||||||
$talent-body-text-color: #000;
|
$talent-body-text-color: #000;
|
||||||
$talent-nature-color: #46800d;
|
$talent-nature-color: #7cb544;
|
||||||
$talent-nature-text-color: #000;
|
$talent-nature-text-color: #000;
|
||||||
$talent-social-color: #ae9809;
|
$talent-social-color: #c8588a;
|
||||||
$talent-social-text-color: #000;
|
$talent-social-text-color: #000;
|
||||||
$talent-knowledge-color: #d319ba;
|
$talent-knowledge-color: #2ba9c5;
|
||||||
$talent-knowledge-text-color: #000;
|
$talent-knowledge-text-color: #000;
|
||||||
$talent-language-color: #573bbc;
|
$talent-language-color: #957fe8;
|
||||||
$talent-language-text-color: #fff;
|
$talent-language-text-color: #000;
|
||||||
$talent-crafting-color: #ae6813;
|
$talent-crafting-color: #cd9551;
|
||||||
$talent-crafting-text-color: #000;
|
$talent-crafting-text-color: #000;
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -31,11 +31,12 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: -1px;
|
left: -1px;
|
||||||
width: 48px;
|
width: 48px;
|
||||||
top: -1px;
|
top: 2px;
|
||||||
font-size: smaller;
|
font-size: large;
|
||||||
line-height: 48px;
|
line-height: 48px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
@if $darkmode {
|
@if $darkmode {
|
||||||
color: colours.$attribute-die-label-color-darkmode;
|
color: colours.$attribute-die-label-color-darkmode;
|
||||||
} @else {
|
} @else {
|
||||||
|
|
@ -62,7 +63,7 @@
|
||||||
|
|
||||||
&.colorfulDice {
|
&.colorfulDice {
|
||||||
|
|
||||||
&.Mut {
|
.Mut {
|
||||||
|
|
||||||
.die svg path {
|
.die svg path {
|
||||||
fill: colours.$attribute-die-co-color;
|
fill: colours.$attribute-die-co-color;
|
||||||
|
|
|
||||||
|
|
@ -52,7 +52,7 @@ $rollable_colours_font: (
|
||||||
.value {
|
.value {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 1px;
|
||||||
width: 32px;
|
width: 32px;
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
|
@ -126,9 +126,9 @@ $rollable_colours_font: (
|
||||||
|
|
||||||
// interactivity
|
// interactivity
|
||||||
.block.rollable {
|
.block.rollable {
|
||||||
&:hover {
|
.die:hover {
|
||||||
|
|
||||||
.die svg {
|
svg {
|
||||||
filter: drop-shadow(0px 0px 10px rgb(255 0 0));
|
filter: drop-shadow(0px 0px 10px rgb(255 0 0));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -138,16 +138,9 @@ $rollable_colours_font: (
|
||||||
&:active {
|
&:active {
|
||||||
|
|
||||||
.die {
|
.die {
|
||||||
width: 28px;
|
scale: 0.8;
|
||||||
height: 28px;
|
|
||||||
left: 2px;
|
|
||||||
top: 2px;
|
|
||||||
|
|
||||||
.value {
|
.value {
|
||||||
width: 28px;
|
|
||||||
height: 28px;
|
|
||||||
left: -1px;
|
|
||||||
top: -2px;
|
|
||||||
|
|
||||||
img {
|
img {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
@ -168,7 +161,6 @@ $rollable_colours_font: (
|
||||||
|
|
||||||
.#{$name}.rollable {
|
.#{$name}.rollable {
|
||||||
.die {
|
.die {
|
||||||
stroke-width: 0.5;
|
|
||||||
|
|
||||||
svg {
|
svg {
|
||||||
|
|
||||||
|
|
@ -176,8 +168,7 @@ $rollable_colours_font: (
|
||||||
|
|
||||||
path {
|
path {
|
||||||
fill: $color;
|
fill: $color;
|
||||||
stroke: colour.$rollable-die-border-color;
|
|
||||||
stroke-width: 5px;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -189,7 +180,10 @@ $rollable_colours_font: (
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
background-image: linear-gradient(to right, rgba($color, numbers.$start_gradient), rgba($color, numbers.$end_gradient));
|
// background-image: linear-gradient(to right, rgba($color, numbers.$start_gradient), rgba($color, numbers.$end_gradient));
|
||||||
|
background: rgba(0, 0, 0, 0.05);
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
box-shadow: 1px 1px 1px #ccc;
|
||||||
border-top-right-radius: 8px;
|
border-top-right-radius: 8px;
|
||||||
border-bottom-right-radius: 8px;
|
border-bottom-right-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -17,6 +17,13 @@
|
||||||
gap: unset;
|
gap: unset;
|
||||||
padding: unset;
|
padding: unset;
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-top: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
|
|
|
||||||
|
|
@ -2,8 +2,9 @@
|
||||||
data-tab="{{tabs.skills.id}}"
|
data-tab="{{tabs.skills.id}}"
|
||||||
data-group="{{tabs.skills.group}}">
|
data-group="{{tabs.skills.group}}">
|
||||||
<div class="collapsible">
|
<div class="collapsible">
|
||||||
<div class="talent-group">
|
<div class="talent-group combat">
|
||||||
<h2>Kampftalente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Kampftalente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
{{#each skills.Kampf}}
|
{{#each skills.Kampf}}
|
||||||
<li>
|
<li>
|
||||||
|
|
@ -11,9 +12,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group body">
|
||||||
<h2>Körperliche Talente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Körperliche Talente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Körperlich}}
|
{{#each skills.Körperlich}}
|
||||||
|
|
@ -22,9 +25,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group social">
|
||||||
<h2>Gesellschaftliche Talente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Gesellschaftliche Talente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Gesellschaft}}
|
{{#each skills.Gesellschaft}}
|
||||||
|
|
@ -33,9 +38,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group nature">
|
||||||
<h2>Natur Talente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Natur Talente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Natur}}
|
{{#each skills.Natur}}
|
||||||
|
|
@ -44,9 +51,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group knowledge">
|
||||||
<h2>Wissenstalente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Wissenstalente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Wissen}}
|
{{#each skills.Wissen}}
|
||||||
|
|
@ -55,9 +64,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group languages">
|
||||||
<h2>Schriften & Sprachen</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Schriften & Sprachen</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Schriften}}
|
{{#each skills.Schriften}}
|
||||||
|
|
@ -71,9 +82,11 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
<div class="talent-group">
|
<div class="talent-group crafting">
|
||||||
<h2>Handwerkliche Talente</h2>
|
<fieldset>
|
||||||
|
<legend><h2>Handwerkliche Talente</h2></legend>
|
||||||
<ul>
|
<ul>
|
||||||
<li>
|
<li>
|
||||||
{{#each skills.Handwerk}}
|
{{#each skills.Handwerk}}
|
||||||
|
|
@ -82,6 +95,7 @@
|
||||||
</li>
|
</li>
|
||||||
{{/each}}
|
{{/each}}
|
||||||
</ul>
|
</ul>
|
||||||
|
</fieldset>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
@ -1,9 +1,5 @@
|
||||||
<div class="block rollable {{this.type}} {{this.gruppe}}" data-item-id="{{this.id}}"
|
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
|
||||||
data-taw="{{this.taw}}"
|
data-tooltip="{{this.name}}<br/>TAW: {{this.taw}}<br/><hr/><i class='fa-solid fa-computer-mouse'></i>: zum Würfeln">
|
||||||
|
|
||||||
data-name="{{this.name}}" data-eigenschaft1="{{this.eigenschaft1}}" data-eigenschaft2="{{this.eigenschaft2}}"
|
|
||||||
data-eigenschaft3="{{this.eigenschaft3}}" data-rollEigenschaft1="{{this.rollEigenschaft1}}"
|
|
||||||
data-rollEigenschaft2="{{this.rollEigenschaft2}}" data-rollEigenschaft3="{{this.rollEigenschaft3}}">
|
|
||||||
|
|
||||||
<div class="die">
|
<div class="die">
|
||||||
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,7 @@
|
||||||
<div class="block rollable {{this.type}} {{this.gruppe}}" data-item-id="{{this.id}}" data-id="{{this.id}}"
|
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
|
||||||
data-taw="{{this.taw}}"
|
data-tooltip="{{this.name}}<br/>TAW/Komplexität: {{this.taw}}/{{this.komplexität}}">
|
||||||
data-name="{{this.name}}" data-eigenschaft1="{{this.eigenschaft1}}" data-eigenschaft2="{{this.eigenschaft2}}"
|
|
||||||
data-eigenschaft3="{{this.eigenschaft3}}" data-rollEigenschaft1="{{this.rollEigenschaft1}}"
|
|
||||||
data-rollEigenschaft2="{{this.rollEigenschaft2}}" data-rollEigenschaft3="{{this.rollEigenschaft3}}">
|
|
||||||
|
|
||||||
<div class="die">
|
<div class="die unrollable">
|
||||||
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
||||||
<span class="value">{{#if this.taw}}
|
<span class="value">{{#if this.taw}}
|
||||||
{{this.taw}}
|
{{this.taw}}
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,10 @@
|
||||||
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}" data-taw="{{this.taw}}"
|
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
|
||||||
data-name="{{this.name}}" data-eigenschaft1="{{this.eigenschaft1}}" data-eigenschaft2="{{this.eigenschaft2}}"
|
data-action="rollCombatSkill" data-tooltip="{{this.name}}<br/>{{#if this.at}}AT: {{this.at}} {{/if}}{{#if
|
||||||
data-eigenschaft3="{{this.eigenschaft3}}" data-taw="{{this.taw}}" data-rollEigenschaft1="{{this.rollEigenschaft1}}"
|
this.pa}}PA: {{this.pa}}{{/if}}<hr/><i class='fa-solid fa-computer-mouse'></i>: Attacke<br/><kbd>Shift</kbd>+<i class='fa-solid fa-computer-mouse'></i>: Parrieren">
|
||||||
data-rollEigenschaft2="{{this.rollEigenschaft2}}" data-rollEigenschaft3="{{this.rollEigenschaft3}}">
|
|
||||||
|
|
||||||
<div class="die">
|
<div class="die">
|
||||||
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
|
||||||
<span class="value" data-action="rollCombatSkill" title="Click: Attacke; Shift+Click: Parrieren"
|
<span class="value"
|
||||||
data-id="{{this.id}}">{{#if this.taw}}
|
data-id="{{this.id}}">{{#if this.taw}}
|
||||||
{{this.taw}}
|
{{this.taw}}
|
||||||
{{else}}
|
{{else}}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue