daggerheart/styles/less/ui/chat/downtime.less
Murilo Brito 74df2c4e87
Feature/chat message styles (#514)
* style items and action chat messages

* enhance death move chat message and fix border bottom from title actions

* fix padding bottom

* Added basic chat-message.hbs

* .

* style remaing chat messages

* style action messages

* remove console log

* add colapsable descriptions in chat messages

* inital style for message rolls

* fix deal damage button style

* add new partchments

* Roll Chat message new design template

* j

* l

* p

* y

* fix _getTags type error and add a alias label for non base messages

* Fix damage & healing roll

* Fix conflict

* Deleting old templates

* Good for now

* fix labels in duality rolls messages and style experience and effects messages

---------

Co-authored-by: WBHarry <williambjrklund@gmail.com>
Co-authored-by: Dapoolp <elcatnet@gmail.com>
2025-08-02 09:24:51 +02:00

87 lines
2.5 KiB
Text

@import '../../utils/colors.less';
@import '../../utils/fonts.less';
@import '../../utils/spacing.less';
.daggerheart.chat {
&.downtime {
display: flex;
flex-direction: column;
align-items: center;
details[open] {
.fa-chevron-down {
transform: rotate(180deg);
transition: all 0.3s ease;
}
}
.downtime-moves-list {
display: flex;
flex-direction: column;
gap: 5px;
width: 100%;
.fa-chevron-down {
transition: all 0.3s ease;
margin-left: auto;
}
.downtime-move {
width: 100%;
.downtime-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;
}
.downtime-image {
width: 40px;
height: 40px;
border-radius: 3px;
}
.header-label {
padding: 8px;
.title {
font-size: 16px;
color: @golden;
font-family: @font-subtitle;
margin: 0;
}
.label {
font-size: 12px;
color: @beige;
font-family: @font-body;
margin: 0;
}
}
}
.description {
padding: 8px;
color: beige;
font-family: @font-body;
font-size: 14px;
}
}
.action-use-button {
width: -webkit-fill-available;
margin: 0 8px;
font-family: @font-body;
font-weight: 600;
height: 40px;
}
}
}
}