Skip to content

Commit 45ba9eb

Browse files
bryansoftwarebryansoftware
authored
Bryansoftware (#2918)
* adding my art to the project * adding the title * added morph animation
1 parent 25b38ba commit 45ba9eb

File tree

3 files changed

+38
-0
lines changed

3 files changed

+38
-0
lines changed

‎Art/bryansoftware-art/index.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<link rel="stylesheet" type="text/css" href="styles.css">
5+
<title>bryansoftware-art</title>
6+
</head>
7+
<body>
8+
<div id="main"></div>
9+
</body>
10+
</html>

‎Art/bryansoftware-art/meta.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"artName": "art",
3+
"githubHandle": "bryansoftware"
4+
}

‎Art/bryansoftware-art/styles.css‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
body {
2+
display: flex;
3+
justify-content: center;
4+
align-content: center;
5+
background-color: #887CAF;
6+
padding: 100px;
7+
}
8+
9+
@keyframes morph {
10+
0% {background-color:#2B4970;}
11+
20% {background-color:#AA9239; border-radius: 25px 50px 50px 50px;}
12+
40% {background-color:#AA6339; border-radius: 50px 50px 25px 50px;}
13+
60% {background-color:#554300; border-radius: 50px 25px 50px 50px;}
14+
80% {background-color:#051B38; border-radius: 50px 50px 50px 25px;}
15+
100% {background-color:#2B4970; border-radius: 50px;}
16+
}
17+
18+
#main {
19+
width: 100px;
20+
height: 100px;
21+
border-radius: 50px;
22+
background-color: #051B38;
23+
animation: morph 10s infinite;
24+
}

0 commit comments

Comments
 (0)