Skip to content

Commit 4503028

Browse files
witty123witty123
authored
Merge pull request #234 from vdvibhu20/nav-image-circle
Nav image circle
2 parents dfd1e2f + c14d63c commit 4503028

File tree

11 files changed

+290
-260
lines changed

11 files changed

+290
-260
lines changed

‎examples/components/nav-account.hbs

Lines changed: 60 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,66 +1,76 @@
11
<header>
22
<nav class="main-nav">
3-
<span class="hamburger-parent">
4-
<i class="hamburger fas fa-bars"></i>
5-
</span>
6-
<span class="logo-parent">
7-
<a class="logo-link" href="/">
8-
<img src="/images/online-logo.png" alt="online-logo" class="nav-logo pointer">
9-
</a>
10-
</span>
11-
12-
<div class="round-img">
13-
<img src="/images/code-red.svg" alt="">
3+
<div class="nav-left">
4+
<span class="hamburger-parent">
5+
<i class="hamburger fas fa-bars"></i>
6+
</span>
7+
<span class="logo-parent">
8+
<a class="logo-link" href="/">
9+
<img src="/images/online-logo.png" alt="online-logo" class="nav-logo pointer">
10+
</a>
11+
</span>
1412
</div>
13+
14+
<div class="nav-right">
15+
<ul class="nav-list">
16+
<a href="https://codingblocks.com/classroom-courses">
17+
<li class="nav-items pointer">
18+
CLASSROOM COURSES
19+
</li>
20+
</a>
1521

16-
<div class="card">
17-
<div class="top-offset"></div>
18-
<div class="nav-info">
19-
<div class="flex-row justify-content-end">
20-
<span class="pointer red">MY PROFILE</span>
21-
</div>
22-
<div class="separator"></div>
22+
<a href="https://online.codingblocks.com/">
23+
<li class="nav-items pointer">
24+
ONLINE COURSES
25+
</li>
26+
</a>
2327

24-
<div class="flex-row justify-content-end">
25-
<span class="pointer">MY ADDRESSES</span>
26-
</div>
28+
<a href="https://hack.codingblocks.com/">
29+
<li class="nav-items pointer">
30+
HACKER BLOCKS
31+
</li>
32+
</a>
33+
</ul>
2734

28-
<div class="separator"></div>
35+
<div class="round-img">
36+
<img src="/images/code-red.svg" alt="">
37+
</div>
2938

30-
<div class="flex-row justify-content-end">
31-
<span class="pointer">MY APPS</span>
32-
</div>
39+
<div class="card">
40+
<div class="top-offset"></div>
41+
<div class="nav-info">
42+
<div class="flex-row justify-content-end">
43+
<span class="pointer red">MY PROFILE</span>
44+
</div>
45+
<div class="separator"></div>
3346

34-
<div class="separator"></div>
35-
<div class="flex-row justify-content-end">
36-
<span class="pointer">MY CLIENTS</span>
37-
</div>
38-
<div class="separator"></div>
39-
<div class="flex-row justify-content-end faded">
40-
<span class="pointer">LOGOUT</span>
47+
<div class="flex-row justify-content-end">
48+
<span class="pointer">MY ADDRESSES</span>
49+
</div>
50+
51+
<div class="separator"></div>
52+
53+
<div class="flex-row justify-content-end">
54+
<span class="pointer">MY APPS</span>
55+
</div>
56+
57+
<div class="separator"></div>
58+
<div class="flex-row justify-content-end">
59+
<span class="pointer">MY CLIENTS</span>
60+
</div>
61+
<div class="separator"></div>
62+
<div class="flex-row justify-content-end faded">
63+
<span class="pointer">LOGOUT</span>
64+
</div>
4165
</div>
4266
</div>
67+
4368
</div>
4469

45-
<ul class="nav-list">
46-
<a href="https://codingblocks.com/classroom-courses">
47-
<li class="nav-items pointer">
48-
CLASSROOM COURSES
49-
</li>
50-
</a>
51-
52-
<a href="https://online.codingblocks.com/">
53-
<li class="nav-items pointer">
54-
ONLINE COURSES
55-
</li>
56-
</a>
5770

58-
<a href="https://hack.codingblocks.com/">
59-
<li class="nav-items pointer">
60-
HACKER BLOCKS
61-
</li>
62-
</a>
63-
</ul>
71+
72+
73+
6474
</nav>
6575

6676
<div class="sidebar sidebar-none">

‎examples/components/nav-bar.hbs

Lines changed: 117 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,106 +1,129 @@
11
<!-- Navigation Bar -->
22
<header>
33
<nav class="main-nav">
4-
<span class="hamburger-parent">
5-
<i class="hamburger fas fa-bars"></i>
6-
</span>
7-
<span class="logo-parent">
8-
<a class=" logo-link">
9-
<img src="images/online-logo.png" alt="online-logo" class="nav-logo pointer">
10-
</a>
11-
</span>
12-
<ul class="nav-list">
13-
<li class="nav-items pointer">
14-
About us
15-
</li>
16-
<li class="nav-items pointer">
17-
All Courses
18-
</li>
19-
<li class="nav-items pointer">
20-
Contact us
21-
</li>
4+
<div class="nav-left">
5+
<span class="hamburger-parent">
6+
<i class="hamburger fas fa-bars"></i>
7+
</span>
8+
<span class="logo-parent">
9+
<a class=" logo-link">
10+
<img src="images/online-logo.png" alt="online-logo" class="nav-logo pointer">
11+
</a>
12+
</span>
13+
</div>
14+
15+
<div class="nav-right">
16+
<div class="input-search nav-search">
17+
<input type="text" placeholder="Search here">
18+
<img src="images/searchicon.png" alt="search">
19+
<div class="search-box display-none">
20+
<div class="row search-content">
21+
<div class="img-container col-md-3">
22+
<img src="images/c" alt="online-logo" class="nav-logo pointer">
23+
</div>
24+
<div class="heading-container col-md-9">
25+
<p>Web Development</p>
26+
<p>NOV-DEC 2017</p>
27+
</div>
28+
</div>
29+
<div class="row search-content">
30+
<div class="img-container col-md-3">
31+
<img src="images/c" alt="online-logo" class="nav-logo pointer">
32+
</div>
33+
<div class="heading-container col-md-9">
34+
<p>Web Development</p>
35+
<p>NOV-DEC 2017</p>
36+
</div>
37+
</div>
38+
</div>
39+
</div>
2240

23-
<li class="nav-items">
24-
<div class="notify-icon">
25-
<span class="notify-dot new"></span>
26-
<img src="images/notif-icon.png" alt="">
27-
</div>
28-
<div class="dropdown-ul o-notification display-none">
29-
<div class="dropdown-li row no-gutters">
30-
<div class="notify-type col-2 ">
31-
<div class="notify-icon">
32-
<span class="notify-dot new"></span>
33-
<img src="images/announcement.png" alt="">
34-
</div>
35-
</div>
36-
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
37-
issues for you.</div>
38-
</div>
41+
<ul class="nav-list">
42+
<li class="nav-items pointer">
43+
About us
44+
</li>
45+
<li class="nav-items pointer">
46+
All Courses
47+
</li>
48+
<li class="nav-items pointer">
49+
Contact us
50+
</li>
3951

40-
<div class="dropdown-li row no-gutters">
41-
<div class="notify-type col-2 ">
42-
<div class="notify-icon">
43-
<span class="notify-dot new"></span>
44-
<img src="images/announcement.png" alt="">
45-
</div>
46-
</div>
47-
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
48-
issues for you.</div>
49-
</div>
52+
<li class="nav-items">
53+
<div class="notify-icon">
54+
<span class="notify-dot new"></span>
55+
<img src="images/notif-icon.png" alt="">
56+
</div>
57+
<div class="dropdown-ul o-notification display-none">
58+
<div class="dropdown-li row no-gutters">
59+
<div class="notify-type col-2 ">
60+
<div class="notify-icon">
61+
<span class="notify-dot new"></span>
62+
<img src="images/announcement.png" alt="">
63+
</div>
64+
</div>
65+
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
66+
issues for you.</div>
67+
</div>
5068

51-
<div class="dropdown-li row no-gutters">
52-
<div class="notify-type col-2 ">
53-
<div class="notify-icon">
54-
<span class="notify-dot new"></span>
55-
<img src="images/announcement.png" alt="">
56-
</div>
57-
</div>
58-
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
59-
issues for you.</div>
60-
</div>
69+
<div class="dropdown-li row no-gutters">
70+
<div class="notify-type col-2 ">
71+
<div class="notify-icon">
72+
<span class="notify-dot new"></span>
73+
<img src="images/announcement.png" alt="">
74+
</div>
75+
</div>
76+
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
77+
issues for you.</div>
78+
</div>
6179

62-
<div class="dropdown-li row no-gutters">
63-
<div class="notify-type col-2 ">
64-
<div class="notify-icon">
65-
<span class="notify-dot new"></span>
66-
<img src="images/announcement.png" alt="">
67-
</div>
68-
</div>
69-
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
70-
issues for you.</div>
71-
</div>
72-
</div>
73-
</li>
80+
<div class="dropdown-li row no-gutters">
81+
<div class="notify-type col-2 ">
82+
<div class="notify-icon">
83+
<span class="notify-dot new"></span>
84+
<img src="images/announcement.png" alt="">
85+
</div>
86+
</div>
87+
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
88+
issues for you.</div>
89+
</div>
7490

75-
<li class="nav-items pointer">
76-
{{>button type='solid' text='Login'}}
77-
</li>
78-
</ul>
91+
<div class="dropdown-li row no-gutters">
92+
<div class="notify-type col-2 ">
93+
<div class="notify-icon">
94+
<span class="notify-dot new"></span>
95+
<img src="images/announcement.png" alt="">
96+
</div>
97+
</div>
98+
<div class="notify-text col-10">Please hard refresh (Ctrl Shift R) your web app to make sure that you are on latest version of the app. We just deployed some major changes so that might be causing
99+
issues for you.</div>
100+
</div>
101+
</div>
102+
</li>
79103

80-
<div class="input-search nav-search">
81-
<input type="text" placeholder="Search here">
82-
<img src="images/searchicon.png" alt="search">
83-
<div class="search-box display-none">
84-
<div class="row search-content">
85-
<div class="img-container col-md-3">
86-
<img src="images/c" alt="online-logo" class="nav-logo pointer">
87-
</div>
88-
<div class="heading-container col-md-9">
89-
<p>Web Development</p>
90-
<p>NOV-DEC 2017</p>
91-
</div>
92-
</div>
93-
<div class="row search-content">
94-
<div class="img-container col-md-3">
95-
<img src="images/c" alt="online-logo" class="nav-logo pointer">
96-
</div>
97-
<div class="heading-container col-md-9">
98-
<p>Web Development</p>
99-
<p>NOV-DEC 2017</p>
100-
</div>
101-
</div>
102-
</div>
103-
</div>
104+
{{!-- <li class="nav-items pointer">
105+
{{>button type='solid' text='Login'}}
106+
</li> --}}
107+
</ul>
108+
109+
<div class="round-img">
110+
<img src="/images/code-red.svg" alt="">
111+
</div>
112+
113+
<div class="card">
114+
<div class="top-offset"></div>
115+
<div class="nav-info">
116+
<div class="flex-row justify-content-end">
117+
<span class="pointer red">MY PROFILE</span>
118+
</div>
119+
<div class="separator"></div>
120+
<div class="flex-row justify-content-end faded">
121+
<span class="pointer">LOGOUT</span>
122+
</div>
123+
</div>
124+
</div>
125+
</div>
126+
104127
</nav>
105128
<div class="sidebar sidebar-none">
106129
<i class="close fas fa-times"></i>

‎examples/views/address-page.hbs

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
{{>nav-account}}
2+
13
<div class="row o-arrangement">
24
{{>side-nav}}
35
<div class="col-md-8 o-address-page">

‎sass/styles/_media-query.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,4 +30,5 @@
3030
@import "media-query/media.signup";
3131
@import "media-query/media.changdp";
3232
@import "media-query/media.arrangement";
33+
@import "media-query/media.sidebar.scss";
3334
@import "media-query/media.pill";

0 commit comments

Comments
 (0)