Skip to content

Commit 23580c8

Browse files
vdvibhu20vdvibhu20
committed
added:
- New Element: pill - Update: added tags to run card
1 parent 813f100 commit 23580c8

File tree

13 files changed

+173
-24
lines changed

13 files changed

+173
-24
lines changed

‎examples/views/about-course.hbs

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -444,7 +444,7 @@
444444

445445
<div class="grid row">
446446
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
447-
<div class="card my-course o-layout-card ">
447+
<div class="card o-run-card o-layout-card ">
448448
<div class="card-heading o-text-card">
449449
MARCH' 18
450450
</div>
@@ -492,7 +492,7 @@
492492
</div>
493493
</div>
494494
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
495-
<div class="card my-course o-layout-card ">
495+
<div class="card o-run-card o-layout-card ">
496496
<div class="card-heading o-text-card">
497497
MARCH' 18
498498
</div>
@@ -540,7 +540,7 @@
540540
</div>
541541
</div>
542542
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
543-
<div class="card my-course o-layout-card ">
543+
<div class="card o-run-card o-layout-card ">
544544
<div class="card-heading o-text-card">
545545
MARCH' 18
546546
</div>
@@ -588,7 +588,7 @@
588588
</div>
589589
</div>
590590
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
591-
<div class="card my-course o-layout-card ">
591+
<div class="card o-run-card o-layout-card ">
592592
<div class="card-heading o-text-card">
593593
MARCH' 18
594594
</div>
@@ -636,7 +636,7 @@
636636
</div>
637637
</div>
638638
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
639-
<div class="card my-course o-layout-card ">
639+
<div class="card o-run-card o-layout-card ">
640640
<div class="card-heading o-text-card">
641641
MARCH' 18
642642
</div>

‎examples/views/mycourse-card.hbs

Lines changed: 37 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{{> nav-bar }}
22
<div class="grid row">
3-
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
4-
<div class="card my-course o-layout-card ">
3+
<div class="card-layout col-md-4 col-sm-6">
4+
<div class="card o-run-card o-layout-card ">
55
<div class="card-heading o-text-card">
66
MARCH' 18
77
</div>
@@ -45,6 +45,33 @@
4545

4646
</div>
4747

48+
<div class="card-mentor-divider"></div>
49+
<div class="font-sm">Major topics covered</div>
50+
51+
<div class="tag-container">
52+
<div class="pill">
53+
Flow Charts
54+
</div>
55+
<div class="pill">
56+
Conditionals and Loops
57+
</div>
58+
<div class="pill">
59+
Functions
60+
</div>
61+
<div class="pill">
62+
Strings
63+
</div>
64+
<div class="pill">
65+
2D Arrays
66+
</div>
67+
<div class="pill">
68+
Operators and Patterns
69+
</div>
70+
<div class="pill">
71+
Arrays
72+
</div>
73+
74+
</div>
4875
<div class="card-mentor-divider"></div>
4976

5077
<div class="row no-gutters">
@@ -60,8 +87,8 @@
6087
</div>
6188
</div>
6289
</div>
63-
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
64-
<div class="card my-course o-layout-card ">
90+
<div class="card-layout col-md-4 col-sm-6">
91+
<div class="card o-run-card o-layout-card ">
6592
<div class="card-heading o-text-card">
6693
MARCH' 18
6794
</div>
@@ -119,8 +146,8 @@
119146
</div>
120147
</div>
121148
</div>
122-
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
123-
<div class="card my-course o-layout-card ">
149+
<div class="card-layout col-md-4 col-sm-6">
150+
<div class="card o-run-card o-layout-card ">
124151
<div class="card-heading o-text-card">
125152
MARCH' 18
126153
</div>
@@ -178,8 +205,8 @@
178205
</div>
179206
</div>
180207
</div>
181-
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
182-
<div class="card my-course o-layout-card ">
208+
<div class="card-layout col-md-4 col-sm-6">
209+
<div class="card o-run-card o-layout-card ">
183210
<div class="card-heading o-text-card">
184211
MARCH' 18
185212
</div>
@@ -237,8 +264,8 @@
237264
</div>
238265
</div>
239266
</div>
240-
<div class="card-layout col-lg-3 col-md-4 col-sm-6">
241-
<div class="card my-course o-layout-card ">
267+
<div class="card-layout col-md-4 col-sm-6">
268+
<div class="card o-run-card o-layout-card ">
242269
<div class="card-heading o-text-card">
243270
MARCH' 18
244271
</div>

‎examples/views/pills.hbs

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
<div class="heading row">Small Pills</div>
2+
<div class="row">
3+
<div class="col-4">
4+
<div class="pill-sm">
5+
Pill Default
6+
</div>
7+
</div>
8+
<div class="col-4">
9+
<div class="pill-sm bg-green">
10+
Pill Green
11+
</div>
12+
</div>
13+
<div class="col-4">
14+
<div class="pill-sm bg-red">
15+
Pill Red
16+
</div>
17+
</div>
18+
</div>
19+
20+
21+
<div class="heading row">Default Pills</div>
22+
<div class="row">
23+
<div class="col-4">
24+
<div class="pill">
25+
Pill Default
26+
</div>
27+
</div>
28+
<div class="col-4 ">
29+
<div class="pill bg-green">
30+
Pill Green
31+
</div>
32+
</div>
33+
<div class="col-4">
34+
<div class="pill bg-red">
35+
Pill Red
36+
</div>
37+
</div>
38+
</div>
39+
40+
<div class="heading row">Large Pills</div>
41+
<div class="row">
42+
<div class="col-4">
43+
<div class="pill-lg">
44+
Pill Default
45+
</div>
46+
</div>
47+
<div class="col-4 ">
48+
<div class="pill-lg bg-green">
49+
Pill Green
50+
</div>
51+
</div>
52+
<div class="col-4">
53+
<div class="pill-lg bg-red">
54+
Pill Red
55+
</div>
56+
</div>
57+
</div>
58+
59+

‎sass/styles/_elements.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,4 +33,5 @@
3333
@import "elements/element.arrangement";
3434
@import "elements/element.border-card";
3535
@import "elements/elements.background";
36-
@import "elements/html/elements.heading";
36+
@import "elements/html/elements.heading";
37+
@import "elements/elements.pill";

‎sass/styles/_media-query.scss

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

‎sass/styles/_objects.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
@import "objects/o-progress/o-progress";
3030
@import "objects/o-sidebar/o-sidebar";
3131
@import "objects/o-about-course/o-accordian";
32-
@import "objects/o-mycourse-layout/o-mycourse";
32+
@import "objects/o-run-card/o-run-card";
3333
@import "objects/o-about-course/o-about-course";
3434
@import "objects/o-content/o-document.scss";
3535
@import "objects/o-footer/o-footer.scss";

‎sass/styles/elements/elements.bg-color.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,6 @@ $list: (red, $fail-red)
66

77
@each $type, $color in $list {
88
.bg-#{$type}{
9-
background-color: $color;
9+
background-color: $color !important;
1010
}
1111
}

‎sass/styles/elements/elements.color.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,6 @@ $list: (red, $button-element-level)
66

77
@each $type, $color in $list {
88
.#{$type}{
9-
color: $color;
9+
color: $color !important;
1010
}
1111
}

‎sass/styles/elements/elements.pill.scss

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
%pill{
2+
@include width-fit();
3+
@include border-radius(17px);
4+
@include flexbox(row);
5+
6+
background-color: $otp-input-bg;
7+
align-items: center;
8+
cursor: default;
9+
}
10+
11+
.pill-sm{
12+
@extend %pill;
13+
@include padding-s(0, 12px);
14+
15+
font-size: $card-sms;
16+
height: 17px;
17+
}
18+
19+
.pill{
20+
@extend %pill;
21+
@include padding-s(0, 20px);
22+
23+
font-size: $card-md;
24+
height: 35px;
25+
}
26+
27+
.pill-lg{
28+
@extend %pill;
29+
@include padding-s(0, 30px);
30+
@include border-radius(30px);
31+
32+
font-size: $font-sm;
33+
height: 45px;
34+
}
35+

‎sass/styles/media-query/media.card.layout.scss

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,6 @@
5252
}
5353

5454
.card-heading {
55-
float: left;
5655
overflow: hidden;
5756
max-width: 70%;
5857
margin-top: 10px;

0 commit comments

Comments
 (0)