Mahdi/CRM_Montzar
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): standardize design system, modals, sidebar, and form inputs

Browse Source 
- Implement unified design system tokens, 10px radius, and IRANSans typography
- Modernize sidebar with Gemini-style collapsed expander, square 1:1 items, and elevated profile flyout
- Standardize all modal dialogs with 16px padding, fixed header/footer, 16px medium title, and sticky bottom actions
- Refactor DealFormView and CustomFieldsSection with standard UiField, UiInput, and UiSelect components
- Add draggable bottom-left QuickCreate floating action button
This commit is contained in:
s.esmaeili
2026-09-12 01:33:07 +03:30
parent 9a991fc1f1
commit 1ae87c97b7
87 changed files with 7844 additions and 5718 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/views/PersonProfileView.vue
+20 -21
View File
@@ -928,9 +928,8 @@ watch(() => route.query.tab, readTab, { immediate: true });
.page {
width: 100%;
min-width: 0;
max-width: 1180px;
margin: 0 auto;
padding-bottom: 6.4rem;
max-width: 100%;
margin: 0;
display: grid;
gap: 1rem;
}
@@ -971,7 +970,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
border: 1px solid #e2e8f0;
background: #fff;
color: #334155;
border-radius: 12px;
border-radius: var(--radius);
padding: 0.55rem 0.9rem;
font: inherit;
font-weight: 700;
@@ -1030,7 +1029,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.hero {
background: #fff;
border-radius: 22px;
border-radius: var(--radius);
box-shadow: 0 10px 28px rgba(15, 23, 42, 0.05);
min-width: 0;
}
@@ -1054,7 +1053,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
border-radius: 999px;
padding: 0.22rem 0.7rem;
font-size: 0.72rem;
font-weight: 800;
font-weight: 600;
background: #ecfdf5;
color: #0f766e;
}
@@ -1103,7 +1102,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
font-weight: 700;
color: #0f766e;
background: color-mix(in srgb, #0f766e 12%, transparent);
border-radius: 8px;
border-radius: var(--radius);
padding: 0.12rem 0.5rem;
letter-spacing: 0;
}
@@ -1215,7 +1214,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
width: 36px;
height: 36px;
border: 0;
border-radius: 10px;
border-radius: var(--radius);
background: #ecfdf5;
color: #0f766e;
display: grid;
@@ -1284,7 +1283,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.card {
background: #fff;
border-radius: 18px;
border-radius: var(--radius);
padding: 1rem 1.05rem 0.95rem;
box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
min-width: 0;
@@ -1339,7 +1338,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
padding: 0.35rem;
list-style: none;
background: #fff;
border-radius: 12px;
border-radius: var(--radius);
box-shadow: 0 14px 32px rgba(15, 23, 42, 0.14);
min-width: 8.5rem;
z-index: 4;
@@ -1351,7 +1350,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
background: none;
text-align: start;
padding: 0.5rem 0.65rem;
border-radius: 8px;
border-radius: var(--radius);
font: inherit;
cursor: pointer;
}
@@ -1434,7 +1433,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
color: #b45309;
border-radius: 999px;
font-size: 0.72rem;
font-weight: 800;
font-weight: 600;
padding: 0.18rem 0.55rem;
}
@@ -1478,10 +1477,10 @@ watch(() => route.query.tab, readTab, { immediate: true });
border: 1.5px solid #14b8a6;
background: #fff;
color: #0f766e;
border-radius: 12px;
border-radius: var(--radius);
padding: 0.62rem 0.8rem;
font: inherit;
font-weight: 800;
font-weight: 600;
display: flex;
align-items: center;
justify-content: center;
@@ -1506,7 +1505,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
width: 100%;
border: 0;
background: #f8fafc;
border-radius: 12px;
border-radius: var(--radius);
padding: 0.55rem 0.65rem;
display: flex;
align-items: center;
@@ -1530,7 +1529,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.file-ico {
width: 36px;
height: 36px;
border-radius: 10px;
border-radius: var(--radius);
display: grid;
place-items: center;
background: #fee2e2;
@@ -1546,7 +1545,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
display: grid;
gap: 0.15rem;
background: #fff;
border-radius: 14px;
border-radius: var(--radius);
padding: 0.85rem 0.95rem;
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.04);
}
@@ -1567,7 +1566,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.info-panel dl {
margin: 0;
background: #fff;
border-radius: 16px;
border-radius: var(--radius);
padding: 0.4rem 1rem;
}
@@ -1597,7 +1596,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.smart {
background: linear-gradient(135deg, #ecfeff, #f5f3ff);
border: 1px solid #e0e7ff;
border-radius: 20px;
border-radius: var(--radius);
padding: 0.95rem 1rem 0.85rem;
display: grid;
gap: 0.75rem;
@@ -1628,7 +1627,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.smart-cta {
width: 100%;
border: 0;
border-radius: 12px;
border-radius: var(--radius);
background: #ccfbf1;
color: #0f766e;
font-weight: 700;
@@ -1699,7 +1698,7 @@ watch(() => route.query.tab, readTab, { immediate: true });
.fab-label {
font-size: 0.75rem;
font-weight: 800;
font-weight: 600;
line-height: 1.2;
color: #0f766e;
white-space: nowrap;