From ce8415357a4168ed06393010538d393bbc85573c Mon Sep 17 00:00:00 2001 From: Johannes Loher Date: Fri, 21 Jan 2022 03:22:17 +0100 Subject: [PATCH] feat: better styling of item sheets --- src/lang/de.json | 31 ++--- src/lang/en.json | 31 ++--- src/module/actor/sheets/actor-sheet.ts | 8 +- src/module/actor/sheets/character-sheet.ts | 2 +- src/module/actor/sheets/creature-sheet.ts | 2 +- src/module/handlebars/handlebars-partials.ts | 21 +++- src/module/item/item-sheet.ts | 80 ++++++++---- src/scss/components/_apps.scss | 25 ---- src/scss/components/_basic_property.scss | 37 ------ src/scss/components/_description.scss | 84 ------------- src/scss/components/_forms.scss | 72 ----------- src/scss/components/_sheet_tab_nav.scss | 18 --- .../components/{ => actor}/_actor_header.scss | 6 +- .../{ => actor}/_actor_progression.scss | 9 +- .../{ => actor}/_actor_properties.scss | 6 +- .../components/{ => actor}/_actor_sheet.scss | 4 +- .../actor}/_biography.scss | 0 src/scss/components/{ => actor}/_check.scss | 2 +- src/scss/components/{ => actor}/_checks.scss | 0 .../components/{ => actor}/_combat_value.scss | 7 +- .../{ => actor}/_combat_values.scss | 2 +- .../components/{ => actor}/_core_value.scss | 8 +- .../components/{ => actor}/_core_values.scss | 5 +- .../components/{ => actor}/_currency.scss | 2 +- src/scss/components/{ => actor}/_profile.scss | 0 .../{ => actor}/_talent_rank_equation.scss | 12 +- .../components/{ => dice}/_dice_total.scss | 2 +- src/scss/components/item/_item_header.scss | 51 ++++++++ .../components/item/_item_properties.scss | 21 ++++ src/scss/components/item/_item_sheet.scss | 10 ++ .../{ => shared}/_control_button_group.scss | 0 src/scss/components/shared/_editor.scss | 18 +++ .../{ => shared}/_embedded_document_list.scss | 30 +++-- .../{ => shared}/_rollable_image.scss | 0 src/scss/components/shared/_sheet_body.scss | 10 ++ .../{_sheet.scss => shared/_sheet_form.scss} | 4 +- src/scss/components/shared/_sheet_tab.scss | 19 +++ .../components/shared/_sheet_tab_nav.scss | 27 ++++ src/scss/ds4.scss | 68 +++++------ src/scss/global/_accessibility.scss | 2 +- src/scss/global/_flex.scss | 93 -------------- src/scss/global/_fonts.scss | 5 + src/scss/global/_grid.scss | 89 -------------- src/scss/global/_window.scss | 18 --- src/scss/utils/_mixins.scss | 24 +--- src/scss/utils/_typography.scss | 14 --- src/scss/utils/_variables.scss | 2 - src/templates/dialogs/roll-options.hbs | 10 +- .../sheets/actor/character-sheet.hbs | 18 +-- .../sheets/actor/components/actor-header.hbs | 2 +- .../actor/components/character-properties.hbs | 4 +- .../actor/components/creature-properties.hbs | 4 +- .../actor/components/effect-list-entry.hbs | 4 +- .../actor/components/item-list-entry.hbs | 4 +- .../actor/components/items-overview.hbs | 10 +- src/templates/sheets/actor/creature-sheet.hbs | 18 +-- src/templates/sheets/actor/tabs/biography.hbs | 2 +- .../sheets/actor/tabs/character-abilities.hbs | 10 +- .../sheets/actor/tabs/character-inventory.hbs | 2 +- .../sheets/actor/tabs/creature-abilities.hbs | 4 +- .../sheets/actor/tabs/creature-inventory.hbs | 2 +- .../sheets/actor/tabs/description.hbs | 2 +- src/templates/sheets/actor/tabs/effects.hbs | 4 +- src/templates/sheets/actor/tabs/spells.hbs | 4 +- src/templates/sheets/actor/tabs/values.hbs | 2 +- src/templates/sheets/item/alphabet-sheet.hbs | 22 +++- src/templates/sheets/item/armor-sheet.hbs | 62 +++++----- src/templates/sheets/item/components/body.hbs | 35 ------ .../item/components/effect-list-entry.hbs | 22 ++++ .../item/components/effect-list-header.hbs | 19 +++ .../sheets/item/components/item-header.hbs | 18 +++ .../item/components/properties/armor.hbs | 33 +++++ .../item/components/properties/equipable.hbs | 14 +++ .../item/components/properties/physical.hbs | 38 ++++++ .../item/components/properties/protective.hbs | 14 +++ .../properties/special-creature-ability.hbs | 15 +++ .../item/components/properties/spell.hbs | 112 +++++++++++++++++ .../item/components/properties/talent.hbs | 26 ++++ .../item/components/properties/weapon.hbs | 31 +++++ .../sheets/item/components/sheet-header.hbs | 15 --- src/templates/sheets/item/equipment-sheet.hbs | 33 +++-- src/templates/sheets/item/language-sheet.hbs | 22 +++- src/templates/sheets/item/loot-sheet.hbs | 29 ++++- .../sheets/item/racialAbility-sheet.hbs | 22 +++- src/templates/sheets/item/shield-sheet.hbs | 41 ++++--- .../item/specialCreatureAbility-sheet.hbs | 34 ++++-- src/templates/sheets/item/spell-sheet.hbs | 115 ++++-------------- .../sheets/item/tabs/description.hbs | 42 +------ src/templates/sheets/item/tabs/details.hbs | 28 ----- src/templates/sheets/item/tabs/effects.hbs | 32 ++--- src/templates/sheets/item/tabs/properties.hbs | 9 ++ src/templates/sheets/item/talent-sheet.hbs | 50 +++----- src/templates/sheets/item/weapon-sheet.hbs | 56 ++++----- .../components/add-button.hbs | 0 .../components/control-button-group.hbs | 0 .../components/rollable-image.hbs | 0 96 files changed, 1026 insertions(+), 1050 deletions(-) delete mode 100644 src/scss/components/_apps.scss delete mode 100644 src/scss/components/_basic_property.scss delete mode 100644 src/scss/components/_description.scss delete mode 100644 src/scss/components/_forms.scss delete mode 100644 src/scss/components/_sheet_tab_nav.scss rename src/scss/components/{ => actor}/_actor_header.scss (88%) rename src/scss/components/{ => actor}/_actor_progression.scss (85%) rename src/scss/components/{ => actor}/_actor_properties.scss (85%) rename src/scss/components/{ => actor}/_actor_sheet.scss (73%) rename src/scss/{tabs => components/actor}/_biography.scss (100%) rename src/scss/components/{ => actor}/_check.scss (90%) rename src/scss/components/{ => actor}/_checks.scss (100%) rename src/scss/components/{ => actor}/_combat_value.scss (93%) rename src/scss/components/{ => actor}/_combat_values.scss (90%) rename src/scss/components/{ => actor}/_core_value.scss (83%) rename src/scss/components/{ => actor}/_core_values.scss (73%) rename src/scss/components/{ => actor}/_currency.scss (92%) rename src/scss/components/{ => actor}/_profile.scss (100%) rename src/scss/components/{ => actor}/_talent_rank_equation.scss (54%) rename src/scss/components/{ => dice}/_dice_total.scss (95%) create mode 100644 src/scss/components/item/_item_header.scss create mode 100644 src/scss/components/item/_item_properties.scss create mode 100644 src/scss/components/item/_item_sheet.scss rename src/scss/components/{ => shared}/_control_button_group.scss (100%) create mode 100644 src/scss/components/shared/_editor.scss rename src/scss/components/{ => shared}/_embedded_document_list.scss (87%) rename src/scss/components/{ => shared}/_rollable_image.scss (100%) create mode 100644 src/scss/components/shared/_sheet_body.scss rename src/scss/components/{_sheet.scss => shared/_sheet_form.scss} (67%) create mode 100644 src/scss/components/shared/_sheet_tab.scss create mode 100644 src/scss/components/shared/_sheet_tab_nav.scss delete mode 100644 src/scss/global/_flex.scss delete mode 100644 src/scss/global/_grid.scss delete mode 100644 src/scss/global/_window.scss delete mode 100644 src/scss/utils/_typography.scss delete mode 100644 src/templates/sheets/item/components/body.hbs create mode 100644 src/templates/sheets/item/components/effect-list-entry.hbs create mode 100644 src/templates/sheets/item/components/effect-list-header.hbs create mode 100644 src/templates/sheets/item/components/item-header.hbs create mode 100644 src/templates/sheets/item/components/properties/armor.hbs create mode 100644 src/templates/sheets/item/components/properties/equipable.hbs create mode 100644 src/templates/sheets/item/components/properties/physical.hbs create mode 100644 src/templates/sheets/item/components/properties/protective.hbs create mode 100644 src/templates/sheets/item/components/properties/special-creature-ability.hbs create mode 100644 src/templates/sheets/item/components/properties/spell.hbs create mode 100644 src/templates/sheets/item/components/properties/talent.hbs create mode 100644 src/templates/sheets/item/components/properties/weapon.hbs delete mode 100644 src/templates/sheets/item/components/sheet-header.hbs delete mode 100644 src/templates/sheets/item/tabs/details.hbs create mode 100644 src/templates/sheets/item/tabs/properties.hbs rename src/templates/sheets/{actor => shared}/components/add-button.hbs (100%) rename src/templates/sheets/{actor => shared}/components/control-button-group.hbs (100%) rename src/templates/sheets/{actor => shared}/components/rollable-image.hbs (100%) diff --git a/src/lang/de.json b/src/lang/de.json index 97c4c49e..2bf3be49 100644 --- a/src/lang/de.json +++ b/src/lang/de.json @@ -9,13 +9,11 @@ "DS4.DocumentImageAltText": "Bild von {name}", "DS4.RollableImageRollableTitle": "Für {name} würfeln", "DS4.DiceOverlayImageAltText": "Bild eines W20", - "DS4.NotOwned": "Nicht besessen", "DS4.HeadingValues": "Werte", "DS4.HeadingBiography": "Biografie", - "DS4.HeadingDetails": "Details", + "DS4.HeadingProperties": "Eigenschaften", "DS4.HeadingEffects": "Effekte", "DS4.HeadingInventory": "Inventar", - "DS4.HeadingProfile": "Profil", "DS4.HeadingAbilities": "Fähigkeiten", "DS4.HeadingSpells": "Zaubersprüche", "DS4.HeadingDescription": "Beschreibung", @@ -43,7 +41,6 @@ "DS4.ItemEquipped": "Ausgerüstet", "DS4.ItemEquippedAbbr": "A", "DS4.SortByItemEquipped": "Nach Ausgerüstet sortieren", - "DS4.ItemOwner": "Besitzer", "DS4.ItemAvailability": "Verfügbarkeit", "DS4.ItemAvailabilityHamlet": "Dorf", "DS4.ItemAvailabilityVilage": "Kleinstadt", @@ -78,6 +75,14 @@ "DS4.ItemTypeSpecialCreatureAbilityPlural": "Besondere Kreaturenfähigkeiten", "DS4.ItemWeaponCheckFlavor": "{actor} greift mit {weapon} an.", "DS4.ItemSpellCheckFlavor": "{actor} wirkt {spell}.", + "DS4.ItemPropertiesArmor": "Panzerungseigenschaften", + "DS4.ItemPropertiesEquipable": "Ausrüstungseigenschaften", + "DS4.ItemPropertiesPhysical": "Physische Eigenschaften", + "DS4.ItemPropertiesProtective": "Schützende Eigenschaften", + "DS4.ItemPropertiesSpecialCreatureAbility": "Besondere Kreaturenfähigkeitseigenschaften", + "DS4.ItemPropertiesSpell": "Zaubereigenschaften", + "DS4.ItemPropertiesTalent": "Talenteigenschaften", + "DS4.ItemPropertiesWeapon": "Waffeneigenschaften", "DS4.ArmorType": "Panzerungstyp", "DS4.ArmorTypeAbbr": "PAT", "DS4.SortByArmorType": "Nach Panzerungstyp sortieren", @@ -129,12 +134,10 @@ "DS4.SpellEffectRadius": "Effektradius", "DS4.SpellDuration": "Wirkdauer", "DS4.SpellCooldownDuration": "Abklingzeit", - "DS4.SpellMinimumLevelsHealer": "Zugangsstufe für Heiler", - "DS4.SpellMinimumLevelsHealerAbbr": "Zugangsstufe Hei", - "DS4.SpellMinimumLevelsWizard": "Zugangsstufe für Zauberer", - "DS4.SpellMinimumLevelsWizardAbbr": "Zugangsstufe Zau", - "DS4.SpellMinimumLevelsSorcerer": "Zugangsstufe für Schwarzmagier", - "DS4.SpellMinimumLevelsSorcererAbbr": "Zugangsstufe Sch", + "DS4.SpellMinimumLevel": "Zugangsstufe", + "DS4.SpellCasterClassHealer": "Heiler", + "DS4.SpellCasterClassSorcerer": "Schwarzmagier", + "DS4.SpellCasterClassWizard": "Zauberer", "DS4.SpellPrice": "Preis (Gold)", "DS4.EffectEnabled": "Aktiv", "DS4.EffectEnabledAbbr": "A", @@ -191,10 +194,10 @@ "DS4.CharacterSlayerPointsAbbr": "SP", "DS4.TalentRank": "Rang", "DS4.SortByTalentRank": "Nach Rang sortieren", - "DS4.TalentRankBase": "Erworbener Rang", - "DS4.TalentRankMax": "Maximaler Rang", - "DS4.TalentRankMod": "Zusätzlicher Rang", - "DS4.TalentRankTotal": "Gesamter Rang", + "DS4.TalentRankBase": "Erworben", + "DS4.TalentRankMax": "Maximum", + "DS4.TalentRankMod": "Zusätzlich", + "DS4.TalentRankTotal": "Gesamt", "DS4.TalentRankOf": "von", "DS4.CharacterLanguageLanguages": "Sprachen", "DS4.CharacterLanguageAlphabets": "Schriftzeichen", diff --git a/src/lang/en.json b/src/lang/en.json index c8823e28..f6d6d59f 100644 --- a/src/lang/en.json +++ b/src/lang/en.json @@ -9,13 +9,11 @@ "DS4.DocumentImageAltText": "Image of {name}", "DS4.RollableImageRollableTitle": "Roll for {name}", "DS4.DiceOverlayImageAltText": "Image of a d20", - "DS4.NotOwned": "No owner", "DS4.HeadingValues": "Values", "DS4.HeadingBiography": "Biography", - "DS4.HeadingDetails": "Details", + "DS4.HeadingProperties": "Properties", "DS4.HeadingEffects": "Effects", "DS4.HeadingInventory": "Inventory", - "DS4.HeadingProfile": "Profile", "DS4.HeadingAbilities": "Abilities", "DS4.HeadingSpells": "Spells", "DS4.HeadingDescription": "Description", @@ -43,7 +41,6 @@ "DS4.ItemEquipped": "Equipped", "DS4.ItemEquippedAbbr": "E", "DS4.SortByItemEquipped": "Sort by Equipped", - "DS4.ItemOwner": "Owner", "DS4.ItemAvailability": "Availability", "DS4.ItemAvailabilityHamlet": "Hamlet", "DS4.ItemAvailabilityVilage": "Village", @@ -78,6 +75,14 @@ "DS4.ItemTypeSpecialCreatureAbilityPlural": "Special Creature Abilities", "DS4.ItemWeaponCheckFlavor": "{actor} attacks with {weapon}.", "DS4.ItemSpellCheckFlavor": "{actor} casts {spell}.", + "DS4.ItemPropertiesArmor": "Armor Properties", + "DS4.ItemPropertiesEquipable": "Equipment Properties", + "DS4.ItemPropertiesPhysical": "Physical Properties", + "DS4.ItemPropertiesProtective": "Protective Properties", + "DS4.ItemPropertiesSpecialCreatureAbility": "Special Creature Ability Properties", + "DS4.ItemPropertiesSpell": "Spell Properties", + "DS4.ItemPropertiesTalent": "Talent Properties", + "DS4.ItemPropertiesWeapon": "Weapon Properties", "DS4.ArmorType": "Armor Type", "DS4.ArmorTypeAbbr": "AT", "DS4.SortByArmorType": "Sort by Armor Type", @@ -129,12 +134,10 @@ "DS4.SpellEffectRadius": "Radius", "DS4.SpellDuration": "Duration", "DS4.SpellCooldownDuration": "Cooldown", - "DS4.SpellMinimumLevelsHealer": "Minimum level for Healers", - "DS4.SpellMinimumLevelsHealerAbbr": "Min lvl HEA", - "DS4.SpellMinimumLevelsWizard": "Minimum level for Wizards", - "DS4.SpellMinimumLevelsWizardAbbr": "Min lvl WIZ", - "DS4.SpellMinimumLevelsSorcerer": "Minimum level for Sorcerers", - "DS4.SpellMinimumLevelsSorcererAbbr": "Min lvl SRC", + "DS4.SpellMinimumLevel": "Minimum Level", + "DS4.SpellCasterClassHealer": "Healer", + "DS4.SpellCasterClassSorcerer": "Sorcerer", + "DS4.SpellCasterClassWizard": "Wizard", "DS4.SpellPrice": "Price (Gold)", "DS4.EffectEnabled": "Enabled", "DS4.EffectEnabledAbbr": "E", @@ -191,10 +194,10 @@ "DS4.CharacterSlayerPointsAbbr": "SP", "DS4.TalentRank": "Rank", "DS4.SortByTalentRank": "Sort by Rank", - "DS4.TalentRankBase": "Acquired Ranks", - "DS4.TalentRankMax": "Maximum Ranks", - "DS4.TalentRankMod": "Additional Ranks", - "DS4.TalentRankTotal": "Total Ranks", + "DS4.TalentRankBase": "Acquired", + "DS4.TalentRankMax": "Maximum", + "DS4.TalentRankMod": "Additional", + "DS4.TalentRankTotal": "Total", "DS4.TalentRankOf": "of", "DS4.CharacterLanguageLanguages": "Languages", "DS4.CharacterLanguageAlphabets": "Alphabets", diff --git a/src/module/actor/sheets/actor-sheet.ts b/src/module/actor/sheets/actor-sheet.ts index 291544d8..421246da 100644 --- a/src/module/actor/sheets/actor-sheet.ts +++ b/src/module/actor/sheets/actor-sheet.ts @@ -22,10 +22,10 @@ export class DS4ActorSheet extends ActorSheet { const templatePaths = [ "systems/ds4/templates/sheets/actor/components/actor-header.hbs", "systems/ds4/templates/sheets/actor/components/actor-progression.hbs", - "systems/ds4/templates/sheets/actor/components/add-button.hbs", "systems/ds4/templates/sheets/actor/components/biography.hbs", "systems/ds4/templates/sheets/actor/components/character-properties.hbs", "systems/ds4/templates/sheets/actor/components/check.hbs", "systems/ds4/templates/sheets/actor/components/checks.hbs", "systems/ds4/templates/sheets/actor/components/combat-value.hbs", "systems/ds4/templates/sheets/actor/components/combat-values.hbs", - "systems/ds4/templates/sheets/actor/components/control-button-group.hbs", "systems/ds4/templates/sheets/actor/components/core-value.hbs", "systems/ds4/templates/sheets/actor/components/core-values.hbs", "systems/ds4/templates/sheets/actor/components/creature-properties.hbs", @@ -26,7 +24,6 @@ export default async function registerHandlebarsPartials(): Promise { "systems/ds4/templates/sheets/actor/components/item-list-header.hbs", "systems/ds4/templates/sheets/actor/components/items-overview.hbs", "systems/ds4/templates/sheets/actor/components/profile.hbs", - "systems/ds4/templates/sheets/actor/components/rollable-image.hbs", "systems/ds4/templates/sheets/actor/components/talent-rank-equation.hbs", "systems/ds4/templates/sheets/actor/tabs/biography.hbs", "systems/ds4/templates/sheets/actor/tabs/character-abilities.hbs", @@ -37,11 +34,23 @@ export default async function registerHandlebarsPartials(): Promise { "systems/ds4/templates/sheets/actor/tabs/effects.hbs", "systems/ds4/templates/sheets/actor/tabs/spells.hbs", "systems/ds4/templates/sheets/actor/tabs/values.hbs", - "systems/ds4/templates/sheets/item/components/body.hbs", - "systems/ds4/templates/sheets/item/components/sheet-header.hbs", + "systems/ds4/templates/sheets/item/components/effect-list-entry.hbs", + "systems/ds4/templates/sheets/item/components/effect-list-header.hbs", + "systems/ds4/templates/sheets/item/components/item-header.hbs", + "systems/ds4/templates/sheets/item/components/properties/armor.hbs", + "systems/ds4/templates/sheets/item/components/properties/equipable.hbs", + "systems/ds4/templates/sheets/item/components/properties/physical.hbs", + "systems/ds4/templates/sheets/item/components/properties/protective.hbs", + "systems/ds4/templates/sheets/item/components/properties/talent.hbs", + "systems/ds4/templates/sheets/item/components/properties/special-creature-ability.hbs", + "systems/ds4/templates/sheets/item/components/properties/spell.hbs", + "systems/ds4/templates/sheets/item/components/properties/weapon.hbs", "systems/ds4/templates/sheets/item/tabs/description.hbs", - "systems/ds4/templates/sheets/item/tabs/details.hbs", "systems/ds4/templates/sheets/item/tabs/effects.hbs", + "systems/ds4/templates/sheets/item/tabs/properties.hbs", + "systems/ds4/templates/sheets/shared/components/add-button.hbs", + "systems/ds4/templates/sheets/shared/components/control-button-group.hbs", + "systems/ds4/templates/sheets/shared/components/rollable-image.hbs", ]; await loadTemplates(templatePaths); } diff --git a/src/module/item/item-sheet.ts b/src/module/item/item-sheet.ts index 4c535c7a..77fac4af 100644 --- a/src/module/item/item-sheet.ts +++ b/src/module/item/item-sheet.ts @@ -8,6 +8,7 @@ import { DS4ActiveEffect } from "../active-effect"; import { DS4 } from "../config"; import { getGame } from "../helpers"; import notifications from "../ui/notifications"; +import { enforce } from "../utils"; import { isDS4ItemDataTypePhysical } from "./item-data-source"; /** @@ -17,11 +18,11 @@ export class DS4ItemSheet extends ItemSheet /** @override */ static get defaultOptions(): ItemSheet.Options { return foundry.utils.mergeObject(super.defaultOptions, { - width: 540, + classes: ["sheet", "ds4-item-sheet"], height: 400, - classes: ["ds4", "sheet", "item"], - tabs: [{ navSelector: ".sheet-tabs", contentSelector: ".sheet-body", initial: "description" }], - scrollY: [".tab.description", ".tab.effects", ".tab.details"], + scrollY: [".ds4-sheet-body"], + tabs: [{ navSelector: ".ds4-sheet-tab-nav", contentSelector: ".ds4-sheet-body", initial: "description" }], + width: 540, }); } @@ -61,46 +62,65 @@ export class DS4ItemSheet extends ItemSheet if (!this.options.editable) return; - html.find(".effect-control").on("click", this._onManageActiveEffect.bind(this)); + html.find(".control-effect").on("click", this.onControlEffect.bind(this)); } /** - * Handle management of ActiveEffects. - * @param event - he originating click event + * Handles a click on an element of this sheet to control an embedded effect of the item corresponding to this + * sheet. + * + * @param event - The originating click event */ - protected async _onManageActiveEffect(event: JQuery.ClickEvent): Promise { + protected onControlEffect(event: JQuery.ClickEvent): void { event.preventDefault(); - if (this.item.isOwned) { return notifications.warn(getGame().i18n.localize("DS4.WarningManageActiveEffectOnOwnedItem")); } const a = event.currentTarget; - const li = $(a).parents(".effect"); - switch (a.dataset["action"]) { case "create": - return this.createActiveEffect(); + return this.onCreateEffect(); case "edit": - const id = li.data("effectId"); - const effect = this.item.effects.get(id); - if (!effect) { - throw new Error( - getGame().i18n.format("DS4.ErrorItemDoesNotHaveEffect", { id, item: this.item.name }), - ); - } - return effect.sheet.render(true); - case "delete": { - return this.item.deleteEmbeddedDocuments("ActiveEffect", [li.data("effectId")]); - } + return this.onEditEffect(event); + case "delete": + return this.onDeleteEffect(event); } } /** - * Create a new ActiveEffect for the item using default data. + * Creates a new embedded effect. + * + * @param event - The originating click event */ - protected createActiveEffect(): void { + protected onCreateEffect(): void { DS4ActiveEffect.createDefault(this.item); } + + /** + * Opens the sheet of the embedded effect corresponding to the clicked element. + * + * @param event - The originating click event + */ + protected onEditEffect(event: JQuery.ClickEvent): void { + const id = $(event.currentTarget) + .parents(embeddedDocumentListEntryProperties.ActiveEffect.selector) + .data(embeddedDocumentListEntryProperties.ActiveEffect.idDataAttribute); + const effect = this.item.effects.get(id); + enforce(effect, getGame().i18n.format("DS4.ErrorItemDoesNotHaveEffect", { id, item: this.item.name })); + effect.sheet.render(true); + } + + /** + * Deletes the embedded item corresponding to the clicked element. + * + * @param event - The originating click event + */ + protected onDeleteEffect(event: JQuery.ClickEvent): void { + const li = $(event.currentTarget).parents(embeddedDocumentListEntryProperties.ActiveEffect.selector); + const id = li.data(embeddedDocumentListEntryProperties.ActiveEffect.idDataAttribute); + this.item.deleteEmbeddedDocuments("ActiveEffect", [id]); + li.slideUp(200, () => this.render(false)); + } } interface DS4ItemSheetData extends ItemSheet.Data { @@ -109,3 +129,13 @@ interface DS4ItemSheetData extends ItemSheet.Data { actor: DS4ItemSheet["item"]["actor"]; isPhysical: boolean; } + +/** + * This object contains information about specific properties embedded document list entries for each different type. + */ +const embeddedDocumentListEntryProperties = Object.freeze({ + ActiveEffect: { + selector: ".effect", + idDataAttribute: "effectId", + }, +}); diff --git a/src/scss/components/_apps.scss b/src/scss/components/_apps.scss deleted file mode 100644 index e041d326..00000000 --- a/src/scss/components/_apps.scss +++ /dev/null @@ -1,25 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * SPDX-FileCopyrightText: 2021 Gesina Schwalbe - * - * SPDX-License-Identifier: MIT - */ - -.window-content { - overflow-y: hidden; - padding: 5px; - - form { - height: 100%; - overflow: hidden; - } - - .sheet-body { - overflow-y: hidden; - } - .tab { - height: 100%; - overflow-y: auto; - align-content: flex-start; - } -} diff --git a/src/scss/components/_basic_property.scss b/src/scss/components/_basic_property.scss deleted file mode 100644 index 0ae6550c..00000000 --- a/src/scss/components/_basic_property.scss +++ /dev/null @@ -1,37 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * SPDX-FileCopyrightText: 2021 Oliver Rümpelein - * SPDX-FileCopyrightText: 2021 Gesina Schwalbe - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/mixins"; - -.basic-properties { - flex: 0 0 100%; - grid-gap: 2px; - grid-template-columns: repeat(auto-fill, minmax(9em, 1fr)); - .basic-property { - display: grid; - align-content: end; - padding-left: 1px; - padding-right: 1px; - - & > label { - font-size: 0.9em; - font-weight: bold; - } - - & > select { - display: block; - width: 100%; - } - - .input-divider { - text-align: center; - } - - @include mixins.mark-invalid-or-disabled-input; - } -} diff --git a/src/scss/components/_description.scss b/src/scss/components/_description.scss deleted file mode 100644 index 78a2c4bc..00000000 --- a/src/scss/components/_description.scss +++ /dev/null @@ -1,84 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * SPDX-FileCopyrightText: 2021 Oliver Rümpelein - * SPDX-FileCopyrightText: 2021 Gesina Schwalbe - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/mixins"; -@use "../utils/variables"; - -.side-properties { - flex: 0; - min-width: fit-content; - max-width: 50%; - margin: 5px 5px 5px 0; - padding-right: 5px; - border-right: variables.$border-groove; - - .side-property { - margin: 2px 0; - display: grid; - grid-template-columns: minmax(40%, max-content) 1fr; - justify-content: left; - - label { - line-height: variables.$default-input-height; - font-weight: bold; - padding-right: 3pt; - } - - input, - select, - a { - text-align: left; - width: calc(100% - 2px); - overflow: hidden; - text-overflow: ellipsis; - } - span { - line-height: variables.$default-input-height; - padding: 0 4px; - } - - @include mixins.mark-invalid-or-disabled-input; - - input[type="checkbox"] { - width: auto; - height: 100%; - margin: 0px; - } - - .unit-data-pair { - display: flex; - flex-direction: row; - select { - width: 4em; - } - input { - max-width: 7em; - } - } - } -} - -.description { - height: 100%; -} - -.sheet-body .tab .editor { - height: 100%; -} - -.tox { - .tox-edit-area { - padding: 0 8px; - } - .tox-toolbar-overlord { - background-color: transparent; - .tox-toolbar__primary { - background: transparent; - } - } -} diff --git a/src/scss/components/_forms.scss b/src/scss/components/_forms.scss deleted file mode 100644 index c4e437ff..00000000 --- a/src/scss/components/_forms.scss +++ /dev/null @@ -1,72 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/colors"; -@use "../utils/typography"; -@use "../utils/variables"; - -.item-form { - font-family: typography.$font-primary; -} - -header.sheet-header { - flex: 0 0 auto; - overflow: hidden; - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: flex-start; - align-items: flex-start; - - .profile-img { - flex: 0 0 100px; - height: 100px; - margin: variables.$margin-sm 10px variables.$margin-sm 0; - border: none; - } - - .header-fields { - flex: 1; - } - - h1.charname { - height: 50px; - padding: 0px; - margin: variables.$margin-sm 10px variables.$margin-sm 0; - border-bottom: 0; - @include typography.font-heading-upper; - display: block; - input { - width: 100%; - height: 100%; - margin: 0; - border: none; - background-color: transparent; - @include typography.font-heading-upper; - } - } - h2.item-type { - @include typography.font-heading-upper; - display: block; - height: 50px; - padding: 0px; - flex: 0 0 auto; - color: colors.$c-light-grey; - border: none; - line-height: 50px; - margin: variables.$margin-sm 0; - text-align: right; - } -} - -.sheet-tabs { - flex: 0; -} - -.sheet-body, -.sheet-body .tab { - height: 100%; -} diff --git a/src/scss/components/_sheet_tab_nav.scss b/src/scss/components/_sheet_tab_nav.scss deleted file mode 100644 index ed8bcdba..00000000 --- a/src/scss/components/_sheet_tab_nav.scss +++ /dev/null @@ -1,18 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/variables"; - -.ds4-sheet-tab-nav { - border-bottom: variables.$border-groove; - border-top: variables.$border-groove; - height: auto; - - &__item { - font-weight: bold; - white-space: nowrap; - } -} diff --git a/src/scss/components/_actor_header.scss b/src/scss/components/actor/_actor_header.scss similarity index 88% rename from src/scss/components/_actor_header.scss rename to src/scss/components/actor/_actor_header.scss index a9828e1d..075fc3ed 100644 --- a/src/scss/components/_actor_header.scss +++ b/src/scss/components/actor/_actor_header.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/typography"; +@use "../../utils/mixins"; .ds4-actor-header { display: flex; @@ -42,8 +42,8 @@ margin: 0; } - &__name-input { - @include typography.font-heading-upper; + &__name-input[type="text"] { + @include mixins.font-heading-upper; background-color: transparent; border: none; flex: 1; diff --git a/src/scss/components/_actor_progression.scss b/src/scss/components/actor/_actor_progression.scss similarity index 85% rename from src/scss/components/_actor_progression.scss rename to src/scss/components/actor/_actor_progression.scss index 3d5679fd..09a3a185 100644 --- a/src/scss/components/_actor_progression.scss +++ b/src/scss/components/actor/_actor_progression.scss @@ -5,10 +5,9 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/colors"; -@use "../utils/typography"; -@use "../utils/variables"; -@use "../utils/mixins"; +@use "../../utils/colors"; +@use "../../utils/mixins"; +@use "../../utils/variables"; .ds4-actor-progression { @include mixins.mark-invalid-or-disabled-input; @@ -24,7 +23,7 @@ } &__label { - @include typography.font-heading-upper; + @include mixins.font-heading-upper; border: none; color: colors.$c-light-grey; margin: 0; diff --git a/src/scss/components/_actor_properties.scss b/src/scss/components/actor/_actor_properties.scss similarity index 85% rename from src/scss/components/_actor_properties.scss rename to src/scss/components/actor/_actor_properties.scss index 0f735047..36e473f6 100644 --- a/src/scss/components/_actor_properties.scss +++ b/src/scss/components/actor/_actor_properties.scss @@ -6,8 +6,8 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/mixins"; -@use "../utils/variables"; +@use "../../utils/mixins"; +@use "../../utils/variables"; .ds4-actor-properties { @include mixins.mark-invalid-or-disabled-input; @@ -26,7 +26,7 @@ &__property-select { width: 100%; - height: variables.$default-input-height; + height: var(--form-field-height); } &__property-multi-input { diff --git a/src/scss/components/_actor_sheet.scss b/src/scss/components/actor/_actor_sheet.scss similarity index 73% rename from src/scss/components/_actor_sheet.scss rename to src/scss/components/actor/_actor_sheet.scss index f68678c6..a49d1934 100644 --- a/src/scss/components/_actor_sheet.scss +++ b/src/scss/components/actor/_actor_sheet.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -.ds4.sheet.actor { +.ds4-actor-sheet { + min-height: 625px; min-width: 650px; - min-height: 620px; } diff --git a/src/scss/tabs/_biography.scss b/src/scss/components/actor/_biography.scss similarity index 100% rename from src/scss/tabs/_biography.scss rename to src/scss/components/actor/_biography.scss diff --git a/src/scss/components/_check.scss b/src/scss/components/actor/_check.scss similarity index 90% rename from src/scss/components/_check.scss rename to src/scss/components/actor/_check.scss index d9cd0d0d..ade5164f 100644 --- a/src/scss/components/_check.scss +++ b/src/scss/components/actor/_check.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/mixins"; +@use "../../utils/mixins"; .ds4-check { cursor: pointer; diff --git a/src/scss/components/_checks.scss b/src/scss/components/actor/_checks.scss similarity index 100% rename from src/scss/components/_checks.scss rename to src/scss/components/actor/_checks.scss diff --git a/src/scss/components/_combat_value.scss b/src/scss/components/actor/_combat_value.scss similarity index 93% rename from src/scss/components/_combat_value.scss rename to src/scss/components/actor/_combat_value.scss index 326d0f6e..40e30685 100644 --- a/src/scss/components/_combat_value.scss +++ b/src/scss/components/actor/_combat_value.scss @@ -4,9 +4,8 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/mixins"; -@use "../utils/variables"; -@use "../utils/typography"; +@use "../../utils/mixins"; +@use "../../utils/variables"; .ds4-combat-value { $size: 3.75rem; @@ -53,7 +52,7 @@ } &__label { - @include typography.font-heading-upper; + @include mixins.font-heading-upper; font-size: 1.2em; white-space: nowrap; } diff --git a/src/scss/components/_combat_values.scss b/src/scss/components/actor/_combat_values.scss similarity index 90% rename from src/scss/components/_combat_values.scss rename to src/scss/components/actor/_combat_values.scss index 66e540c6..71512390 100644 --- a/src/scss/components/_combat_values.scss +++ b/src/scss/components/actor/_combat_values.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/variables"; +@use "../../utils/variables"; .ds4-combat-values { border-bottom: variables.$border-groove; diff --git a/src/scss/components/_core_value.scss b/src/scss/components/actor/_core_value.scss similarity index 83% rename from src/scss/components/_core_value.scss rename to src/scss/components/actor/_core_value.scss index bc7aa7e0..4397a348 100644 --- a/src/scss/components/_core_value.scss +++ b/src/scss/components/actor/_core_value.scss @@ -4,16 +4,16 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/colors"; -@use "../utils/typography"; -@use "../utils/variables"; +@use "../../utils/colors"; +@use "../../utils/mixins"; +@use "../../utils/variables"; .ds4-core-value { align-items: center; display: flex; &__label { - @include typography.font-heading-upper; + @include mixins.font-heading-upper; flex: 1; font-size: 2em; text-align: center; diff --git a/src/scss/components/_core_values.scss b/src/scss/components/actor/_core_values.scss similarity index 73% rename from src/scss/components/_core_values.scss rename to src/scss/components/actor/_core_values.scss index 739ebe08..13bda985 100644 --- a/src/scss/components/_core_values.scss +++ b/src/scss/components/actor/_core_values.scss @@ -4,9 +4,8 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/colors"; -@use "../utils/typography"; -@use "../utils/variables"; +@use "../../utils/colors"; +@use "../../utils/variables"; .ds4-core-values { column-gap: 0.5em; diff --git a/src/scss/components/_currency.scss b/src/scss/components/actor/_currency.scss similarity index 92% rename from src/scss/components/_currency.scss rename to src/scss/components/actor/_currency.scss index d773dc48..29dc5193 100644 --- a/src/scss/components/_currency.scss +++ b/src/scss/components/actor/_currency.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/variables"; +@use "../../utils/variables"; .ds4-currency { align-items: center; diff --git a/src/scss/components/_profile.scss b/src/scss/components/actor/_profile.scss similarity index 100% rename from src/scss/components/_profile.scss rename to src/scss/components/actor/_profile.scss diff --git a/src/scss/components/_talent_rank_equation.scss b/src/scss/components/actor/_talent_rank_equation.scss similarity index 54% rename from src/scss/components/_talent_rank_equation.scss rename to src/scss/components/actor/_talent_rank_equation.scss index aeb70f16..5bf13a42 100644 --- a/src/scss/components/_talent_rank_equation.scss +++ b/src/scss/components/actor/_talent_rank_equation.scss @@ -10,10 +10,12 @@ gap: 0.5em; &__value { - background-color: transparent; - border: 0; - height: auto; - padding: 0; - text-align: center; + &[type="number"] { + background-color: transparent; + border: 0; + height: auto; + padding: 0; + text-align: center; + } } } diff --git a/src/scss/components/_dice_total.scss b/src/scss/components/dice/_dice_total.scss similarity index 95% rename from src/scss/components/_dice_total.scss rename to src/scss/components/dice/_dice_total.scss index 31bc6841..2df67ba1 100644 --- a/src/scss/components/_dice_total.scss +++ b/src/scss/components/dice/_dice_total.scss @@ -4,7 +4,7 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/colors"; +@use "../../utils/colors"; // Needs to be nested in .dice-roll to win against foundry's style.css with respect to specificity .dice-roll .ds4-dice-total { diff --git a/src/scss/components/item/_item_header.scss b/src/scss/components/item/_item_header.scss new file mode 100644 index 00000000..bb8ded17 --- /dev/null +++ b/src/scss/components/item/_item_header.scss @@ -0,0 +1,51 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +@use "../../utils/colors"; +@use "../../utils/mixins"; + +.ds4-item-header { + align-items: center; + display: flex; + gap: 1em; + + &__img { + border: none; + cursor: pointer; + height: 100px; + width: 100px; + } + + &__data { + flex: 1; + } + + &__type { + @include mixins.font-heading-upper; + border: none; + color: colors.$c-light-grey; + margin-bottom: 0; + } + + &__name { + border: none; + margin: 0; + } + + &__name-label { + display: none; + } + + &__name-input[type="text"] { + @include mixins.font-heading-upper; + background-color: transparent; + border: none; + font-size: 1.25em; + height: auto; + padding-left: 0; + padding-right: 0; + } +} diff --git a/src/scss/components/item/_item_properties.scss b/src/scss/components/item/_item_properties.scss new file mode 100644 index 00000000..a62fa2b9 --- /dev/null +++ b/src/scss/components/item/_item_properties.scss @@ -0,0 +1,21 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * SPDX-FileCopyrightText: 2021 Gesina Schwalbe + * + * SPDX-License-Identifier: MIT + */ + +@use "../../utils/mixins"; +@use "../../utils/variables"; + +.ds4-item-properties { + @include mixins.mark-invalid-or-disabled-input; + + &__title { + border-bottom: variables.$border-groove; + font-weight: bold; + margin-bottom: 0; + margin-top: 1em; + padding-left: 1em; + } +} diff --git a/src/scss/components/item/_item_sheet.scss b/src/scss/components/item/_item_sheet.scss new file mode 100644 index 00000000..9048fe80 --- /dev/null +++ b/src/scss/components/item/_item_sheet.scss @@ -0,0 +1,10 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +.ds4-item-sheet { + min-height: 400px; + min-width: 540px; +} diff --git a/src/scss/components/_control_button_group.scss b/src/scss/components/shared/_control_button_group.scss similarity index 100% rename from src/scss/components/_control_button_group.scss rename to src/scss/components/shared/_control_button_group.scss diff --git a/src/scss/components/shared/_editor.scss b/src/scss/components/shared/_editor.scss new file mode 100644 index 00000000..1d5ac59d --- /dev/null +++ b/src/scss/components/shared/_editor.scss @@ -0,0 +1,18 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +.ds4-sheet-form { + .editor { + height: 100%; + + .tox { + .tox-toolbar-overlord, + .tox-toolbar__primary { + background: transparent; + } + } + } +} diff --git a/src/scss/components/_embedded_document_list.scss b/src/scss/components/shared/_embedded_document_list.scss similarity index 87% rename from src/scss/components/_embedded_document_list.scss rename to src/scss/components/shared/_embedded_document_list.scss index 0a2d266a..ca4eff88 100644 --- a/src/scss/components/_embedded_document_list.scss +++ b/src/scss/components/shared/_embedded_document_list.scss @@ -5,8 +5,8 @@ * SPDX-License-Identifier: MIT */ -@use "../utils/mixins"; -@use "../utils/variables"; +@use "../../utils/mixins"; +@use "../../utils/variables"; .ds4-embedded-document-list { @include mixins.mark-invalid-or-disabled-input; @@ -17,9 +17,9 @@ display: grid; grid-column-gap: 0.5em; grid-row-gap: 0.2em; - margin: 0.5em 0; + margin: 0; overflow-y: auto; - padding: 0; + padding: 0.5em 0; &--weapon { grid-template-columns: $row-height $row-height 3ch 3fr $row-height 1fr 3ch 5fr 5ch; @@ -85,6 +85,10 @@ } } + &--item-effect { + grid-template-columns: $row-height 1fr 5ch; + } + &__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` @@ -96,7 +100,6 @@ height: $row-height; line-height: $row-height; white-space: nowrap; - overflow: hidden; text-overflow: ellipsis; } } @@ -106,14 +109,19 @@ } &__editable { - background-color: transparent; - border: 0; - padding: 0; + &[type="text"], + &[type="number"] { + background-color: transparent; + border: 0; + padding: 0; + } &--checkbox { - width: 100%; - height: 100%; - margin: 0px; + &[type="checkbox"] { + width: 100%; + height: 100%; + margin: 0px; + } } } diff --git a/src/scss/components/_rollable_image.scss b/src/scss/components/shared/_rollable_image.scss similarity index 100% rename from src/scss/components/_rollable_image.scss rename to src/scss/components/shared/_rollable_image.scss diff --git a/src/scss/components/shared/_sheet_body.scss b/src/scss/components/shared/_sheet_body.scss new file mode 100644 index 00000000..6a718c2c --- /dev/null +++ b/src/scss/components/shared/_sheet_body.scss @@ -0,0 +1,10 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +.ds4-sheet-body { + height: 100%; + overflow-y: auto; +} diff --git a/src/scss/components/_sheet.scss b/src/scss/components/shared/_sheet_form.scss similarity index 67% rename from src/scss/components/_sheet.scss rename to src/scss/components/shared/_sheet_form.scss index 2308aef2..7c6165ec 100644 --- a/src/scss/components/_sheet.scss +++ b/src/scss/components/shared/_sheet_form.scss @@ -4,8 +4,10 @@ * SPDX-License-Identifier: MIT */ -.ds4-sheet { +.ds4-sheet-form { display: flex; flex-direction: column; flex-wrap: nowrap; + font-family: var(--ds4-font-primary); + height: 100%; } diff --git a/src/scss/components/shared/_sheet_tab.scss b/src/scss/components/shared/_sheet_tab.scss new file mode 100644 index 00000000..ae1b3d32 --- /dev/null +++ b/src/scss/components/shared/_sheet_tab.scss @@ -0,0 +1,19 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +.ds4-sheet-tab { + flex-direction: column; + flex-wrap: nowrap; + height: 100%; + + &[data-tab].active { + display: flex; + } + + > * { + flex-shrink: 0; + } +} diff --git a/src/scss/components/shared/_sheet_tab_nav.scss b/src/scss/components/shared/_sheet_tab_nav.scss new file mode 100644 index 00000000..78097981 --- /dev/null +++ b/src/scss/components/shared/_sheet_tab_nav.scss @@ -0,0 +1,27 @@ +/* + * SPDX-FileCopyrightText: 2021 Johannes Loher + * + * SPDX-License-Identifier: MIT + */ + +@use "../../utils/variables"; + +.ds4-sheet-tab-nav { + border-bottom: variables.$border-groove; + border-top: variables.$border-groove; + display: flex; + flex-wrap: nowrap; + height: calc(2 * var(--line-height-16)); + justify-content: space-around; + line-height: calc(2 * var(--line-height-16)); + margin: variables.$margin-sm 0; + + &__item { + font-weight: bold; + white-space: nowrap; + + &.active { + text-shadow: 0 0 variables.$padding-md var(--color-shadow-primary); + } + } +} diff --git a/src/scss/ds4.scss b/src/scss/ds4.scss index 59325e00..24a1b8a5 100644 --- a/src/scss/ds4.scss +++ b/src/scss/ds4.scss @@ -6,40 +6,40 @@ * SPDX-License-Identifier: MIT */ -@use "sass:meta"; +// global +@use "global/accessibility"; +@use "global/fonts"; -/* Global styles */ -@include meta.load-css("global/accessibility"); -@include meta.load-css("global/flex"); -@include meta.load-css("global/fonts"); -@include meta.load-css("global/grid"); -@include meta.load-css("global/window"); +// shared +@use "components/shared/control_button_group"; +@use "components/shared/editor"; +@use "components/shared/embedded_document_list"; +@use "components/shared/rollable_image"; +@use "components/shared/sheet_body"; +@use "components/shared/sheet_form"; +@use "components/shared/sheet_tab_nav"; +@use "components/shared/sheet_tab"; -@include meta.load-css("components/actor_sheet"); -@include meta.load-css("components/dice_total"); +// actor +@use "components/actor/actor_header"; +@use "components/actor/actor_progression"; +@use "components/actor/actor_properties"; +@use "components/actor/actor_sheet"; +@use "components/actor/biography"; +@use "components/actor/check"; +@use "components/actor/checks"; +@use "components/actor/combat_value"; +@use "components/actor/combat_values"; +@use "components/actor/core_value"; +@use "components/actor/core_values"; +@use "components/actor/currency"; +@use "components/actor/profile"; +@use "components/actor/talent_rank_equation"; -/* Styles limited to ds4 sheets */ -.ds4 { - @include meta.load-css("components/actor_header"); - @include meta.load-css("components/actor_progression"); - @include meta.load-css("components/actor_properties"); - @include meta.load-css("components/apps"); - @include meta.load-css("components/basic_property"); - @include meta.load-css("components/check"); - @include meta.load-css("components/checks"); - @include meta.load-css("components/combat_value"); - @include meta.load-css("components/combat_values"); - @include meta.load-css("components/control_button_group"); - @include meta.load-css("components/core_value"); - @include meta.load-css("components/core_values"); - @include meta.load-css("components/currency"); - @include meta.load-css("components/description"); - @include meta.load-css("components/embedded_document_list"); - @include meta.load-css("components/forms"); - @include meta.load-css("components/profile"); - @include meta.load-css("components/rollable_image"); - @include meta.load-css("components/sheet_tab_nav"); - @include meta.load-css("components/sheet"); - @include meta.load-css("components/talent_rank_equation"); - @include meta.load-css("tabs/biography"); -} +// item +@use "components/item/item_header"; +@use "components/item/item_properties"; +@use "components/item/item_sheet"; + +// dice +@use "components/dice/dice_total"; diff --git a/src/scss/global/_accessibility.scss b/src/scss/global/_accessibility.scss index e464b165..cb2172cc 100644 --- a/src/scss/global/_accessibility.scss +++ b/src/scss/global/_accessibility.scss @@ -5,6 +5,6 @@ * SPDX-License-Identifier: MIT */ -.hidden { +.ds4-hidden { display: none; } diff --git a/src/scss/global/_flex.scss b/src/scss/global/_flex.scss deleted file mode 100644 index 891c83bc..00000000 --- a/src/scss/global/_flex.scss +++ /dev/null @@ -1,93 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * SPDX-FileCopyrightText: 2021 Gesina Schwalbe - * - * SPDX-License-Identifier: MIT - */ - -/* ----------------------------------------- */ -/* Flexbox */ -/* ----------------------------------------- */ - -.flexrow { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: flex-start; - - > * { - flex: 1; - } - - .flex05 { - flex: 0.5; - } - .flex1 { - flex: 1; - } - .flex125 { - flex: 1.25; - } - .flex15 { - flex: 1.5; - } - .flex2 { - flex: 2; - } - .flex3 { - flex: 3; - } - .flex4 { - flex: 4; - } -} - -.flexnowrap { - flex-wrap: nowrap; -} - -.flexcol { - display: flex; - flex-direction: column; - flex-wrap: nowrap; - - > * { - flex: 1; - } - - .flex05 { - flex: 0.5; - } - .flex1 { - flex: 1; - } - .flex125 { - flex: 1.25; - } - .flex15 { - flex: 1.5; - } - .flex2 { - flex: 2; - } - .flex3 { - flex: 3; - } - .flex4 { - flex: 4; - } -} - -.flex-center { - align-items: center; - justify-content: center; - text-align: center; -} - -.flex-between { - justify-content: space-between; -} - -.flex-around { - justify-content: space-around; -} diff --git a/src/scss/global/_fonts.scss b/src/scss/global/_fonts.scss index c837506c..d864335d 100644 --- a/src/scss/global/_fonts.scss +++ b/src/scss/global/_fonts.scss @@ -43,3 +43,8 @@ font-weight: normal; src: local("Wood Stamp"), url("../fonts/Woodstamp/Woodstamp.woff") format("woff"); } + +:root { + --ds4-font-primary: Lora, serif; + --ds4-font-heading: "Wood Stamp", sans-serif; +} diff --git a/src/scss/global/_grid.scss b/src/scss/global/_grid.scss deleted file mode 100644 index ef735cac..00000000 --- a/src/scss/global/_grid.scss +++ /dev/null @@ -1,89 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * - * SPDX-License-Identifier: MIT - */ - -.grid, -.grid-2col { - display: grid; - grid-column: span 2 / span 2; - grid-template-columns: repeat(2, minmax(0, 1fr)); - gap: 10px; - padding: 0; -} - -.grid-1col { - grid-column: span 1 / span 1; - grid-template-columns: repeat(1, minmax(0, 1fr)); -} - -.grid-3col { - grid-column: span 3 / span 3; - grid-template-columns: repeat(3, minmax(0, 1fr)); -} - -.grid-4col { - grid-column: span 4 / span 4; - grid-template-columns: repeat(4, minmax(0, 1fr)); -} - -.grid-5col { - grid-column: span 5 / span 5; - grid-template-columns: repeat(5, minmax(0, 1fr)); -} - -.grid-6col { - grid-column: span 6 / span 6; - grid-template-columns: repeat(6, minmax(0, 1fr)); -} - -.grid-7col { - grid-column: span 7 / span 7; - grid-template-columns: repeat(7, minmax(0, 1fr)); -} - -.grid-8col { - grid-column: span 8 / span 8; - grid-template-columns: repeat(8, minmax(0, 1fr)); -} - -.grid-9col { - grid-column: span 9 / span 9; - grid-template-columns: repeat(9, minmax(0, 1fr)); -} - -.grid-10col { - grid-column: span 10 / span 10; - grid-template-columns: repeat(10, minmax(0, 1fr)); -} - -.grid-11col { - grid-column: span 11 / span 11; - grid-template-columns: repeat(11, minmax(0, 1fr)); -} - -.grid-12col { - grid-column: span 12 / span 12; - grid-template-columns: repeat(12, minmax(0, 1fr)); -} - -.flex-group-center, -.flex-group-left, -.flex-group-right { - justify-content: center; - align-items: center; - text-align: center; - padding: 5px; - border: 1px solid #999; -} - -.flex-group-left { - justify-content: flex-start; - text-align: left; -} - -.flex-group-right { - justify-content: flex-end; - text-align: right; -} diff --git a/src/scss/global/_window.scss b/src/scss/global/_window.scss deleted file mode 100644 index 8893cd54..00000000 --- a/src/scss/global/_window.scss +++ /dev/null @@ -1,18 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * - * SPDX-License-Identifier: MIT - */ - -@use "../utils/typography"; - -.window-app { - font-family: typography.$font-primary; - input[type="text"], - input[type="number"], - input[type="password"], - input[type="date"], - input[type="time"] { - width: 100%; - } -} diff --git a/src/scss/utils/_mixins.scss b/src/scss/utils/_mixins.scss index d78942e9..369d35b7 100644 --- a/src/scss/utils/_mixins.scss +++ b/src/scss/utils/_mixins.scss @@ -7,23 +7,6 @@ @use "./colors"; -@mixin element-invisible { - position: absolute; - - width: 1px; - height: 1px; - margin: -1px; - border: 0; - padding: 0; - - clip: rect(0 0 0 0); - overflow: hidden; -} - -@mixin hide { - display: none; -} - @mixin centered-content { display: grid; place-items: center; @@ -39,5 +22,10 @@ } @mixin foundry-highlight-text-shadow { - text-shadow: 0 0 10px red; + text-shadow: 0 0 10px var(--color-shadow-primary); +} + +@mixin font-heading-upper { + font-family: var(--ds4-font-heading); + text-transform: uppercase; } diff --git a/src/scss/utils/_typography.scss b/src/scss/utils/_typography.scss deleted file mode 100644 index 0ffd53de..00000000 --- a/src/scss/utils/_typography.scss +++ /dev/null @@ -1,14 +0,0 @@ -/* - * SPDX-FileCopyrightText: 2021 Johannes Loher - * - * SPDX-License-Identifier: MIT - */ - -$font-primary: "Lora", serif; -$font-secondary: "Lora", serif; -$font-heading: "Wood Stamp", sans-serif; - -@mixin font-heading-upper { - font-family: $font-heading; - text-transform: uppercase; -} diff --git a/src/scss/utils/_variables.scss b/src/scss/utils/_variables.scss index c32eb8a6..9909c4ed 100644 --- a/src/scss/utils/_variables.scss +++ b/src/scss/utils/_variables.scss @@ -13,8 +13,6 @@ $margin-sm: $padding-sm; $margin-md: $padding-md; $margin-lg: $padding-lg; -$default-input-height: 26px; - $official-icons-path: "../assets/icons/official"; $border-groove: 2px groove colors.$c-border-groove; diff --git a/src/templates/dialogs/roll-options.hbs b/src/templates/dialogs/roll-options.hbs index 11e25295..57f76556 100644 --- a/src/templates/dialogs/roll-options.hbs +++ b/src/templates/dialogs/roll-options.hbs @@ -16,27 +16,27 @@ SPDX-License-Identifier: MIT
-
- +
-
-
- {{#select rollMode}} {{#each rollModes as |rollModeValue rollModeKey|}} diff --git a/src/templates/sheets/actor/character-sheet.hbs b/src/templates/sheets/actor/character-sheet.hbs index 70455a92..556b4c1e 100644 --- a/src/templates/sheets/actor/character-sheet.hbs +++ b/src/templates/sheets/actor/character-sheet.hbs @@ -6,26 +6,26 @@ SPDX-FileCopyrightText: 2021 Gesina Schwalbe SPDX-License-Identifier: MIT --}} - + {{!-- Header --}} {{#> systems/ds4/templates/sheets/actor/components/actor-header.hbs}} {{> systems/ds4/templates/sheets/actor/components/character-properties.hbs}} {{/systems/ds4/templates/sheets/actor/components/actor-header.hbs}} {{!-- Sheet Tab Navigation --}} -