-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout-me.html
137 lines (113 loc) · 5.5 KB
/
about-me.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
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
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pixabay Fernandez</title>
<meta name="description" content="A website template for photographers">
<!-- FONT AWESOME CDN -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="styles/about-me.css">
<!-- AOS ANIMATIONS-->
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/[email protected]/dist/aos.js" defer></script>
<script src="./src/js/aos.js" defer></script>
</head>
<body>
<!-- WHOLE PAGE CONTAINER -->
<div class="about-me_big-container">
<!-- HEADER -->
<header class="general_header">
<!-- SOCIAL MEDIA LINKS -->
<div class="general_header_social-media">
<a href="#" rel="external noopener noreferrer">
<i class="fa-brands fa-instagram"></i>
</a>
<a href="#" rel="external noopener noreferrer">
<i class="fa-brands fa-facebook"></i>
</a>
</div>
<!-- MAIN HEADING / HOME LINK -->
<h1 class="general_header_heading">
PIXABAY Fernandez
</h1>
<!-- HAMBURGER -->
<div class="general_header_hamburger-wrapper">
<button class="general_header_hamburger">
<span></span>
<span></span>
<span></span>
</button>
</div>
<!-- NAVIGATION -->
<nav class="general_header_nav" aria-label="primary navigation">
<h2 class="hidden">Navigation</h2>
<div class="general_header_nav_img"></div>
<ul class="general_header_nav_list">
<li>
<a href="./about-me.html">About Me</a>
</li>
<li>
Portfolio
<ul>
<li>
<a href="./gallery_wildlife.html">Wildlife</a>
</li>
<li>
<a href="./gallery_nature.html">Nature</a>
</li>
<li>
<a href="./gallery_pets.html">Pets</a>
</li>
</ul>
</li>
<li>
<a href="./credits.html">Credits</a>
</li>
</ul>
</nav>
</header>
<!-- ABOUT ME -->
<section class="about-me_content">
<header class="about-me_content_header">
<h2 data-aos="zoom-in">About Me</h2>
<img src="./pics/Skitterphoto_man.jpg" alt="photographer">
</header>
<p data-aos="fade-right">Lorem ipsum dolor sit amet consectetur adipisicing elit. Error dolores id quae iusto minima? Necessitatibus impedit soluta aliquam accusantium nulla corrupti repellat placeat, sequi iste quod alias fugiat distinctio assumenda?</p>
<p data-aos="fade-left">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Rem omnis eaque, dolore perferendis, fugiat et modi ad ipsam sed eligendi nostrum sapiente a officia ex eveniet? Culpa explicabo ratione error. Lorem ipsum dolor sit amet consectetur adipisicing elit. Exercitationem adipisci quisquam, enim qui quas facere. Beatae magnam harum nisi vero sint. Expedita laborum assumenda repellendus perspiciatis temporibus harum vero debitis.
</p>
<p data-aos="fade-up">Lorem ipsum dolor sit amet consectetur adipisicing elit. Error dolores id quae iusto minima? Necessitatibus impedit soluta aliquam accusantium nulla corrupti repellat placeat, sequi iste quod alias fugiat distinctio assumenda?</p>
</section>
<!-- FOOTER -->
<footer class="general_footer footer">
<h2>PIXABAY <span>Fernandez</span></h2>
<!-- PORTFOLIO NAVIGATION -->
<nav class="general_footer_gallery-navigation" aria-label="portfolio navigation">
<h3 class="hidden">Portfolio Navigation</h3>
<ul>
<li>
<a href="./gallery_wildlife.html">Wildlife</a>
</li>
<li>
<a href="./gallery_nature.html">Nature</a>
</li>
<li>
<a href="./gallery_pets.html">Pets</a>
</li>
</ul>
</nav>
<button class="general_footer_arrow-up">
<p>↑</p>
</button>
</footer>
<div class="general_loader">
<img src="./pics/loader.svg" alt="loader">
</div>
</div> <!-- END / WHOLE PAGE CONTAINER-->
<script src="./src/js/dom_elements.js"></script>
<script src="./src/js/hamburger.js"></script>
<script src="./src/js/jump_home.js"></script>
<script src="./src/js/global-buttons.js"></script>
<script src="./src/js/loader.js"></script>
</body>
</html>