diff --git a/src/scss/components/_effect_list.scss b/src/scss/components/_effect_list.scss deleted file mode 100644 index 06e18d36..00000000 --- a/src/scss/components/_effect_list.scss +++ /dev/null @@ -1,68 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * SPDX-FileCopyrightText: 2021 Gesina Schwalbe - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/mixins"; -@use "../utils/variables"; - -.ds4-effect-list { - @include mixins.mark-invalid-or-disabled-input; - - $row-height: 1.75em; - - align-items: center; - display: grid; - grid-column-gap: 0.5em; - grid-row-gap: 0.2em; - grid-template-columns: $row-height $row-height 3fr 2fr 5ch; - margin: 0.5em 0; - overflow-y: auto; - padding: 0; - - :nth-child(5n + 1) { - justify-self: center; - } - - &__row { - display: contents; // TODO: Once chromium supports `grid-template-columns: subgrid` (https://bugs.chromium.org/p/chromium/issues/detail?id=618969), switch to `display: grid; grid: 1/-1; grid-template-columns: subgrid` - - &--header { - font-weight: bold; - } - - > * { - height: $row-height; - line-height: $row-height; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } - } - - &__image { - border: none; - } - - &__editable { - background-color: transparent; - border: 0; - padding: 0; - - &--checkbox { - width: 100%; - height: 100%; - margin: 0px; - } - } - - &__control-buttons { - display: grid; - grid-template-columns: 1fr 1fr; - text-align: center; - width: 100%; - padding: 0 calc(1em / 3); - } -} diff --git a/src/scss/components/_item_list.scss b/src/scss/components/_embedded_document_list.scss similarity index 72% rename from src/scss/components/_item_list.scss rename to src/scss/components/_embedded_document_list.scss index 0b7700a3..e459e8d4 100644 --- a/src/scss/components/_item_list.scss +++ b/src/scss/components/_embedded_document_list.scss @@ -8,7 +8,7 @@ @use "../utils/mixins"; @use "../utils/variables"; -.ds4-item-list { +.ds4-embedded-document-list { @include mixins.mark-invalid-or-disabled-input; $row-height: 1.75em; @@ -23,24 +23,51 @@ &--weapon { grid-template-columns: $row-height $row-height 3ch 3fr $row-height 1fr 3ch 5fr 5ch; + :nth-child(9n + 1), + :nth-child(9n + 5), + :nth-child(9n + 6), + :nth-child(9n + 7) { + justify-self: center; + } } &--armor { grid-template-columns: $row-height $row-height 3ch 3fr 1fr 1fr 3ch 5fr 5ch; + :nth-child(9n + 1), + :nth-child(9n + 7) { + justify-self: center; + } } &--shield { grid-template-columns: $row-height $row-height 3ch 1fr 3ch 3fr 5ch; + :nth-child(7n + 1), + :nth-child(7n + 5) { + justify-self: center; + } } &--equipment { grid-template-columns: $row-height $row-height 3ch 1fr 10ch 3fr 5ch; + :nth-child(7n + 1) { + justify-self: center; + } } &--loot { grid-template-columns: $row-height 3ch 1fr 10ch 3fr 5ch; } &--spell { grid-template-columns: $row-height $row-height 2fr $row-height 1fr 1fr 1fr 1fr 5ch; + :nth-child(9n + 1), + :nth-child(9n + 4), + :nth-child(9n + 6), + :nth-child(9n + 7), + :nth-child(9n + 8) { + justify-self: center; + } } &--talent { grid-template-columns: $row-height 1fr 21ch 3fr 5ch; + :nth-child(9n + 3) { + justify-self: center; + } } &--racial-ability, &--language, @@ -49,6 +76,13 @@ grid-template-columns: $row-height 1fr 3fr 5ch; } + &--effect { + grid-template-columns: $row-height $row-height 3fr 2fr 5ch; + :nth-child(5n + 1) { + justify-self: center; + } + } + &__row { display: contents; // TODO: Once chromium supports `grid-template-columns: subgrid` (https://bugs.chromium.org/p/chromium/issues/detail?id=618969), switch to `display: grid; grid: 1/-1; grid-template-columns: subgrid` @@ -98,7 +132,7 @@ } } -.ds4-item-list-title { +.ds4-embedded-document-list-title { border-bottom: variables.$border-groove; font-weight: bold; margin-bottom: 0; diff --git a/src/scss/ds4.scss b/src/scss/ds4.scss index 8203eb62..79fb8a1d 100644 --- a/src/scss/ds4.scss +++ b/src/scss/ds4.scss @@ -34,9 +34,8 @@ @include meta.load-css("components/core_values"); @include meta.load-css("components/currency"); @include meta.load-css("components/description"); - @include meta.load-css("components/effect_list"); + @include meta.load-css("components/embedded_document_list"); @include meta.load-css("components/forms"); - @include meta.load-css("components/item_list"); @include meta.load-css("components/profile"); @include meta.load-css("components/rollable_image"); @include meta.load-css("components/sheet_tab_nav"); diff --git a/src/templates/sheets/actor/components/effect-list-entry.hbs b/src/templates/sheets/actor/components/effect-list-entry.hbs index 9106ddfe..4fbb0a95 100644 --- a/src/templates/sheets/actor/components/effect-list-entry.hbs +++ b/src/templates/sheets/actor/components/effect-list-entry.hbs @@ -9,9 +9,9 @@ SPDX-License-Identifier: MIT !-- Render an effect list entry row. !-- @param effectData: The data of the item. --}} -