Style for new dice Rnk + technique fix

This commit is contained in:
Mandar
2021-02-09 13:53:42 +01:00
parent e0cb2bf235
commit 1cc496ad77
11 changed files with 257 additions and 250 deletions

View File

@@ -51,8 +51,6 @@ export class DicePickerDialog extends FormApplication {
classes: ["l5r5e", "dice-picker-dialog"],
template: CONFIG.l5r5e.paths.templates + "dice/dice-picker-dialog.html",
title: "L5R Dice Roller",
width: 660,
height: 460,
actor: null,
ringId: null,
skillId: "",

View File

@@ -20,8 +20,8 @@ export class GmToolsDialog extends FormApplication {
classes: ["l5r5e", "gm-tools-dialog"],
template: CONFIG.l5r5e.paths.templates + "dice/gm-tools-dialog.html",
title: game.i18n.localize("l5r5e.gm_toolbox.title"),
left: x - 540,
top: y - 94,
left: x - 523,
top: y - 114,
closeOnSubmit: false,
submitOnClose: false,
submitOnChange: true,

View File

@@ -7,7 +7,7 @@
@import "../scss/ui";
.l5r5e {
@import "../scss/dices";
@import "../scss/dices-chat";
@import "../scss/sheets";
@import "../scss/npc";
@import "../scss/nav";

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,37 @@
// Dice in chat
.chat-dice {
&.rerolled > img {
border-bottom: 3px solid orangered;
}
&.swapped > img {
border-bottom: 3px solid fuchsia;
}
> img {
border: 1px solid transparent;
height: auto;
width: calc(100% / 6 - 0.255rem);
margin: auto;
}
}
.chat-profil {
text-align: center;
vertical-align: middle;
&-stance {
font-size: 40px;
position: relative;
top: 8px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
&-element {
flex-wrap: wrap;
flex-grow: 1;
&-skill {
flex-grow: 3;
}
}
}

View File

@@ -62,44 +62,6 @@
}
}
// Dice in chat
.chat-dice {
&.rerolled > img {
border-bottom: 3px solid orangered;
}
&.swapped > img {
border-bottom: 3px solid fuchsia;
}
> img {
border: 1px solid transparent;
height: auto;
width: calc(100% / 6 - 0.255rem);
margin: auto;
}
}
.chat-profil {
text-align: center;
vertical-align: middle;
&-stance {
font-size: 40px;
position: relative;
top: 8px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}
&-element {
flex-wrap: wrap;
flex-grow: 1;
&-skill {
flex-grow: 3;
}
}
}
// If DicePicker add a pointer
.dice-picker {
cursor: url("../assets/cursors/pointer.webp"), pointer;
@@ -107,6 +69,8 @@
// Dice Picker
.dice-picker-dialog {
min-width: 600px;
min-height: auto;
// Utility
* {
transition: none;
@@ -127,18 +91,24 @@
text-align: center;
background: none;
border: none;
height: calc(100% - 3rem);
td:first-child {
width: 200px;
}
td {
width: 240px;
}
td:last-child {
width: 200px;
margin: 0;
tbody {
tr {
td {
width: 250px;
padding: 0 0.5rem;
&:first-child,
&:last-child {
width: 150px;
}
}
&:last-child {
td {
width: 100%;
padding: 0.5rem;
}
}
}
}
}
@@ -206,10 +176,27 @@
}
.roll-n-keep-dialog {
min-width: 600px;
&.finalized {
min-width: 400px;
}
img {
border: 0;
}
table {
margin: 0.75rem 0 0;
table {
border: 0 none;
tr {
background: transparent;
}
}
.button {
columns: 3;
}
}
.profil {
border-bottom: 1px solid #782e22;
}
@@ -251,6 +238,11 @@
.swap {
border: 3px solid fuchsia;
}
#finalize {
width: calc(100% - 1rem);
margin: 0.5rem;
}
}
#l5r5e-gm-tools-dialog {
@@ -270,6 +262,8 @@
border-image: url("../assets/ui/macro-button.webp") 10 repeat;
border-image-width: 0.5rem;
border-image-outset: 0px;
padding: 0;
margin: 0.5rem;
.window-header {
text-align: center;
border-bottom: 1px solid rgb(195, 165, 130);
@@ -285,21 +279,27 @@
background: transparent;
color: $white-light;
.gm-tools-container {
flex: 1;
display: flex;
flex-flow: wrap;
a {
font-size: 2rem;
line-height: 2rem;
min-height: 2rem;
margin: 0.5rem 0;
li {
flex: 1;
display: flex;
margin: 0 0.5rem;
cursor: url("../assets/cursors/pointer.webp"), pointer;
i {
font-size: 3rem;
line-height: 4rem;
vertical-align: middle;
strong {
font-size: 1.5rem;
margin: 0 0.25rem;
}
:hover {
text-shadow: 0 0 $red;
}
}
.difficulty {
flex: 1;
font-size: 3rem;
font-size: 2rem;
}
}
}

View File

@@ -138,7 +138,8 @@
}
min-height: auto;
display: flex;
fieldset {
fieldset,
.checklist {
flex: 0 0 calc(100% - 0.5rem);
}
.items-content {
@@ -151,6 +152,14 @@
&:last-child {
padding-bottom: 1rem;
}
.techniques-wrapper {
padding-left: 0.5rem;
fieldset,
.checklist {
flex: 100%;
margin: 0;
}
}
}
.npc-note {
.editor {

View File

@@ -17,13 +17,6 @@
.sheet-body {
height: calc(100% - 27rem);
}
.techniques-wrapper {
fieldset {
&:last-child {
margin: 0 0 0 0.5rem;
}
}
}
fieldset {
&.advancement {
display: block;
@@ -517,11 +510,15 @@
}
}
.techniques-wrapper {
padding-left: 0.25rem;
fieldset {
margin: 0 0 0 0.25rem;
}
.checklist {
display: flex;
flex-wrap: wrap;
font-size: 0.85rem;
margin: 0 0 0.25rem 0.5rem;
margin: 0 0 0.25rem 0.25rem;
padding: 0.5rem;
background: $l5r5e-title;
--notchSize: 0.25rem;

View File

@@ -3,28 +3,16 @@
{{!-- First line--}}
<tr>
<td class="profil center">
<img class="profile-img"
src="{{#if actor.img}}{{actor.img}}{{else}}icons/svg/mystery-man.svg{{/if}}"
data-edit="img"
height="200"
width="200"
alt="{{#if actor.name}}{{actor.name}}{{else}}mystery-man{{/if}}"
>
<img class="profile-img" src="{{#if actor.img}}{{actor.img}}{{else}}icons/svg/mystery-man.svg{{/if}}" data-edit="img" alt="{{#if actor.name}}{{actor.name}}{{else}}mystery-man{{/if}}" />
</td>
<td class="rings center">
<td class="center">
<ul class="rings">
{{#each ringsList}}
<li id="{{this.id}}">
<label class="attribute-label {{this.id}} centered-input ring-selection pointer-choice {{#ifCond ../data.ring.id '==' this.id}}ring-selected{{/ifCond}}">
<i class="i_{{this.id}}"></i>
<strong>{{this.label}}</strong>
<input class="centered-input approach_{{this.id}}"
type="text"
name="approach"
data-ringid="{{this.id}}"
value="{{this.value}}"
readonly="readonly"
/>
<input class="centered-input approach_{{this.id}}" type="text" name="approach" data-ringid="{{this.id}}" value="{{this.value}}" readonly="readonly" />
</label>
</li>
{{/each}}
@@ -32,33 +20,19 @@
</td>
<td class="skill">
{{#if data.skill.name}}
<div>
<label>{{localizeSkill data.skill.cat 'title'}}</label>
</div>
{{#if actorIsPc}}
<div>
<label>{{data.skill.name}}</label>
</div>
{{/if}}
<div>
<label id="stance_label">{{localizeSkill data.skill.cat data.ring.id}}</label>
</div>
<div id="skill_default_value" class="dice-container pointer-choice">
<img src="systems/l5r5e/assets/dices/default/skill_blank.svg" alt="1">
<div class="dice-value">
<span class="dice-skill" type="text" name="skill_{{data.skill.name}}">{{data.skill.defaultValue}}</span>
</div>
</div>
<label id="stance_label">{{localizeSkill data.skill.cat data.ring.id}}</label>
<div id="skill_default_value" class="dice-container pointer-choice">
<img src="systems/l5r5e/assets/dices/default/skill_blank.svg" alt="1">
<div class="dice-value">
<span class="dice-skill" type="text" name="skill_{{data.skill.name}}">{{data.skill.defaultValue}}</span>
</div>
</div>
{{else}}
<img class="profile-img"
src="systems/l5r5e/assets/imgs/noskill.webp"
data-edit="img"
height="200"
width="200"
alt="no skill selected"
>
<img class="profile-img" src="systems/l5r5e/assets/imgs/noskill.webp" data-edit="img" alt="no skill selected" />
{{/if}}
</td>
</tr>
@@ -81,7 +55,7 @@
<td>
{{#if data.difficulty.hidden}}
<label>
<input type="checkbox" id="diff_add_void_point" name="difficulty.addVoidPoint" value="1" {{checked data.difficulty.addVoidPoint}}>
<input type="checkbox" id="diff_add_void_point" name="difficulty.addVoidPoint" value="1" {{checked data.difficulty.addVoidPoint}} />
+1 <i class="i_void" title="{{localize 'l5r5e.dicepicker.void_point_tooltip'}}"></i>
</label>
{{else}}
@@ -92,9 +66,9 @@
<div class="third">
<div class="dice-container">
<img src="systems/l5r5e/assets/dices/default/3d/blank.png" alt="1">
<img src="systems/l5r5e/assets/dices/default/3d/blank.png" alt="1" />
<div class="dice-value">
<input class="input-dice" type="text" name="difficulty.value" value="{{data.difficulty.value}}" readonly="readonly">
<input class="input-dice" type="text" name="difficulty.value" value="{{data.difficulty.value}}" readonly="readonly" />
</div>
</div>
</div>
@@ -113,9 +87,9 @@
<div class="third">
<div class="dice-container">
<img src="systems/l5r5e/assets/dices/default/ring_blank.svg" alt="1">
<img src="systems/l5r5e/assets/dices/default/ring_blank.svg" alt="1" />
<div class="dice-value">
<input class="input-dice input-dice-ring" type="text" name="ring.value" value="{{data.ring.value}}" readonly="readonly">
<input class="input-dice input-dice-ring" type="text" name="ring.value" value="{{data.ring.value}}" readonly="readonly" />
</div>
</div>
</div>
@@ -132,9 +106,9 @@
<div class="third">
<div class="dice-container">
<img src="systems/l5r5e/assets/dices/default/skill_blank.svg" alt="1">
<img src="systems/l5r5e/assets/dices/default/skill_blank.svg" alt="1" />
<div class="dice-value">
<input class="input-dice input-dice-skill" type="text" name="skill.value" value="{{data.skill.value}}" readonly="readonly">
<input class="input-dice input-dice-skill" type="text" name="skill.value" value="{{data.skill.value}}" readonly="readonly" />
</div>
</div>
</div>
@@ -150,7 +124,7 @@
<td>
{{^if difficultyHiddenIsLock}}
<label>
<input type="checkbox" id="diff_hidden" name="difficulty.hidden" value="1" {{checked data.difficulty.hidden}}>
<input type="checkbox" id="diff_hidden" name="difficulty.hidden" value="1" {{checked data.difficulty.hidden}} />
{{localize 'l5r5e.dicepicker.difficulty_hidden_label'}}
</label>
{{/if}}
@@ -158,7 +132,7 @@
<td>
{{#if canUseVoidPoint}}
<label>
<input type="checkbox" id="use_void_point" name="useVoidPoint" value="1" {{checked data.useVoidPoint}}>
<input type="checkbox" id="use_void_point" name="useVoidPoint" value="1" {{checked data.useVoidPoint}} />
{{localize 'l5r5e.dicepicker.use_void_point_label'}} <i class="i_void" title="{{localize 'l5r5e.dicepicker.void_point_tooltip'}}"></i>
</label>
{{/if}}
@@ -171,9 +145,9 @@
<div class="third">
<i class="i_skill"></i> {{localize 'l5r5e.dicepicker.skill_assistance_label'}}
<div class="dice-container">
<img src="systems/l5r5e/assets/dices/default/3d/blank.png" alt="1">
<img src="systems/l5r5e/assets/dices/default/3d/blank.png" alt="1" />
<div class="dice-value">
<input class="input-dice" type="text" name="skill.assistance" value="{{data.skill.assistance}}" readonly="readonly">
<input class="input-dice" type="text" name="skill.assistance" value="{{data.skill.assistance}}" readonly="readonly" />
</div>
</div>
</div>
@@ -183,10 +157,10 @@
</div>
</td>
</tr>
<tr>
<td colspan="3">
<button name="roll" type="submit" {{#if disableSubmit}}disabled{{/if}}>{{localize 'l5r5e.dicepicker.roll_label'}} <i class='fas fa-arrow-circle-right'></i></button>
</td>
</tr>
</table>
<div class="form-group">
<button name="roll" type="submit" {{#if disableSubmit}}disabled{{/if}}>{{localize 'l5r5e.dicepicker.roll_label'}} <i class='fas fa-arrow-circle-right'></i></button>
</div>
</form>
</form>

View File

@@ -1,8 +1,14 @@
<form class="l5r5e gm-tools-dialog" autocomplete="off">
<p class="gm-tools-container">
<a class="difficulty_hidden" title="{{localize 'l5r5e.gm_toolbox.difficulty_hidden'}}"><i class="fa fa-eye{{#if data.difficultyHidden}}-slash{{/if}}"></i></a>
<strong class="difficulty" title="{{localize 'l5r5e.gm_toolbox.difficulty'}}">{{data.difficulty}}</strong>
<a class="gm_actor_updates sleep" data-type="sleep" title="{{localize 'l5r5e.gm_toolbox.sleep'}}"><i class="fa fa-bed"></i></a>
<a class="gm_actor_updates scene_end" data-type="scene_end" title="{{localize 'l5r5e.gm_toolbox.scene_end'}}"><i class="fas fa-star-half-alt"></i></a>
</p>
</form>
<ul class="gm-tools-container">
<li class="difficulty_hidden" title="{{localize 'l5r5e.gm_toolbox.difficulty_hidden'}}">
<i class="fa fa-eye{{#if data.difficultyHidden}}-slash{{/if}}"></i>
<strong class="difficulty" title="{{localize 'l5r5e.gm_toolbox.difficulty'}}">{{data.difficulty}}</strong>
</li>
<li class="gm_actor_updates sleep" data-type="sleep" title="{{localize 'l5r5e.gm_toolbox.sleep'}}">
<i class="fa fa-bed"></i>
</li>
<li class="gm_actor_updates scene_end" data-type="scene_end" title="{{localize 'l5r5e.gm_toolbox.scene_end'}}">
<i class="fas fa-star-half-alt"></i>
</li>
</ul>
</form>

View File

@@ -36,125 +36,111 @@
</span>
</header>
</div>
{{!-- Body --}}
{{#if options.editable}}
<table>
<tr>
{{!-- Face Rings --}}
<td>
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.swap_drop_here' }}
</legend>
{{!-- Body --}}
{{#if options.editable}}
<tr>
{{!-- Face Rings --}}
<td>
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.swap_drop_here' }}
</legend>
{{#each data.swapDiceFaces.rings}}
<div class="dice dropbox faces-change" data-type="swap" data-face="{{this}}" data-die="RingDie">
<img src="{{getDiceFaceUrl 'RingDie' this}}" alt="{{this}}" />
</div>
{{/each}}
</td>
{{!-- Center --}}
<td>
{{!-- Discard & ReRoll --}}
<table>
<tr>
<td>
<fieldset class="dropbox discards" data-type="discard">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.discard_drop_here' }}
</legend>
</fieldset>
</td>
<td>&nbsp;</td>
<td>
<fieldset class="dropbox rerolls" data-type="reroll">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.reroll_drop_here' }}
</legend>
</fieldset>
</td>
</tr>
</table>
{{!-- DiceList history --}}
<table>
{{#each data.dicesList as |item idxStep|}}
<tr>
{{#each item as |dice idxDie|}}
<td>
{{#if dice.face}}
<div
class="dice {{dice.choice}}{{#ifCond ../../data.currentStep '==' idxStep}} draggable{{/ifCond}}"
data-step="{{idxStep}}"
data-die="{{idxDie}}"
>
{{#if dice.newFace}}
<img src="{{getDiceFaceUrl dice.type dice.newFace}}" alt="{{idxStep}}_{{idxDie}}" />
{{else}}
<img src="{{getDiceFaceUrl dice.type dice.face}}" alt="{{idxStep}}_{{idxDie}}" />
{{/if}}
</div>
{{/if}}
</td>
{{/each}}
</tr>
{{#each data.swapDiceFaces.rings}}
<div class="dice dropbox faces-change" data-type="swap" data-face="{{this}}" data-die="RingDie">
<img src="{{getDiceFaceUrl 'RingDie' this}}" alt="{{this}}" />
</div>
{{/each}}
</table>
{{!-- Keep --}}
<table>
<tr>
<td>
<fieldset class="dropbox keeps" data-type="keep">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.keep_drop_here' }}
</legend>
</fieldset>
</td>
</tr>
</table>
</td>
{{!-- Face Skills --}}
<td>
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.swap_drop_here' }}
</legend>
{{#each data.swapDiceFaces.skills}}
<div class="dice dropbox faces-change" data-type="swap" data-face="{{this}}" data-die="AbilityDie">
<img src="{{getDiceFaceUrl 'AbilityDie' this}}" alt="{{this}}" />
</div>
{{/each}}
</td>
</tr>
</table>
<button id="finalize" name="finalize" type="button" {{#if data.submitDisabled}}disabled{{/if}}>
{{ localize 'l5r5e.roll_n_keep.bt_validate' }} <i class="fas fa-arrow-circle-right"></i>
</button>
{{else}}
{{!-- Non editable DiceList history --}}
<table>
{{#each data.dicesList as |item idxStep|}}
<tr>
{{#each item as |dice idxDie|}}
<td>
{{#if dice.face}}
<div class="dice {{dice.choice}}">
{{#if dice.newFace}}
<img src="{{getDiceFaceUrl dice.type dice.newFace}}" alt="{{idxStep}}_{{idxDie}}" />
{{else}}
<img src="{{getDiceFaceUrl dice.type dice.face}}" alt="{{idxStep}}_{{idxDie}}" />
</td>
{{!-- Center --}}
<td>
{{!-- Discard & ReRoll --}}
<table>
<tr>
<td>
<fieldset class="dropbox discards" data-type="discard">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.discard_drop_here' }}
</legend>
</fieldset>
</td>
<td>&nbsp;</td>
<td>
<fieldset class="dropbox rerolls" data-type="reroll">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.reroll_drop_here' }}
</legend>
</fieldset>
</td>
</tr>
</table>
{{!-- DiceList history --}}
<table>
{{#each data.dicesList as |item idxStep|}}
<tr>
{{#each item as |dice idxDie|}}
{{#if dice.face}}
<td>
{{#if dice.newFace}}
<img class="dice {{dice.choice}}{{#ifCond ../../data.currentStep '==' idxStep}} draggable{{/ifCond}}" data-step="{{idxStep}}" data-die="{{idxDie}}" src="{{getDiceFaceUrl dice.type dice.newFace}}" alt="{{idxStep}}_{{idxDie}}" />
{{else}}
<img class="dice {{dice.choice}}{{#ifCond ../../data.currentStep '==' idxStep}} draggable{{/ifCond}}" data-step="{{idxStep}}" data-die="{{idxDie}}" src="{{getDiceFaceUrl dice.type dice.face}}" alt="{{idxStep}}_{{idxDie}}" />
{{/if}}
</td>
{{/if}}
{{/each}}
</tr>
{{/each}}
</table>
{{!-- Keep --}}
<table>
<tr>
<td>
<fieldset class="dropbox keeps" data-type="keep">
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.keep_drop_here' }}
</legend>
</fieldset>
</td>
</tr>
</table>
</td>
{{!-- Face Skills --}}
<td>
<legend class="section-header">
<i class="fa fa-arrow-down" aria-hidden="true"></i> {{ localize 'l5r5e.roll_n_keep.swap_drop_here' }}
</legend>
{{#each data.swapDiceFaces.skills}}
<div class="dice dropbox faces-change" data-type="swap" data-face="{{this}}" data-die="AbilityDie">
<img src="{{getDiceFaceUrl 'AbilityDie' this}}" alt="{{this}}" />
</div>
{{/each}}
</td>
</tr>
<tr>
<td colspan="3">
<button id="finalize" name="finalize" type="button" {{#if data.submitDisabled}}disabled{{/if}}>
{{ localize 'l5r5e.roll_n_keep.bt_validate' }} <i class="fas fa-arrow-circle-right"></i>
</button>
</td>
</tr>
{{else}}
{{!-- Non editable DiceList history --}}
{{#each data.dicesList as |item idxStep|}}
<tr>
{{#each item as |dice idxDie|}}
{{#if dice.face}}
<td>
{{#if dice.newFace}}
<img class="dice {{dice.choice}}" src="{{getDiceFaceUrl dice.type dice.newFace}}" alt="{{idxStep}}_{{idxDie}}" />
{{else}}
<img class="dice {{dice.choice}}" src="{{getDiceFaceUrl dice.type dice.face}}" alt="{{idxStep}}_{{idxDie}}" />
{{/if}}
</td>
{{/if}}
</div>
{{/if}}
</td>
{{/each}}
</tr>
{{/each}}
{{/each}}
</tr>
{{/each}}
{{/if}}
</table>
{{/if}}
</form>