Split desktop and mobile layouts with shared page data so APIs fetch once per context.

Add layout shells, desktop views, module-level page caches, and UI fixes for auth, home, wallet, transactions, address, and related pages. Co-authored-by: Cursor <cursoragent@cursor.com>
2026-06-14 10:08:46 +03:30
parent 4404b4cb92
commit a5e458ed25
234 changed files with 18425 additions and 5503 deletions
@@ -0,0 +1,157 @@
+.desktop-app-layout {
+  display: flex;
+  flex-direction: row;
+  min-height: 100vh;
+  width: 100%;
+  max-width: 100vw;
+  background: @prefixCls-background-color;
+}
+
+.desktop-app-layout__main {
+  flex: 1;
+  min-width: 0;
+  height: 100vh;
+  overflow: hidden;
+}
+
+.desktop-app-layout__main--full {
+  width: 100%;
+}
+
+.desktop-app-layout__content {
+  height: 100vh;
+  width: 100%;
+  min-height: 100vh;
+  overflow-y: auto;
+  overflow-x: hidden;
+  background: @prefixCls-background-color;
+}
+
+.desktop-sidebar {
+  flex-shrink: 0;
+  width: var(--app-desktop-sidebar-width, 260px);
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: #fff;
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  padding: 20px 12px 16px;
+  box-sizing: border-box;
+}
+
+.desktop-sidebar--boursecu {
+  background: var(--App-brand-nav, #133050);
+
+  .desktop-sidebar__divider {
+    background: rgba(255, 255, 255, 0.12);
+  }
+
+  .desktop-nav-item {
+    color: rgba(255, 255, 255, 0.72);
+
+    &:hover {
+      background: rgba(255, 255, 255, 0.08);
+      color: #fff;
+    }
+
+    &--active {
+      background: rgba(255, 255, 255, 0.14);
+      color: #fff;
+
+      .desktop-nav-item__icon {
+        color: #fff;
+      }
+    }
+  }
+
+  .desktop-nav-item__icon {
+    color: rgba(255, 255, 255, 0.85);
+  }
+
+  .desktop-sidebar__logo {
+    max-width: 200px;
+    max-height: 80px;
+  }
+}
+
+.desktop-sidebar__brand {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 8px 12px 20px;
+  margin-bottom: 4px;
+}
+
+.desktop-sidebar__logo {
+  max-width: 140px;
+  max-height: 48px;
+  width: auto;
+  height: auto;
+  object-fit: contain;
+}
+
+.desktop-sidebar__section {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.desktop-sidebar__section--secondary {
+  margin-top: auto;
+}
+
+.desktop-sidebar__divider {
+  height: 1px;
+  background: rgba(0, 0, 0, 0.08);
+  margin: 12px 8px;
+}
+
+.desktop-nav-item {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  padding: 10px 12px;
+  border: none;
+  border-radius: 10px;
+  background: transparent;
+  cursor: pointer;
+  text-align: right;
+  font-family: inherit;
+  font-size: 14px;
+  font-weight: 600;
+  color: #6b7280;
+  transition: background 0.15s ease, color 0.15s ease;
+
+  &:hover {
+    background: rgba(0, 0, 0, 0.04);
+    color: @App-primary-color;
+  }
+
+  &--active {
+    background: rgba(0, 0, 0, 0.05);
+    color: @App-primary-color;
+
+    .desktop-nav-item__icon {
+      color: @App-primary-color;
+    }
+  }
+}
+
+.desktop-nav-item__icon {
+  flex-shrink: 0;
+  color: #9ca3af;
+}
+
+.desktop-nav-item__label {
+  flex: 1;
+  line-height: 1.3;
+}
+
+.desktop-sidebar__section--secondary .desktop-nav-item {
+  font-size: 13px;
+  font-weight: 500;
+  padding: 8px 12px;
+}