-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
142 lines (139 loc) · 9.12 KB
/
Copy pathindex.html
File metadata and controls
142 lines (139 loc) · 9.12 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
140
141
142
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Home - Brand</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,300italic,400italic,700italic">
<link rel="stylesheet" href="assets/fonts/font-awesome.min.css">
<link rel="stylesheet" href="assets/fonts/simple-line-icons.min.css">
</head>
<body id="page-top"><a href="#" class="menu-toggle rounded"><i class="fa fa-bars"></i></a>
<nav class="navbar navbar-light navbar-expand" id="sidebar-wrapper">
<div class="container"><button class="navbar-toggler d-none" data-toggle="collapse" data-target="#"></button>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav sidebar-nav" id="sidebar-nav">
<li class="nav-item sidebar-brand" role="presentation"><a class="nav-link active js-scroll-trigger" href="#page-top">Brand</a></li>
<li class="nav-item sidebar-nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#page-top">Home</a></li>
<li class="nav-item sidebar-nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#about">About</a></li>
<li class="nav-item sidebar-nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#services">Services</a></li>
<li class="nav-item sidebar-nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#portfolio">Portfolio</a></li>
<li class="nav-item sidebar-nav-item" role="presentation"><a class="nav-link js-scroll-trigger" href="#contact">Contact</a></li>
</ul>
</div>
</div>
</nav>
<header class="d-flex masthead" style="background-image:url('assets/img/bg-masthead.jpg');">
<div class="container my-auto text-center">
<h1 class="mb-1">VirtualUY</h1>
<h3 class="mb-5"><em>A Free Bootstrap Theme</em></h3><a class="btn btn-primary btn-xl js-scroll-trigger" role="button" href="#about">Find Out More</a>
<div class="overlay"></div>
</div>
</header>
<section id="about" class="content-section bg-light">
<div class="container text-center">
<div class="row">
<div class="col-lg-10 mx-auto">
<h2>Stylish Portfolio is the perfect theme for your next project!</h2>
<p class="lead mb-5"><span>This theme features a flexible, UX friendly sidebar menu and stock photos from our friends at </span><a href="https://unsplash.com/">Unsplash</a><span>!</span></p><a class="btn btn-dark btn-xl js-scroll-trigger" role="button"
href="#services">What We Offer</a></div>
</div>
</div>
</section>
<section id="services" class="content-section bg-primary text-white text-center">
<div class="container">
<div class="content-section-heading">
<h3 class="text-secondary mb-0">Services</h3>
<h2 class="mb-5">What We Offer</h2>
</div>
<div class="row">
<div class="col-md-6 col-lg-3 mb-5 mb-lg-0"><span class="mx-auto service-icon rounded-circle mb-3"><i class="icon-screen-smartphone"></i></span>
<h4><strong>Responsive</strong></h4>
<p class="mb-0 text-faded">Looks great on any screen size!</p>
</div>
<div class="col-md-6 col-lg-3 mb-5 mb-lg-0"><span class="mx-auto service-icon rounded-circle mb-3"><i class="icon-pencil"></i></span>
<h4><strong>Redesigned</strong></h4>
<p class="mb-0 text-faded">Freshly redesigned for Bootstrap 4.</p>
</div>
<div class="col-md-6 col-lg-3 mb-5 mb-lg-0"><span class="mx-auto service-icon rounded-circle mb-3"><i class="icon-like"></i></span>
<h4><strong>Favorited</strong></h4>
<p class="mb-0 text-faded"><span>Milions of users </span><i class="fa fa-heart"></i><span> us!</span></p>
</div>
<div class="col-md-6 col-lg-3 mb-5 mb-lg-0"><span class="mx-auto service-icon rounded-circle mb-3"><i class="icon-mustache"></i></span>
<h4><strong>Question</strong></h4>
<p class="mb-0 text-faded">I mustache you a question...</p>
</div>
</div>
</div>
</section>
<section class="callout" style="background:linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.1) 100%), url("assets/img/bg-callout.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;">
<div class="container text-center">
<h2 class="mx-auto mb-5"><span>Welcome to </span><em>your</em><span><br>next website!<br></span></h2><a class="btn btn-primary btn-xl" role="button" href="#">Download Now!</a></div>
</section>
<section id="portfolio" class="content-section">
<div class="container">
<div class="content-section-heading text-center">
<h3 class="text-secondary mb-0">Portfolio</h3>
<h2 class="mb-5">Recent Projects</h2>
</div>
<div class="row no-gutters">
<div class="col-lg-6">
<a href="#" class="portfolio-item">
<div class="caption">
<div class="caption-content">
<h2>Stationary</h2>
<p class="mb-0">A yellow pencil with envelopes on a clean, blue backdrop!</p>
</div>
</div><img class="img-fluid" src="assets/img/portfolio-1.jpg"></a>
</div>
<div class="col-lg-6">
<a href="#" class="portfolio-item">
<div class="caption">
<div class="caption-content">
<h2>Ice Cream</h2>
<p class="mb-0">A dark blue background with a colored pencil, a clip, and a tiny ice cream cone!</p>
</div>
</div><img class="img-fluid" src="assets/img/portfolio-2.jpg"></a>
</div>
<div class="col-lg-6">
<a href="#" class="portfolio-item">
<div class="caption">
<div class="caption-content">
<h2>Strawberries</h2>
<p class="mb-0">Strawberries are such a tasty snack, especially with a little sugar on top!</p>
</div>
</div><img class="img-fluid" src="assets/img/portfolio-3.jpg"></a>
</div>
<div class="col-lg-6">
<a href="#" class="portfolio-item">
<div class="caption">
<div class="caption-content">
<h2>Workspace</h2>
<p class="mb-0">A yellow workspace with some scissors, pencils, and other objects.</p>
</div>
</div><img class="img-fluid" src="assets/img/portfolio-4.jpg"></a>
</div>
</div>
</div>
</section>
<section class="content-section bg-primary text-white">
<div class="container text-center">
<h2 class="mb-4">The buttons below are impossible to resist..</h2><a class="btn btn-light btn-xl mr-4" role="button" href="#">Click Me!</a><a class="btn btn-dark btn-xl mr-4" role="button" href="#">Look at Me</a></div>
</section>
<section id="contact" class="map"><iframe allowfullscreen="" frameborder="0" width="100%" height="400" src="https://www.google.com/maps/embed/v1/place?key=+&q=Paris%2C+France&zoom=11"></iframe></section>
<footer class="footer text-center">
<div class="container">
<ul class="list-inline mb-5">
<li class="list-inline-item"> <a class="text-white social-link rounded-circle" href="#"><i class="icon-social-facebook"></i></a></li>
<li class="list-inline-item"> <a class="text-white social-link rounded-circle" href="#"><i class="icon-social-twitter"></i></a></li>
<li class="list-inline-item"> <a class="text-white social-link rounded-circle" href="#"><i class="icon-social-github"></i></a></li>
</ul>
<p class="text-muted mb-0 small">Copyright © Brand 2018</p>
</div><a href="#page-top" class="js-scroll-trigger scroll-to-top rounded"><i class="fa fa-angle-up"></i></a></footer>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
<script src="assets/js/stylish-portfolio.js"></script>
</body>
</html>