-
Notifications
You must be signed in to change notification settings - Fork 0
/
demos.html
147 lines (141 loc) · 6.49 KB
/
demos.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
138
139
140
141
142
143
144
145
146
147
<!DOCTYPE html>
<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">
<link href="images/favicon.png" rel="icon" />
<title>Simone - Personal Portfolio Template</title>
<meta name="description" content="Simone is responsive bootstrap 5 one page personal portfolio html template.">
<meta name="author" content="harnishdesign.net">
<!-- Web Fonts
======================= -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<!-- Stylesheet
======================= -->
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/stylesheet.css"/>
</head>
<body>
<!-- Preloader -->
<div class="preloader">
<div class="lds-ellipsis">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
</div>
<!-- Preloader End -->
<div id="main-wrapper">
<!-- Header -->
<header class="text-center bg-white py-5">
<h1 class="text-12 fw-700">Simone</h1>
<h2 class="text-muted text-6 fw-400">Personal Portfolio Template</h2>
</header>
<div class="container text-center pb-5">
<h2 class="text-7 mb-4 text-dark text-uppercase fw-600">Light <span class="fw-300 mx-2">&</span> Dark Demo <span class="fw-300 mx-2">+</span> (RTL)</h2>
<div class="row gx-5 mx-lg-4 portfolio">
<div class="col-md-6 my-4">
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/index.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="index.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Light</a>
<a href="index-dark.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Dark</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">Side Header - <span class="text-info">Image Background</span></h3>
</div>
</div>
</div>
<div class="col-md-6 my-4">
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/index-video.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="index-video-youtube.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Light</a>
<a href="index-video-youtube-dark.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Dark</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">Side Header - <span class="text-info">Video Background</span></h3>
</div>
</div>
</div>
<div class="col-md-6 my-4">
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/index-classic-header.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="index-classic-header.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Light</a>
<a href="index-dark-classic-header.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Dark</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">Classic Header - <span class="text-info">Image Background</span></h3>
</div>
</div>
</div>
<div class="col-md-6 my-4">
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/index-video-classic-header.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="index-video-youtube-classic-header.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Light</a>
<a href="index-video-youtube-dark-classic-header.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">Dark</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">Classic Header - <span class="text-info">Video Background</span></h3>
</div>
</div>
</div>
<div class="col-md-6 my-4">
<h2 class="text-7 mb-4 text-dark text-uppercase fw-600">RTL Version</h2>
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/index-rtl.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="index-rtl.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">View Demo</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">RTL - Default</h3>
</div>
</div>
</div>
<div class="col-md-6 my-4">
<h2 class="text-7 mb-4 text-dark text-uppercase fw-600">Elements</h2>
<div class="portfolio-box mb-3">
<div class="portfolio-img shadow-lg"> <img class="img-fluid d-block" src="images/demos/elements.jpg" alt="">
<div class="portfolio-overlay">
<div class="portfolio-overlay-details">
<a href="elements.html" target="_blank" class="btn btn-outline-light btn-lg mx-1">View Demo</a>
</div>
</div>
</div>
<div class="portfolio-details pb-0">
<h3 class="text-4 fw-500 mb-0">Elements</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer id="footer" class="text-center bg-dark footer-text-light py-5">
<p class="mb-0">Copyright © 2022 <a href="#" class="fw-500">Simone</a>. All Rights Reserved.</p>
</footer>
</div>
<!-- Script -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="js/theme.js"></script>
</body>
</html>