Skip to content

Commit 37e8da2

Browse files
BipinKalraBipinKalra
committed
finishing
1 parent 1641834 commit 37e8da2

File tree

3 files changed

+61
-28
lines changed

3 files changed

+61
-28
lines changed

‎examples/views/index.hbs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -88,6 +88,7 @@
8888
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="dashboard-cards.html">dashboard-cards</a></div>
8989
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="dashboard-carousel-cards.html">dashboard-carousel-cards</a></div>
9090
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="dashboard-stats-card.html">dashboard-stats-card</a></div>
91+
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="eligibility-test-modals.html">eligibility-test-modals</a></div>
9192
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="goodies-card.html">goodies-card</a></div>
9293
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="hiring-index.html">hiring-index</a></div>
9394
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="home.html">home</a></div>

‎examples/views/online-cb/eligibility-test-modals.hbs

Lines changed: 59 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
<div class="font-md mt-1">Find out by answering 10 MCQ questions!</div>
2222
<div class="my-5 pt-2 font-mds">WHAT TO KNOW BEFORE YOU BEGIN:</div>
2323
<div class="row pb-5 border-bottom mb-5">
24-
<div class="col-4">
24+
<div class="col-sm-4 mb-sm-0 mb-4">
2525
<div class="font-mds bold mb-3 v-align-ma">
2626
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/clock-small.svg" class="mr-2">
2727
<span>Timed</span>
@@ -30,7 +30,7 @@
3030
The questions are timed, you will get 30 seconds for one question.
3131
</div>
3232
</div>
33-
<div class="col-4">
33+
<div class="col-sm-4 mb-sm-0 mb-4">
3434
<div class="font-mds bold mb-3 v-align-ma">
3535
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/files-small.svg" class="mr-2">
3636
<span>Questions</span>
@@ -39,7 +39,7 @@
3939
There will be 10 skill based MCQ questions.
4040
</div>
4141
</div>
42-
<div class="col-4">
42+
<div class="col-sm-4 mb-sm-0 mb-4">
4343
<div class="font-mds bold mb-3 v-align-ma">
4444
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/repeat-small.svg" class="mr-2">
4545
<span>Retake</span>
@@ -72,8 +72,8 @@
7272
</div>
7373
</div>
7474
<div class="bg-white p-md-5 p-4">
75-
<div class="row no-gutters align-items-center justify-content-between pb-5 mb-5 border-bottom">
76-
<div class="flex-1">
75+
<div class="row no-gutters align-items-center justify-content-between pb-5 mb-sm-5 mb-4 border-bottom">
76+
<div class="flex-1 pr-4">
7777
<div class="row no-gutters align-items-center">
7878
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/tick_solid.svg">
7979
<div class="flex-1 pl-4">
@@ -82,13 +82,27 @@
8282
</div>
8383
</div>
8484
</div>
85-
<div>
85+
<div class="d-sm-block d-none">
8686
<ul class="divided-list">
87-
<li class="px-5">
87+
<li class="px-sm-5 px-4">
88+
<div class="font-mdxl green bold mb-2">10</div>
89+
<div class="font-md">Questions</div>
90+
</li>
91+
<li class="px-sm-5 px-4">
92+
<div class="font-mdxl green bold mb-2">07</div>
93+
<div class="font-md">Correct</div>
94+
</li>
95+
</ul>
96+
</div>
97+
</div>
98+
<div class="row no-gutters justify-content-end d-sm-none d-block mb-5">
99+
<div>
100+
<ul class="divided-list mx-auto" style="width: fit-content;">
101+
<li class="px-sm-5 px-4">
88102
<div class="font-mdxl green bold mb-2">10</div>
89103
<div class="font-md">Questions</div>
90104
</li>
91-
<li class="px-5">
105+
<li class="px-sm-5 px-4">
92106
<div class="font-mdxl green bold mb-2">07</div>
93107
<div class="font-md">Correct</div>
94108
</li>
@@ -119,24 +133,38 @@
119133
</div>
120134
</div>
121135
<div class="bg-white p-md-5 p-4">
122-
<div class="row no-gutters align-items-center justify-content-between pb-5 mb-5 border-bottom">
123-
<div class="flex-1">
136+
<div class="row no-gutters align-items-center justify-content-between pb-5 mb-sm-5 mb-4 border-bottom">
137+
<div class="flex-1 pr-4">
124138
<div class="row no-gutters align-items-center">
125-
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/tick_solid.svg">
139+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/cross_solid.svg">
126140
<div class="flex-1 pl-4">
127-
<div class="font-mdxl green bold">Congratulations</div>
128-
<div class="font-md mt-2">You are eligible for this course</div>
141+
<div class="font-mdxl pink bold">Sorry, you missed it!</div>
142+
<div class="font-md mt-2">You are not eligible for this course</div>
129143
</div>
130144
</div>
131145
</div>
132-
<div>
146+
<div class="d-sm-block d-none">
133147
<ul class="divided-list">
134-
<li class="px-5">
135-
<div class="font-mdxl green bold mb-2">10</div>
148+
<li class="px-sm-5 px-4">
149+
<div class="font-mdxl pink bold mb-2">10</div>
136150
<div class="font-md">Questions</div>
137151
</li>
138-
<li class="px-5">
139-
<div class="font-mdxl green bold mb-2">07</div>
152+
<li class="px-sm-5 px-4">
153+
<div class="font-mdxl pink bold mb-2">03</div>
154+
<div class="font-md">Correct</div>
155+
</li>
156+
</ul>
157+
</div>
158+
</div>
159+
<div class="row no-gutters justify-content-end d-sm-none d-block mb-5">
160+
<div>
161+
<ul class="divided-list mx-auto" style="width: fit-content;">
162+
<li class="px-sm-5 px-4">
163+
<div class="font-mdxl pink bold mb-2">10</div>
164+
<div class="font-md">Questions</div>
165+
</li>
166+
<li class="px-sm-5 px-4">
167+
<div class="font-mdxl pink bold mb-2">03</div>
140168
<div class="font-md">Correct</div>
141169
</li>
142170
</ul>
@@ -148,7 +176,7 @@
148176
</div>
149177

150178
<div class="row c-card-carousel">
151-
<div class="col-5">
179+
<div class="col-xl-5 col-sm-8 col-10">
152180
<div class="br-10 overflow-hidden">
153181
<div class="row no-gutters justify-content-between align-items-center bg-gradient-pink py-4 px-lg-5 px-4">
154182
<div class="flex-1 pr-4 white" style="max-width: calc(100% - 75px);">
@@ -182,7 +210,7 @@
182210
</div>
183211
</div>
184212
</div>
185-
<div class="col-5">
213+
<div class="col-xl-5 col-sm-8 col-10">
186214
<div class="br-10 overflow-hidden">
187215
<div class="row no-gutters justify-content-between align-items-center bg-gradient-pink py-4 px-lg-5 px-4">
188216
<div class="flex-1 pr-4 white" style="max-width: calc(100% - 75px);">
@@ -216,7 +244,7 @@
216244
</div>
217245
</div>
218246
</div>
219-
<div class="col-5">
247+
<div class="col-xl-5 col-sm-8 col-10">
220248
<div class="br-10 overflow-hidden">
221249
<div class="row no-gutters justify-content-between align-items-center bg-gradient-pink py-4 px-lg-5 px-4">
222250
<div class="flex-1 pr-4 white" style="max-width: calc(100% - 75px);">
@@ -262,7 +290,7 @@
262290
Skill Assessment Test: Frontend Developement
263291
</div>
264292
<div class="row no-gutters align-items-center justify-content-between mb-5">
265-
<div class="flex-1">
293+
<div class="flex-1 pr-4">
266294
<div class="font-md bold">
267295
Q1. What is the preferred way for adding a background color in HTML?
268296
</div>
@@ -300,7 +328,7 @@
300328
</div>
301329

302330
<div class="row no-gutters justify-content-between align-items-center mt-5">
303-
<div class="col-8">
331+
<div class="col-sm-8 col-6">
304332
<div class="med-grey font-sm">8 Questions Remaining</div>
305333
<div class="mt-4">
306334
<progress value="40" max="100"></progress>
@@ -318,7 +346,7 @@
318346
Skill Assessment Test: Frontend Developement
319347
</div>
320348
<div class="row no-gutters align-items-center justify-content-between mb-5">
321-
<div class="flex-1">
349+
<div class="flex-1 pr-4">
322350
<div class="font-md bold">
323351
Q1. What is the preferred way for adding a background color in HTML?
324352
</div>
@@ -331,22 +359,25 @@
331359
</div>
332360
</div>
333361
<div
334-
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between">
362+
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between b-green">
335363
<div class="font-md">
336364
some random option
337365
</div>
366+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/tick_green.svg">
338367
</div>
339368
<div
340-
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between">
369+
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between bg-green">
341370
<div class="font-md">
342371
some random option
343372
</div>
373+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/tick_grey.svg">
344374
</div>
345375
<div
346-
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between">
376+
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between bg-pink">
347377
<div class="font-md">
348378
some random option
349379
</div>
380+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/cross_white.svg">
350381
</div>
351382
<div
352383
class="border-card py-3 px-4 mb-4 hover-grey pointer row no-gutters align-items-center justify-content-between">
@@ -356,7 +387,7 @@
356387
</div>
357388

358389
<div class="row no-gutters justify-content-between align-items-center mt-5">
359-
<div class="col-8">
390+
<div class="col-sm-8 col-6">
360391
<div class="med-grey font-sm">8 Questions Remaining</div>
361392
<div class="mt-4">
362393
<progress value="40" max="100"></progress>

‎sass/styles/settings/settings.color.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -192,6 +192,7 @@ $bg-color-list: (
192192
"blue": $blue,
193193
"white": $white,
194194
"yellow": $yellow,
195+
"pink": $pink,
195196
"grey": $grey,
196197
"light-grey": $light-grey,
197198
"dark-grey": $interview-grey,

0 commit comments

Comments
 (0)