-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
111 lines (110 loc) · 5.74 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Materialize-Portfolio</title>
<link rel="stylesheet" href="assets/css/reset.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Abril+Fatface" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
crossorigin="anonymous">
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<nav class="grey darken-4 collapse-small">
<div class="container">
<div class="nav-wrapper">
<a href="index.html" class="logo">MEARAT</a>
<a href="#" data-target="mobile-demo" class="sidenav-trigger hide-on-med-and-up">
<i class="material-icons">menu</i>
</a>
<ul class="right hide-on-small-only">
<li class="hover">
<a href="index.html" class="center-align">About</a>
</li>
<li class="hover">
<a href="portfolio.html" class="center-align">Portfolio</a>
</li>
<li class="hover">
<a href="contact.html" class="center-align">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<ul class="sidenav hide-on-med-and-up" id="mobile-demo">
<li>
<a href="index.html">About</a>
</li>
<li>
<a href="portfolio.html">Portfolio</a>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
<main>
<div class="container">
<div class="section">
<h5 class="flow-text valign-wrapper">
<i class="material-icons medium">account_circle</i>About</h5>
</div>
<div class="divider"></div>
<br>
</div>
<div class="container z-depth-2">
<img class="responsive-img circle z-depth-2" align="left" width="200px" height="200px" src="assets/img/DSC00573.jpg" alt="profile picture">
<p class="flow-text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam animi magnam enim dolorem, ipsum reprehenderit
officia tenetur repudiandae numquam est soluta dignissimos inventore non, eos quaerat necessitatibus! Impedit,
voluptatibus iure. Corporis sed, rem facilis tenetur adipisci repudiandae quis quibusdam expedita dolorem.
Pariatur, neque cum. Velit, sit dolores culpa nisi aut tempora, dignissimos nulla eveniet maiores veniam
qui eius in reiciendis quo? Odit consequatur unde accusamus impedit. Dolore nesciunt aliquid repellendus,
sapiente hic iusto distinctio doloremque modi reprehenderit sint reiciendis dolorem optio assumenda incidunt,
mollitia doloribus atque amet eligendi tenetur perspiciatis ducimus officia impedit maiores. Inventore unde
ducimus rem?
</p>
<p class="flow-text">Provident unde nihil minima inventore maiores itaque delectus. Sed inventore, autem dignissimos sunt ullam corporis
deserunt voluptatibus tenetur suscipit animi? Deserunt voluptatum tempore cumque excepturi neque sit a earum
voluptatibus laboriosam officiis, beatae quas, repellendus veritatis vitae. Reprehenderit debitis, excepturi
eaque ipsam fugiat nesciunt deleniti dignissimos amet totam perferendis vel blanditiis? Unde.
</p>
<p class="flow-text">Provident unde nihil minima inventore maiores itaque delectus. Sed inventore, autem dignissimos sunt ullam corporis
deserunt voluptatibus tenetur suscipit animi? Deserunt voluptatum tempore cumque excepturi neque sit a earum
voluptatibus laboriosam officiis, beatae quas, repellendus veritatis vitae. Reprehenderit debitis, excepturi
eaque ipsam fugiat nesciunt deleniti dignissimos amet totam perferendis vel blanditiis? Unde.
</p>
</div>
<div class="section"></div>
<div class="section"></div>
</main>
<footer class="page-footer grey darken-3 z-depth-2">
<div class="container">
<div class="col s12 center-align">
<h5>Follow Me</h5>
<a href="https://github.com/mearatjames" class="white-text">
<i class="fab fa-github fa-3x"></i>
</a>
<a href="https://www.linkedin.com/in/mearat-hou-013a93164/s" class="white-text">
<i class="fab fa-linkedin fa-3x"></i>
</a>
<a href="https://stackoverflow.com/users/9907520/mearat-hou" class="white-text">
<i class="fab fa-stack-overflow fa-3x"></i>
</a>
</div>
</div>
<div class="footer-copyright grey darken-4 center-align z-depth-2">
<div class="container">
© 2018 Copyright
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-rc.2/js/materialize.min.js"></script>
<script>$(document).ready(function () {
$('.sidenav').sidenav();
});</script>
</body>
</html>