purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2024-10-30 01:08:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

(dashboards/project) Light header on light themes, small adjustments in the project selector

Browse Source
This commit is contained in:
sercan 2021-07-21 12:22:02 +03:00
parent 966e2db743
commit a2ff55d4c1
2 changed files with 38 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/app/modules/admin/dashboards/project/project.component.html
View File

@ -1,7 +1,7 @@
<div class="flex flex-col flex-auto min-w-0">
<!-- Header -->
<div class="dark bg-card dark:border-b">
<div class="bg-card">
<div class="flex flex-col w-full max-w-screen-xl mx-auto px-6 sm:px-8">
<div class="flex flex-col sm:flex-row flex-auto sm:items-center min-w-0 my-8 sm:my-12">
<!-- Avatar and name -->
@ -26,7 +26,7 @@
<!-- Actions -->
<div class="flex items-center mt-6 sm:mt-0 sm:ml-2 space-x-3">
<button
class="fuse-mat-button-rounded bg-accent-600"
class="fuse-mat-button-rounded bg-accent-700"
mat-flat-button
[color]="'accent'">
<mat-icon
@ -46,41 +46,46 @@
</div>
</div>
<!-- Project selector -->
<div class="flex items-center">
<div class="px-4 py-2 rounded-tl-xl overflow-hidden bg-hover">
<div class="sm:text-lg leading-6 truncate">{{selectedProject}}</div>
<div
class="relative flex self-start pt-2 pb-1 pl-5 pr-4 cursor-pointer overflow-hidden rounded-t-xl bg-default hover:bg-hover"
matRipple
[matMenuTriggerFor]="projectsMenu">
<div class="flex items-center">
<div class="overflow-hidden">
<div class="font-medium leading-6 truncate">{{selectedProject}}</div>
</div>
<div class="flex items-center justify-center pl-2">
<mat-icon
class="icon-size-5"
[svgIcon]="'heroicons_solid:chevron-down'"></mat-icon>
</div>
</div>
<div class="ml-px rounded-tr-xl bg-hover">
<mat-menu
#projectsMenu="matMenu"
[xPosition]="'before'">
<button
[matMenuTriggerFor]="projectsMenu"
mat-icon-button>
<mat-icon [svgIcon]="'heroicons_outline:dots-horizontal'"></mat-icon>
mat-menu-item
(click)="selectedProject='ACME Corp. Backend App'">ACME Corp. Backend App
</button>
<mat-menu #projectsMenu="matMenu">
<button
mat-menu-item
(click)="selectedProject='ACME Corp. Backend App'">ACME Corp. Backend App
</button>
<button
mat-menu-item
(click)="selectedProject='ACME Corp. Frontend App'">ACME Corp. Frontend App
</button>
<button
mat-menu-item
(click)="selectedProject='Creapond'">Creapond
</button>
<button
mat-menu-item
(click)="selectedProject='Withinpixels'">Withinpixels
</button>
</mat-menu>
</div>
<button
mat-menu-item
(click)="selectedProject='ACME Corp. Frontend App'">ACME Corp. Frontend App
</button>
<button
mat-menu-item
(click)="selectedProject='Creapond'">Creapond
</button>
<button
mat-menu-item
(click)="selectedProject='Withinpixels'">Withinpixels
</button>
</mat-menu>
</div>
</div>
</div>
<!-- Main -->
<div class="flex-auto mt-4 sm:mt-6">
<div class="flex-auto pt-4 sm:pt-6">
<div class="w-full max-w-screen-xl mx-auto">
<!-- Tabs -->

6
src/app/modules/admin/dashboards/project/project.module.ts
View File

@ -6,6 +6,7 @@ import { MatDividerModule } from '@angular/material/divider';
import { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatRippleModule } from '@angular/material/core';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
@ -20,7 +21,7 @@ import { projectRoutes } from 'app/modules/admin/dashboards/project/project.rout
declarations: [
ProjectComponent
],
imports : [
imports: [
RouterModule.forChild(projectRoutes),
MatButtonModule,
MatButtonToggleModule,
@ -34,7 +35,8 @@ import { projectRoutes } from 'app/modules/admin/dashboards/project/project.rout
MatTabsModule,
NgApexchartsModule,
TranslocoModule,
SharedModule
SharedModule,
MatRippleModule
]
})
export class ProjectModule