root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(FN-1463): fix settings tab highlight alignment on mobile

Browse Source 
- Fix settings modal tab alignment on mobile by switching .settings-nav-item to flexbox
- Add align-items: center to .settings-sidebar for icon+label vertical alignment
- Add justify-content: center and gap: 4px to .settings-nav-item
- Remove deprecated text-align: center from .settings-nav-item
- Add regression tests for new CSS properties in settings-mobile tests
This commit is contained in:
gsxdsm
2026-04-10 10:38:29 -07:00
parent c78ffaab5c
commit 583285fa65
4 changed files with 21 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/dashboard/app/components/__tests__/core-modals-mobile.test.tsx
View File

@@ -75,7 +75,13 @@ describe("core modals mobile css coverage", () => {
expect(mobileBlock).toContain("flex-direction: column;");
expect(mobileBlock).toContain(".settings-sidebar {");
expect(mobileBlock).toContain("flex-direction: row;");
expect(mobileBlock).toContain("align-items: center;");
expect(mobileBlock).toContain("overflow-x: auto;");
expect(mobileBlock).toContain(".settings-nav-item {");
expect(mobileBlock).toContain("display: flex;");
expect(mobileBlock).toContain("align-items: center;");
expect(mobileBlock).toContain("justify-content: center;");
expect(mobileBlock).toContain("gap: 4px;");
});
it("GitManagerModal: 768px mobile block includes stacked layout rules", () => {

5
packages/dashboard/app/components/__tests__/settings-mobile.test.tsx
View File

@@ -131,9 +131,14 @@ describe("SettingsModal mobile adaptations", () => {
expectMobileRule(css, ".settings-layout", "flex-direction: column;");
expectMobileRule(css, ".settings-sidebar", "flex-direction: row;");
expectMobileRule(css, ".settings-sidebar", "align-items: center;");
expectMobileRule(css, ".settings-sidebar", "overflow-x: auto;");
expectMobileRule(css, ".settings-sidebar", "scrollbar-width: none;");
expectMobileRule(css, ".settings-sidebar::-webkit-scrollbar", "display: none;");
expectMobileRule(css, ".settings-nav-item", "display: flex;");
expectMobileRule(css, ".settings-nav-item", "align-items: center;");
expectMobileRule(css, ".settings-nav-item", "justify-content: center;");
expectMobileRule(css, ".settings-nav-item", "gap: 4px;");
expectMobileRule(css, ".settings-content textarea", "font-size: 16px;");
});
});