diff --git a/styles/less/global/elements.css b/styles/less/global/elements.css deleted file mode 100644 index 5c9d36d1..00000000 --- a/styles/less/global/elements.css +++ /dev/null @@ -1,618 +0,0 @@ -@keyframes glow { - 0% { - box-shadow: 0 0 1px 1px #f3c267; - } - 100% { - box-shadow: 0 0 2px 2px #f3c267; - } -} -@keyframes glow-dark { - 0% { - box-shadow: 0 0 1px 1px #18162e; - } - 100% { - box-shadow: 0 0 2px 2px #18162e; - } -} -@font-face { - font-family: 'Cinzel'; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url(https://fonts.gstatic.com/s/cinzel/v25/8vIU7ww63mVu7gtR-kwKxNvkNOjw-tbnTYo.ttf) format('truetype'); -} -@font-face { - font-family: 'Cinzel'; - font-style: normal; - font-weight: 700; - font-display: swap; - src: url(https://fonts.gstatic.com/s/cinzel/v25/8vIU7ww63mVu7gtR-kwKxNvkNOjw-jHgTYo.ttf) format('truetype'); -} -@font-face { - font-family: 'Cinzel Decorative'; - font-style: normal; - font-weight: 700; - font-display: swap; - src: url(https://fonts.gstatic.com/s/cinzeldecorative/v18/daaHSScvJGqLYhG8nNt8KPPswUAPniZoaelD.ttf) - format('truetype'); -} -@font-face { - font-family: 'Montserrat'; - font-style: normal; - font-weight: 400; - font-display: swap; - src: url(https://fonts.gstatic.com/s/montserrat/v30/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCtr6Ew-.ttf) format('truetype'); -} -@font-face { - font-family: 'Montserrat'; - font-style: normal; - font-weight: 600; - font-display: swap; - src: url(https://fonts.gstatic.com/s/montserrat/v30/JTUHjIg1_i6t8kCHKm4532VJOt5-QNFgpCu170w-.ttf) format('truetype'); -} -.application.sheet.daggerheart.dh-style h1 { - font-family: 'Cinzel Decorative', serif; - margin: 0; - border: none; - font-weight: normal; -} -.application.sheet.daggerheart.dh-style h2, -.application.sheet.daggerheart.dh-style h3 { - font-family: 'Cinzel', serif; - margin: 0; - border: none; - font-weight: normal; -} -.application.sheet.daggerheart.dh-style h4 { - font-family: 'Montserrat', sans-serif; - font-size: 14px; - border: none; - font-weight: 700; - margin: 0; - text-shadow: none; - color: #f3c267; - font-weight: normal; -} -.application.sheet.daggerheart.dh-style h5 { - font-size: 14px; - color: #f3c267; - margin: 0; - font-weight: normal; -} -.application.sheet.daggerheart.dh-style p, -.application.sheet.daggerheart.dh-style span { - font-family: 'Montserrat', sans-serif; -} -.application.sheet.daggerheart.dh-style small { - font-family: 'Montserrat', sans-serif; - opacity: 0.8; -} -.application.dh-style { - border: 1px solid light-dark(#18162e, #f3c267); -} -.application.dh-style input[type='text'], -.application.dh-style input[type='number'] { - background: light-dark(transparent, transparent); - border-radius: 6px; - box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05); - backdrop-filter: blur(9.5px); - -webkit-backdrop-filter: blur(9.5px); - outline: none; - color: light-dark(#18162e, #f3c267); - border: 1px solid light-dark(#222, #efe6d8); -} -.application.dh-style input[type='text']:hover[type='text'], -.application.dh-style input[type='number']:hover[type='text'], -.application.dh-style input[type='text']:hover[type='number'], -.application.dh-style input[type='number']:hover[type='number'], -.application.dh-style input[type='text']:focus[type='text'], -.application.dh-style input[type='number']:focus[type='text'], -.application.dh-style input[type='text']:focus[type='number'], -.application.dh-style input[type='number']:focus[type='number'] { - background: light-dark(rgba(0, 0, 0, 0.05), rgba(24, 22, 46, 0.33)); - box-shadow: none; - outline: 2px solid light-dark(#222, #efe6d8); -} -.application.dh-style input[type='text']:disabled[type='text'], -.application.dh-style input[type='number']:disabled[type='text'], -.application.dh-style input[type='text']:disabled[type='number'], -.application.dh-style input[type='number']:disabled[type='number'] { - outline: 2px solid transparent; - cursor: not-allowed; -} -.application.dh-style input[type='text']:disabled[type='text']:hover, -.application.dh-style input[type='number']:disabled[type='text']:hover, -.application.dh-style input[type='text']:disabled[type='number']:hover, -.application.dh-style input[type='number']:disabled[type='number']:hover { - background: transparent; -} -.application.dh-style input[type='checkbox']:checked::after, -.application.dh-style input[type='radio']:checked::after { - color: light-dark(#222, #f3c267); -} -.application.dh-style input[type='checkbox']:checked::before, -.application.dh-style input[type='radio']:checked::before { - color: light-dark(#22222240, #f3c26740); -} -.application.dh-style input[type='checkbox']::before, -.application.dh-style input[type='radio']::before { - color: light-dark(#22222240, #f3c26740); -} -.application.dh-style button { - background: light-dark(transparent, #f3c267); - border: 1px solid light-dark(#18162e, #18162e); - color: light-dark(#18162e, #18162e); - outline: none; - box-shadow: none; -} -.application.dh-style button:hover { - background: light-dark(rgba(0, 0, 0, 0.3), #18162e); - color: light-dark(#18162e, #f3c267); -} -.application.dh-style button.glow { - animation: glow 0.75s infinite alternate; -} -.application.dh-style button:disabled { - background: light-dark(transparent, #f3c267); - color: light-dark(#18162e, #18162e); - opacity: 0.6; - cursor: not-allowed; -} -.application.dh-style button:disabled:hover { - background: light-dark(transparent, #f3c267); - color: light-dark(#18162e, #18162e); -} -.application.dh-style select { - background: light-dark(transparent, transparent); - color: light-dark(#222, #efe6d8); - font-family: 'Montserrat', sans-serif; - outline: 2px solid transparent; - border: 1px solid light-dark(#222, #efe6d8); -} -.application.dh-style select:focus, -.application.dh-style select:hover { - outline: 2px solid light-dark(#222, #efe6d8); - box-shadow: none; -} -.application.dh-style select option, -.application.dh-style select optgroup { - color: #efe6d8; - background-color: #18162e; - border-radius: 6px; -} -.application.dh-style select:disabled { - opacity: 0.6; - outline: 2px solid transparent; - cursor: not-allowed; -} -.application.dh-style multi-select { - position: relative; - height: 34px; -} -.application.dh-style multi-select .tags { - justify-content: flex-start; - margin: 4px; - height: inherit; -} -.application.dh-style multi-select .tags .tag { - padding: 0.3rem 0.5rem; - color: light-dark(#18162e, #f3c267); - background-color: light-dark(#18162e10, #f3c26740); - font-family: 'Montserrat', sans-serif; - border-radius: 3px; - transition: 0.13s ease-out; - gap: 0.5rem; - z-index: 1; -} -.application.dh-style multi-select .tags .tag .remove { - font-size: 10px; -} -.application.dh-style multi-select select { - position: absolute; - height: inherit; - outline: initial; -} -.application.dh-style p { - margin: 0; -} -.application.dh-style ul { - margin: 0; - padding: 0; - list-style: none; -} -.application.dh-style li { - margin: 0; -} -.application.dh-style a:hover, -.application.dh-style a.active { - font-weight: bold; - text-shadow: 0 0 8px light-dark(#18162e, #f3c267); -} -.application.dh-style fieldset { - align-items: center; - margin-top: 5px; - border-radius: 6px; - border-color: light-dark(#18162e, #f3c267); -} -.application.dh-style fieldset.glassy { - background-color: light-dark(#18162e10, #f3c26710); - border-color: transparent; -} -.application.dh-style fieldset.glassy legend { - padding: 2px 12px; - border-radius: 3px; - background-color: light-dark(#18162e, #f3c267); - color: light-dark(#efe6d8, #18162e); -} -.application.dh-style fieldset.fit-height { - height: 95%; -} -.application.dh-style fieldset.flex { - display: flex; - gap: 20px; -} -.application.dh-style fieldset.flex.wrap { - flex-wrap: wrap; - gap: 10px 20px; -} -.application.dh-style fieldset.flex .inline-child { - flex: 1; -} -.application.dh-style fieldset .list-w-img { - padding: 5px; -} -.application.dh-style fieldset .list-w-img label { - flex: 1; -} -.application.dh-style fieldset .list-w-img img { - width: 2rem; - height: 2rem; -} -.application.dh-style fieldset.one-column { - display: flex; - flex-direction: column; - align-items: start; - gap: 10px; - min-height: 64px; - flex: 1; -} -.application.dh-style fieldset.one-column > .one-column { - width: 100%; -} -.application.dh-style fieldset.two-columns { - display: grid; - grid-template-columns: 1fr 2fr; - gap: 10px; -} -.application.dh-style fieldset.two-columns.even { - grid-template-columns: 1fr 1fr; -} -.application.dh-style fieldset.two-columns .full-width { - grid-column: span 2; -} -.application.dh-style fieldset legend { - font-family: 'Montserrat', sans-serif; - font-weight: bold; - color: light-dark(#18162e, #f3c267); -} -.application.dh-style fieldset input[type='text'], -.application.dh-style fieldset input[type='number'] { - color: light-dark(#222, #efe6d8); - font-family: 'Montserrat', sans-serif; - transition: all 0.3s ease; - outline: 2px solid transparent; -} -.application.dh-style fieldset input[type='text']:focus, -.application.dh-style fieldset input[type='number']:focus, -.application.dh-style fieldset input[type='text']:hover, -.application.dh-style fieldset input[type='number']:hover { - outline: 2px solid light-dark(#222, #efe6d8); -} -.application.dh-style fieldset[disabled], -.application.dh-style fieldset.child-disabled .form-group, -.application.dh-style fieldset select[disabled], -.application.dh-style fieldset input[disabled] { - opacity: 0.5; -} -.application.dh-style fieldset.child-disabled .form-group { - pointer-events: none; -} -.application.dh-style fieldset .nest-inputs { - display: flex; - align-items: center; - width: 100%; - gap: 5px; -} -.application.dh-style fieldset .nest-inputs .btn { - padding-top: 15px; -} -.application.dh-style fieldset .nest-inputs .image { - height: 40px; - width: 40px; - object-fit: cover; - border-radius: 6px; - border: none; -} -.application.dh-style fieldset .nest-inputs > .checkbox { - align-self: end; -} -.application.dh-style fieldset .form-group { - width: 100%; -} -.application.dh-style fieldset .form-group label { - font-family: 'Montserrat', sans-serif; - font-weight: bold; - font-size: smaller; -} -.application.dh-style fieldset .form-group.checkbox { - width: fit-content; - display: flex; - align-items: center; -} -.application.dh-style fieldset .form-group.checkbox .form-fields { - height: 32px; - align-content: center; -} -.application.dh-style fieldset:has(.list-w-img) { - gap: 0; -} -.application.dh-style .two-columns { - display: grid; - grid-template-columns: 1fr 2fr; - gap: 10px; -} -.application.dh-style .two-columns.even { - grid-template-columns: 1fr 1fr; -} -.application.dh-style line-div { - display: block; - height: 1px; - width: 100%; - border-bottom: 1px solid light-dark(#18162e, #f3c267); - mask-image: linear-gradient(270deg, transparent 0%, black 50%, transparent 100%); -} -.application.dh-style side-line-div { - display: block; - height: 1px; - width: 100%; - border-bottom: 1px solid light-dark(#18162e, #f3c267); - mask-image: linear-gradient(270deg, transparent 0%, black 100%); -} -.application.dh-style side-line-div.invert { - mask-image: linear-gradient(270deg, black 0%, transparent 100%); -} -.application.dh-style .item-description { - opacity: 1; - transform: translateY(0); - grid-column: 1/-1; - transition: - opacity 0.3s ease-out, - transform 0.3s ease-out; -} -.application.dh-style .item-description.invisible { - height: 0; - opacity: 0; - overflow: hidden; - transform: translateY(-20px); - transform-origin: top; -} -.application.dh-style .item-buttons { - grid-column: span 3; - display: flex; - gap: 8px; - flex-wrap: wrap; -} -.application.dh-style .item-buttons button { - white-space: nowrap; -} -.application.setting.dh-style fieldset h2, -.application.setting.dh-style fieldset h3, -.application.setting.dh-style fieldset h4 { - margin: 8px 0 4px; - text-align: center; -} -.application.setting.dh-style fieldset .title-hint { - font-size: 12px; - font-variant: small-caps; - text-align: center; -} -.application.setting.dh-style fieldset .field-section .split-section { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 10px; -} -.application.setting.dh-style fieldset .label-container { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 10px; -} -.application.setting.dh-style fieldset .label-container label { - align-self: center; - text-align: center; -} -.application.setting.dh-style footer { - margin-top: 8px; - display: flex; - gap: 8px; -} -.application.setting.dh-style footer button { - flex: 1; -} -.application.setting.dh-style .form-group { - display: flex; - justify-content: space-between; - align-items: center; -} -.application.setting.dh-style .form-group label { - font-size: 16px; - font-family: 'Montserrat', sans-serif; -} -.application.setting.dh-style .form-group .form-fields { - display: flex; - gap: 4px; - align-items: center; -} -.system-daggerheart .tagify { - background: light-dark(transparent, transparent); - border: 1px solid light-dark(#222, #efe6d8); - height: 34px; - --tags-disabled-bg: none; - --tags-border-color: none; - --tags-hover-border-color: none; - --tags-focus-border-color: none; - --tag-border-radius: 3px; - --tag-bg: light-dark(#18162e, #f3c267); - --tag-remove-btn-color: light-dark(#18162e, #f3c267); - --tag-hover: light-dark(#18162e, #f3c267); - --tag-text-color: light-dark(#efe6d8, #222); - --tag-text-color--edit: light-dark(#efe6d8, #222); - --tag-pad: 0.3em 0.5em; - --tag-inset-shadow-size: 1.2em; - --tag-invalid-color: #d39494; - --tag-invalid-bg: rgba(211, 148, 148, 0.5); - --tag--min-width: 1ch; - --tag--max-width: 100%; - --tag-hide-transition: 0.3s; - --tag-remove-bg: light-dark(#18162e40, #f3c26740); - --tag-remove-btn-color: light-dark(#efe6d8, #222); - --tag-remove-btn-bg: none; - --tag-remove-btn-bg--hover: light-dark(#efe6d8, #222); - --input-color: inherit; - --placeholder-color: light-dark(#efe6d815, #22222215); - --placeholder-color-focus: light-dark(#efe6d815, #22222215); - --loader-size: 0.8em; - --readonly-striped: 1; - border-radius: 3px; - margin-right: 1px; -} -.system-daggerheart .tagify tag div { - display: flex; - justify-content: space-between; - align-items: center; - height: 22px; -} -.system-daggerheart .tagify tag div span { - font-weight: 400; -} -.system-daggerheart .tagify tag div img { - margin-left: 8px; - height: 20px; - width: 20px; -} -.system-daggerheart .tagify__dropdown { - border: 1px solid light-dark(#222, #efe6d8) !important; - font-family: 'Montserrat', sans-serif; - color: light-dark(#222, #efe6d8); -} -.system-daggerheart .tagify__dropdown .tagify__dropdown__wrapper { - background-image: url(../assets/parchments/dh-parchment-dark.png); - background-color: transparent; - border: 0; - color: light-dark(#222, #efe6d8); -} -.system-daggerheart .tagify__dropdown .tagify__dropdown__wrapper .tagify__dropdown__item--active { - background-color: light-dark(#222, #efe6d8); - color: light-dark(#efe6d8, #222); -} -.system-daggerheart.theme-light .tagify__dropdown .tagify__dropdown__wrapper { - background-image: url(../assets/parchments/dh-parchment-light.png); -} -.theme-light .application.sheet.dh-style button.glow { - animation: glow-dark 0.75s infinite alternate; -} -.theme-light .application .component.dh-style.card-preview-container { - background-image: url('../assets/parchments/dh-parchment-light.png'); -} -.theme-light .application .component.dh-style.card-preview-container .preview-text-container { - background-image: url(../assets/parchments/dh-parchment-dark.png); -} -.theme-light .application .component.dh-style.card-preview-container .preview-selected-icon-container { - background-image: url(../assets/parchments/dh-parchment-dark.png); - color: var(--color-light-5); -} -.application .component.dh-style.card-preview-container { - position: relative; - border-radius: 6px; - border: 2px solid var(--color-tabs-border); - display: flex; - flex-direction: column; - aspect-ratio: 0.75; - background-image: url('../assets/parchments/dh-parchment-dark.png'); -} -.application .component.dh-style.card-preview-container.selectable { - cursor: pointer; -} -.application .component.dh-style.card-preview-container.disabled { - pointer-events: none; - opacity: 0.4; -} -.application .component.dh-style.card-preview-container .preview-image-outer-container { - position: relative; - display: flex; - align-items: center; - justify-content: center; -} -.application .component.dh-style.card-preview-container .preview-image-container { - flex: 1; - border-radius: 4px 4px 0 0; -} -.application .component.dh-style.card-preview-container .preview-text-container { - flex: 1; - border-radius: 0 0 4px 4px; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: 18px; - text-align: center; - color: var(--color-text-selection-bg); - background-image: url(../assets/parchments/dh-parchment-light.png); -} -.application .component.dh-style.card-preview-container .preview-empty-container { - pointer-events: none; - position: relative; - display: flex; - align-items: center; - justify-content: center; - flex: 1; -} -.application .component.dh-style.card-preview-container .preview-empty-container .preview-empty-inner-container { - width: 100%; - display: flex; - justify-content: center; -} -.application - .component.dh-style.card-preview-container - .preview-empty-container - .preview-empty-inner-container - .preview-add-icon { - font-size: 48px; -} -.application - .component.dh-style.card-preview-container - .preview-empty-container - .preview-empty-inner-container - .preview-empty-subtext { - position: absolute; - top: 10%; - font-size: 18px; - font-variant: small-caps; - text-align: center; -} -.application .component.dh-style.card-preview-container .preview-selected-icon-container { - position: absolute; - height: 54px; - width: 54px; - border-radius: 50%; - border: 2px solid; - font-size: 48px; - display: flex; - align-items: center; - justify-content: center; - background-image: url(../assets/parchments/dh-parchment-light.png); - color: var(--color-dark-5); -} -.application .component.dh-style.card-preview-container .preview-selected-icon-container i { - position: relative; - right: 2px; -} diff --git a/styles/less/global/elements.less b/styles/less/global/elements.less index 4c319ed5..dda82362 100755 --- a/styles/less/global/elements.less +++ b/styles/less/global/elements.less @@ -97,6 +97,19 @@ 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; + } + } } select { diff --git a/templates/dialogs/actionSelect.hbs b/templates/dialogs/actionSelect.hbs index 22142f09..e3468249 100644 --- a/templates/dialogs/actionSelect.hbs +++ b/templates/dialogs/actionSelect.hbs @@ -5,7 +5,7 @@