diff --git a/AGENTS.md b/AGENTS.md index 71b2ba3..3e52212 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -2,5 +2,7 @@ - AYN Thor main display: 6-inch AMOLED, 1920 x 1080, 120Hz. - AYN Thor secondary display: 3.92-inch AMOLED, 1240 x 1080, 60Hz. +- AYN Thor UI sizing must be designed against Android CSS/layout viewport, not physical framebuffer pixels. +- Approximate Thor CSS viewports: main display 960 x 540, secondary display 620 x 540. - User rebuilds app; do not rebuild APK unless explicitly requested. - Apply game changes to both web version and mobile app version. diff --git a/IWantToHeal-Thor-v1.0.27.apk b/IWantToHeal-Thor-v1.0.27.apk index 64547e5..348768a 100644 Binary files a/IWantToHeal-Thor-v1.0.27.apk and b/IWantToHeal-Thor-v1.0.27.apk differ diff --git a/android/app/build.gradle b/android/app/build.gradle index 72e84cc..6659890 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -7,8 +7,8 @@ android { applicationId "com.warren.iwanttoheal" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion - versionCode 44 - versionName "1.0.26" + versionCode 45 + versionName "1.0.27" testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner" aaptOptions { // Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps. diff --git a/db/seed.sql b/db/seed.sql index a654f52..a1505a2 100644 --- a/db/seed.sql +++ b/db/seed.sql @@ -479,9 +479,7 @@ WHERE id BETWEEN 901 AND 1409; UPDATE items SET rarity = CASE item_level WHEN 1 THEN 'common' - WHEN 5 THEN 'common' WHEN 10 THEN 'uncommon' - WHEN 15 THEN 'rare' WHEN 20 THEN 'epic' WHEN 25 THEN 'legendary' ELSE rarity @@ -493,9 +491,7 @@ SET name = ( SELECT CASE items.item_level WHEN 1 THEN 'Raw ' - WHEN 5 THEN 'Honed ' WHEN 10 THEN 'Green ' - WHEN 15 THEN 'Blue ' WHEN 20 THEN 'Purple ' WHEN 25 THEN 'Orange ' ELSE '' @@ -1276,12 +1272,23 @@ SET difficulty_id = CASE END WHERE id BETWEEN 901 AND 1409; +DELETE FROM crafting_recipe_components +WHERE recipe_id IN ( + SELECT crafting_recipes.id + FROM crafting_recipes + JOIN items ON items.id = crafting_recipes.item_id + WHERE items.item_level NOT IN (1, 10, 20, 25) +); + +DELETE FROM crafting_recipes +WHERE item_id IN ( + SELECT id FROM items WHERE item_level NOT IN (1, 10, 20, 25) +); + UPDATE items SET rarity = CASE item_level WHEN 1 THEN 'common' - WHEN 5 THEN 'common' WHEN 10 THEN 'uncommon' - WHEN 15 THEN 'rare' WHEN 20 THEN 'epic' WHEN 25 THEN 'legendary' ELSE rarity @@ -1293,9 +1300,7 @@ SET name = ( SELECT CASE items.item_level WHEN 1 THEN 'Raw ' - WHEN 5 THEN 'Honed ' WHEN 10 THEN 'Green ' - WHEN 15 THEN 'Blue ' WHEN 20 THEN 'Purple ' WHEN 25 THEN 'Orange ' ELSE '' diff --git a/src/App.css b/src/App.css index 7b93702..9b69028 100644 --- a/src/App.css +++ b/src/App.css @@ -1053,9 +1053,14 @@ textarea:focus-visible, } .game-shell.dungeon-shell { + padding: 0; width: min(1400px, calc(100% - 28px)); } +.game-shell.dungeon-shell > .app-header { + display: none; +} + .auth-shell { align-items: center; display: flex; @@ -1374,6 +1379,7 @@ h2 { .dungeon-run-screen { gap: 14px; + margin-top: 0; } .menu-screen { @@ -1995,18 +2001,17 @@ h2 { @media (max-height: 1100px) { .game-shell.dungeon-shell { - padding: 8px 0; + padding: 0; } .dungeon-shell .app-header { - min-height: 58px; - padding: 9px 14px; + display: none; } .dungeon-run-screen { - gap: 10px; - margin-top: 10px; - padding: 16px; + gap: 8px; + margin-top: 0; + padding: 10px; } .dungeon-run-screen .screen-heading { @@ -2035,16 +2040,16 @@ h2 { } .dungeon-focus-card { - grid-template-columns: 84px minmax(0, 1fr); - min-height: 132px; + grid-template-columns: 64px minmax(0, 1fr); + min-height: 92px; } .dungeon-focus-card > .dungeon-art { - height: 84px; + height: 64px; } .dungeon-focus-card .run-summary-copy p:not(.eyebrow) { - font-size: 16px; + font-size: 14px; line-height: 1.05; } @@ -2066,14 +2071,14 @@ h2 { .dungeon-choice-grid .activity-card { gap: 5px 9px; - grid-template-columns: 54px minmax(0, 1fr); - min-height: 82px; - padding: 8px; + grid-template-columns: 46px minmax(0, 1fr); + min-height: 66px; + padding: 6px; } .dungeon-choice-grid .activity-card .dungeon-art { - height: 50px; - width: 50px; + height: 42px; + width: 42px; } .dungeon-choice-grid .activity-card strong, @@ -2089,8 +2094,8 @@ h2 { } .tier-setup-panel .tier-grid button { - min-height: 48px; - padding: 7px; + min-height: 40px; + padding: 5px 7px; } .part-setup-panel .part-picker { @@ -2099,8 +2104,8 @@ h2 { .part-setup-panel .primary-button { font-size: 8px; - min-height: 44px; - padding: 7px 8px; + min-height: 38px; + padding: 5px 8px; } .dungeon-setup-rail .difficulty-summary { @@ -2130,7 +2135,42 @@ h2 { } .dungeon-setup-rail .loot-preview-grid { - max-height: 210px; + max-height: 160px; + } +} + +@media (max-height: 760px) { + .dungeon-run-screen .screen-heading { + align-items: center; + padding-bottom: 6px; + } + + .dungeon-run-screen .screen-heading .eyebrow, + .dungeon-focus-card .run-summary-copy > p:not(.eyebrow), + .dungeon-setup-rail .run-setup-heading small { + display: none; + } + + .dungeon-focus-card { + grid-template-columns: 52px minmax(0, 1fr); + min-height: 68px; + } + + .dungeon-focus-card > .dungeon-art { + height: 52px; + } + + .dungeon-run-screen .run-setup-panel, + .dungeon-run-screen .run-summary-card, + .dungeon-run-screen .difficulty-section, + .dungeon-run-screen .loot-preview-section, + .dungeon-run-screen .leaderboard-section { + padding: 7px; + } + + .dungeon-setup-rail .difficulty-summary small, + .dungeon-run-screen .tag-row { + display: none; } } @@ -2146,6 +2186,634 @@ h2 { } } +@media (max-height: 620px) { + .game-shell.dungeon-shell { + width: 100%; + } + + .dungeon-run-screen { + gap: 5px; + padding: 6px; + } + + .dungeon-run-screen .screen-heading { + padding-bottom: 4px; + } + + .dungeon-run-screen .screen-heading h1 { + font-size: 13px; + line-height: 1.15; + } + + .dungeon-run-screen .back-button { + font-size: 14px; + min-height: 34px; + padding: 5px 8px; + } + + .dungeon-run-board, + .dungeon-run-main, + .dungeon-setup-rail { + gap: 5px; + } + + .dungeon-run-board { + grid-template-columns: minmax(0, 1fr) minmax(214px, 0.45fr); + } + + .dungeon-run-screen .run-setup-panel, + .dungeon-run-screen .run-summary-card, + .dungeon-run-screen .difficulty-section, + .dungeon-run-screen .loot-preview-section, + .dungeon-run-screen .leaderboard-section { + padding: 5px; + } + + .dungeon-focus-card { + gap: 7px; + grid-template-columns: 42px minmax(0, 1fr); + min-height: 52px; + } + + .dungeon-focus-card > .dungeon-art { + font-size: 11px; + height: 42px; + } + + .dungeon-run-screen .run-setup-heading h2, + .dungeon-focus-card .run-summary-copy h2, + .dungeon-setup-rail .equipment-heading h2 { + font-size: 9px; + line-height: 1.2; + } + + .dungeon-run-screen .eyebrow, + .dungeon-run-screen .tier-grid strong, + .dungeon-choice-grid .activity-card strong, + .dungeon-setup-rail .difficulty-summary strong { + font-size: 6px; + line-height: 1.2; + margin-bottom: 2px; + } + + .dungeon-choice-grid, + .dungeon-run-screen .tier-grid { + gap: 5px; + margin-top: 5px; + } + + .dungeon-choice-grid { + grid-auto-rows: minmax(52px, max-content); + } + + .dungeon-choice-grid .activity-card { + gap: 4px 6px; + grid-template-columns: 34px minmax(0, 1fr); + min-height: 52px; + padding: 5px; + } + + .dungeon-choice-grid .activity-card .dungeon-art { + font-size: 10px; + height: 32px; + width: 32px; + } + + .dungeon-choice-grid .activity-card small, + .dungeon-choice-grid .activity-card i, + .dungeon-run-screen .tier-grid span { + font-size: 11px; + line-height: 1; + } + + .tier-setup-panel .tier-grid button { + min-height: 32px; + padding: 4px 5px; + } + + .part-setup-panel .part-picker { + gap: 4px; + } + + .part-setup-panel .primary-button { + font-size: 7px; + min-height: 32px; + padding: 4px 5px; + } + + .dungeon-setup-rail .difficulty-summary { + gap: 5px; + padding: 5px; + } + + .dungeon-setup-rail .difficulty-summary dl { + gap: 4px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .dungeon-setup-rail .difficulty-summary dl > div { + padding: 3px 4px; + } + + .dungeon-setup-rail .difficulty-summary dt, + .dungeon-setup-rail .difficulty-summary dd { + font-size: 10px; + } + + .dungeon-setup-rail .loot-preview-section .equipment-heading { + gap: 6px; + } + + .dungeon-setup-rail .loot-preview-section .eyebrow { + display: none; + } + + .dungeon-setup-rail .loot-preview-section .text-button { + font-size: 12px; + padding: 5px 7px; + } +} + +@media (max-width: 700px) and (max-height: 620px) { + .dungeon-run-board { + grid-template-columns: minmax(0, 1fr) 214px; + overflow: hidden; + } + + .dungeon-run-main, + .dungeon-setup-rail { + overflow: hidden; + } + + .dungeon-focus-card { + display: none; + } + + .dungeon-choice-grid { + grid-template-columns: 1fr; + } +} + +@media (max-height: 620px) { + .game-shell.workshop-shell { + height: 100dvh; + padding: 0; + width: 100%; + } + + .game-shell.workshop-shell > .app-header { + display: none; + } + + .workshop-shell .customize-screen { + height: 100dvh; + margin-top: 0; + padding: 6px; + } + + .workshop-shell .screen-heading { + padding-bottom: 4px; + } + + .workshop-shell .screen-heading .eyebrow { + display: none; + } + + .workshop-shell .screen-heading h1 { + font-size: 13px; + line-height: 1.15; + } + + .workshop-shell .back-button { + font-size: 14px; + min-height: 32px; + padding: 5px 8px; + } + + .customize-tabs { + gap: 5px; + margin-top: 5px; + } + + .customize-tabs button, + .equipment-tab, + .talent-page-tabs button { + font-size: 7px; + min-height: 30px; + padding: 5px 7px; + } + + .equipment-screen, + .talent-screen { + gap: 0; + height: auto; + } + + .embedded-screen .gear-summary, + .embedded-screen .talent-toolbar, + .equipment-screen.crafting-active .gear-summary { + margin-top: 5px; + padding: 5px 7px; + } + + .gear-summary { + gap: 6px; + grid-template-columns: minmax(130px, 1.3fr) repeat(3, minmax(62px, 0.7fr)); + } + + .gear-character { + gap: 7px; + } + + .gear-character > span, + .equipment-screen.crafting-active .gear-character > span, + .talent-class-summary > span { + flex-basis: 30px; + height: 30px; + } + + .gear-character h2, + .talent-class-summary h2, + .equipment-heading h2 { + font-size: 9px; + line-height: 1.2; + } + + .gear-stat { + padding-left: 6px; + } + + .gear-stat strong, + .talent-points strong, + .equipment-screen.crafting-active .gear-stat strong { + font-size: 11px; + } + + .gear-stat span, + .equipment-screen.crafting-active .gear-stat span { + font-size: 10px; + margin-top: 1px; + } + + .equipment-tabs, + .equipment-screen.crafting-active .equipment-tabs, + .talent-page-tabs { + gap: 5px; + margin-top: 5px; + } + + .item-comparison { + gap: 5px; + grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) minmax(92px, 0.45fr); + margin-top: 5px; + min-height: 80px; + padding: 5px; + } + + .comparison-arrow { + font-size: 12px; + padding: 0; + } + + .item-detail { + padding: 5px; + } + + .item-title { + gap: 5px; + } + + .item-title > span { + flex-basis: 28px; + height: 28px; + } + + .item-detail h2 { + font-size: 9px; + line-height: 1.2; + } + + .item-detail small, + .item-detail > p:not(.eyebrow), + .item-detail li, + .comparison-delta span { + font-size: 10px; + line-height: 1.05; + } + + .item-detail > p:not(.eyebrow) { + max-height: 22px; + overflow: hidden; + } + + .item-detail ul { + margin-top: 4px; + } + + .equip-action { + gap: 5px; + } + + .equip-action .primary-button, + .equip-action .breakdown-button, + .equipment-footer .text-button { + font-size: 7px; + min-height: 28px; + padding: 4px 6px; + } + + .equipment-layout { + gap: 6px; + grid-template-columns: minmax(0, 1.08fr) minmax(180px, 0.92fr); + margin-top: 6px; + } + + .equipped-panel, + .inventory-panel, + .crafting-panel, + .set-bonus-panel, + .crafting-filters, + .crafting-list-panel, + .crafting-detail-panel { + padding: 5px; + } + + .equipment-slots, + .inventory-list, + .crafting-list { + gap: 4px; + margin-top: 5px; + } + + .equipment-slots > button, + .inventory-list > button, + .crafting-list > button { + gap: 5px; + grid-template-columns: 28px minmax(0, 1fr) auto; + min-height: 36px; + padding: 4px 5px; + } + + .equipment-slots > button > span, + .inventory-list > button > span, + .crafting-list > button > span { + height: 26px; + } + + .equipment-slots > button strong, + .inventory-list strong, + .crafting-list strong { + font-size: 10px; + line-height: 1.15; + } + + .equipment-slots > button small, + .inventory-list small, + .crafting-list small, + .inventory-list i, + .crafting-list i, + .equipment-slots .item-status i { + font-size: 10px; + line-height: 1; + } + + .list-pager { + gap: 5px; + margin-top: 3px; + } + + .list-pager button { + font-size: 7px; + min-height: 26px; + padding: 4px 6px; + } + + .equipment-footer { + font-size: 11px; + min-height: 20px; + padding-top: 5px; + } + + .equipment-screen.crafting-active .gear-summary { + display: none; + } + + .equipment-screen.crafting-active .crafting-panel { + margin-top: 5px; + } + + .crafting-layout { + gap: 6px; + grid-template-columns: minmax(134px, 0.42fr) minmax(248px, 1fr) minmax(190px, 0.72fr); + margin-top: 6px; + } + + .crafting-filters { + gap: 7px; + } + + .crafting-filter-grid, + .crafting-level-row { + gap: 4px; + } + + .crafting-filter-grid button { + min-height: 30px; + padding: 4px; + } + + .crafting-filter-grid strong { + font-size: 5px; + } + + .crafting-filter-grid span { + font-size: 10px; + } + + .crafting-level-row button { + font-size: 6px; + min-height: 25px; + min-width: 32px; + padding: 3px 5px; + } + + .crafting-detail { + gap: 5px; + } + + .crafting-detail-heading span { + font-size: 6px; + } + + .crafting-components { + gap: 4px; + } + + .crafting-components > div { + gap: 5px; + grid-template-columns: 20px 1fr auto; + min-height: 26px; + padding: 4px; + } + + .crafting-components strong, + .crafting-components i { + font-size: 10px; + } + + .talent-toolbar { + margin-top: 5px; + } + + .talent-class-summary { + gap: 7px; + } + + .talent-points span, + .talent-points small { + font-size: 9px; + margin-top: 1px; + } + + .talent-tree { + gap: 5px; + margin-top: 5px; + } + + .talent-tier { + gap: 6px; + grid-template-columns: 70px minmax(0, 1fr); + padding: 5px 0; + } + + .tier-label { + padding-right: 6px; + } + + .tier-label span { + font-size: 6px; + } + + .tier-label small { + font-size: 10px; + margin-top: 4px; + } + + .tier-talents { + gap: 5px; + } + + .talent-node { + min-height: 0; + padding: 5px; + } + + .talent-node-header { + gap: 5px; + } + + .talent-node-header > span { + flex-basis: 26px; + height: 26px; + } + + .talent-node-header strong { + font-size: 6px; + line-height: 1.2; + } + + .talent-node-header small, + .talent-node > p, + .talent-node > button:disabled { + font-size: 10px; + line-height: 1; + } + + .talent-node > p { + max-height: 30px; + margin-top: 4px; + overflow: hidden; + } + + .rank-pips { + gap: 2px; + margin: 4px 0; + } + + .rank-pips i { + height: 4px; + width: 12px; + } + + .talent-node > button { + font-size: 7px; + min-height: 24px; + padding: 3px; + } + + .talent-footer { + font-size: 11px; + padding-top: 5px; + } +} + +@media (max-width: 700px) and (max-height: 620px) { + .gear-summary { + grid-template-columns: minmax(120px, 1fr) repeat(3, minmax(52px, auto)); + } + + .gear-character .eyebrow, + .talent-class-summary .eyebrow { + display: none; + } + + .item-comparison { + grid-template-columns: minmax(0, 1fr) minmax(92px, 0.45fr); + } + + .item-comparison .comparison-arrow, + .item-comparison .empty-comparison, + .item-comparison article:nth-of-type(2) { + display: none; + } + + .equipment-layout { + grid-template-columns: minmax(0, 1fr) minmax(168px, 0.82fr); + } + + .crafting-layout { + grid-template-columns: 112px minmax(0, 1fr) 174px; + } + + .crafting-filter-grid { + grid-template-columns: 1fr; + } + + .crafting-filter-grid button { + min-height: 24px; + } + + .crafting-list > button { + grid-template-columns: 24px minmax(0, 1fr); + } + + .crafting-list > button i { + display: none; + } + + .talent-toolbar .talent-class-summary h2 { + display: none; + } + + .talent-tier { + grid-template-columns: 52px minmax(0, 1fr); + } + + .tier-talents { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } +} + .part-picker .primary-button.selected-part { background: #f0cb79; outline-color: #fff; @@ -6182,3 +6850,494 @@ h2 { .admin-rename-input:focus { outline-color: var(--gold); } + +@media (max-height: 620px) { + .game-shell.workshop-shell { + height: 100dvh; + overflow: hidden; + padding: 0; + width: 100%; + } + + .game-shell.workshop-shell > .app-header { + display: none; + } + + .workshop-shell .customize-screen { + gap: 4px; + height: 100dvh; + margin-top: 0; + overflow: hidden; + padding: 6px; + } + + .workshop-shell .screen-heading { + padding-bottom: 3px; + } + + .workshop-shell .screen-heading .eyebrow, + .workshop-shell .gear-character .eyebrow, + .workshop-shell .talent-class-summary .eyebrow { + display: none; + } + + .workshop-shell .screen-heading h1 { + font-size: 13px; + line-height: 1.1; + } + + .workshop-shell .back-button { + font-size: 12px; + min-height: 30px; + padding: 5px 8px; + } + + .workshop-shell .customize-tabs, + .workshop-shell .equipment-tabs, + .workshop-shell .talent-page-tabs { + gap: 5px; + margin-top: 4px; + } + + .workshop-shell .customize-tabs button, + .workshop-shell .equipment-tab, + .workshop-shell .talent-page-tabs button { + font-size: 7px; + min-height: 30px; + padding: 5px 7px; + } + + .workshop-shell .equipment-screen, + .workshop-shell .talent-screen { + gap: 0; + height: auto; + overflow: hidden; + } + + .workshop-shell .gear-summary, + .workshop-shell .talent-toolbar { + gap: 6px; + grid-template-columns: minmax(128px, 1.2fr) repeat(3, minmax(56px, 0.6fr)); + margin-top: 4px; + padding: 5px 7px; + } + + .workshop-shell .gear-character, + .workshop-shell .talent-class-summary { + gap: 7px; + } + + .workshop-shell .gear-character > span, + .workshop-shell .talent-class-summary > span { + flex-basis: 30px; + height: 30px; + } + + .workshop-shell .gear-character h2, + .workshop-shell .talent-class-summary h2, + .workshop-shell .equipment-heading h2 { + font-size: 9px; + line-height: 1.2; + } + + .workshop-shell .gear-stat { + padding-left: 6px; + } + + .workshop-shell .gear-stat strong, + .workshop-shell .talent-points strong { + font-size: 11px; + } + + .workshop-shell .gear-stat span, + .workshop-shell .talent-points span, + .workshop-shell .talent-points small { + font-size: 9px; + line-height: 1; + margin-top: 1px; + } + + .workshop-shell .item-comparison { + gap: 5px; + grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) minmax(90px, 0.45fr); + margin-top: 5px; + min-height: 76px; + padding: 5px; + } + + .workshop-shell .comparison-arrow { + font-size: 11px; + padding: 0; + } + + .workshop-shell .item-detail { + padding: 5px; + } + + .workshop-shell .item-title { + gap: 5px; + } + + .workshop-shell .item-title > span { + flex-basis: 26px; + height: 26px; + } + + .workshop-shell .item-detail h2 { + font-size: 9px; + line-height: 1.2; + } + + .workshop-shell .item-detail small, + .workshop-shell .item-detail > p:not(.eyebrow), + .workshop-shell .item-detail li, + .workshop-shell .comparison-delta span { + font-size: 10px; + line-height: 1.05; + } + + .workshop-shell .item-detail > p:not(.eyebrow) { + max-height: 22px; + overflow: hidden; + } + + .workshop-shell .item-detail ul { + margin-top: 4px; + } + + .workshop-shell .equip-action { + gap: 4px; + } + + .workshop-shell .equip-action .primary-button, + .workshop-shell .equip-action .breakdown-button, + .workshop-shell .equipment-footer .text-button, + .workshop-shell .talent-footer .text-button { + font-size: 7px; + min-height: 26px; + padding: 3px 5px; + } + + .workshop-shell .equipment-layout { + gap: 6px; + grid-template-columns: minmax(0, 1.05fr) minmax(178px, 0.95fr); + margin-top: 5px; + } + + .workshop-shell .equipped-panel, + .workshop-shell .inventory-panel, + .workshop-shell .crafting-panel, + .workshop-shell .crafting-filters, + .workshop-shell .crafting-list-panel, + .workshop-shell .crafting-detail-panel { + padding: 5px; + } + + .workshop-shell .equipment-slots { + gap: 4px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + margin-top: 5px; + } + + .workshop-shell .inventory-list, + .workshop-shell .crafting-list { + gap: 4px; + margin-top: 5px; + max-height: none; + } + + .workshop-shell .equipment-slots > button, + .workshop-shell .inventory-list > button, + .workshop-shell .crafting-list > button { + gap: 5px; + grid-template-columns: 28px minmax(0, 1fr) auto; + min-height: 35px; + padding: 4px 5px; + } + + .workshop-shell .equipment-slots > button > span, + .workshop-shell .inventory-list > button > span, + .workshop-shell .crafting-list > button > span { + height: 26px; + } + + .workshop-shell .equipment-slots > button strong, + .workshop-shell .inventory-list strong, + .workshop-shell .crafting-list strong { + font-size: 9px; + line-height: 1.15; + } + + .workshop-shell .equipment-slots > button small, + .workshop-shell .inventory-list small, + .workshop-shell .crafting-list small, + .workshop-shell .inventory-list i, + .workshop-shell .crafting-list i, + .workshop-shell .equipment-slots .item-status i { + font-size: 9px; + line-height: 1; + } + + .workshop-shell .list-pager { + gap: 5px; + margin-top: 3px; + } + + .workshop-shell .list-pager button { + font-size: 7px; + min-height: 25px; + padding: 3px 6px; + } + + .workshop-shell .list-pager span, + .workshop-shell .equipment-heading > span { + font-size: 7px; + } + + .workshop-shell .set-bonus-panel { + display: none; + } + + .workshop-shell .equipment-footer, + .workshop-shell .talent-footer { + font-size: 10px; + min-height: 19px; + padding-top: 4px; + } + + .workshop-shell .equipment-screen.crafting-active .gear-summary { + display: none; + } + + .workshop-shell .equipment-screen.crafting-active .crafting-panel { + margin-top: 5px; + } + + .workshop-shell .crafting-layout { + gap: 6px; + grid-template-columns: minmax(132px, 0.42fr) minmax(230px, 1fr) minmax(190px, 0.72fr); + margin-top: 6px; + } + + .workshop-shell .crafting-filters { + gap: 6px; + } + + .workshop-shell .crafting-filter-grid, + .workshop-shell .crafting-level-row { + gap: 4px; + } + + .workshop-shell .crafting-filter-grid button { + min-height: 28px; + padding: 4px; + } + + .workshop-shell .crafting-filter-grid strong { + font-size: 5px; + } + + .workshop-shell .crafting-filter-grid span { + font-size: 10px; + } + + .workshop-shell .crafting-level-row button { + font-size: 6px; + min-height: 24px; + min-width: 31px; + padding: 3px 5px; + } + + .workshop-shell .crafting-detail { + gap: 5px; + } + + .workshop-shell .crafting-detail-heading span { + font-size: 6px; + } + + .workshop-shell .crafting-components { + gap: 4px; + } + + .workshop-shell .crafting-components > div { + gap: 5px; + grid-template-columns: 20px 1fr auto; + min-height: 25px; + padding: 4px; + } + + .workshop-shell .crafting-components strong, + .workshop-shell .crafting-components i { + font-size: 9px; + } + + .workshop-shell .talent-tree { + gap: 4px; + grid-template-rows: repeat(2, minmax(0, 1fr)); + margin-top: 4px; + } + + .workshop-shell .talent-tier { + gap: 6px; + grid-template-columns: 66px minmax(0, 1fr); + min-height: 0; + overflow: hidden; + padding: 4px 0; + } + + .workshop-shell .tier-label { + padding-right: 6px; + } + + .workshop-shell .tier-label span { + font-size: 6px; + } + + .workshop-shell .tier-label small { + font-size: 9px; + line-height: 1; + margin-top: 4px; + } + + .workshop-shell .tier-talents { + gap: 5px; + grid-template-columns: repeat(3, minmax(0, 1fr)); + min-height: 0; + overflow: hidden; + } + + .workshop-shell .talent-node { + min-height: 0; + overflow: hidden; + padding: 5px; + } + + .workshop-shell .talent-node-header { + gap: 5px; + } + + .workshop-shell .talent-node-header > span { + flex-basis: 24px; + height: 24px; + } + + .workshop-shell .talent-node-header strong { + font-size: 6px; + line-height: 1.2; + } + + .workshop-shell .talent-node-header small, + .workshop-shell .talent-node > p, + .workshop-shell .talent-node > button:disabled { + font-size: 9px; + line-height: 1; + } + + .workshop-shell .talent-node > p { + max-height: 28px; + margin-top: 3px; + overflow: hidden; + } + + .workshop-shell .rank-pips { + gap: 2px; + margin: 3px 0; + } + + .workshop-shell .rank-pips i { + height: 4px; + width: 12px; + } + + .workshop-shell .talent-node > button { + font-size: 7px; + min-height: 22px; + padding: 3px; + } +} + +@media (max-width: 700px) and (max-height: 620px) { + .workshop-shell .gear-summary { + grid-template-columns: minmax(120px, 1fr) repeat(3, minmax(42px, auto)); + } + + .workshop-shell .item-comparison { + grid-template-columns: minmax(0, 1fr) minmax(86px, 0.45fr); + min-height: 60px; + } + + .workshop-shell .item-comparison .comparison-arrow, + .workshop-shell .item-comparison .empty-comparison, + .workshop-shell .item-comparison article:nth-of-type(2) { + display: none; + } + + .workshop-shell .equipment-layout { + grid-template-columns: minmax(0, 1fr) minmax(150px, 0.72fr); + } + + .workshop-shell .gear-stat span, + .workshop-shell .equipment-slots > button small, + .workshop-shell .equipment-slots .item-status, + .workshop-shell .inventory-list i { + display: none; + } + + .workshop-shell .equipment-slots > button, + .workshop-shell .inventory-list > button { + grid-template-columns: 24px minmax(0, 1fr); + min-height: 32px; + } + + .workshop-shell .equipment-slots > button > span, + .workshop-shell .inventory-list > button > span { + height: 23px; + } + + .workshop-shell .crafting-layout { + grid-template-columns: 110px minmax(0, 1fr) 174px; + } + + .workshop-shell .crafting-filter-grid { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .workshop-shell .crafting-filter-grid button { + min-height: 22px; + padding: 3px; + } + + .workshop-shell .crafting-filter-grid strong { + font-size: 4px; + } + + .workshop-shell .crafting-list > button { + grid-template-columns: 24px minmax(0, 1fr); + min-height: 34px; + } + + .workshop-shell .crafting-list > button i { + display: none; + } + + .workshop-shell .crafting-list > button:nth-child(n+4) { + display: none; + } + + .workshop-shell .talent-class-summary h2 { + display: none; + } + + .workshop-shell .talent-tier { + grid-template-columns: 52px minmax(0, 1fr); + } + + .workshop-shell .tier-talents { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + + .workshop-shell .talent-node { + grid-column: auto !important; + } +} diff --git a/src/App.tsx b/src/App.tsx index ccdbce5..5f411bd 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -328,7 +328,7 @@ function App() { : a.sequence - b.sequence) return ( -
+