Skip to content

Commit 7f947c9

Browse files
author
Edgar Guaman
committed
fix: TT-331 Rebase from master and use of dark mode
1 parent 2f8aa05 commit 7f947c9

File tree

6 files changed

+48
-59
lines changed

6 files changed

+48
-59
lines changed

src/app/modules/customer-management/components/customer-info/components/customer-list/customer-list.component.ts

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -70,12 +70,6 @@ export class CustomerListComponent implements OnInit, OnDestroy, AfterViewInit {
7070
},
7171
];
7272

73-
this.dtOptions = {
74-
scrollY: '325px',
75-
paging: false,
76-
responsive: true,
77-
};
78-
7973
const customerIdToEdit$ = this.store.pipe(select(customerIdtoEdit));
8074
this.customerIdToEditSubscription = customerIdToEdit$.subscribe((customerId: string) => {
8175
this.currentCustomerIdToEdit = customerId;
Lines changed: 33 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,50 @@
1-
<div class="d-flex bg-grayTW-lightest dark:bg-grayTW-darker dark:text-whiteTW" id="wrapper">
2-
<div class="border-right bg-whiteTW dark:bg-grayTW-dark" id="sidebar-wrapper">
3-
<div class="sidebar-heading" style="text-align: center">
4-
<img src="assets/img/ioet.png" width="90" height="auto" style="padding-top: 2rem; padding-bottom: 2rem;" alt="logo" />
5-
</div>
1+
<div id="wrapper" class="d-flex bg-grayTW-lightest dark:bg-grayTW-darker dark:text-whiteTW">
2+
<div id="sidebar-wrapper" class="table-row border-r border-grayTW-lighter shadow-sm bg-whiteTW dark:bg-grayTW-dark dark:border-grayTW">
3+
<div class="table-cell">
4+
<div class="relative flex items-center border-b border-grayTW-lighter dark:border-grayTW sidebar-heading">
5+
<img src="assets/img/ioet-logo-without-letters.png" alt="ioet-logo" width="50" height="auto" style="padding-top: 0.5rem; padding-left: 1rem;"/>
6+
<h1 class="pl-2 pt-2" style="font-family:spinnaker,sans-serif">ioet</h1>
7+
</div>
8+
<app-user></app-user>
69
<div class="list-group list-group-flush bg-whiteTW dark:bg-grayTW-darker">
7-
<a
8-
*ngFor="let item of itemsSidebar"
9-
[routerLink]="item.route"
10-
routerLinkActive=""
11-
class="list-group-item list-group-item-action bg-whiteTW dark:bg-grayTW-dark dark:text-whiteTW"
12-
[ngClass]="{active: item.active}"
13-
>
14-
<i class="{{ item.icon }}"></i> {{ item.text }}
15-
</a>
10+
<a
11+
*ngFor="let item of itemsSidebar"
12+
[routerLink]="item.route"
13+
routerLinkActive=""
14+
class="font-poppins relative pl-4 py-3 bg-whiteTW dark:bg-grayTW-dark dark:text-whiteTW"
15+
[ngClass]="{active: item.active}"
16+
>
17+
<i class="{{ item.icon }}"></i>
18+
<h3 class="font-poppins text-base ml-4 pl-3 -mt-6 text-left" >{{ item.text }}</h3>
19+
</a>
20+
<div class="bg-whiteTW pt-2 pr-24 absolute bottom-0 -mb-10 dark:bg-grayTW-dark">
21+
<a class="flex pl-4 mb-4 text-blackTW hover:text-grayTW dark:text-whiteTW" href="#">
22+
<i class="fas fa-sign-out-alt"></i>
23+
<span class="font-poppins pl-3 font-medium -mt-1 dark:text-whiteTW" (click)="logout()">Sign out</span>
24+
</a>
25+
<app-dark-mode class="relative left-40 -top-14"></app-dark-mode>
26+
</div>
1627
</div>
28+
</div>
1729
<div class="table-cell relative">
18-
<span class="absolute cursor-pointer inset-y-0 right-0 min-h-screen w-0.5 hover:z-0 hover:bg-blue-400" (click)="toggleSideBar()"></span>
19-
<span class="group cursor-pointer absolute w-5 top-20 -right-3">
20-
<img src="assets/icons/left-chevron.svg" alt="hide-chevron" id="hide-sidebar" (click)="toggleSideBar()" width="20" height="20" class="bg-black-light rounded-full hover:bg-opacity-50 hover:bg-info-light sm:hidden md:block lg:block shadow-sm"/>
21-
<div class="opacity-0 w-12 bg-black text-white text-center text-xs rounded-lg py-2 absolute z-10 group-hover:opacity-100 bottom-full left-1/4 ml-4 -mb-6 px-1 pointer-events-none">Hide</div>
30+
<span class="absolute cursor-pointer inset-y-0 right-0 min-h-screen w-0.5 hover:z-0 hover:bg-primaryTW-light" (click)="toggleSideBar()"></span>
31+
<span class="group cursor-pointer absolute w-5 top-28 -right-3">
32+
<img src="assets/icons/left-chevron.svg" id="hide-sidebar" (click)="toggleSideBar()" width="20" height="20" class="bg-whiteTW rounded-full hover:bg-opacity-50 hover:bg-primaryTW-light sm:hidden md:block lg:block"/>
33+
<div class="opacity-0 w-12 bg-blackTW text-whiteTW text-center text-xs rounded-lg py-2 absolute z-10 group-hover:opacity-100 bottom-full left-1/4 ml-4 -mb-6 px-1 pointer-events-none">Hide</div>
2234
</span>
2335
<span class="group cursor-pointer absolute top-20 -right-5">
24-
<img src="assets/icons/right-chevron.svg" alt="show-chevron" id="show-sidebar" (click)="toggleSideBar()" width="20" height="20" class="bg-black-light rounded-full hover:bg-opacity-50 hover:bg-info-light sm:block md:hidden lg:hidden"/>
25-
<div class="opacity-0 w-12 bg-black text-white text-center text-xs rounded-lg py-2 absolute z-10 group-hover:opacity-100 bottom-full left-1/4 ml-4 -mb-6 px-1 pointer-events-none">Show</div>
36+
<img src="assets/icons/right-chevron.svg" id="show-sidebar" (click)="toggleSideBar()" width="20" height="20" class="bg-whiteTW rounded-full hover:bg-opacity-50 hover:bg-primaryTW-light sm:block md:hidden lg:hidden"/>
37+
<div class="opacity-0 w-12 bg-blackTW text-whiteTW text-center text-xs rounded-lg py-2 absolute z-10 group-hover:opacity-100 bottom-full left-1/4 ml-4 -mb-6 px-1 pointer-events-none">Show</div>
2638
</span>
2739
</div>
2840
</div>
2941
<div id="page-content-wrapper">
30-
<nav class="navbar navbar-expand-lg navbar-light border-bottom bg-whiteTW dark:bg-grayTW-dark">
31-
<button class="btn bg-primaryTW hover:bg-primaryTW-dark text-whiteTW hover:text-whiteTW" id="menu-toggle">
32-
Toggle Menu
33-
</button>
34-
<div class="dark-mode-toggle">
35-
<app-dark-mode></app-dark-mode>
36-
</div>
37-
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
38-
<span class="navbar-toggler-icon"></span>
39-
</button>
40-
<div class="collapse navbar-collapse" id="navbarSupportedContent">
41-
<ul class="navbar-nav ml-auto mt-2 mt-lg-0">
42-
<app-user></app-user>
43-
</ul>
44-
</div>
45-
</nav>
4642
<div class="container-fluid px-0 full-height">
4743
<div class="content_app h-100">
4844
<div class="m-1 p-5 rounded-md bg-whiteTW dark:bg-grayTW-dark">
4945
<router-outlet></router-outlet>
5046
</div>
5147
</div>
52-
</div>
48+
</div>
5349
</div>
5450
</div>

src/app/modules/shared/components/sidebar/sidebar.component.scss

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,6 @@ body {
6666
.active {
6767
color: $primary;
6868
font-weight: bold;
69-
text-decoration: underline;
7069
border-color: $primary;
7170
background-color: transparent;
7271
}
@@ -80,7 +79,7 @@ body {
8079
}
8180

8281
.dark-mode-toggle {
83-
position: absolute;
84-
left: 50%;
85-
transform: translateX(-50%);
86-
}
82+
position: absolute;
83+
left: 50%;
84+
transform: translateX(-50%);
85+
}

src/app/modules/shared/components/sidebar/sidebar.component.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -44,17 +44,17 @@ export class SidebarComponent implements OnInit, OnDestroy {
4444
map((isAdmin) => {
4545
if (isAdmin) {
4646
this.itemsSidebar = [
47-
{ route: '/time-clock', icon: 'assets/icons/clock.svg', text: 'Time Clock', active: false },
48-
{ route: '/time-entries', icon: 'assets/icons/time-entries.svg', text: 'Time Entries', active: false },
49-
{ route: '/reports', icon: 'assets/icons/reports.svg', text: 'Reports', active: false },
50-
{ route: '/activities-management', icon: 'assets/icons/activities.svg', text: 'Activities', active: false },
51-
{ route: '/customers-management', icon: 'assets/icons/customers.svg', text: 'Customers', active: false },
52-
{ route: '/users', icon: 'assets/icons/users.svg', text: 'Users', active: false },
47+
{ route: '/time-clock', icon: 'far fa-clock', text: 'Time Clock', active: false },
48+
{ route: '/time-entries', icon: 'far fa-file-alt', text: 'Time Entries', active: false },
49+
{ route: '/reports', icon: 'fas fa-chart-bar', text: 'Reports', active: false },
50+
{ route: '/activities-management', icon: 'fas fa-list-ol', text: 'Activities', active: false },
51+
{ route: '/customers-management', icon: 'fas fa-users', text: 'Customers', active: false },
52+
{ route: '/users', icon: 'fas fa-user-friends', text: 'Users', active: false },
5353
];
5454
} else {
5555
this.itemsSidebar = [
56-
{ route: '/time-clock', icon: 'assets/icons/clock.svg', text: 'Time Clock', active: false },
57-
{ route: '/time-entries', icon: 'assets/icons/time-entries.svg', text: 'Time Entries', active: false },
56+
{ route: '/time-clock', icon: 'far fa-clock', text: 'Time Clock', active: false },
57+
{ route: '/time-entries', icon: 'far fa-file-alt', text: 'Time Entries', active: false },
5858
];
5959
}
6060
})
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<div class=" py-8 flex items-center pl-3">
22
<img src="assets/icons/user.svg" alt="user-icon" width="40" height="40"/>
33
<span class="pl-1">
4-
<h2 class="font-sans text-base font-semibold">{{userName}}</h2>
5-
<p class="font-sans mt-1 text-xs font-medium text-grey dark:text-gray-400">{{userEmail}}</p>
4+
<h2 class="font-poppins text-base font-semibold pl-2 dark:text-whiteTW">{{userName}}</h2>
5+
<p class="font-poppins mt-1 text-xs font-medium pl-2 text-grayTW dark:text-whiteTW">{{userEmail}}</p>
66
</span>
77
</div>

src/app/modules/time-clock/components/time-entries-summary/time-entries-summary.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<h6 class="text-left"><strong>Summary</strong></h6>
2-
<hr class="mb-3" />
2+
<hr class="mb-4" />
33
<div class ="container px-0">
44
<div class="row pb-4">
55
<div class="col-12 col-sm-3">

0 commit comments

Comments
 (0)