daggerheart/styles/less/ui/chat/sheet.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

141 lines
3.5 KiB
Text

@import '../../utils/colors.less';
@import '../../utils/fonts.less';
.chat-message.dh-chat-message {
.message-content {
padding: 0;
}
}
.chat-message {
.duality-modifiers,
.duality-result,
.dice-title {
display: none;
}
.message-content {
padding: 0 8px;
font-family: @font-body;
color: light-dark(@dark, @beige);
blockquote {
border-left: 5px solid light-dark(@dark-blue-40, @golden-40);
}
a[href] {
color: light-dark(@dark-blue, @golden);
}
a[href]:hover,
a[href].active {
font-weight: bold;
text-shadow: 0 0 8px light-dark(@dark-blue, @golden);
}
button {
background: light-dark(transparent, @golden);
border: 1px solid light-dark(@dark-blue, @dark-blue);
color: light-dark(@dark-blue, @dark-blue);
outline: none;
box-shadow: none;
&:hover {
background: light-dark(@light-black, @dark-blue);
color: light-dark(@dark-blue, @golden);
}
&.glow {
animation: glow 0.75s infinite alternate;
}
&:disabled {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
opacity: 0.6;
cursor: not-allowed;
&:hover {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
}
}
&.reverted {
background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden);
border: 1px solid light-dark(@dark, transparent);
&:hover {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
}
img {
border-radius: 3px;
}
}
}
.enriched-effect {
display: flex;
align-items: center;
border: 1px solid black;
width: fit-content;
padding: 0 2px 0 0;
border-radius: 6px;
color: @dark;
background-image: url(../assets/parchments/dh-parchment-light.png);
&:hover {
text-shadow: none;
}
span {
white-space: nowrap;
}
}
.dice-roll .dice-formula,
.dice-roll .dice-total {
box-shadow: none;
border: none;
background: light-dark(@dark-blue-40, @golden-40);
color: light-dark(@dark-blue, @golden);
font-weight: 600;
align-content: center;
}
.dice-roll .dice-formula {
height: 27px;
}
.dice-roll .dice-total {
height: 34px;
}
}
}
fieldset.daggerheart.chat {
padding: 0;
border-left-width: 0;
border-right-width: 0;
border-bottom-width: 0;
legend {
display: flex;
align-items: center;
gap: 5px;
&:before,
&:after {
content: '\f0d8';
font-family: 'Font Awesome 6 Pro';
}
}
&.expanded {
legend:before,
legend:after {
content: '\f0d7';
}
}
.daggerheart.chat {
margin-top: 5px;
}
}