forked from Abraham-Tourdex/bootstrap-ecommerce
-
Notifications
You must be signed in to change notification settings - Fork 0
/
design.html
169 lines (144 loc) · 6.8 KB
/
design.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
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="author" content="Bootstrap-ecommerce by Vosidiy">
<meta name="description" content=" ecommerce design templates sketchapp download, Bootstrap 4 e-ecommerce templates, best online shopping themes for web site">
<meta name="keywords" content="e-commerce, bootstrap ecommerce, HTML, CSS, Bootstrap 4, framework, online shopping template">
<title> Ecommerce website design templates. E-commerce UI design sketchapp</title>
<link href="images/favicon.ico" rel="shortcut icon" type="image/x-icon">
<!-- jQuery -->
<script src="main/js/jquery-2.0.0.min.js" type="text/javascript"></script>
<!-- Bootstrap4 files-->
<link href="main/css/bootstrap-custom.css" rel="stylesheet" type="text/css"/>
<script src="main/js/bootstrap.bundle.min.js" type="text/javascript"></script>
<!-- Font awesome 5 -->
<link href="main/fonts/fontawesome/css/fontawesome-all.min.css" type="text/css" rel="stylesheet">
<!-- custom style -->
<link href="_assets/custom.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
/// some script
// jquery ready start
$(document).ready(function() {
// jQuery code
///////////////// fixed menu on scroll for desctop
if ($(window).width() > 768) {
$(window).scroll(function(){
if ($(this).scrollTop() > 125) {
$('.header').addClass("scrolled");
}else{
$('.header').removeClass("scrolled");
}
});
}
});
// jquery end
</script>
</head>
<body>
<!-- ========================= SECTION HEADER ========================= -->
<header class="header navbar-sticky bg-white">
<nav class="navbar navbar-light navbar-expand-md">
<a class="navbar-brand" href="http://bootstrap-ecommerce.com">
<img src="main/images/logo.png" class="logo">
<div class="slogan slogan-dark">Bootstrap <br> Ecommerce UI</div>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarCollapse">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="index.html"> Home </a>
</li>
<li class="nav-item">
<a class="nav-link" href="main/html-components.html">HTML components</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="design.html">Design blocks </a>
</li>
<li class="nav-item">
<a class="nav-link" href="templates.html">Templates</a>
</li>
<li><a class="nav-link" href="#hireme" data-toggle="modal">Hire me</a></li>
</ul>
<a class="btn btn-purple mt-2 mt-md-0 ml-md-3" href="http://bootstrap-ecommerce.com/download.html" data-toggle="tooltip" title="SketchApp Design & HTML Bootstrap version">Download all</a>
</div>
</nav>
</header>
<!-- ========================= SECTION HEADER END // ========================= -->
<!-- ========================= SECTION CONTENT ========================= -->
<section class="section-content padding-y-lg bg">
<div class="container">
<header class="mb-5 text-center">
<h2>E-commerce sketchApp design templates </h2>
<p class="d-inline-block" style="width: 70%">Creative ecommerce website design based on ecommerce ui kit for sketch. Download shopping website design blocks to create Your new project. Get free ecommerce sketch app design templates Can be used for any ecommerce, online shopping web sites and booking projects.</p>
</header>
<div class="row">
<div class="col-md-12 col-sm-12">
<img src="design/shots/products.png" class="img-thumbnail mb-4" title="ecommerce website ui product cards design" alt="ecommerce product cards design">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<img src="design/shots/headers.png" class="img-thumbnail mb-4" title="ecommerce website header design" alt="e-commerce header menu design">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<img src="design/shots/product-detail.png" class="img-thumbnail mb-4" title="ecommerce ui product detail design" alt="website design product details">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<img src="design/shots/product-listing.png" class="img-thumbnail mb-4" title=" web site product listing design" alt="website e-commerce product list view ui">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<img src="design/shots/forms.png" class="img-thumbnail mb-4" title="login form design, registration form design sketchapp, sketch design form, sign in, sign up design creative html">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<img src="design/shots/items-aside.png" class="img-thumbnail mb-4" title="ecommerce sidebar product listing design" alt="sidebar product items design for shopping website">
</div> <!-- col // -->
<div class="col-md-12 col-sm-12">
<figure>
<img src="design/shots/template-showcase.png" class="img-thumbnail mb-4" title="ecommerce web design" alt="creative shopping design website">
<figcaption class="text-center"> Creative ecommerce design template. Shopping website designs</figcaption>
</figure>
</div> <!-- col // -->
</div> <!-- row.// -->
<hr>
<p class="text-center">
<a href="download.html" class="btn btn-lg btn-warning">Download All</a> <br>
<small>SketchApp + Bootstrap 4</small>
</p>
</div><!-- container // -->
</section>
<!-- ========================= SECTION CONTENT END// ========================= -->
<!-- ========================= SECTION FOOTER ========================= -->
<footer class="bg-purple white text-center py-5" id="page_footer">
<div class="container">
Made with <i class="fa fa-heart"></i> by <a class="text-light" href="mailto:[email protected]">Vosidiy M.</a>   © 2018 <br>
<a href="http://bootstrap-ecommerce.com" class="text-light">Bootstrap-ecommerce UI kit</a>
</div><!-- container // -->
</footer>
<!-- ========================= SECTION FOOTER END // ========================= -->
<!-- Modal -->
<div class="modal fade" tabindex="-1" id="hireme" role="dialog">
<div class="modal-dialog modal-md" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Do you need help for...</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
×
</button>
</div>
<div class="modal-body">
<ul class="list-bullet">
<li>SketchApp, PSD design to HTML5/CSS3.</li>
<li>UI design of website or app</li>
<li>Customize this UI KIT for your project</li>
</ul>
<p>Portfolio: <a href="http://behance.com/vosidiy" target="_blank">Behance.com/vosidiy</a> <br>
Email me: <b>[email protected]</b>
</p>
</div>
</div>
</div>
</div> <!-- modal.// -->
</body>
</html>