-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
139 lines (139 loc) · 6.05 KB
/
index.html
File metadata and controls
139 lines (139 loc) · 6.05 KB
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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Website Home</title>
<link rel="stylesheet" href="css/styles.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@300;600&display=swap" rel="stylesheet">
<script src="js/main.js"></script>
</head>
<body>
<div class="container">
<header>
<div class="wrapper">
<h1>My homepage</h1>
<input type="text" placeholder="Discover news, articles" />
<nav>
<a href="#">Home</a>
<a href="./contact.html">Contact</a>
</nav>
</div>
</header>
<div class="intro">
<div class="wrapper">
<div>
<h2>Hi, I'm <span>Jaume Serradell</span>.</h2>
<h2>Senior Email Developer</h2>
<h3>Specialized in Frontend Development</h3>
<div class="button-module">
<button class="primary"><a href="./contact.html">Contact Me</a></button>
</div>
</div>
<div class="imgprofile"></div>
</div>
</div>
<main>
<div class="wrapper align-top">
<div>
<section>
<h3>Recently Published</h3>
<article>
<div class="img photo01"></div>
<div>
<p class="tag">Agency</p>
<h4>Lorem ipsum dolor sit amet.</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nisi turpis, consequat nec ante in, viverra iaculis leo</p>
</div>
</article>
<article>
<div class="img photo02"></div>
<div>
<p class="tag">Lorem</p>
<h4>Quisque vel gravida mauris.</h4>
<p>Aenean egestas orci in sapien viverra, vel tincidunt nunc malesuada. Morbi commodo convallis diam ut vulputate.</p>
</div>
</article>
<article>
<div class="img photo03"></div>
<div>
<p class="tag">ipsum</p>
<h4>Sed lacinia elementum blandit.</h4>
<p>Fusce ac commodo enim. Ut at tortor nulla. Vestibulum eu mauris scelerisque, pretium ex in, tempor ligula.</p>
</div>
</article>
<article>
<div class="img photo04"></div>
<div>
<p class="tag">dolor</p>
<h4>Nulla a interdum sem.</h4>
<p>Proin eget arcu vel dolor porttitor bibendum vel sit amet elit. Pellentesque ornare venenatis nibh, ut gravida nisl facilisis eget.</p>
</div>
</article>
</section>
</div>
<div>
<aside>
<h3>Tags</h3>
<div class="box">
<p class="tag">#agency</p>
<p class="tag">#Lorem</p>
<p class="tag">#ipsum</p>
<p class="tag">#dolor</p>
<p class="tag">#sit</p>
<p class="tag">#amet</p>
<p class="tag">#consectetur</p>
<p class="tag">#adipiscing</p>
<p class="tag">#elit</p>
</div>
<h3>Let's Talk</h3>
<div class="box">
<p>Want to find out how I can solve problems specific to your business? Let's talk.</p>
<div>
<a href="#"><img src="./img/whatsapp_logo.png"/></a>
<a href="#"><img src="./img/instagram_logo.png"/></a>
<a href="#"><img src="./img/twitter_logo.png"/></a>
</div>
</div>
<h3>Newsletter</h3>
<div class="box">
<p>Make sure to subscribe to our newsletter and be the first to know the news.
</p>
<input type="text" placeholder="Email Address" />
<button class="primary">Subscribe</button>
</div>
</aside>
</div>
</div>
</main>
<footer>
<div class="wrapper">
<div>
<p>Jaume Serradell</p>
<p>© 2020, All Rights Reserved.</p>
<p>Powered by Jaume</p>
</div>
<div>
<p>Quick Links</p>
<a href="#">Advertise with us</a>
<a href="#">About Us</a>
<a href="#">Contact Us</a>
</div>
<div>
<p>Legal Stuff</p>
<a href="#">Privacy Notice</a>
<a href="#">Cookie Policy</a>
<a href="#">Terms Of Use</a>
</div>
<div>
<p>Social Media</p>
<a href="#">Whatsapp</a>
<a href="#">Instagram</a>
<a href="#">Twitter</a>
</div>
</div>
</footer>
</div>
</body>
</html>