cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-01-14 04:31:07 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Separate less file for the Death Moves instead of reusing Downtime

Browse source
This commit is contained in:
Chris Ryan 2026-01-13 22:23:43 +10:00
parent 5e25fa671f
commit 4214e5133d
2 changed files with 138 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

133
styles/less/ui/chat/deathmoves.less Normal file
View file

@ -0,0 +1,133 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
#interface.theme-light {
.daggerheart.chat.deathmoves {
.death-moves-list .death-move {
&:hover {
background: @dark-blue-10;
}
.death-label {
border-bottom: 1px solid @dark-blue;
.header-label .title {
color: @dark-blue;
}
.header-label .label {
color: @dark;
}
}
.fa-chevron-down {
color: @dark-blue;
}
}
.description {
color: @dark;
}
}
}
.daggerheart.chat {
&.death {
display: flex;
flex-direction: column;
align-items: center;
details[open] {
.fa-chevron-down {
transform: rotate(180deg);
transition: all 0.3s ease;
}
}
.death-moves-list {
display: flex;
flex-direction: column;
gap: 5px;
width: 100%;
.fa-chevron-down {
transition: all 0.3s ease;
margin-left: auto;
}
.death-move {
width: 100%;
.death-label {
display: flex;
align-items: center;
gap: 5px;
border-bottom: 1px solid @golden;
margin: 0 8px;
padding-bottom: 5px;
width: -webkit-fill-available;
&:hover {
background: light-dark(@dark-blue-10, @golden-10);
cursor: pointer;
transition: all 0.3s ease;
}
.death-image {
width: 40px;
height: 40px;
border-radius: 3px;
}
.header-label {
padding: 8px;
.title {
font-size: var(--font-size-16);
color: @golden;
font-weight: 700;
}
.label {
font-size: var(--font-size-12);
color: @beige;
margin: 0;
}
}
}
.description {
padding: 8px;
}
}
.action-use-button-parent {
width: 100%;
.action-use-target {
display:flex;
align-items: center;
justify-content: space-between;
gap: 4px;
width: 100%;
padding: 4px 8px 10px 40px;
font-size: var(--font-size-12);
label {
font-weight: bold;
}
select {
flex: 1;
}
}
}
.action-use-button {
width: -webkit-fill-available;
margin: 0 8px;
font-weight: 600;
height: 40px;
}
}
}
}

10
templates/ui/chat/deathMove.hbs
View file

@ -1,8 +1,8 @@
<div class="daggerheart chat downtime">
<ul class="downtime-moves-list">
<details class="downtime-move" {{this.open}}>
<summary class="downtime-label">
<img class="downtime-image" src="{{this.img}}" />
<div class="daggerheart chat deathmoves">
<ul class="death-moves-list">
<details class="death-move" {{this.open}}>
<summary class="death-label">
<img class="death-image" src="{{this.img}}" />
<div class="header-label">
<h2 class="title">{{this.title}}</h2>
<span class="label">{{localize 'DAGGERHEART.UI.Chat.deathMove.title'}}</span>