mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-07-22 10:29:54 +02:00
Merge branch 'main' into weapon-tokens
This commit is contained in:
Gergely Bräutigam
GitHub
commit
7bbd250aec
454 changed files with 3347 additions and 4751 deletions
|
|
@ -22,6 +22,7 @@
|
|||
font-family: var(--dh-font-body);
|
||||
font-size: var(--font-size-12);
|
||||
font-weight: 300;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.members-container {
|
||||
|
|
|
|||
|
|
@ -26,9 +26,11 @@
|
|||
&:focus,
|
||||
&:focus[type='text'],
|
||||
&:focus[type='number'] {
|
||||
background: light-dark(@soft-shadow, @semi-transparent-dark-blue);
|
||||
box-shadow: none;
|
||||
outline: 2px solid @input-color-border;
|
||||
&:where(:not(:disabled)) {
|
||||
background: light-dark(@soft-shadow, @semi-transparent-dark-blue);
|
||||
box-shadow: none;
|
||||
outline: 2px solid @input-color-border;
|
||||
}
|
||||
}
|
||||
|
||||
&:disabled[type='text'],
|
||||
|
|
@ -306,6 +308,10 @@
|
|||
min-height: auto;
|
||||
row-gap: 0;
|
||||
|
||||
&.active {
|
||||
row-gap: 10px;
|
||||
}
|
||||
|
||||
legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -589,7 +595,86 @@
|
|||
margin-top: 4px;
|
||||
color: light-dark(#14142599, #efe6d850);
|
||||
font-size: var(--font-size-12);
|
||||
padding-left: 3px;
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
section.gm-notes-section {
|
||||
padding-bottom: var(--spacer-4);
|
||||
header.gm-notes + p {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
header.gm-notes {
|
||||
position: relative;
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
&::before,
|
||||
&::after {
|
||||
content: " ";
|
||||
flex: 1;
|
||||
border-bottom: 1px solid var(--color-dark-6);
|
||||
}
|
||||
&::before {
|
||||
mask-image: linear-gradient(270deg, black 0%, black calc(100% - 10px), transparent 100%);
|
||||
}
|
||||
&::after {
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 10px, black 100%);
|
||||
}
|
||||
margin-top: var(--spacer-8);
|
||||
margin-bottom: var(--spacer-4);
|
||||
font-size: var(--font-size-11);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
secret-block {
|
||||
display: block;
|
||||
|
||||
/** A buffer to make the hover behavior work a bit better. The bottom in the button needs to compensate */
|
||||
@buffer: 8px;
|
||||
margin-top: -@buffer;
|
||||
padding-top: @buffer;
|
||||
|
||||
button.reveal {
|
||||
--button-size: 1rem;
|
||||
height: var(--button-size);
|
||||
position: absolute;
|
||||
margin: auto;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: min-content;
|
||||
padding: 1px 8px 0 8px;
|
||||
bottom: calc(100% - 0.4375rem - 1px);
|
||||
|
||||
background-color: var(--dh-window-button-color-bg); // todo: find a better var name
|
||||
border-color: var(--color-secret-border);
|
||||
color: var(--dh-window-button-color-text);
|
||||
font-size: var(--font-size-10);
|
||||
user-select: none;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
&:hover button.reveal {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* The element inside a secret-block.
|
||||
* This is separate since during prosemirror editing, the secret-block container does not exist.
|
||||
*/
|
||||
section.secret {
|
||||
--color-secret-bg: @red-10;
|
||||
--color-revealed-bg: @green-10;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
p {
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -811,4 +896,8 @@
|
|||
right: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.gm-notes {
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
|
||||
.sheet.daggerheart.dh-style.item {
|
||||
.tab.features {
|
||||
padding: 0 10px;
|
||||
padding: 7px 10px;
|
||||
overflow-y: auto;
|
||||
.feature-list {
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -111,3 +111,7 @@ body.theme-light,
|
|||
.themed.theme-light {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
body:not([data-gm=true]) [data-visibility="gm"] {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -163,37 +163,7 @@
|
|||
}
|
||||
.inventory-description {
|
||||
overflow: hidden;
|
||||
|
||||
h1 {
|
||||
font-size: var(--font-size-32);
|
||||
}
|
||||
h2 {
|
||||
font-size: var(--font-size-28);
|
||||
font-weight: 600;
|
||||
}
|
||||
h3 {
|
||||
font-size: var(--font-size-20);
|
||||
font-weight: 600;
|
||||
}
|
||||
h4 {
|
||||
font-size: var(--font-size-16);
|
||||
color: @beige;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin: 1rem 0;
|
||||
padding: 0 0 0 1.25rem;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc;
|
||||
}
|
||||
.typography();
|
||||
}
|
||||
}
|
||||
.item-resources {
|
||||
|
|
|
|||
|
|
@ -12,12 +12,14 @@
|
|||
});
|
||||
|
||||
.application.sheet.daggerheart.dh-style {
|
||||
--portrait-size: 150px;
|
||||
|
||||
.item-sheet-header {
|
||||
display: flex;
|
||||
|
||||
.profile {
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
height: var(--portrait-size);
|
||||
width: var(--portrait-size);
|
||||
object-fit: cover;
|
||||
border-right: 1px solid light-dark(@dark-blue, @golden);
|
||||
border-bottom: 1px solid light-dark(@dark-blue, @golden);
|
||||
|
|
@ -34,19 +36,24 @@
|
|||
text-align: center;
|
||||
width: 80%;
|
||||
|
||||
.item-name input[type='text'] {
|
||||
font-size: var(--font-size-32);
|
||||
height: 42px;
|
||||
text-align: center;
|
||||
width: 90%;
|
||||
transition: all 0.3s ease;
|
||||
outline: 2px solid transparent;
|
||||
border: 1px solid transparent;
|
||||
.item-name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 10px 10px 0 10px;
|
||||
input[type='text'] {
|
||||
font-size: var(--font-size-30);
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
transition: all 0.3s ease;
|
||||
outline: 2px solid transparent;
|
||||
border: 1px solid transparent;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
&:hover[type='text'],
|
||||
&:focus[type='text'] {
|
||||
box-shadow: none;
|
||||
outline: 2px solid light-dark(@dark-blue, @golden);
|
||||
&:hover[type='text'],
|
||||
&:focus[type='text'] {
|
||||
box-shadow: none;
|
||||
outline: 2px solid light-dark(@dark-blue, @golden);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -14,36 +14,7 @@
|
|||
}
|
||||
.editor-content {
|
||||
.with-scroll-shadows();
|
||||
h1 {
|
||||
font-size: var(--font-size-32);
|
||||
}
|
||||
h2 {
|
||||
font-size: var(--font-size-28);
|
||||
font-weight: 600;
|
||||
}
|
||||
h3 {
|
||||
font-size: var(--font-size-20);
|
||||
font-weight: 600;
|
||||
}
|
||||
h4 {
|
||||
font-size: var(--font-size-16);
|
||||
color: light-dark(@dark, @beige);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin: 1rem 0;
|
||||
padding: 0 0 0 1.25rem;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc;
|
||||
}
|
||||
.typography();
|
||||
}
|
||||
// Fixes centering and makes it not render over scrollbar
|
||||
&:hover button.toggle:enabled {
|
||||
|
|
|
|||
|
|
@ -36,8 +36,8 @@ body.game:is(.performance-low, .noblur) {
|
|||
}
|
||||
|
||||
button {
|
||||
background: light-dark(#e8e6e3, @deep-black);
|
||||
color: light-dark(@dark-blue, @beige);
|
||||
background: var(--dh-window-button-color-bg);
|
||||
color: var(--dh-window-button-color-text);
|
||||
border: 1px solid light-dark(@dark-blue, transparent);
|
||||
padding: 0;
|
||||
|
||||
|
|
|
|||
|
|
@ -6,11 +6,80 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
overflow-y: hidden !important;
|
||||
padding-top: 10px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
prose-mirror.active + .artist-attribution {
|
||||
display: none;
|
||||
.description-section {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: auto;
|
||||
padding: 12px 16px 4px 16px;
|
||||
.with-scroll-shadows();
|
||||
prose-mirror {
|
||||
button.toggle {
|
||||
top: 0px;
|
||||
right: 0;
|
||||
}
|
||||
button[data-action=editGMNote] {
|
||||
right: calc(var(--button-size) + 4px);
|
||||
}
|
||||
&.inactive {
|
||||
height: unset!important;
|
||||
overflow: unset;
|
||||
.editor-content {
|
||||
position: relative;
|
||||
overflow: unset;
|
||||
|
||||
// Allows content links to peek out
|
||||
margin-top: -4px;
|
||||
padding: 4px 0 0 0;
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
--min-height: 250px;
|
||||
padding: 8px 0 0 16px;
|
||||
button[data-action=editGMNote] {
|
||||
display: none;
|
||||
}
|
||||
.editor-content {
|
||||
padding-right: 16px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
/** Hide editors that are empty when inactive if we need them to be */
|
||||
prose-mirror.inactive.hide-if-inactive {
|
||||
display: none;
|
||||
}
|
||||
&:has(prose-mirror.active) {
|
||||
padding: 0;
|
||||
}
|
||||
/** Description should fill available room (with overriden exceptions) */
|
||||
prose-mirror[name="system.description"] {
|
||||
flex: 1 0;
|
||||
}
|
||||
&:has(prose-mirror[name="system.gmNotes"]:not(.hide-if-inactive)) {
|
||||
prose-mirror.inactive {
|
||||
--min-height: 3rem;
|
||||
&[name="system.description"] {
|
||||
flex: 0 0;
|
||||
}
|
||||
&[name="system.gmNotes"] {
|
||||
flex: 1 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** Hide other elements if an editor is open */
|
||||
&:has(prose-mirror.active) {
|
||||
prose-mirror.inactive,
|
||||
header.gm-notes,
|
||||
.artist-attribution {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -93,10 +93,6 @@
|
|||
padding: 8px 0 0 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.artist-attribution {
|
||||
padding-left: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.search-section {
|
||||
|
|
|
|||
|
|
@ -42,19 +42,14 @@
|
|||
}
|
||||
|
||||
h1 {
|
||||
--dh-input-color-border: @color-border;
|
||||
display: flex;
|
||||
flex: 1;
|
||||
padding: 6px 0 0 0;
|
||||
font-size: var(--font-size-32);
|
||||
text-align: start;
|
||||
border: 1px solid transparent;
|
||||
outline: 2px solid transparent;
|
||||
transition: all 0.3s ease;
|
||||
word-break: break-word;
|
||||
|
||||
&:hover {
|
||||
outline: 2px solid light-dark(@dark, @golden);
|
||||
}
|
||||
}
|
||||
|
||||
.level-div {
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
.items-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
gap: 10px;
|
||||
padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
|
||||
.stable-scroll-container();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,48 +1,44 @@
|
|||
@import '../../../utils/colors.less';
|
||||
@import '../../../utils/fonts.less';
|
||||
@import '../../../utils/mixin.less';
|
||||
|
||||
.party-header-sheet {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
text-align: center;
|
||||
|
||||
.profile {
|
||||
height: 235px;
|
||||
cursor: pointer;
|
||||
.smooth-gradient-ease-in-out(mask-image, to top, black, 3.5rem);
|
||||
}
|
||||
|
||||
.item-container {
|
||||
margin-top: -2rem;
|
||||
z-index: 1;
|
||||
input.item-name[type='text'] {
|
||||
backdrop-filter: none;
|
||||
border: none;
|
||||
color: @color-text-emphatic;
|
||||
font-family: @font-title;
|
||||
font-size: var(--font-size-32);
|
||||
outline: 2px solid transparent;
|
||||
box-shadow: unset;
|
||||
text-shadow: 0 0 4px @color-text-shadow-contrast, 0 0 8px @color-text-shadow-contrast, 0 0 14px @color-text-shadow-contrast;
|
||||
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
width: calc(100% - 40px);
|
||||
height: 2.625rem;
|
||||
|
||||
&:hover[type='text'],
|
||||
&:focus[type='text'] {
|
||||
outline: 2px solid @color-border;
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@import '../../../utils/colors.less';
|
||||
@import '../../../utils/fonts.less';
|
||||
@import '../../../utils/mixin.less';
|
||||
|
||||
.party-header-sheet {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: start;
|
||||
text-align: center;
|
||||
|
||||
.profile {
|
||||
height: 235px;
|
||||
cursor: pointer;
|
||||
.smooth-gradient-ease-in-out(mask-image, to top, black, 3.5rem);
|
||||
}
|
||||
|
||||
.item-container {
|
||||
margin-top: -2rem;
|
||||
z-index: 1;
|
||||
input.item-name[type='text'] {
|
||||
--dh-input-color-border: @color-border;
|
||||
backdrop-filter: none;
|
||||
border: none;
|
||||
color: @color-text-emphatic;
|
||||
font-family: @font-title;
|
||||
font-size: var(--font-size-32);
|
||||
outline: 2px solid transparent;
|
||||
box-shadow: unset;
|
||||
text-shadow: 0 0 4px @color-text-shadow-contrast, 0 0 8px @color-text-shadow-contrast, 0 0 14px @color-text-shadow-contrast;
|
||||
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
width: calc(100% - 40px);
|
||||
height: 2.625rem;
|
||||
}
|
||||
|
||||
.label {
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
margin: 5px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,10 +8,8 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
overflow-y: auto;
|
||||
margin-top: 20px;
|
||||
padding-bottom: 4px;
|
||||
.with-scroll-shadows();
|
||||
padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
|
||||
.stable-scroll-container();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
.application.sheet.daggerheart.dh-style.beastform {
|
||||
--portrait-size: 130px;
|
||||
|
||||
.settings.tab {
|
||||
.advantage-on-section {
|
||||
display: flex;
|
||||
|
|
@ -9,4 +11,11 @@
|
|||
font-style: italic;
|
||||
}
|
||||
}
|
||||
.tab.features.active {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
|
||||
.stable-scroll-container();
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,17 +2,9 @@
|
|||
@import '../../utils/fonts.less';
|
||||
|
||||
.application.sheet.daggerheart.dh-style.feature {
|
||||
.item-sheet-header {
|
||||
display: flex;
|
||||
|
||||
.profile {
|
||||
height: 130px;
|
||||
width: 130px;
|
||||
}
|
||||
}
|
||||
--portrait-size: 130px;
|
||||
|
||||
section.tab {
|
||||
height: 400px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,8 @@
|
|||
@import './item-sheet-shared.less';
|
||||
@import './beastform.less';
|
||||
@import './class.less';
|
||||
@import './domain-card.less';
|
||||
@import './feature.less';
|
||||
@import './heritage.less';
|
||||
@import './item-sheet-shared.less';
|
||||
@import './weapon.less';
|
||||
@import './weapon.less';
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
.application.sheet.daggerheart.dh-style.item {
|
||||
.item.daggerheart.dh-style:where(.application.sheet) {
|
||||
&.minimized {
|
||||
.attribution-header-label {
|
||||
display: none;
|
||||
|
|
@ -14,4 +14,22 @@
|
|||
button.plain.inline-control {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.tab-navigation {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/** Default tab stylings */
|
||||
.tab.active {
|
||||
padding-top: 8px;
|
||||
.with-scroll-shadows();
|
||||
|
||||
&.effects {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
padding: 8px calc(12px - var(--scrollbar-width)) 4px 12px;
|
||||
.stable-scroll-container();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -117,7 +117,9 @@
|
|||
}
|
||||
|
||||
.description {
|
||||
padding: 8px;
|
||||
padding: 0;
|
||||
margin: 8px;
|
||||
.typography();
|
||||
}
|
||||
|
||||
.ability-card-footer {
|
||||
|
|
|
|||
|
|
@ -107,6 +107,8 @@
|
|||
--dh-input-color-text: @dark;
|
||||
--dh-trait-color-bg: #b1afb6;
|
||||
--dh-trait-color-border: #8e8d96;
|
||||
--dh-window-button-color-bg: #e8e6e3;
|
||||
--dh-window-button-color-text: @dark-blue;
|
||||
}
|
||||
}
|
||||
@scope (.theme-dark) to (.themed) {
|
||||
|
|
@ -124,6 +126,8 @@
|
|||
--dh-input-color-text: @beige;
|
||||
--dh-trait-color-bg: #50433F;
|
||||
--dh-trait-color-border: #927952;
|
||||
--dh-window-button-color-bg: @deep-black;
|
||||
--dh-window-button-color-text: @beige;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -203,4 +203,38 @@
|
|||
overflow-y: auto;
|
||||
scrollbar-gutter: stable;
|
||||
.with-scroll-shadows();
|
||||
}
|
||||
}
|
||||
|
||||
/** Typography stylings for most longform text, usually item descriptions */
|
||||
.typography() {
|
||||
h1 {
|
||||
font-size: var(--font-size-32);
|
||||
}
|
||||
h2 {
|
||||
font-size: var(--font-size-28);
|
||||
font-weight: 600;
|
||||
}
|
||||
h3 {
|
||||
font-size: var(--font-size-20);
|
||||
font-weight: 600;
|
||||
}
|
||||
h4 {
|
||||
font-size: var(--font-size-16);
|
||||
color: light-dark(@dark, @beige);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin: 0.5rem 0;
|
||||
padding: 0 0 0 1.25rem;
|
||||
|
||||
li {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,130 @@
|
|||
@import './sheet.less';
|
||||
#tooltip:has(div.daggerheart.dh-style.tooltip.card-style),
|
||||
aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip),
|
||||
#tooltip.bordered-tooltip {
|
||||
.tooltip-title {
|
||||
font-size: var(--font-size-20);
|
||||
color: @color-text-emphatic;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tooltip-description {
|
||||
font-style: inherit;
|
||||
text-align: inherit;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip-separator {
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.tooltip-tags {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
max-height: 150px;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
|
||||
.tooltip-tag {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.tooltip-tag-label-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
gap: 5px 10px;
|
||||
padding-bottom: 4px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
&.advantages {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background: @green-10;
|
||||
color: @green;
|
||||
border-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 3px 5px;
|
||||
font-size: var(--font-size-12);
|
||||
font: @font-body;
|
||||
|
||||
background: light-dark(@dark-15, @beige-15);
|
||||
border: 1px solid light-dark(@dark, @beige);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: var(--font-size-12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@import './armorManagement.less';
|
||||
@import './battlepoints.less';
|
||||
@import './bordered-tooltip.less';
|
||||
|
|
|
|||
|
|
@ -1,126 +0,0 @@
|
|||
#tooltip:has(div.daggerheart.dh-style.tooltip.card-style),
|
||||
aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip),
|
||||
#tooltip.bordered-tooltip {
|
||||
.tooltip-title {
|
||||
font-size: var(--font-size-20);
|
||||
color: @color-text-emphatic;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.tooltip-description {
|
||||
font-style: inherit;
|
||||
text-align: inherit;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip-separator {
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.tooltip-tags {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
position: relative;
|
||||
max-height: 150px;
|
||||
overflow-y: auto;
|
||||
position: relative;
|
||||
|
||||
.tooltip-tag {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-direction: column;
|
||||
|
||||
.tooltip-tag-label-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
|
||||
img {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
display: flex;
|
||||
gap: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
|
||||
&.advantages {
|
||||
width: 100%;
|
||||
padding: 5px 10px;
|
||||
padding-bottom: 16px;
|
||||
position: relative;
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
background: @golden;
|
||||
mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%);
|
||||
height: 2px;
|
||||
width: calc(100% - 10px);
|
||||
}
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
}
|
||||
|
||||
.tag {
|
||||
background: @green-10;
|
||||
color: @green;
|
||||
border-color: @green;
|
||||
}
|
||||
}
|
||||
|
||||
.tag {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 3px 5px;
|
||||
font-size: var(--font-size-12);
|
||||
font: @font-body;
|
||||
|
||||
background: light-dark(@dark-15, @beige-15);
|
||||
border: 1px solid light-dark(@dark, @beige);
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: var(--font-size-12);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4,6 +4,7 @@
|
|||
#tooltip:has(div.daggerheart.dh-style.tooltip.card-style),
|
||||
aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip.card-style) {
|
||||
padding: 0;
|
||||
padding-bottom: 8px;
|
||||
border: none;
|
||||
border-radius: 10px;
|
||||
height: max-content;
|
||||
|
|
@ -134,7 +135,6 @@ aside[role='tooltip']:has(div.daggerheart.dh-style.tooltip.card-style) {
|
|||
background: light-dark(@dark-blue-60, @rustic-brown-80);
|
||||
color: @color-text-emphatic;
|
||||
font-size: 12px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue