-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathproject.html
277 lines (264 loc) · 19.4 KB
/
project.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
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="description" content="Asia Rahman is a front-end and back-end web designer and developer. She develops and designs both static and dynamic websites those are simple, usable, effective and responsive as well." />
<title>Projects of Asia Rahman</title>
<link rel="icon" href="./images/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="./css/all.css" />
<link rel="stylesheet" href="./css/animate.css" />
<link rel="stylesheet" href="./css/bootstrap.css" />
<link rel="stylesheet" href="./css/mdb.lite.css" />
<link rel="stylesheet" href="./css/mdb.css" />
<link rel="stylesheet" href="./css/style.css" />
</head>
<body>
<!--header-->
<section class="bg-project">
<header class="card bg-transparent text-center h-100">
<div class="">
<div class="header-text font-italic">
<div class="wow flipInX p-3">
<p class="pt-4 p-3">Best of <span class="font-weight-bold">my works</span></p>
</div>
</div>
</div>
</header>
</section>
<!--header-->
<!--Navbar -->
<section style="z-index: 999;" id="navbar">
<div class="card rounded-0 shadow-none logo-div" style="">
<img src="./images/logo_white1.png" class="logo mx-auto mt-2" alt="Asia Rahman's Logo" />
</div>
<nav class="navbar navbar-expand-sm bg-white text-center navbar-pt">
<button class="navbar-toggler mx-auto" type="button" data-toggle="collapse" data-target="#menu"
aria-controls="menu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"><i class="fas fa-bars nav-icon"></i></span>
</button>
<div class="collapse navbar-collapse " id="menu">
<ul class="navbar-nav mx-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home
<span class="sr-only">(current)</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="about.html">About</a>
</li>
<li class="nav-item">
<a class="nav-link " href="skill.html">Skill</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="project.html">Project</a>
</li>
</ul>
</div>
</nav>
</section>
<!--/.Navbar -->
<!--project-->
<section>
<div class="bg-white">
<div class="container pt-5 pb-4" >
<div class="row">
<div class="col-md-12">
<h2 class="text-color skill-heading">Static Website</h2>
<hr class="bg-color"/>
<div class="row">
<div class="col-md-6 text-justify text-muted wow bounceInLeft">
<h5><span style="font-size: xx-large;">T</span>his is a static website which consists of multiple pages. It is a site for interior design and home decoration company.</h5>
<h5 class="font-weight-bold text-capitalize pt-2"><u>built with:</u></h5>
<div class="text-left">
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">HTML 5</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">CSS 3</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Bootstrap 4</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">JavaScript</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">jQuery</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">jQuery Plugins</button>
</div>
<div class="py-3">
<a href="https://asiahub-10.github.io/asia-art/" target="_blank" title="Demo" class="btn btn-lg font-weight-bold rounded bg-color text-white"><i class="fas fa-desktop mr-2"></i> preview</a>
<a href="https://github.com/asiahub-10/asia-art" target="_blank" title="Source Code" class="btn btn-lg font-weight-bold rounded bg-dark text-white"><i class="fab fa-github mr-2"></i> Repository</a>
</div>
</div>
<div class="col-md-6 px-0 wow bounceInRight">
<img src="./images/static-web.png" alt="Static Website" class="card-img" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="rgba-grey-slight">
<div class="container pt-5 pb-4" >
<div class="row">
<div class="col-md-12">
<h2 class="text-color skill-heading">PSD to HTML</h2>
<hr class="bg-color"/>
<div class="row">
<div class="col-md-6 px-0 wow bounceInLeft">
<img src="./images/psd-html.png" alt="PSD to HTML" class="card-img" />
</div>
<div class="col-md-6 text-justify text-muted wow bounceInRight">
<h5><span style="font-size: xx-large;">I</span>t's a project on conversion to HTML from PSD file. This is a single page static website.</h5>
<h5 class="font-weight-bold text-capitalize pt-2"><u>built with:</u></h5>
<div class="text-left">
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">HTML 5</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">CSS 3</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Bootstrap 4</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">JavaScript</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">jQuery</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">jQuery Plugins</button>
</div>
<div class="py-3">
<a href="https://asiahub-10.github.io/NewLight-PSD-to-HTML/" target="_blank" title="Demo" class="btn btn-lg font-weight-bold rounded bg-color text-white"><i class="fas fa-desktop mr-2"></i> preview</a>
<a href="https://github.com/asiahub-10/NewLight-PSD-to-HTML" target="_blank" title="Source Code" class="btn btn-lg font-weight-bold rounded bg-dark text-white"><i class="fab fa-github mr-2"></i> Repository</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="bg-white">
<div class="container pt-5 pb-4" >
<div class="row">
<div class="col-md-12">
<h2 class="text-color skill-heading">Dynamic Website (Server Side)</h2>
<hr class="bg-color"/>
<div class="row">
<div class="col-md-6 text-justify text-muted wow bounceInLeft">
<h5><span style="font-size: xx-large;">T</span>his is a dynamic ecommerce website for admin panel which is created with laravel. Basically this is back-end of the ecommerce site and also linked up with a front-end.</h5>
<h5>In addition, the front-end of this site is created with vue.js whose link is also given bellow.</h5>
<h5 class="font-weight-bold text-capitalize pt-2"><u>built with:</u></h5>
<div class="text-left">
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">HTML</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">CSS</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Bootstrap</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">JavaScript</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">jQuery</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">ajax</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">php</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">laravel</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">laravel packages</button>
</div>
<div class="py-3">
<a href="https://asiahub-10.github.io/my-project-preview/" target="_blank" title="Demo Video" class="btn btn-lg font-weight-bold rounded bg-color text-white"><i class="fas fa-play-circle mr-2"></i> preview video</a>
<a href="https://github.com/asiahub-10/my-project" target="_blank" title="Source Code" class="btn btn-lg font-weight-bold rounded bg-dark text-white"><i class="fab fa-github mr-2"></i> Repository</a>
</div>
</div>
<div class="col-md-6 px-0 wow bounceInRight">
<img src="./images/dynamic-server.png" alt="Server Side Website" class="card-img" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="rgba-grey-slight">
<div class="container pt-5 pb-4" >
<div class="row">
<div class="col-md-12">
<h2 class="text-color skill-heading">Dynamic Website (Client Side)</h2>
<hr class="bg-color"/>
<div class="row">
<div class="col-md-6 px-0 wow bounceInLeft">
<img src="./images/dynamic-client.png" alt="Client Side Website" class="card-img" />
</div>
<div class="col-md-6 text-justify text-muted wow bounceInRight">
<h5><span style="font-size: xx-large;">T</span>his is a dynamic ecommerce website which is created with vue js. Basically this is front-end of the ecommerce site and also linked up with a back-end.</h5>
<h5>In addition, the back-end of this site, which is only accessed by the admin panel, is created with laravel whose link has also be given before.</h5>
<h5 class="font-weight-bold text-capitalize pt-2"><u>built with:</u></h5>
<div class="text-left">
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">HTML</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">CSS</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">MDBootstrap</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">JavaScript</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">ajax</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Vue.js</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Vuex</button>
<button disabled class="btn btn-outline-dark btn-sm font-weight-bold rounded px-2" style="font-size: small;">Vue packages</button>
</div>
<div class="py-3">
<a href="https://asiahub-10.github.io/my-project-front-preview/" target="_blank" title="Demo Video" class="btn btn-lg font-weight-bold rounded bg-color text-white"><i class="fas fa-play-circle mr-2"></i> preview video</a>
<a href="https://github.com/asiahub-10/my-project-front" target="_blank" title="Source Code" class="btn btn-lg font-weight-bold rounded bg-dark text-white"><i class="fab fa-github mr-2"></i> Repository</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="container py-5 text-center">
<div class="row">
<h4 class="text-uppercase mx-auto font-weight-bold text-muted wow flipInX">For more you can check out
<a href="https://github.com/asiahub-10?tab=repositories" title="Github Repositories" target="_blank" class="text-color font-italic">my github <i class="fab fa-github-alt"></i></a>
</h4>
</div>
</div>
</section>
<!--project-->
<!--contact-->
<section class="contact">
<div class="card rounded-0 rgba-red-strong container-fluid px-0">
<div class="row">
<div class="col-sm-12 text-center text-white contact-text px-5 wow bounceIn" data-wow-delay=".25s">
<h1 class="font-weight-bold text-uppercase contact-header">Let's work together.</h1>
<p class="contact-para">Have a project that you'd like to discuss with me?</p>
<p class="contact-para">Send a mail to
<span class="font-weight-bold font-italic text-dark" style="text-shadow: 2px 2px 4px white;">asiarahman104@gmail.com</span>
</p>
</div>
</div>
<div class="bar1"></div>
<div class="bar2"></div>
<div class="triangle"></div>
</div>
</section>
<!--contact-->
<!--footer-->
<footer>
<div class="container">
<div class="row">
<div class="col-sm-12 text-center pb-4">
<h3 class="text-uppercase text-muted mb-4 footer-title">stay connected with</h3>
<a href="https://www.facebook.com/asiarahman.shorna" target="_blank" title="Facebook"><img src="./images/fb.png" alt="Icon" class="social-icon" /></a>
<a href="https://twitter.com/AsiaShorna" target="_blank" title="Twitter"><img src="./images/twitter.png" alt="Icon" class="social-icon" /></a>
<a href="https://bd.linkedin.com/in/asia-rahman-647875b4?trk=people-guest_profile-result-card_result-card_full-click" target="_blank" title="LinkedIn"><img src="./images/linkedin.png" alt="Icon" class="social-icon" /></a>
<a href="https://github.com/asiahub-10" target="_blank" title="Github"><img src="./images/github.png" alt="Icon" class="social-icon" /></a>
<a href="https://asiarahman.blogspot.com/" target="_blank" title="Blogger"><img src="./images/blogger.png" alt="Icon" class="social-icon" /></a>
</div>
</div>
<div class="row">
<div class="col-sm-12 text-center pb-5 text-muted">
<hr style="background-color: #c0504d;"/>
<p class="m-0">©2020 Asia Rahman. Designed by <span class="font-italic font-weight-bold text-color">Asia Rahman</span>.</p>
<p class="m-0">All Rights Reserved.</p>
</div>
</div>
</div>
</footer>
<!--footer-->
<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("navbar");
var sticky = navbar.offsetTop;
function myFunction() {
if (window.pageYOffset >= sticky) {
navbar.classList.add("sticky")
} else {
navbar.classList.remove("sticky");
}
}
</script>
<script src="./js/wow.min.js"></script>
<script src="./js/jquery-3.4.1.min.js"></script>
<script src="./js/bootstrap.js"></script>
<script src="./js/mdb.js"></script>
<script src="./js/script.js"></script>
</body>
</html>