Skip to content

Commit cb2beb3

Browse files
daros10daros10
committed
addes more styles
1 parent bdf5bc6 commit cb2beb3

File tree

5 files changed

+72
-41
lines changed

5 files changed

+72
-41
lines changed

‎src/app/components/shared/navbar/navbar.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
<app-clock></app-clock>
1313
</div>
1414

15-
<div class="col text-right" style="background-color: sienna;">
15+
<div class="col">
1616
<app-user></app-user>
1717
</div>
1818

‎src/app/components/shared/sidebar/sidebar.component.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ body {
66
color: #30BCED !important
77
}
88

9-
.color-item-avtive {
9+
.color-item-active {
1010
color: #16BAC5 !important
1111
}
1212

‎src/app/components/shared/sidebar/sidebar.component.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22
<!-- Sidebar -->
33
<div class="bg-dark border-right rounded-right " id="sidebar-wrapper">
44
<div class="list-group options-sidebar-hover">
5-
<a [routerLink]="['/getting-started']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white" style="border-top-color: #565264; border-color: #565264;"><i class="fas fa-flag"></i> Getting Started</a>
6-
<a [routerLink]="['/time-clock']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-clock"></i> Time Clock</a>
7-
<a [routerLink]="['/time-entries']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-list-alt"></i> Time Entries</a>
8-
<a [routerLink]="['/time-off']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-paper-plane"></i> Time Off</a>
9-
<a [routerLink]="['/reports']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="fas fa-chart-pie"></i> Reports</a>
10-
<a [routerLink]="['/project-management']" routerLinkActive="color-item-avtive" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-folder-open"></i> Projects</a>
5+
<a [routerLink]="['/getting-started']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white" style="border-top-color: #565264; border-color: #565264;"><i class="fas fa-flag"></i> Getting Started</a>
6+
<a [routerLink]="['/time-clock']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-clock"></i> Time Clock</a>
7+
<a [routerLink]="['/time-entries']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-list-alt"></i> Time Entries</a>
8+
<a [routerLink]="['/time-off']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-paper-plane"></i> Time Off</a>
9+
<a [routerLink]="['/reports']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="fas fa-chart-pie"></i> Reports</a>
10+
<a [routerLink]="['/project-management']" routerLinkActive="color-item-active" class="list-group-item list-group-item-action bg-dark text-white " style="border-color: #565264;"><i class="far fa-folder-open"></i> Projects</a>
1111
</div>
1212
</div>
1313
<!-- /#sidebar-wrapper -->

‎src/app/components/shared/user/user.component.css‎

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,23 @@
1-
.help-color {
2-
color: white;
1+
.user-hover :hover {
2+
cursor: pointer;
3+
color: #16BAC5 !important
4+
}
5+
6+
.notifications-hover :hover {
7+
cursor: pointer;
8+
color: #FF3948 !important
9+
}
10+
11+
.help-hover :hover {
12+
cursor: pointer;
13+
color: #861388 !important
14+
}
15+
16+
.text-items-black :hover {
17+
cursor: pointer;
18+
color: black !important;
19+
}
20+
21+
.black-item {
22+
color: black !important;
323
}

‎src/app/components/shared/user/user.component.html‎

Lines changed: 42 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,51 @@
1-
<div class="row">
2-
<div class="col-md-2">
3-
<a class="nav-link dropdown-toggle help-color" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
4-
<i class="fas fa-question-circle"></i>
5-
</a>
6-
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
7-
<a class="dropdown-item">Getting Started Guie</a>
8-
<a class="dropdown-item">Product Help</a>
9-
<a class="dropdown-item">Suggest Idea</a>
10-
<a class="dropdown-item">What's New</a>
11-
</div>
12-
</div>
1+
<div class="row justify-content-end">
2+
3+
<div class="col-form-label text-right help-hover">
4+
<div class="dropdown show">
5+
<a class="nav-link dropdown-toggle text-white" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
6+
<i class="fas fa-question-circle"></i>
7+
</a>
138

14-
<div class="col-md-2">
15-
<a class="nav-link dropdown-toggle help-color" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
16-
<i class="far fa-bell"></i>
17-
</a>
18-
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
19-
<a class="dropdown-item">Notifications</a>
20-
<div class="dropdown-divider"></div>
21-
<p class="text-center"> Empty </p>
9+
<div class="dropdown-menu text-items-black" aria-labelledby="dropdownMenuLink">
10+
<a class="dropdown-item black-item">Getting Started Guie</a>
11+
<a class="dropdown-item black-item">Product Help</a>
12+
<a class="dropdown-item black-item">Suggest Idea</a>
13+
<a class="dropdown-item black-item">What's New</a>
14+
</div>
2215
</div>
16+
17+
2318
</div>
19+
<div class="col-form-label text-right notifications-hover">
20+
<div class="dropdown show">
21+
<a class="nav-link dropdown-toggle text-white" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
22+
<i class="far fa-bell"></i>
23+
</a>
2424

25-
<div class="col-md-5">
25+
<div class="dropdown-menu p-4 text-muted text-items-black">
26+
<p class="black-item">
27+
All clear. No notifications right now.
28+
</p>
29+
</div>
30+
</div>
2631

27-
<a class="nav-link dropdown-toggle help-color" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
28-
<i class="far fa-user-circle"></i> Dario Herrera
29-
</a>
3032

31-
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
32-
<a class="dropdown-item">Profile user</a>
33-
<div class="dropdown-divider"></div>
34-
<a class="dropdown-item">Time clock</a>
35-
<a class="dropdown-item">Profile</a>
36-
<a class="dropdown-item">Support tools</a>
37-
<a class="dropdown-item">Sign Out</a>
33+
</div>
34+
<div class="col-form-label border rounded text-right " style="border-color: #30BCED !important;">
3835

36+
<div class="dropdown show mt-2 text-white user-hover">
37+
<a class="dropdown-toggle p-2 " role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
38+
<i class="far fa-user-circle"></i> Dario Herrera
39+
</a>
40+
<div class=" dropdown-menu text-items-black" aria-labelledby="dropdownMenuLink">
41+
<a class="dropdown-item black-item">Profile user</a>
42+
<div class="dropdown-divider"></div>
43+
<a class="dropdown-item black-item">Profile</a>
44+
<a class="dropdown-item black-item">Time clock</a>
45+
<a class="dropdown-item black-item">Support tools</a>
46+
<a class="dropdown-item black-item">Sign Out</a>
47+
</div>
3948
</div>
49+
50+
4051
</div>

0 commit comments

Comments
 (0)