Skip to content

Commit 1f0abd1

Browse files
BipinKalraBipinKalra
committed
certificate of excellence
1 parent 875d20a commit 1f0abd1

File tree

6 files changed

+124
-7
lines changed

6 files changed

+124
-7
lines changed

‎examples/public/fonts/GreatVibes-Regular.ttf

88.4 KB
Binary file not shown.

‎examples/public/images/cblogo.png

37.8 KB
Loading

‎examples/views/certificate-excellence.hbs

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<div class="certificate-excellence">
2+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/excellence-certi-overlay.svg"
3+
class="position-absolute tr">
4+
<div class="certificate-excellence__main-section white">
5+
<div class="certificate-excellence__main-section__right-section">
6+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/cb_white.svg">
7+
<div class="certificate-excellence__main-section__title1">CERTIFICATE</div>
8+
<div class="certificate-excellence__main-section__title2">of Excellence</div>
9+
<div class="font-mds" style="margin-top: 14px;">This certificate is presented for exemplary performance in</div>
10+
<div class="divider-h" style="opacity: 0.5; margin: 42px 0 25px 0;"></div>
11+
<div class="font-mds"><strong>Machine Learning</strong> course by <br />Coding Blocks.</div>
12+
</div>
13+
<div class="certificate-excellence__main-section__left-section">
14+
<div class="certificate-excellence__main-section__left-section__content t-align-c">
15+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/gold+_logo.svg">
16+
<div class="font-mds" style="margin-top: 24px;"><strong>Machine <br />Learning</strong></div>
17+
<div style="margin-top: 46px;">Batch</div>
18+
<div class="divider-h" style="opacity: 0.5; margin: 24px 0 19px 0;"></div>
19+
<img src="https://cb-thumbnails.s3.ap-south-1.amazonaws.com/munna_bhaiya_sign_white.svg" style="margin-bottom: 7px;">
20+
<div>Manmohan Gupta<br />(Founder, Coding Blocks)</div>
21+
</div>
22+
</div>
23+
</div>
24+
</div>

‎examples/views/index.hbs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="cast-window.html">cast-window</a></div>
2121
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="cb-navbar.html">cb-navbar</a></div>
2222
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="cbhire.html">cbhire</a></div>
23+
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="certificate-excellence.html">certificate-excellence</a></div>
2324
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="certificate-lite.html">certificate-lite</a></div>
2425
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="code-editor.html">code-editor</a></div>
2526
<div class="py-2 px-4 text-ellipses"><a target="preview" class="font-sm" href="code-window.html">code-window</a></div>

‎sass/styles/objects/certificate.scss

Lines changed: 99 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,23 @@
1+
@font-face {
2+
font-family: "BebasNeue";
3+
src: url("/fonts/BebasNeue-Regular.ttf");
4+
}
5+
6+
@font-face {
7+
font-family: "Gilroy";
8+
src: url("/fonts/Gilroy.ttf");
9+
}
10+
11+
@font-face {
12+
font-family: "GreatVibes";
13+
src: url("/fonts/GreatVibes-Regular.ttf");
14+
}
15+
116
.certificate-lite {
217
height: 839px;
318
width: 1381px;
419
background: $white;
5-
font-family: 'Gilroy', sans-serif;
20+
font-family: "Gilroy", sans-serif;
621

722
&__left-section {
823
width: 220px;
@@ -29,7 +44,7 @@
2944
&__title {
3045
margin-top: 36px;
3146
font-size: 82px;
32-
font-family: "BebasNeue", sans-serif;
47+
font-family: "BebasNeue", sans-serif !important;
3348
margin-bottom: 37px;
3449
}
3550

@@ -73,3 +88,85 @@
7388
}
7489
}
7590
}
91+
92+
.certificate-excellence {
93+
height: 485px;
94+
width: 1000px;
95+
background: #16171c;
96+
position: relative;
97+
border-radius: 10px;
98+
font-family: "Gilroy", sans-serif;
99+
100+
&__main-section {
101+
padding: 44px 183px 44px 75px;
102+
display: flex;
103+
justify-content: space-between;
104+
z-index: 1;
105+
106+
&__right-section {
107+
width: 377px !important;
108+
}
109+
110+
&__left-section {
111+
width: 313px !important;
112+
border-radius: 10px;
113+
display: flex;
114+
position: relative;
115+
justify-content: center;
116+
align-items: center;
117+
background-image: linear-gradient(
118+
90deg,
119+
#ffda82 2.25%,
120+
#bf8442 13.23%,
121+
#dbae63 42.19%,
122+
#b38a4b 53.2%,
123+
#b67f36 64.66%,
124+
#855929 77.64%,
125+
#ffdc83 87.62%,
126+
#d69c51 98.11%
127+
);
128+
129+
&::after {
130+
content: "";
131+
background: #16171c;
132+
position: absolute;
133+
border-radius: 10px;
134+
width: 309px;
135+
height: calc(100% - 4px);
136+
z-index: 0;
137+
}
138+
139+
&__content {
140+
padding: 30px 31px 30px 31px;
141+
z-index: 1;
142+
width: 100%;
143+
}
144+
}
145+
146+
&__title1 {
147+
font-family: "BebasNeue", sans-serif;
148+
font-size: 80px;
149+
margin-top: 18px;
150+
-webkit-text-fill-color: transparent;
151+
-webkit-background-clip: text;
152+
background-clip: text;
153+
background-image: linear-gradient(
154+
90deg,
155+
#ffda82 2.25%,
156+
#bf8442 13.23%,
157+
#dbae63 42.19%,
158+
#b38a4b 53.2%,
159+
#b67f36 64.66%,
160+
#855929 77.64%,
161+
#ffdc83 87.62%,
162+
#d69c51 98.11%
163+
);
164+
}
165+
166+
&__title2 {
167+
font-family: "GreatVibes";
168+
font-size: 64px;
169+
margin-top: -28px;
170+
}
171+
}
172+
}

‎sass/styles/settings/settings.font.scss

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,11 +35,6 @@ $card-xs: 0.5rem; // 7px
3535
src: url("https://unpkg.com/@coding-blocks/motley@1.0.1/dist/font/Muli-Italic.ttf");
3636
}
3737

38-
@font-face {
39-
font-family: "BebasNeue";
40-
src: url(fonts/BebasNeue-Regular.ttf);
41-
}
42-
4338
$text-size-list: (
4439
"font-xs": $font-xs,
4540
"font-sm": $font-sm,

0 commit comments

Comments
 (0)