andwati/zitadel
1
0
Fork 0
mirror of https://github.com/andwati/zitadel.git synced 2026-11-06 06:12:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(console): horizontal toggle for users, projects, improve UI/UX (#4047)

Browse Source 
* fix(console): horizontal toggle for users, projects

* improve input contrast

* toggles, profile UI fix

* lint

* fix safari styles

* fix button placement redirects

* style lint

Co-authored-by: Livio Spring <[email protected]>
This commit is contained in:
Max Peintner
2022-07-29 09:14:45 +00:00
committed by GitHub
co-authored by Livio Spring
parent 9ed972f308
commit 5b284f8c9b
22 changed files with 358 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files
console/src/app/pages/projects/projects.component.html
+14 -15
View File
@@ -9,22 +9,21 @@
<p class="sub cnsl-secondary-text max-width-description">{{ 'PROJECT.PAGES.LISTDESCRIPTION' | translate }}</p>
<div class="projects-controls">
<div class="project-type-actions">
<button
class="type-button"
[ngClass]="{ active: (projectType$ | async) === ProjectType.PROJECTTYPE_OWNED }"
(click)="setType(ProjectType.PROJECTTYPE_OWNED)"
>
{{ 'PROJECT.PAGES.TYPE.OWNED' | translate }} ({{ (mgmtService?.ownedProjectsCount | async) ?? 0 }})
</button>
<button
class="type-button"
[ngClass]="{ active: (projectType$ | async) === ProjectType.PROJECTTYPE_GRANTED }"
(click)="setType(ProjectType.PROJECTTYPE_GRANTED)"
>
{{ 'PROJECT.PAGES.TYPE.GRANTED' | translate }} ({{ (mgmtService?.grantedProjectsCount | async) ?? 0 }})
</button>
<div class="project-toggle-group">
<cnsl-nav-toggle
label="{{ 'PROJECT.PAGES.TYPE.OWNED' | translate }}"
[count]="mgmtService.ownedProjectsCount | async"
(clicked)="setType(ProjectType.PROJECTTYPE_OWNED)"
[active]="(projectType$ | async) === ProjectType.PROJECTTYPE_OWNED"
></cnsl-nav-toggle>
<cnsl-nav-toggle
label="{{ 'PROJECT.PAGES.TYPE.GRANTED' | translate }}"
[count]="mgmtService.grantedProjectsCount | async"
(clicked)="setType(ProjectType.PROJECTTYPE_GRANTED)"
[active]="(projectType$ | async) === ProjectType.PROJECTTYPE_GRANTED"
></cnsl-nav-toggle>
</div>
<span class="fill-space"></span>
<button class="grid-btn" (click)="grid = !grid" mat-icon-button [attr.data-e2e]="'toggle-grid'">
<i *ngIf="grid" class="show list view las la-th-list"></i>