purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-09 12:05:08 +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

31
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"> <div class="flex flex-col flex-auto min-w-0">
<!-- Header --> <!-- 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 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"> <div class="flex flex-col sm:flex-row flex-auto sm:items-center min-w-0 my-8 sm:my-12">
<!-- Avatar and name --> <!-- Avatar and name -->
@ -26,7 +26,7 @@
<!-- Actions --> <!-- Actions -->
<div class="flex items-center mt-6 sm:mt-0 sm:ml-2 space-x-3"> <div class="flex items-center mt-6 sm:mt-0 sm:ml-2 space-x-3">
<button <button
class="fuse-mat-button-rounded bg-accent-600" class="fuse-mat-button-rounded bg-accent-700"
mat-flat-button mat-flat-button
[color]="'accent'"> [color]="'accent'">
<mat-icon <mat-icon
@ -46,17 +46,23 @@
</div> </div>
</div> </div>
<!-- Project selector --> <!-- Project selector -->
<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="flex items-center">
<div class="px-4 py-2 rounded-tl-xl overflow-hidden bg-hover"> <div class="overflow-hidden">
<div class="sm:text-lg leading-6 truncate">{{selectedProject}}</div> <div class="font-medium leading-6 truncate">{{selectedProject}}</div>
</div> </div>
<div class="ml-px rounded-tr-xl bg-hover"> <div class="flex items-center justify-center pl-2">
<button <mat-icon
[matMenuTriggerFor]="projectsMenu" class="icon-size-5"
mat-icon-button> [svgIcon]="'heroicons_solid:chevron-down'"></mat-icon>
<mat-icon [svgIcon]="'heroicons_outline:dots-horizontal'"></mat-icon> </div>
</button> </div>
<mat-menu #projectsMenu="matMenu"> <mat-menu
#projectsMenu="matMenu"
[xPosition]="'before'">
<button <button
mat-menu-item mat-menu-item
(click)="selectedProject='ACME Corp. Backend App'">ACME Corp. Backend App (click)="selectedProject='ACME Corp. Backend App'">ACME Corp. Backend App
@ -77,10 +83,9 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- Main --> <!-- 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"> <div class="w-full max-w-screen-xl mx-auto">
<!-- Tabs --> <!-- Tabs -->

4
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 { MatIconModule } from '@angular/material/icon';
import { MatMenuModule } from '@angular/material/menu'; import { MatMenuModule } from '@angular/material/menu';
import { MatProgressBarModule } from '@angular/material/progress-bar'; import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatRippleModule } from '@angular/material/core';
import { MatSidenavModule } from '@angular/material/sidenav'; import { MatSidenavModule } from '@angular/material/sidenav';
import { MatSortModule } from '@angular/material/sort'; import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table'; import { MatTableModule } from '@angular/material/table';
@ -34,7 +35,8 @@ import { projectRoutes } from 'app/modules/admin/dashboards/project/project.rout
MatTabsModule, MatTabsModule,
NgApexchartsModule, NgApexchartsModule,
TranslocoModule, TranslocoModule,
SharedModule SharedModule,
MatRippleModule
] ]
}) })
export class ProjectModule export class ProjectModule