Skip to content

Commit 9c0b37b

Browse files
authored
Merge pull request #14 from mlutcss/feat/clown-art
Add the art with clown emoji
2 parents f6cd4b9 + dce3a9c commit 9c0b37b

10 files changed

Lines changed: 236 additions & 258 deletions

File tree

package-lock.json

Lines changed: 7 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/_data/arts.json

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,22 @@
11
[
22
{
3-
"caption":"Cute ghost",
43
"artId":"ghost",
5-
"bgColor":"Bgc-$art900"
4+
"bgColor":"Bgc-$artGhost"
65
},
76
{
8-
"caption":"Penrose triangle",
97
"artId":"penrose-triangle",
10-
"bgColor":"Bgc-$art850"
8+
"bgColor":"Bgc-$artPenroseTriangle"
119
},
1210
{
13-
"caption":"Flushed emoji",
1411
"artId":"flushed-emoji",
15-
"bgColor":"Bgc-$art800"
12+
"bgColor":"Bgc-$artFlushedEmoji"
1613
},
1714
{
18-
"caption":"Exploding head",
1915
"artId":"exploding-head",
20-
"bgColor":"Bgc-$art750"
16+
"bgColor":"Bgc-$artExplodingHead"
17+
},
18+
{
19+
"artId":"clown-emoji",
20+
"bgColor":"Bgc-$artClownEmoji"
2121
}
2222
]

src/arts.ejs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ area: Arts
2424
<div class="-Sz100p Ov-h Plcc-c Plci-c D-f <%= art.bgColor %>">
2525
<%- include(`./arts/${art.artId}.ejs`) %>
2626
</div>
27-
<div class="Ps-a P4u T0 L0 M0 D-f Jc-fe Fld-c -Sz100p O0 Vs-h ^:h_Vs-v ^:h_O1 Bd1;s;tp Bgc-$core350 ^:h_Bdc-$brand Tsd500ms">
27+
<div class="Ps-a Zi15 P4u T0 L0 M0 D-f Jc-fe Fld-c -Sz100p O0 Vs-h ^:h_Vs-v ^:h_O1 Bd1;s;tp Bgc-$core350 ^:h_Bdc-$brand Tsd500ms">
2828
<div class="Mt-a D-f Jc-c Gap3u">
2929
<div class="<%= artsPageCSS.button %> ">
3030
<%- include(`./_includes/components/link-button.ejs`, {

src/arts/clown-emoji.ejs

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
<%
2+
const css = {
3+
hairWrapper: '-Sz40p Ps-a T2p',
4+
hairBottomPart: '-Sz35p Bdrd100p Ps-a T45p L-15p Bgc-$clownRedA Bd3;s;$clownRedB Ct_b Ps-a_b -Sz100p_b L205p_b T-145p_b Bgc-$clownRedA_b Bd3;s;$clownRedB_b Bdrd100p_b',
5+
hairTopPart: '-Sz40p Bdrd100p Ps Bgc-$clownRedA Bd3;s;$clownRedB Ct_af,b Ps-a_af,b -Sz120p_af,b T40p_af L-30p_af L55p_b T-15p_b Bgc-$clownRedA_af,b Bd3;s;$clownRedB_af,b Bdrd100p_af,b',
6+
eye: 'Ps-a Bgc-$clownWhiteA Zi10 T20p W23p H38p Bd6;s;$clownBlue Bdrd100p D-f Jc-c Ai-c Ct_af,b Ps-a_af T-40p_af Bdrd100p_af L0_af W100p_af H30p_af -Gdrd-cr;at;50p;100p,tp,tp;50p,$clownGrayB;50p,$clownGrayA;70p,tp;70p_af',
7+
pupil: 'W60p H70p Bdrd100p -Gdrd-cr;fts;at;50p;70p,$clownGrayA,$clownGrayA;80p,$clownGrayB;95p',
8+
lipsCorner: 'Ps-a Zi7 B28p -Sz19p',
9+
shutter: 'W100p H65p Bgc-$clownWhiteA'
10+
}
11+
%>
12+
<!-- Canvas -->
13+
<div class="-Sz100p Ctnt-s D-f Jc-c Ai-c -ClownRedA#ff382c -ClownRedB#c50301 -ClownRedC#ff372c40 -ClownWhiteA#fff -ClownWhiteB#ece3b6 -ClownWhiteC#a79b4d -ClownWhiteD#f9f8ef -ClownGrayA#404040 -ClownGrayB#030303 -ClownBlue#0072be Ov-h">
14+
<div class="@c:apcr>=1_H70p @c:apcr<=1_W70p Apcr1 Ps-r ">
15+
<!-- Left Hair -->
16+
<div class="<%= css.hairWrapper%> Tf -Rt-15d L2p">
17+
<div class="<%= css.hairBottomPart%>"></div>
18+
<div class="<%= css.hairTopPart%>"></div>
19+
</div>
20+
<!-- Left Hair -->
21+
<div class="<%= css.hairWrapper%> Tf -Rt-15d R2p -Sx-100p">
22+
<div class="<%= css.hairBottomPart%>"></div>
23+
<div class="<%= css.hairTopPart%>"></div>
24+
</div>
25+
<!-- Head-->
26+
<div class="Apcr1 -Sz100p Ps-a Bdrd100p Bd1;s;$clownWhiteC -Gdrd-cr;at;50p;48p,$clownWhiteD,$clownWhiteA;65p,$clownWhiteB;70p,$clownWhiteB;">
27+
<!-- Left eye -->
28+
<div class="<%= css.eye %> @c:w>=gMd_Bdw13 L20p">
29+
<div class="<%= css.pupil %>"></div>
30+
</div>
31+
<!-- Right eye -->
32+
<div class="<%= css.eye %> @c:w>=gMd_Bdw13 R20p">
33+
<div class="<%= css.pupil %>"></div>
34+
</div>
35+
<!-- Nose -->
36+
<div class="Ps-a -Sz22p Zi8 T48p L39p -Gdrd-cr;at;50p;90p,$clownRedA;80p,$clownWhiteA;84p Bd4;s;$clownRedB @c:w>=gMd_Bdw6 Bdrd100p Ct_af,b -Sz2p_af,b Bgc-$clownRedA_af,b Bdrd100p_af,b Bxsd0;0;6u;4u;$clownRedA_af,b @c:w>=gSm_Bxsd0;0;7u;5u;$clownRedA_af,b @c:w>=gMd_Bxsd0;0;9u;7u;$clownRedA_af,b Ps-a_af,b T30p_af,b L220p_af R220p_b"></div>
37+
<!-- Mouth -->
38+
<div class="Ps-a B6p L15p W70p Apcr1 -Bdbrd100p -Bdtrd100p -Gdrd-cr;at;c,$clownWhiteA,$clownWhiteA;58p,$clownRedA;58p,$clownRedA;66p,$clownRedB;66p">
39+
<div class="<%= css.shutter %>"></div>
40+
<div class="<%= css.lipsCorner%> Tf -Rt-35d L-3p -Gdrd-el;at;57p;100p,$clownRedA,$clownRedA;33p,$clownRedB;33p,$clownRedB;54p,$clownWhiteA;54p"></div>
41+
<div class="<%= css.lipsCorner%> Tf -Rt35d R-3p -Gdrd-el;at;41p;100p,$clownRedA,$clownRedA;32p,$clownRedB;32p,$clownRedB;52p,$clownWhiteA;52p"></div>
42+
</div>
43+
<div class="Ps-a B100p L15p B20p W70p H40p -Bdbrd100p -Bdtrd100p -Gdrd-el;108p;100p,$clownWhiteA,$clownWhiteA;35p,$clownRedB;35p,$clownRedB;40p,$clownRedA;40p">
44+
<div class="<%= css.shutter %>"></div>
45+
</div>
46+
</div>
47+
</div>
48+
</div>

0 commit comments

Comments
 (0)