Skip to content

fix design issue #514

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dvCodeWorld merged 1 commit into from
Apr 1, 2026
Merged

fix design issue #514

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
150 changes: 31 additions & 119 deletions apps/36-blocks/src/app/dashboard/dashboard.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,120 +1,32 @@
<div
class="flex flex-col items-center justify-center flex-1 w-full min-h-[calc(100vh-64px)] h-screen px-4"
style="background-color: var(--mat-card-elevated-container-color, var(--mat-sys-surface-container-low))"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 520 400"
class="w-full max-w-[480px]"
role="img"
aria-label="Coming Soon illustration"
>
<!-- Background blobs -->
<ellipse cx="260" cy="370" rx="200" ry="18" fill="var(--color-common-border)" opacity="0.5" />
<!-- Monitor -->
<rect
x="100"
y="60"
width="320"
height="210"
rx="18"
ry="18"
fill="var(--color-common-bg)"
stroke="var(--color-common-border)"
stroke-width="3"
/>
<rect x="115" y="75" width="290" height="175" rx="8" ry="8" fill="var(--color-common-app-bg)" />
<!-- Monitor stand -->
<rect
x="225"
y="270"
width="70"
height="36"
rx="4"
ry="4"
fill="var(--color-common-bg)"
stroke="var(--color-common-border)"
stroke-width="2.5"
/>
<rect x="185" y="302" width="150" height="14" rx="7" ry="7" fill="var(--color-common-border)" />
<!-- Screen glow lines (under construction pattern) -->
<rect x="150" y="108" width="220" height="12" rx="6" fill="var(--color-common-border)" opacity="0.6" />
<rect x="150" y="130" width="160" height="10" rx="5" fill="var(--color-common-border)" opacity="0.4" />
<rect x="150" y="150" width="190" height="10" rx="5" fill="var(--color-common-border)" opacity="0.4" />
<!-- Gear big -->
<g transform="translate(245,185)">
<circle cx="0" cy="0" r="32" fill="none" stroke="var(--color-dark-accent)" stroke-width="5" />
<circle cx="0" cy="0" r="12" fill="var(--color-dark-accent)" opacity="0.15" />
<circle cx="0" cy="0" r="12" fill="none" stroke="var(--color-dark-accent)" stroke-width="3.5" />
<g stroke="var(--color-dark-accent)" stroke-width="5" stroke-linecap="round">
<line x1="0" y1="-32" x2="0" y2="-42" />
<line x1="0" y1="32" x2="0" y2="42" />
<line x1="-32" y1="0" x2="-42" y2="0" />
<line x1="32" y1="0" x2="42" y2="0" />
<line x1="-22.6" y1="-22.6" x2="-29.7" y2="-29.7" />
<line x1="22.6" y1="22.6" x2="29.7" y2="29.7" />
<line x1="22.6" y1="-22.6" x2="29.7" y2="-29.7" />
<line x1="-22.6" y1="22.6" x2="-29.7" y2="29.7" />
</g>
</g>
<!-- Gear small -->
<g transform="translate(305,160)">
<circle
cx="0"
cy="0"
r="16"
fill="none"
stroke="var(--color-dark-accent)"
stroke-width="3.5"
opacity="0.6"
/>
<circle
cx="0"
cy="0"
r="6"
fill="none"
stroke="var(--color-dark-accent)"
stroke-width="2.5"
opacity="0.6"
/>
<g stroke="var(--color-dark-accent)" stroke-width="3.5" stroke-linecap="round" opacity="0.6">
<line x1="0" y1="-16" x2="0" y2="-21" />
<line x1="0" y1="16" x2="0" y2="21" />
<line x1="-16" y1="0" x2="-21" y2="0" />
<line x1="16" y1="0" x2="21" y2="0" />
<line x1="-11.3" y1="-11.3" x2="-14.8" y2="-14.8" />
<line x1="11.3" y1="11.3" x2="14.8" y2="14.8" />
<line x1="11.3" y1="-11.3" x2="14.8" y2="-14.8" />
<line x1="-11.3" y1="11.3" x2="-14.8" y2="14.8" />
</g>
</g>
<!-- Wrench -->
<g transform="translate(185,178) rotate(-35)">
<rect x="-5" y="-30" width="10" height="52" rx="4" fill="var(--color-dark-accent)" opacity="0.7" />
<rect x="-12" y="-40" width="24" height="14" rx="7" fill="var(--color-dark-accent)" opacity="0.7" />
<rect x="-12" y="18" width="24" height="14" rx="7" fill="var(--color-dark-accent)" opacity="0.7" />
</g>
<!-- Text label -->
<text
x="260"
y="342"
text-anchor="middle"
font-family="inherit"
font-size="22"
font-weight="700"
fill="var(--mat-sys-on-surface)"
>
Coming Soon
</text>
<text
x="260"
y="366"
text-anchor="middle"
font-family="inherit"
font-size="13"
fill="var(--color-common-secondary-text)"
>
Dashboard is under construction
</text>
</svg>
<div class="coming-soon-container flex flex-1 w-full items-center justify-center min-h-[calc(100vh-64px)] p-10">
<div class="coming-soon-content text-center max-w-[600px]">
<div class="icon-wrapper inline-flex items-center justify-center w-[120px] h-[120px] rounded-full mb-8">
<mat-icon class="coming-soon-icon">rocket_launch</mat-icon>
</div>
<h1 class="coming-soon-title text-5xl font-bold tracking-tight mb-4">Coming Soon</h1>
<p class="coming-soon-subtitle text-xl font-medium mb-3">We're working hard to bring you something amazing.</p>
<p class="coming-soon-description text-base leading-relaxed mb-10">
Our dashboard is under construction. Stay tuned for powerful analytics and insights.
</p>
<div class="coming-soon-features flex justify-center gap-8 flex-wrap">
<div
class="feature-item flex flex-col items-center gap-2 px-6 py-5 rounded-xl border transition-all duration-300 cursor-default"
>
<mat-icon class="feature-icon">analytics</mat-icon>
<span class="text-sm font-medium">Analytics</span>
</div>
<div
class="feature-item flex flex-col items-center gap-2 px-6 py-5 rounded-xl border transition-all duration-300 cursor-default"
>
<mat-icon class="feature-icon">insights</mat-icon>
<span class="text-sm font-medium">Insights</span>
</div>
<div
class="feature-item flex flex-col items-center gap-2 px-6 py-5 rounded-xl border transition-all duration-300 cursor-default"
>
<mat-icon class="feature-icon">trending_up</mat-icon>
<span class="text-sm font-medium">Reports</span>
</div>
</div>
</div>
</div>
78 changes: 78 additions & 0 deletions apps/36-blocks/src/app/dashboard/dashboard.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
:host {
display: flex;
width: 100%;
height: 100%;
}

.coming-soon-content {
animation: fadeInUp 0.8s ease-out;
}

.icon-wrapper {
background: linear-gradient(135deg, var(--color-dark-accent) 0%, #15b8a0 100%);
animation: pulse 2s infinite;
}

.coming-soon-icon {
font-size: 56px !important;
width: 56px !important;
height: 56px !important;
color: var(--color-common-white);
}

.coming-soon-title {
color: var(--color-common-text);
}

.coming-soon-subtitle {
color: var(--color-dark-accent);
}

.coming-soon-description {
color: var(--color-common-placeholder);
}

.feature-item {
background: var(--color-common-bg);
border-color: var(--color-common-border);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);

&:hover {
background: var(--color-dark-accent-light);
border-color: var(--color-dark-accent);
transform: translateY(-4px);
box-shadow: 0 10px 20px -5px rgba(25, 230, 206, 0.2);
}

.feature-icon {
font-size: 32px !important;
width: 32px !important;
height: 32px !important;
color: var(--color-dark-accent);
}

span {
color: var(--color-common-text);
}
}

@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

@keyframes pulse {
0%,
100% {
box-shadow: 0 0 0 0 rgba(25, 230, 206, 0.4);
}
50% {
box-shadow: 0 0 0 20px rgba(25, 230, 206, 0);
}
}
1 change: 1 addition & 0 deletions apps/36-blocks/src/app/dashboard/dashboard.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,6 @@ import { BaseComponent } from '@proxy/ui/base-component';
selector: 'proxy-dashboard',
imports: [RouterModule, MatIconModule],
templateUrl: './dashboard.component.html',
styleUrl: './dashboard.component.scss',
})
export class DashboardComponent extends BaseComponent {}
2 changes: 1 addition & 1 deletion apps/36-blocks/src/app/layout/layout.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,7 +118,7 @@ <h4 class="m-0 py-2 px-6 text-dark font-medium">{{ user.displayName }}</h4>
</div>
}
</div>
<div class="flex-1 flex flex-col app-content">
<div class="flex-1 flex flex-col" [class.app-content]="!showContainer">
<!-- Content::START -->
<router-outlet></router-outlet>
<div id="ChatbotContainer" class="h-screen w-full"></div>
Expand Down
6 changes: 3 additions & 3 deletions apps/36-blocks/src/app/logs/log/log.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<proxy-loader></proxy-loader>
}
<div class="flex flex-wrap items-center justify-between gap-4 mb-6">
<form [formGroup]="engProjectFormGroup" class="flex flex-wrap items-center grow gap-4">
<form [formGroup]="engProjectFormGroup" class="flex flex-wrap items-start grow gap-4">
<mat-form-field appearance="outline" class="no-padding w-xs-100">
<mat-label>Select Project</mat-label>
<input
Expand Down Expand Up @@ -66,11 +66,11 @@
<mat-icon matSuffix>arrow_drop_down</mat-icon>
</mat-form-field>
<proxy-lib-search
[matFormFieldClass]="'no-padding w-xs-100'"
[matFormFieldClass]="'w-xs-100 w-100'"
[placeholder]="'Hit Enter to Search'"
(inputChanges)="onEnter($event)"
[emitOnEnter]="true"
hint="To search in specific field use <b>field:</b> before anything (field => endpoint,request_body,response,headers)"
hint="Use field: to search specific fields (endpoint, request_body, response, headers)."
></proxy-lib-search>
</form>
<div class="flex items-center gap-4 ml-auto flex-wrap">
Expand Down
10 changes: 0 additions & 10 deletions apps/36-blocks/src/app/ngrx/effects/root/root.effect.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,16 +41,6 @@ export class RootEffects {
this.showError(res.errors);
return rootActions.getAllClientsError();
}
console.log(res.data?.data);
const data = [
...(res.data?.data || []),
...(res.data?.data || []),
...(res.data?.data || []),
...(res.data?.data || []),
...(res.data?.data || []),
...(res.data?.data || []),
];
res.data['data'] = data.map((i, indx) => ({ ...i, id: i.id + indx }));
return rootActions.getAllClientsSuccess({ response: res.data });
}),
catchError((err) => {
Expand Down
Loading