Skip to content

Commit 346b384

Browse files
YuvrajchandraYuvrajchandra
committed
silent sea and lattice pattern
1 parent 87f469d commit 346b384

File tree

4 files changed

+59
-0
lines changed

4 files changed

+59
-0
lines changed

‎4. The Silent Sea/index.html

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en" dir="ltr">
3+
<head>
4+
<meta charset="utf-8">
5+
<title></title>
6+
<link rel="stylesheet" href="styles.css">
7+
</head>
8+
<body>
9+
<div class="patterns pt1"></div>
10+
</body>
11+
</html>

‎4. The Silent Sea/styles.css

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
body {
2+
margin: 0px;
3+
}
4+
5+
.patterns {
6+
width: 100vw;
7+
height: 100vw;
8+
}
9+
10+
.pt1 {
11+
background-color: #026873;
12+
background-size: 13px 13px, 29px 29px, 37px 37px, 53px 53px;
13+
background-image: -webkit-linear-gradient(0, rgba(255, 255, 255, .07) 50%, transparent 50%), -webkit-linear-gradient(0, rgba(255, 255, 255, .13) 50%, transparent 50%), -webkit-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .17) 50%), -webkit-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .19) 50%);
14+
background-image: -moz-linear-gradient(0, rgba(255, 255, 255, .07) 50%, transparent 50%), -moz-linear-gradient(0, rgba(255, 255, 255, .13) 50%, transparent 50%), -moz-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .17) 50%), -moz-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .19) 50%);
15+
background-image: -ms-linear-gradient(0, rgba(255, 255, 255, .07) 50%, transparent 50%), -ms-linear-gradient(0, rgba(255, 255, 255, .13) 50%, transparent 50%), -ms-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .17) 50%), -ms-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .19) 50%);
16+
background-image: -o-linear-gradient(0, rgba(255, 255, 255, .07) 50%, transparent 50%), -o-linear-gradient(0, rgba(255, 255, 255, .13) 50%, transparent 50%), -o-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .17) 50%), -o-linear-gradient(0, transparent 50%, rgba(255, 255, 255, .19) 50%);
17+
background-image: linear-gradient(0, rgba(255, 255, 255, .07) 50%, transparent 50%), linear-gradient(0, rgba(255, 255, 255, .13) 50%, transparent 50%), linear-gradient(0, transparent 50%, rgba(255, 255, 255, .17) 50%), linear-gradient(0, transparent 50%, rgba(255, 255, 255, .19) 50%);
18+
}

‎5. CSS Lattice Pattern/index.html

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en" dir="ltr">
3+
<head>
4+
<meta charset="utf-8">
5+
<title></title>
6+
<link rel="stylesheet" href="styles.css">
7+
</head>
8+
<body>
9+
<div id="grid"></div>
10+
</body>
11+
</html>

0 commit comments

Comments
 (0)