Skip to content

Commit c8b2e98

Browse files
committed
add styles
1 parent 4f23116 commit c8b2e98

File tree

1 file changed

+41
-0
lines changed

1 file changed

+41
-0
lines changed

ScrollAnimation/style.css

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
* {
2+
box-sizing: border-box;
3+
}
4+
5+
body {
6+
font-family: Georgia, 'Times New Roman', Times, serif;
7+
margin: 0;
8+
padding: 20px;
9+
background-color: #fffafa;
10+
display: flex;
11+
flex-direction: column;
12+
align-items: center;
13+
overflow-x: hidden;
14+
}
15+
.heading{
16+
display: flex;
17+
justify-content: center;
18+
}
19+
20+
.content {
21+
display: flex;
22+
flex-direction: column;
23+
align-items: center;
24+
width: 400px;
25+
height: 200px;
26+
border-radius: 10px;
27+
background: rgb(84, 84, 248);
28+
color: #fffafa;
29+
font-size: 32px;
30+
justify-content: center;
31+
margin: 20px;
32+
box-shadow: 2px 4px 5px rgba(0,0,0,0.3);
33+
transform: translateX(400%);
34+
transition: transform 0.5s ease;
35+
}
36+
.content:nth-of-type(even){
37+
transform: translateX(-200%);
38+
}
39+
.content.show{
40+
transform: translateX(0);
41+
}

0 commit comments

Comments
 (0)