Repository navigation
Expand file tree
/
Copy pathindex.html
More file actions
134 lines (128 loc) · 6.66 KB
/
Copy pathindex.html
File metadata and controls
134 lines (128 loc) · 6.66 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
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<title>Front End Developer</title>
</head>
<body>
<header>
<nav class="navbar navbar-dark" style="background-color: #2b2b2b;">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class=" navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#" tabindex="-1" aria-disabled="true">Contact Us</a>
</li>
</ul>
</div>
</nav>
</header>
<div class="wrapper">
<div class="row">
<div class="header-description col-lg content-align-center">
<h2>I am Mark Recabo</h2>
<h1>Front End <span>Developer</span></h1>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Unde ducimus deleniti magnam saepe aspernatur ipsum, sunt inventore eaque tempora repellendus ut necessitatibus tenetur aliquid deserunt accusantium blanditiis dolorem harum nam?</p>
<button><a href="#">Learn more about me</a></button>
<!-- -->
</div>
</div>
<section class="featured-blog">
<div class="fluid-container">
<div class="row">
<div class="col-md-4 col-sm-12 blog">
<h2>Lorem ipsum dolor sit amet consectetur <br> <span>Posted By Mark Recabo</span></h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus necessitatibus ea laborum, quas vero fuga. Nesciunt at ut, iste quam deserunt nobis excepturi amet ullam. Ad veniam aperiam atque iusto.</p>
</div>
<div class="col-md-4 col-sm-12 blog">
<h2>Lorem ipsum dolor sit amet consectetur <br> <span>Posted By Mark Recabo</span></h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus necessitatibus ea laborum, quas vero fuga. Nesciunt at ut, iste quam deserunt nobis excepturi amet ullam. Ad veniam aperiam atque iusto.</p>
</div>
<div class="col-md-4 col-sm-12 blog">
<h2>How to change design header in WordPress<br> <span>Posted By Mark Recabo</span></h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus necessitatibus ea laborum, quas vero fuga. Nesciunt at ut, iste quam deserunt nobis excepturi amet ullam. Ad veniam aperiam atque iusto.</p>
</div>
</div>
</div> <!-- end of fluid container div -->
</section>
<section class="portfolio">
<div class="fluid-container">
<div class="row portfolio">
<div class="col-md-4 img-gallery">
<img class="img-fluid" src="./img/img1.jpg" alt="">
</div>
<div class="col-md-4">
<img src="./img/img2.jpg" alt="" class="img-fluid">
</div>
<div class="col-md-4">
<img src="./img/img3.jpg" alt="" class="img-fluid">
</div>
<div class="col-md-4 img-gallery">
<img class="img-fluid" src="./img/img3.jpg" alt="">
</div>
<div class="col-md-4">
<img src="./img/img1.jpg" alt="" class="img-fluid">
</div>
<div class="col-md-4">
<img src="./img/img2.jpg" alt="" class="img-fluid">
</div>
</div>
</div>
</section>
<section class="cta-contact">
<h2>Want to work with me?</h2>
<button class="cta-home"><a href="#">Contact me</a></button>
</section>
<footer class="main-footer">
<div class="container">
<div class="row">
<div class="col-md-4 footer-md quicklinks">
<h3>Quick Links</h3>
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Contact</a>
</li>
<li>
<a href="#">Portfolio</a>
</li>
</div>
<div class="col-md-4 footer-md social-links">
<h3>Connect with me!</h3>
<div class="s-icons">
<li><a href="facebook.com"><i class="fab fa-facebook-square"></i></a></li>
<li><a href="facebook.com"><i class="fab fa-facebook-square"></i></a></li>
<li><a href="facebook.com"><i class="fab fa-facebook-square"></i></a></li>
</div>
</div>
<div class="col-md-4 footer-md resource">
<h3>Quick about me!</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Est, recusandae quae. Ut cupiditate impedit nulla fuga non commodi, tempora, id suscipit architecto omnis ratione sed dolorum.</p>
</div>
</div>
</div>
</footer>
</div>
<script scr="main.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>