makes talents more subtle also adds tooltips to rollable on the skill sheet.

pull/65/head
macniel 2025-11-12 20:13:21 +01:00
parent cfc5bc15b1
commit 811806a68b
8 changed files with 64 additions and 56 deletions

View File

@ -9,17 +9,17 @@ $talent-text-color: #000;
$kampftalent-color: #cc0000;
$kampftalent-text-color: #FFF;
$talent-body-color: #16bd6c;
$talent-body-color: #45d18c;
$talent-body-text-color: #000;
$talent-nature-color: #46800d;
$talent-nature-color: #7cb544;
$talent-nature-text-color: #000;
$talent-social-color: #ae9809;
$talent-social-color: #c8588a;
$talent-social-text-color: #000;
$talent-knowledge-color: #d319ba;
$talent-knowledge-color: #2ba9c5;
$talent-knowledge-text-color: #000;
$talent-language-color: #573bbc;
$talent-language-text-color: #fff;
$talent-crafting-color: #ae6813;
$talent-language-color: #957fe8;
$talent-language-text-color: #000;
$talent-crafting-color: #cd9551;
$talent-crafting-text-color: #000;

View File

@ -31,11 +31,12 @@
position: absolute;
left: -1px;
width: 48px;
top: -1px;
font-size: smaller;
top: 2px;
font-size: large;
line-height: 48px;
vertical-align: middle;
text-align: center;
@if $darkmode {
color: colours.$attribute-die-label-color-darkmode;
} @else {
@ -62,7 +63,7 @@
&.colorfulDice {
&.Mut {
.Mut {
.die svg path {
fill: colours.$attribute-die-co-color;

View File

@ -52,7 +52,7 @@ $rollable_colours_font: (
.value {
position: absolute;
left: 0;
top: 0;
top: 1px;
width: 32px;
line-height: 30px;
vertical-align: middle;
@ -126,9 +126,9 @@ $rollable_colours_font: (
// interactivity
.block.rollable {
&:hover {
.die:hover {
.die svg {
svg {
filter: drop-shadow(0px 0px 10px rgb(255 0 0));
}
@ -138,16 +138,9 @@ $rollable_colours_font: (
&:active {
.die {
width: 28px;
height: 28px;
left: 2px;
top: 2px;
scale: 0.8;
.value {
width: 28px;
height: 28px;
left: -1px;
top: -2px;
img {
position: absolute;
@ -168,7 +161,6 @@ $rollable_colours_font: (
.#{$name}.rollable {
.die {
stroke-width: 0.5;
svg {
@ -176,8 +168,7 @@ $rollable_colours_font: (
path {
fill: $color;
stroke: colour.$rollable-die-border-color;
stroke-width: 5px;
}
}
@ -189,7 +180,10 @@ $rollable_colours_font: (
}
.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-bottom-right-radius: 8px;
}

View File

@ -17,6 +17,13 @@
gap: unset;
padding: unset;
fieldset {
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
}
ul {

View File

@ -2,8 +2,9 @@
data-tab="{{tabs.skills.id}}"
data-group="{{tabs.skills.group}}">
<div class="collapsible">
<div class="talent-group">
<h2>Kampftalente</h2>
<div class="talent-group combat">
<fieldset>
<legend><h2>Kampftalente</h2></legend>
<ul>
{{#each skills.Kampf}}
<li>
@ -11,9 +12,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Körperliche Talente</h2>
<div class="talent-group body">
<fieldset>
<legend><h2>Körperliche Talente</h2></legend>
<ul>
<li>
{{#each skills.Körperlich}}
@ -22,9 +25,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Gesellschaftliche Talente</h2>
<div class="talent-group social">
<fieldset>
<legend><h2>Gesellschaftliche Talente</h2></legend>
<ul>
<li>
{{#each skills.Gesellschaft}}
@ -33,9 +38,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Natur Talente</h2>
<div class="talent-group nature">
<fieldset>
<legend><h2>Natur Talente</h2></legend>
<ul>
<li>
{{#each skills.Natur}}
@ -44,9 +51,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Wissenstalente</h2>
<div class="talent-group knowledge">
<fieldset>
<legend><h2>Wissenstalente</h2></legend>
<ul>
<li>
{{#each skills.Wissen}}
@ -55,9 +64,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Schriften & Sprachen</h2>
<div class="talent-group languages">
<fieldset>
<legend><h2>Schriften & Sprachen</h2></legend>
<ul>
<li>
{{#each skills.Schriften}}
@ -71,9 +82,11 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
<div class="talent-group">
<h2>Handwerkliche Talente</h2>
<div class="talent-group crafting">
<fieldset>
<legend><h2>Handwerkliche Talente</h2></legend>
<ul>
<li>
{{#each skills.Handwerk}}
@ -82,6 +95,7 @@
</li>
{{/each}}
</ul>
</fieldset>
</div>
</div>
</section>

View File

@ -1,9 +1,5 @@
<div class="block rollable {{this.type}} {{this.gruppe}}" data-item-id="{{this.id}}"
data-taw="{{this.taw}}"
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="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
data-tooltip="{{this.name}}<br/>TAW: {{this.taw}}<br/><hr/><i class='fa-solid fa-computer-mouse'></i>: zum Würfeln">
<div class="die">
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}

View File

@ -1,10 +1,7 @@
<div class="block rollable {{this.type}} {{this.gruppe}}" data-item-id="{{this.id}}" data-id="{{this.id}}"
data-taw="{{this.taw}}"
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="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
data-tooltip="{{this.name}}<br/>TAW/Komplexität: {{this.taw}}/{{this.komplexität}}">
<div class="die">
<div class="die unrollable">
{{> 'systems/DSA_4-1/templates/ui/partial-die.hbs' }}
<span class="value">{{#if this.taw}}
{{this.taw}}

View File

@ -1,11 +1,10 @@
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}" data-taw="{{this.taw}}"
data-name="{{this.name}}" data-eigenschaft1="{{this.eigenschaft1}}" data-eigenschaft2="{{this.eigenschaft2}}"
data-eigenschaft3="{{this.eigenschaft3}}" data-taw="{{this.taw}}" data-rollEigenschaft1="{{this.rollEigenschaft1}}"
data-rollEigenschaft2="{{this.rollEigenschaft2}}" data-rollEigenschaft3="{{this.rollEigenschaft3}}">
<div class="block rollable {{this.type}} {{this.gruppe}}" data-id="{{this.id}}"
data-action="rollCombatSkill" data-tooltip="{{this.name}}<br/>{{#if this.at}}AT: {{this.at}} {{/if}}{{#if
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">
<div class="die">
{{> '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}}
{{this.taw}}
{{else}}