/
blog.html
92 lines (87 loc) · 4.49 KB
/
blog.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Blog</title>
<!-- css -->
<link rel="stylesheet" href="style/style.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" integrity="sha384-vp86vTRFVJgpjF9jiIGPEEqYqlDwgyBgEF109VFjmqGmIY/Y4HV4d3Gp2irVfcrp" crossorigin="anonymous">
</head>
<body>
<div class="blogFirstPort">
<div class="blogAndText">
<div class="blogTitle">
<div class="blogYellowsq"></div>
<h2>BLOG</h2>
</div>
<div class="blogWelcomeText">
<p>Thanks for visiting Aqua Wonderland. If there's any memorial things here, do not hesitate to post your story and share with anyone else.</p>
</div>
</div>
<div class="blogPostBtnPos">
<a href="#" class="blogPostBtn">POST BLOG</a>
</div>
</div>
<div class="blogPostSection">
<div class="blogPostLeft"><img src="https://picsum.photos/300/200?random=2"></div>
<div class="blogPostMiddle">
<h4 class="sub_title">This is title of certain post</h4>
<div class="blogMemInfo">
<div class="blogMemName" id="#"><p>By Tony Stark</p></div>
<div class="blogMemImg"><img src="https://picsum.photos/40/40?random=22"></div>
<div><p>|</p> </div>
<div class="blogMemDate" id="#"><p>Sep 17 2020</p></div>
</div>
<div class="blogPostPreview">Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam quia quod ex enim doloribus officia quaerat, voluptatum expedita nesciunt repellendus unde quis illo ipsum modi, dolorum et. Voluptatem, enim maxime.</div>
</div>
<div class="blogPostRight">
<div class="blogIcon">
<div class="blogIconCollect"><i class="far fa-heart">50</i></div>
<div class="blogIconReport"><i class="fas fa-exclamation-circle"></i></div>
</div>
<a href="###" class="blogMoreBtn">More</a>
</div>
</div>
<div class="blogPostSection">
<div class="blogPostLeft"><img src="https://picsum.photos/300/200?random=4"></div>
<div class="blogPostMiddle">
<h4 class="sub_title">This is title of certain post</h4>
<div class="blogMemInfo">
<div class="blogMemName" id="#"><p>By Tony Stark</p></div>
<div class="blogMemImg"><img src="https://picsum.photos/40/40?random=24"></div>
<div><p>|</p> </div>
<div class="blogMemDate" id="#"><p>Sep 17 2020</p></div>
</div>
<div class="blogPostPreview">Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam quia quod ex enim doloribus officia quaerat, voluptatum expedita nesciunt repellendus unde quis illo ipsum modi, dolorum et. Voluptatem, enim maxime.</div>
</div>
<div class="blogPostRight">
<div class="blogIcon">
<div class="blogIconCollect"><i class="far fa-heart">50</i></div>
<div class="blogIconReport"><i class="fas fa-exclamation-circle"></i></div>
</div>
<a href="###" class="blogMoreBtn">More</a>
</div>
</div>
<div class="blogPostSection">
<div class="blogPostLeft"><img src="https://picsum.photos/300/200?random=6"></div>
<div class="blogPostMiddle">
<h4 class="sub_title">This is title of certain post</h4>
<div class="blogMemInfo">
<div class="blogMemName" id="#"><p>By Tony Stark</p></div>
<div class="blogMemImg"><img src="https://picsum.photos/40/40?random=26"></div>
<div><p>|</p> </div>
<div class="blogMemDate" id="#"><p>Sep 17 2020</p></div>
</div>
<div class="blogPostPreview">Lorem ipsum dolor sit amet consectetur adipisicing elit. Veniam quia quod ex enim doloribus officia quaerat, voluptatum expedita nesciunt repellendus unde quis illo ipsum modi, dolorum et. Voluptatem, enim maxime.</div>
</div>
<div class="blogPostRight">
<div class="blogIcon">
<div class="blogIconCollect"><i class="far fa-heart">50</i></div>
<div class="blogIconReport"><i class="fas fa-exclamation-circle"></i></div>
</div>
<a href="###" class="blogMoreBtn">More</a>
</div>
</div>
</body>
</html>