File tree Expand file tree Collapse file tree 3 files changed +32
-33
lines changed
Art/oOXxTNTxXOo-colorchange Expand file tree Collapse file tree 3 files changed +32
-33
lines changed Original file line number Diff line number Diff line change 22< html >
33 < head >
44 < title > colorchange</ title >
5- < link rel ="stylesheet " href ="styles.css ">
5+ < link rel ="stylesheet " href ="styles.css " / >
66 </ head >
77
88 < body >
Original file line number Diff line number Diff line change 11{
2- "githubHandle" : " oOXxTNTxXOo" ,
3- "artName" : " colorchange"
4- }
5-
2+ "githubHandle" : " oOXxTNTxXOo" ,
3+ "artName" : " colorchange"
4+ }
Original file line number Diff line number Diff line change 11body {
2- animation : changercolor 15s linear infinite;
3- display : flex;
4- justify-content : center;
5- align-items : center;
6- height : 100vh ;
7- margin : 0 ;
8- }
2+ animation : changercolor 15s linear infinite;
3+ display : flex;
4+ justify-content : center;
5+ align-items : center;
6+ height : 100vh ;
7+ margin : 0 ;
8+ }
99
10- @keyframes changercolor { /* background randbow cycle */
11- 0% {
12- background-color : red;
13- }
14- 25% {
15- background-color : yellow;
16- }
17- 50% {
18- background-color : cyan;
19- }
20- 75% {
21- background-color : purple;
22- }
23- 100% {
24- background-color : red;
25- }
10+ @keyframes changercolor {
11+ /* background randbow cycle */
12+ 0% {
13+ background-color : red;
14+ }
15+ 25% {
16+ background-color : yellow;
17+ }
18+ 50% {
19+ background-color : cyan;
20+ }
21+ 75% {
22+ background-color : purple;
23+ }
24+ 100% {
25+ background-color : red;
26+ }
2627}
2728
2829.pixel-container {
@@ -65,27 +66,26 @@ body {
6566 animation-delay : 0.8s ;
6667}
6768
68-
6969@keyframes pixel-load {
7070 0% {
7171 opacity : 0.5 ;
7272 transform : scale (1 );
7373 background-color : cyan;
7474 }
75- 25% {
75+ 25% {
7676 background-color : purple;
7777 }
7878 50% {
7979 opacity : 1 ;
8080 transform : scale (1.2 );
8181 background-color : red;
8282 }
83- 75% {
83+ 75% {
8484 background-color : yellow;
85- }
85+ }
8686 100% {
8787 opacity : 1 ;
8888 transform : scale (1 );
8989 background-color : cyan;
9090 }
91- }
91+ }
You can’t perform that action at this time.
0 commit comments