Skip to content

Commit 0ff76e2

Browse files
mr150mr150
authored
Merge pull request #15 from mlutcss/refactor/penrose-triangle
Refactor art page
2 parents 9c0b37b + f57878c commit 0ff76e2

3 files changed

Lines changed: 24 additions & 23 deletions

File tree

‎src/_data/arts.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,14 @@
33
"artId":"ghost",
44
"bgColor":"Bgc-$artGhost"
55
},
6-
{
7-
"artId":"penrose-triangle",
8-
"bgColor":"Bgc-$artPenroseTriangle"
9-
},
106
{
117
"artId":"flushed-emoji",
128
"bgColor":"Bgc-$artFlushedEmoji"
139
},
10+
{
11+
"artId":"penrose-triangle",
12+
"bgColor":"Bgc-$artPenroseTriangle"
13+
},
1414
{
1515
"artId":"exploding-head",
1616
"bgColor":"Bgc-$artExplodingHead"

‎src/arts/penrose-triangle.ejs‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
11
<%
2-
backgroundPart = "Apcr1 T-25p M-a Ps-a Bgr-nr"
2+
BckgroundPart = "Apcr1 T-25p M-a Ps-a Bgr-nr"
33
%>
4-
<div class="Ps-r -Sz100p Apcr1 D-f Jc-c Ai-c Ctnt-s -BlackA#444 -GrayA#747373 -BlueGray#d0d9e7 Ov-h">
5-
<!-- right-white2 -->
6-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;14.5p,$blueGray;14.5p,$blueGray;40%,tp;40p Bgp61.8p;57p Bgs17p;4p"></div>
7-
<!-- left-black -->
8-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;19.5p,$blackA;19.5p,$blackA;32p,tp;32p Bgp0p;34.5p
4+
<div class="Ps-r -Sz100p Apcr1 D-f Jc-c Ai-c Ctnt-s -ColorA#009dcf -ColorB#3e55ba -ColorC#b1cbfa Ov-h">
5+
<!-- right-colorC2 -->
6+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;14.5p,$colorC;14.5p,$colorC;40%,tp;40p Bgp61.8p;57p Bgs17p;4p"></div>
7+
<!-- left-colorA -->
8+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;19.5p,$colorA;19.5p,$colorA;32p,tp;32p Bgp0p;34.5p
99
Bgs50p;30.4p" ></div>
10-
<!-- right-gray -->
11-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;20p,$grayA;20p,$grayA;26.5p,tp;26.5p Bgp95.6p;40.9p Bgs50p;30.3p"></div>
12-
<!-- right-white1 -->
13-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;18.7p,$blueGray;18.7p,$blueGray;24.9p,tp;24.9p Bgp100p;28p Bgs50p;37.5p"></div>
14-
<!-- left-white -->
15-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;18.5p,$blueGray;18.5p,$blueGray;25p,tp;25p Bgp0;33p Bgs50p;30.5p" ></div>
16-
<!-- bottom-black -->
17-
<div class=" <%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,$blackA;0p,$blackA;37p,tp;37p Bgp107p;52p Bgs70.5p;5p" ></div>
18-
<!-- bottom-gray -->
19-
<div class="<%= backgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;6p,$grayA;6p,$grayA;55p,tp;55p Bgp67.2p;56.8p Bgs59.5p;4.55p"></div>
20-
</div>
10+
<!-- right-colorB -->
11+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;20p,$colorB;20p,$colorB;26.5p,tp;26.5p Bgp95.6p;40.9p Bgs50p;30.3p"></div>
12+
<!-- right-colorC1 -->
13+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;18.7p,$colorC;18.7p,$colorC;24.9p,tp;24.9p Bgp100p;28p Bgs50p;37.5p"></div>
14+
<!-- left-colorC -->
15+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl-60deg,tp;18.5p,$colorC;18.5p,$colorC;25p,tp;25p Bgp0;33p Bgs50p;30.5p" ></div>
16+
<!-- bottom-colorA -->
17+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,$colorA;0p,$colorA;37p,tp;37p Bgp107p;52p Bgs70.5p;5p" ></div>
18+
<!-- bottom-colorB -->
19+
<div class="<%= BckgroundPart %> @c:apcr>=1_H180p @c:apcr<=1_W180p -Gdl60deg,tp;6p,$colorB;6p,$colorB;55p,tp;55p Bgp67.2p;56.8p Bgs59.5p;4.55p"></div>
20+
</div>

‎src/assets/style/style.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ html{
9393
--ml-correct750:rgba(0,130,54,0.6);
9494
// arts
9595
--ml-artGhost:#450c00;
96-
--ml-artPenroseTriangle:#420039;
96+
--ml-artPenroseTriangle:#726603;
9797
--ml-artFlushedEmoji:#000942;
9898
--ml-artExplodingHead:#003b2a;
9999
--ml-artClownEmoji: #065054;
@@ -150,10 +150,11 @@ html{
150150
--ml-correct750:rgba(83, 250, 141, 0.6);
151151
// arts
152152
--ml-artGhost:#ffbcB0;
153-
--ml-artPenroseTriangle:#ffa6f2;
153+
--ml-artPenroseTriangle:#77de64;
154154
--ml-artFlushedEmoji:#bfc5ff;
155155
--ml-artExplodingHead:#9cffe5;
156156
--ml-artClownEmoji: #10bac3;
157+
157158
}
158159

159160
}

0 commit comments

Comments
 (0)