fabric_trade/fabric_trade_user
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix desktop shell scroll, product cards, and profile/order layouts.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
safavimohadeseh78
2026-08-10 18:54:02 +02:00
co-authored by Cursor
parent 3a822b6882
commit 22282d2480
13 changed files with 375 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/styles/app-shell.css
+58
View File
@@ -99,8 +99,47 @@
background: var(--color-page-background);
}
.app-shell--with-nav .app-layout {
position: relative;
}
/* One continuous divider under sidebar brand + top header */
.app-shell--with-nav .app-layout::after {
content: '';
position: absolute;
top: var(--header-height);
inset-inline: 0;
height: 1px;
background: var(--color-border);
z-index: 30;
pointer-events: none;
}
/*
* Scroll lives on app-main__content. Children must not shrink+clip
* (flex + overflow:hidden), or short viewports hide the bottom of pages.
*/
.app-shell--with-nav .app-main__content {
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.app-shell--with-nav .app-content,
.app-shell--with-nav .page-transition {
flex: 1 0 auto;
min-height: min-content;
overflow: visible;
}
/* Let route roots grow with content so the shell scroll area can work */
.app-shell--with-nav .page-transition > * {
flex: 1 0 auto;
min-height: min-content;
height: auto;
max-height: none;
overflow: visible;
}
}
@@ -117,6 +156,8 @@
width: 100%;
height: auto;
max-height: calc(100dvh - 32px);
min-height: 0;
overflow: hidden;
}
.app-shell--no-nav .app-frame {
@@ -124,9 +165,24 @@
width: 100%;
height: auto;
max-height: calc(100dvh - 32px);
min-height: 0;
border-radius: var(--radius-lg);
box-shadow: var(--shadow-frame);
background: var(--color-surface);
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.app-shell--no-nav .app-main,
.app-shell--no-nav .app-main__content,
.app-shell--no-nav .app-content,
.app-shell--no-nav .page-transition {
flex: 1 0 auto;
min-height: min-content;
overflow: visible;
height: auto;
}
.app-shell--no-nav .app-content {
@@ -135,6 +191,8 @@
.app-shell--no-nav .page {
background: transparent;
overflow: visible;
min-height: auto;
}
.app-shell--no-nav.app-shell--wide .app-layout,