Neo-Tokyo Neon Noir design pour fiches items
- Nouvelle palette : #080c14 fond, accents néon par type (#00d4d4 item, #ff3d5a kungfu, #4a9eff spell, #cc44ff supernatural) - Nouveaux composants LESS : .cde-neon-header (clip-path angulaire + accent line), .cde-avatar (clip-path), .cde-stat-grid/.cde-stat-cell (style terminal), .cde-badge (parallélogramme), .cde-neon-tabs (underline néon animé), .cde-check-cell - Fix layout : .cde-sheet width: 100% + height: 100% + overflow: hidden, .cde-tab-body flex: 1 + min-height: 0, .cde-notes-editor flex stretch - Fix positions : DEFAULT_OPTIONS height explicite pour tous les types (item 620x580, spell 660x680, kungfu 720x680, supernatural 560x520) - 4 templates items reécrits avec nouvelles classes et structure épurée Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
67
templates/item/cde-item-sheet.html
Normal file
67
templates/item/cde-item-sheet.html
Normal file
@@ -0,0 +1,67 @@
|
||||
<form class="flexcol cde-sheet {{cssClass}}" autocomplete="off">
|
||||
<header class="cde-neon-header item">
|
||||
<img class="cde-avatar" src="{{item.img}}" data-edit="img" title="{{item.name}}" />
|
||||
<div class="cde-header-content">
|
||||
<h1 class="cde-item-name">
|
||||
<input name="name" type="text" value="{{item.name}}" placeholder="{{ localize 'CDE.Name' }}" />
|
||||
</h1>
|
||||
<div class="cde-stat-grid">
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.TypeOfItem" }}</span>
|
||||
<select name="system.subtype">
|
||||
{{selectOptions subtypes selected=systemData.subtype labelAttr="label"}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Reference" }}</span>
|
||||
<input type="text" name="system.reference" value="{{systemData.reference}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Quantity" }}</span>
|
||||
<input type="number" name="system.quantity" value="{{systemData.quantity}}" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Weight" }}</span>
|
||||
<input type="number" name="system.weight" value="{{systemData.weight}}" />
|
||||
</div>
|
||||
{{#if isWeapon}}
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Damage" }}</span>
|
||||
<input type="text" name="system.damage" value="{{systemData.damage}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Range" }}</span>
|
||||
<input type="text" name="system.range" value="{{systemData.range}}" placeholder="—" />
|
||||
</div>
|
||||
{{/if}}
|
||||
{{#if isArmor}}
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Protection" }}</span>
|
||||
<input type="text" name="system.protection" value="{{systemData.protection}}" placeholder="—" />
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div style="margin-top:6px;">
|
||||
<span class="cde-badge item">{{ localize "CDE.Items" }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="sheet-tabs tabs cde-neon-tabs" data-group="primary">
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="description">{{ localize "CDE.Description" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="notes">{{ localize "CDE.Notes" }}</a>
|
||||
</nav>
|
||||
|
||||
<section class="sheet-body cde-tab-body">
|
||||
<div class="tab" data-group="primary" data-tab="description">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor descriptionHTML target="system.description" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="notes">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor notesHTML target="system.notes" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
141
templates/item/cde-kungfu-sheet.html
Normal file
141
templates/item/cde-kungfu-sheet.html
Normal file
@@ -0,0 +1,141 @@
|
||||
<form class="flexcol cde-sheet {{cssClass}}" autocomplete="off">
|
||||
<header class="cde-neon-header kungfu">
|
||||
<img class="cde-avatar" src="{{item.img}}" data-edit="img" title="{{item.name}}" />
|
||||
<div class="cde-header-content">
|
||||
<h1 class="cde-item-name">
|
||||
<input name="name" type="text" value="{{item.name}}" placeholder="{{ localize 'CDE.Name' }}" />
|
||||
</h1>
|
||||
<div class="cde-stat-grid">
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Orientation" }}</span>
|
||||
<input type="text" name="system.kungfu.orientation" value="{{systemData.kungfu.orientation}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Aspect" }}</span>
|
||||
<input type="text" name="system.kungfu.aspect" value="{{systemData.kungfu.aspect}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Skill" }}</span>
|
||||
<input type="text" name="system.kungfu.skill" value="{{systemData.kungfu.skill}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Speciality" }}</span>
|
||||
<input type="text" name="system.kungfu.speciality" value="{{systemData.kungfu.speciality}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Reference" }}</span>
|
||||
<input type="text" name="system.reference" value="{{systemData.reference}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:6px;">
|
||||
<span class="cde-badge kungfu">{{ localize "CDE.KungFu" }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="sheet-tabs tabs cde-neon-tabs" data-group="primary">
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="description">{{ localize "CDE.Description" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="technique1">{{ localize "CDE.Technique" }} 1</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="technique2">{{ localize "CDE.Technique" }} 2</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="technique3">{{ localize "CDE.Technique" }} 3</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="notes">{{ localize "CDE.Notes" }}</a>
|
||||
</nav>
|
||||
|
||||
<section class="sheet-body cde-tab-body">
|
||||
<div class="tab" data-group="primary" data-tab="description">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor descriptionHTML target="system.description" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab" data-group="primary" data-tab="technique1">
|
||||
<div class="cde-card cde-technique-card">
|
||||
<header class="cde-technique-header">
|
||||
<div class="cde-technique-title">
|
||||
<span class="cde-badge kungfu">T1</span>
|
||||
<input type="text" name="system.techniques.technique1.name"
|
||||
value="{{systemData.techniques.technique1.name}}"
|
||||
placeholder="{{ localize 'CDE.Technique' }}" />
|
||||
</div>
|
||||
<div class="cde-technique-meta">
|
||||
<div class="cde-check-cell">
|
||||
<label>{{ localize "CDE.Masterized" }}</label>
|
||||
<input type="checkbox" name="system.techniques.technique1.check"
|
||||
{{ checked systemData.techniques.technique1.check }} />
|
||||
</div>
|
||||
<div class="cde-stat-cell" style="min-width:140px;">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Activation" }}</span>
|
||||
<input type="text" name="system.techniques.technique1.activation"
|
||||
value="{{systemData.techniques.technique1.activation}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="cde-technique-body">
|
||||
{{editor descriptionTechnique1HTML target="system.techniques.technique1.technique" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab" data-group="primary" data-tab="technique2">
|
||||
<div class="cde-card cde-technique-card">
|
||||
<header class="cde-technique-header">
|
||||
<div class="cde-technique-title">
|
||||
<span class="cde-badge kungfu">T2</span>
|
||||
<input type="text" name="system.techniques.technique2.name"
|
||||
value="{{systemData.techniques.technique2.name}}"
|
||||
placeholder="{{ localize 'CDE.Technique' }}" />
|
||||
</div>
|
||||
<div class="cde-technique-meta">
|
||||
<div class="cde-check-cell">
|
||||
<label>{{ localize "CDE.Masterized" }}</label>
|
||||
<input type="checkbox" name="system.techniques.technique2.check"
|
||||
{{ checked systemData.techniques.technique2.check }} />
|
||||
</div>
|
||||
<div class="cde-stat-cell" style="min-width:140px;">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Activation" }}</span>
|
||||
<input type="text" name="system.techniques.technique2.activation"
|
||||
value="{{systemData.techniques.technique2.activation}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="cde-technique-body">
|
||||
{{editor descriptionTechnique2HTML target="system.techniques.technique2.technique" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab" data-group="primary" data-tab="technique3">
|
||||
<div class="cde-card cde-technique-card">
|
||||
<header class="cde-technique-header">
|
||||
<div class="cde-technique-title">
|
||||
<span class="cde-badge kungfu">T3</span>
|
||||
<input type="text" name="system.techniques.technique3.name"
|
||||
value="{{systemData.techniques.technique3.name}}"
|
||||
placeholder="{{ localize 'CDE.Technique' }}" />
|
||||
</div>
|
||||
<div class="cde-technique-meta">
|
||||
<div class="cde-check-cell">
|
||||
<label>{{ localize "CDE.Masterized" }}</label>
|
||||
<input type="checkbox" name="system.techniques.technique3.check"
|
||||
{{ checked systemData.techniques.technique3.check }} />
|
||||
</div>
|
||||
<div class="cde-stat-cell" style="min-width:140px;">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Activation" }}</span>
|
||||
<input type="text" name="system.techniques.technique3.activation"
|
||||
value="{{systemData.techniques.technique3.activation}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="cde-technique-body">
|
||||
{{editor descriptionTechnique3HTML target="system.techniques.technique3.technique" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tab" data-group="primary" data-tab="notes">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor notesHTML target="system.notes" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
81
templates/item/cde-spell-sheet.html
Normal file
81
templates/item/cde-spell-sheet.html
Normal file
@@ -0,0 +1,81 @@
|
||||
<form class="flexcol cde-sheet {{cssClass}}" autocomplete="off">
|
||||
<header class="cde-neon-header spell">
|
||||
<img class="cde-avatar" src="{{item.img}}" data-edit="img" title="{{item.name}}" />
|
||||
<div class="cde-header-content">
|
||||
<h1 class="cde-item-name">
|
||||
<input name="name" type="text" value="{{item.name}}" placeholder="{{ localize 'CDE.Name' }}" />
|
||||
</h1>
|
||||
<div class="cde-stat-grid">
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.SpecialityName" }}</span>
|
||||
<input type="text" name="system.specialityname" value="{{systemData.specialityname}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.AssociatedElement" }}</span>
|
||||
<input type="text" name="system.associatedelement" value="{{systemData.associatedelement}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Hei" }}</span>
|
||||
<input type="text" name="system.hei" value="{{systemData.hei}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Reference" }}</span>
|
||||
<input type="text" name="system.reference" value="{{systemData.reference}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="cde-stat-grid" style="margin-top:6px;">
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.RealizationTimeRitual" }}</span>
|
||||
<input type="text" name="system.realizationtimeritual" value="{{systemData.realizationtimeritual}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.RealizationTimeAccelerated" }}</span>
|
||||
<input type="text" name="system.realizationtimeaccelerated" value="{{systemData.realizationtimeaccelerated}}" placeholder="—" />
|
||||
</div>
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Flashback" }}</span>
|
||||
<input type="text" name="system.flashback" value="{{systemData.flashback}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:6px;">
|
||||
<span class="cde-badge spell">{{ localize "CDE.Spells" }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="sheet-tabs tabs cde-neon-tabs" data-group="primary">
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="description">{{ localize "CDE.Description" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="components">{{ localize "CDE.Components" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="effects">{{ localize "CDE.Effects" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="examples">{{ localize "CDE.Examples" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="notes">{{ localize "CDE.Notes" }}</a>
|
||||
</nav>
|
||||
|
||||
<section class="sheet-body cde-tab-body">
|
||||
<div class="tab" data-group="primary" data-tab="description">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor spellDescriptionHTML target="system.description" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="components">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor componentsDescriptionHTML target="system.components" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="effects">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor effectsDescriptionHTML target="system.effects" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="examples">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor examplesDescriptionHTML target="system.examples" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="notes">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor notesHTML target="system.notes" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
37
templates/item/cde-supernatural-sheet.html
Normal file
37
templates/item/cde-supernatural-sheet.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<form class="flexcol cde-sheet {{cssClass}}" autocomplete="off">
|
||||
<header class="cde-neon-header supernatural">
|
||||
<img class="cde-avatar" src="{{item.img}}" data-edit="img" title="{{item.name}}" />
|
||||
<div class="cde-header-content">
|
||||
<h1 class="cde-item-name">
|
||||
<input name="name" type="text" value="{{item.name}}" placeholder="{{ localize 'CDE.Name' }}" />
|
||||
</h1>
|
||||
<div class="cde-stat-grid">
|
||||
<div class="cde-stat-cell">
|
||||
<span class="cde-stat-label">{{ localize "CDE.Reference" }}</span>
|
||||
<input type="text" name="system.reference" value="{{systemData.reference}}" placeholder="—" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:6px;">
|
||||
<span class="cde-badge supernatural">{{ localize "CDE.Supernatural" }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="sheet-tabs tabs cde-neon-tabs" data-group="primary">
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="description">{{ localize "CDE.Description" }}</a>
|
||||
<a class="item" data-action="tab" data-group="primary" data-tab="notes">{{ localize "CDE.Notes" }}</a>
|
||||
</nav>
|
||||
|
||||
<section class="sheet-body cde-tab-body">
|
||||
<div class="tab" data-group="primary" data-tab="description">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor descriptionHTML target="system.description" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab" data-group="primary" data-tab="notes">
|
||||
<div class="cde-card cde-notes-editor">
|
||||
{{editor notesHTML target="system.notes" button=true editable=editable engine="prosemirror"}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</form>
|
||||
Reference in New Issue
Block a user