mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-01-11 19:25:21 +01:00
562 lines
No EOL
16 KiB
Text
562 lines
No EOL
16 KiB
Text
form.daggerheart.views.downtime { // Shouldn't be needed, but DEFAULT_OPTIONS doesn't accept Height: 'auto'
|
|
height: auto !important;
|
|
}
|
|
|
|
div.daggerheart.views.death-move { // Shouldn't be needed, but DEFAULT_OPTIONS doesn't accept Height: 'auto'
|
|
height: auto !important;
|
|
}
|
|
|
|
div.daggerheart.views.multiclass { // Shouldn't be needed, but DEFAULT_OPTIONS doesn't accept Height: 'auto'
|
|
height: auto !important;
|
|
}
|
|
|
|
.daggerheart.views {
|
|
&.levelup {
|
|
.levelup-title-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 32px;
|
|
margin-bottom: 4px;
|
|
|
|
.level-title {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.level-display {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
i {
|
|
margin: 0 @halfMargin;
|
|
}
|
|
}
|
|
}
|
|
|
|
.levelup-section {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
margin-bottom: 8px;
|
|
font-size: 11px;
|
|
|
|
.levelup-container {
|
|
flex: 1;
|
|
|
|
&:nth-of-type(2) {
|
|
padding: 0 4px;
|
|
}
|
|
|
|
&.disabled {
|
|
opacity: 0.2;
|
|
}
|
|
|
|
.levelup-inner-container {
|
|
height: 700px;
|
|
padding: 24px 58px 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
position: relative;
|
|
|
|
.levelup-legend {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
font-weight: bold;
|
|
z-index: 1;
|
|
}
|
|
|
|
.levelup-info {
|
|
background: @primaryAccent;
|
|
width: 100%;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: -6px;
|
|
padding: 8px 0;
|
|
}
|
|
|
|
.levelup-pretext {
|
|
padding: 8px 0;
|
|
}
|
|
|
|
.levelup-body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.levelup-choice-row {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 4px;
|
|
|
|
.levelup-choice-row-inner {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.levelup-choice-input-container {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
input {
|
|
&:disabled:checked::before {
|
|
opacity: 0.4;
|
|
color: var(--color-warm-1);
|
|
}
|
|
}
|
|
|
|
i.fa-link {
|
|
transform: rotate(45deg);
|
|
position: relative;
|
|
top: 2px;
|
|
margin: 0 -3px;
|
|
}
|
|
|
|
i.fa-lock {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
font-size: 8px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.levelup-posttext {
|
|
padding: 8px 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.downtime-container {
|
|
.activity-container {
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 8px;
|
|
|
|
.activity-title {
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.activity-title-text {
|
|
font-size: 24px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.activity-image {
|
|
width: 120px;
|
|
border: 2px solid black;
|
|
border-radius: 50%;
|
|
margin-right: 8px;
|
|
cursor: pointer;
|
|
|
|
&:hover, &.selected {
|
|
filter: drop-shadow(0 0 6px gold);
|
|
}
|
|
}
|
|
|
|
.custom-name-input {
|
|
font-size: 24px;
|
|
font-weight: bold;
|
|
padding: 0;
|
|
background: transparent;
|
|
color: rgb(239, 230, 216);
|
|
}
|
|
}
|
|
|
|
.activity-body {
|
|
flex: 1;
|
|
font-style: italic;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.downtime {
|
|
.activity-text-area {
|
|
resize: none;
|
|
}
|
|
}
|
|
|
|
.range-reset {
|
|
flex: 0;
|
|
width: 21px;
|
|
height: 21px;
|
|
margin: 3px 4px;
|
|
border: 1px solid black;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
&.roll-selection {
|
|
.roll-selection-container {
|
|
i {
|
|
filter: invert(0%) sepia(100%) saturate(0%) hue-rotate(21deg) brightness(17%) contrast(103%);
|
|
}
|
|
}
|
|
|
|
.roll-dialog-container {
|
|
.disadvantage, .advantage {
|
|
border: 2px solid @secondaryAccent;
|
|
border-radius: 6px;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 4px;
|
|
margin-bottom: 6px;
|
|
|
|
&.selected {
|
|
filter: drop-shadow(0px 0px 3px @mainShadow);
|
|
}
|
|
|
|
input {
|
|
border: 0;
|
|
}
|
|
|
|
button {
|
|
flex: 0;
|
|
border-radius: 50%;
|
|
height: 20px;
|
|
width: 20px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin: 2px 0 2px 4px;
|
|
padding: 12px;
|
|
|
|
i {
|
|
margin: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
.roll-dialog-experience-container {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
gap: @halfMargin;
|
|
|
|
.roll-dialog-chip {
|
|
border: @thinBorder solid black;
|
|
border-radius: 6px;
|
|
min-width: calc(33% - 2px);
|
|
flex: 1;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: @halfMargin;
|
|
cursor: pointer;
|
|
padding: @fullPadding;
|
|
background: grey;
|
|
overflow: hidden;
|
|
font-weight: bold;
|
|
|
|
&.hover {
|
|
filter: drop-shadow(0 0 3px @mainShadow);
|
|
}
|
|
|
|
span {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
&.selected {
|
|
background: green;
|
|
|
|
span {
|
|
filter: drop-shadow(0 0 3px @secondaryShadow);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.hope-container {
|
|
display: flex;
|
|
gap: @fullMargin;
|
|
align-items: center;
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.npc-roll-selection {
|
|
.npc-roll-dialog-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.selection-container {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: @fullMargin;
|
|
|
|
.dice-container {
|
|
display: flex;
|
|
align-items: center;
|
|
flex: 1;
|
|
|
|
.dice-inner-container{
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
i {
|
|
font-size: 18px;
|
|
}
|
|
|
|
img {
|
|
border: 0;
|
|
position: relative;
|
|
left: 1px;
|
|
}
|
|
|
|
.dice-number {
|
|
position: absolute;
|
|
top: calc(50% - 14px);
|
|
left: calc(50% - 7px);
|
|
font-size: 24px;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.roll-dialog-experience-container {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-wrap: wrap;
|
|
gap: @halfMargin;
|
|
flex: 2;
|
|
height: 100%;
|
|
|
|
.roll-dialog-chip {
|
|
border: @thinBorder solid black;
|
|
border-radius: 6px;
|
|
flex-basis: calc(50% - 2px);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
cursor: pointer;
|
|
padding: @fullPadding;
|
|
background: grey;
|
|
overflow: hidden;
|
|
|
|
&.hover {
|
|
filter: drop-shadow(0 0 3px @mainShadow);
|
|
}
|
|
|
|
span {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
&.selected i {
|
|
color: green;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&.multiclass {
|
|
.multiclass-container {
|
|
margin-bottom: @largeMargin;
|
|
|
|
.multiclass-category-title {
|
|
margin-top: @largeMargin;
|
|
}
|
|
|
|
.multiclass-class-choices {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.multiclass-spaced-choices {
|
|
display: flex;
|
|
justify-content: space-around;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.multiclass-class-choice {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-basis: 33.33%;
|
|
font-weight: bold;
|
|
font-size: 24px;
|
|
cursor: pointer;
|
|
|
|
&.selected:not(.disabled), &:hover:not(.disabled) {
|
|
filter: drop-shadow(0 0 3px gold);
|
|
}
|
|
|
|
&.inactive, &.disabled {
|
|
cursor: initial;
|
|
opacity: 0.4;
|
|
}
|
|
|
|
img {
|
|
width: 80px;
|
|
height: 80px;
|
|
margin-right: @largeMargin;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&.damage-selection {
|
|
.hope-container {
|
|
display: flex;
|
|
gap: @fullMargin;
|
|
align-items: center;
|
|
font-size: 18px;
|
|
}
|
|
}
|
|
|
|
&.action {
|
|
.action-category {
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
.action-category-label {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-radius: 6px;
|
|
cursor: pointer;
|
|
padding: 0 @fullPadding;
|
|
margin: 0 auto @halfMargin;
|
|
|
|
&:hover {
|
|
background-color: darkgray;
|
|
}
|
|
}
|
|
|
|
.action-category-data {
|
|
max-height: 0;
|
|
transition: max-height 0.2s ease-in-out;
|
|
overflow: hidden;
|
|
|
|
&.open {
|
|
max-height: initial;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&.ancestry-selection {
|
|
.ancestry-section {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin-bottom: @fullMargin;
|
|
|
|
.ancestry-container {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.ancestry-inner-container {
|
|
flex-basis: 25%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
|
|
.image-container {
|
|
img {
|
|
width: 120px;
|
|
border: 4px solid black;
|
|
border-radius: 50%;
|
|
|
|
&.selected {
|
|
border-color: @secondaryShadow;
|
|
}
|
|
|
|
&:hover:not(.selected) {
|
|
filter: drop-shadow(0 0 3px @secondaryShadow);
|
|
}
|
|
|
|
&.disabled {
|
|
opacity: 0.3;
|
|
}
|
|
}
|
|
}
|
|
|
|
.name-container {
|
|
div {
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
cursor: help;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.mixed-ancestry-container {
|
|
width: 100%;
|
|
display: flex;
|
|
gap: @fullMargin;
|
|
|
|
> div {
|
|
flex: 1;
|
|
}
|
|
|
|
.mixed-ancestry-name {
|
|
text-align: center;
|
|
div {
|
|
font-size: 24px;
|
|
}
|
|
}
|
|
|
|
.mixed-ancestry-images {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: @halfMargin;
|
|
|
|
.mixed-ancestry-image {
|
|
position: relative;
|
|
max-width: 33%;
|
|
|
|
&:hover i {
|
|
opacity: 1;
|
|
}
|
|
|
|
i {
|
|
position: absolute;
|
|
font-size: 32px;
|
|
top: calc(50% - 20px);
|
|
left: calc(50% - 20px);
|
|
padding: @fullPadding;
|
|
background-color: grey;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
|
|
&:hover {
|
|
filter: drop-shadow(0 0 3px @secondaryShadow);
|
|
}
|
|
}
|
|
|
|
img {
|
|
max-width: 100%;
|
|
}
|
|
}
|
|
|
|
img {
|
|
max-width: 33%;
|
|
border: 4px solid black;
|
|
border-radius: 50%;
|
|
|
|
&.selected {
|
|
border-color: @secondaryShadow;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
} |