-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblogtemplate.html
101 lines (85 loc) · 3.3 KB
/
blogtemplate.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
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html lang="en">
<head>
<title>Other page</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<link rel="stylesheet" href="styles.css" />
<script type="module" src="script.js"></script>
</head>
<body>
<nav>
<div class="navbar" >
<a href="/" aria-current="page" style="color:white;" class="navi-logo"> Websurf 🏃♂️</a>
<a href="/page2.html">Tech</a>
<a href="/page2.html">Goals</a>
<a href="/page2.html">Random</a>
<a href="/page2.html">Mindfulness</a>
<a href="/page2.html">Blog</a>
</div>
<form>
<input type="search" name="q" placeholder="Search blogs">
<input type="submit" value="Go!">
</form>
</nav>
<main>
<article>
<div class="row">
<div class="leftcolumn">
<div class="card">
<h2>TITLE HEADING</h2>
<h5>Title description, Dec 7, 2017</h5>
<div class="fakeimg" style="height:200px;">Image</div>
<p>Some text..</p>
<p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
</div>
<div class="card">
<h2>TITLE HEADING</h2>
<h5>Title description, Sep 2, 2017</h5>
<div class="fakeimg" style="height:200px;">Image</div>
<p>Some text..</p>
<p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
</div>
</div>
<div class="rightcolumn">
<div class="card">
<h2>About Me</h2>
<div class="fakeimg" style="height:100px;">Image</div>
<p> Hi my names Mia! I’m here finding new resources for time management, productivity, and really cool software you had.
<br><br>
I curated content through hours of research, I test each product beforehand to make sure it’s the best option. <br>Comparing products listed in a easy to read pros and cons, to help you make informed decisions.</p>
</div>
<div class="card">
<h3>Popular Post</h3>
<div class="fakeimg">Image</div><br>
<div class="fakeimg">Image</div><br>
<div class="fakeimg">Image</div>
</div>
<div class="card">
<h3>Follow Me</h3>
<p>[email protected]</p>
</div>
</div>
</div>
<footer>
<div class="end-footer">
<h2> find us </h2>
<ul class="footer-socials">
<li> <a href="#"> instagram</a> </li>
<li> <a href="#"> linkin</a> </li>
<li> <a href="#"> pinterest</a> </li>
<li> <a href="#"> twitter</a> </li>
<li> <a href="#"> facebook</a> </li>
</ul>
<h2> Catagories </h2>
<ul class="footer-blogs">
<li> <a href="#"> tech</a> </li>
<li> <a href="#"> idk</a> </li>
<li> <a href="#"> Service</a> </li>
</ul>
</div>
</footer>
</article>
</main>
</body>
</html>