-
Notifications
You must be signed in to change notification settings - Fork 0
/
webdev.html
364 lines (364 loc) · 13.7 KB
/
webdev.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
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
<!DOCTYPE html>
<html lang="en">
<head>
<title>Shadowlabs | Web Development</title>
<link rel="shortcut icon" href="images/main/logo.png" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="css\webdev.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<!--Semantic import-->
<script src="assets/semantic/semantic.min.js"></script>
<link href="assets/semantic/semantic.min.css" rel="stylesheet" />
<!--Font-->
<link href="https://fonts.googleapis.com/css?family=Exo+2|Ubuntu" rel="stylesheet">
<!-- Javascript -->
<script src="js/webdev.js"></script>
<script src="js/root.js"></script>
<script src="js/contact.js"></script>
<!--Recaptcha-->
<script src="https://www.google.com/recaptcha/api.js"></script>
</head>
<body>
<div class="ui sidebar vertical menu">
<a class="item" href="index.html">Home</a>
<a class="item" href="404.html">Portfolio</a>
<a class="item" href="gamesdev.html">Games Development</a>
<a class="active item" href="webdev.html">Web Development</a>
<a class="item" href="404.html">Graphic Design</a>
<a class="browse item" id="modsDD">Mods
<i class="dropdown icon"></i>
</a>
<div class="ui popup" id="modDD+">
<div class="ui two column center aligned divided inverted grid">
<div class="column">
<h4 class="ui header">League of Legends</h4>
<div class="ui link list">
<a class="item">Custom Skins</a>
<a class="item">HD Remakes</a>
</div>
</div>
<div class="column">
<h4 class="ui header">Games</h4>
<div class="ui link list">
<a class="item">Fallout</a>
<a class="item">Skyrim</a>
<a class="item">Others</a>
</div>
</div>
</div>
</div>
</div>
<div class="pusher">
<!--Header-->
<div class="ui sticky">
<div class="ui basic inverted teal segment">
<div class="ui centered grid">
<div class="row">
<div class="two wide column">
<div class="ui basic icon circular inverted grow button" id="sidebar-toggle" data-content="Sidebar" data-variation="inverted">
<i class="content icon"></i>
</div>
</div>
<div class="twelve wide column">
<img id="header-logo" href="index.html" class="grow" src="images\Shadow_Labs_White-01.png" />
</div>
<div class="two wide column">
<div class="ui basic icon circular inverted grow button" id="contact-button" data-content="Contact Me" data-variation="inverted">
<i class="mail icon"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="page">
<!--Page-->
<div class="ui gridded stackable container">
<div class="row">
<center>
<div class="ui huge inverted icon header">
<i class="inverted teal circular html5 icon"></i>
Web Development
<div class="sub header">
That thing between you and the customer
</div>
</div>
</center>
<div class="row">
<div class="ten wide column">
<div class="ui inverted gridded segment" id="pitch">
<center>
<div class="six wide column">
<h2>Why?</h2>
<p>
well when you have a client or an audience, the best way to
keep them engaged is to push content... be it through the
easy route, Social Media or a more professional, always there,
controlled by you and you alone, Website. Websites have been
used since the dawn of the internet to interact with other users
and is still the best way to push content to the world wide web.
</p>
</div>
<div class="six wide column">
<h2>How?</h2>
<p>
The entire process is simple, you can contact me, tell me
what you want, how you want it done, with what style and I'll
let you know the cost. Its that simple
You pay the deposit and I'll get to work, updating you as progress
is made, websites can be compleated as quicky as a week,
depending on the complexity time to build may vary. You don't
need any prior knowledge making websites just the idea and the content, I do the rest.
</p>
</div>
<div class="column">
<h2>What?</h2>
<p>
So, your wondering what I can do. Valid query. so here are a few examples...
</p>
</div>
</center>
<div class="column">
<div class="spacer"></div>
<div class="ui fluid styled accordion">
<div class="active title">
<i class="dropdown icon"></i>
Website Examples
</div>
<div class="active content">
<div class="ui small centered stackable cards">
<div class="teal card">
<div class="image">
<img src="images/main/logo.png" />
</div>
<div class="content">
<div class="title">
Shadowlabs
</div>
<div class="meta">
This Website
</div>
<div class="description">
A website i made myself from pure code and freetime.
</div>
</div>
</div>
<div class="blue card">
<div class="image">
<img src="images/main/umage.png" />
</div>
<div class="content">
<div class="title">
Umage Photography
</div>
<div class="meta">
Sheffield Based photography
</div>
<div class="description">
Showcase website for umage photography and projects worked on by the company.
</div>
</div>
</div>
<div class="yellow card">
<div class="image">
<img src="http://via.placeholder.com/500x500" />
</div>
<div class="content">
<div class="title">
Turbocare 24
</div>
<div class="meta">
Sheffield Based Turbo repair and fitting company
</div>
<div class="description">
main webpage for tubo replacement company.
</div>
</div>
<div class="extra content">
<a class="ui button" href="dev-sites/Turbocare24/index.html">
<i class="ui find icon"></i>
take a look
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="column">
<center>
<h2 class="header">When</h2>
<p>
As soon as your happy with thedesign and we have talkied it over, we can organise a date for work to commense. below is a calendar containing working dates and holidays (only available on PC)
</p>
<div class="computer only row">
<div class="ui fluid styled accordion">
<div class="active title">
<i class="dropdown icon"></i>
Calendar
</div>
<div class="active content">
<iframe src="https://calendar.google.com/calendar/embed?title=Current%20Job%20Adgenda&height=720&wkst=1&hl=en_GB&bgcolor=%23323232&src=6fkig4t1igm20furhrlumiuo1k%40group.calendar.google.com&color=%232952A3&ctz=Europe%2FLondon" style="border-width:0" width="100%" height="720" frameborder="0" scrolling="no"></iframe>
</div>
</div>
</div>
<div class="spacer"></div>
<div class="ui button" id="contact-button">
<i class="mail icon"></i>
Contact Me
</div>
</center>
</div>
</div>
</div>
</div>
</div>
</div>
<!--Footer-->
<div class="ui basic inverted equal width stackable centered grid segment">
<div class="column">
<div class="ui inverted header">
Stay Connected
</div>
<div class="ui icon buttons">
<div class="ui blue button">
<i class="facebook icon"></i>
</div>
<div class="ui teal button">
<i class="twitter icon"></i>
</div>
<div class="ui red button">
<i class="youtube icon"></i>
</div>
<div class="ui purple button">
<i class="instagram icon"></i>
</div>
</div>
</div>
<div class="column">
<div class="ui inverted header">
Developer To the Core
</div>
<p>
Ive been making things for years, now I make things on a computer.
Religeously. Support me on Paetreon to keep up to date on all my
new projects.
</p>
<div class="ui fluid orange animated button">
<div class="visible content">
Paetreon
</div>
<div class="hidden content">
<i class="product hunt icon"></i>
</div>
</div>
</div>
<div class="column">
<div class="ui inverted header">
Nav Panel
</div>
<div class="ui horizontal divided inverted list">
<a class="item" href="index.html">
<i class="home icon"></i>
<div class="content">
Home
</div>
</a>
<a class="item" href="404.html">
<i class="image icon"></i>
<div class="content">
Portfolio
</div>
</a>
<a class="item" href="404.html">
<i class="game icon"></i>
<div class="content">
Games Development
</div>
</a>
<a class="item" href="404.html">
<i class="html5 icon"></i>
<div class="content">
Website Development
</div>
</a>
<a class="item" href="404.html">
<i class="paint brush icon"></i>
<div class="content">
Graphic Design
</div>
</a>
<a class="item" href="404.html">
<i class="film icon"></i>
<div class="content">
Videography
</div>
</a>
<a class="item" href="404.html">
<i class="plus icon"></i>
<div class="content">
Game Mods
</div>
</a>
<a class="item" id="contact-footer">
<i class="address book outline icon"></i>
<div class="content">
Contact Me
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="ui modal" id="contact-modal">
<i class="teal close icon"></i>
<div class="header">
Contact Me
</div>
<div class="content">
<form class="ui form" action="php/contact_form.php" method="post">
<div class="required field">
<label>Name</label>
<div class="two fields">
<div class="field">
<input type="text" name="firstName" placeholder="First Name" />
</div>
<div class="field">
<input type="text" name="lastName" placeholder="Last Name" />
</div>
</div>
</div>
<div class="required field">
<label>Email</label>
<input type="email" name="email" placeholder="E-Mail Address"/>
</div>
<div class="required field">
<label>Subject</label>
<input type="text" name="subject" placeholder="Subject" />
</div>
<div class="required field">
<label>Message</label>
<textarea name="body"></textarea>
</div>
<button class="ui basic fluid teal animated fade button">
<div class="visible content">
<i class="send icon"></i>
</div>
<div class="hidden content">
Send
</div>
</button>
<div class="ui error message">
</div>
<div class="ui success message">
<div class="header">Message Sent ^^</div>
<p>Message on its way, you should hear from me soon</p>
</div>
</form>
</div>
</div>
</body>
</html>