-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
132 lines (107 loc) · 11.6 KB
/
index.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
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head xmlns:og="http://ogp.me/ns#" xmlns:fb="http://www.facebook.com/2008/fbml" itemscope="" itemtype="http://schema.org/Article">
<meta charset="utf-8">
<title>James Bell | Portfolio</title>
<meta name="description" content="A showcase of my work which I will try and keep up to date!">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta property="og:type" content="website"/>
<meta property="og:title" content="James Bell"/>
<meta property="og:description" content="A showcase of my work which I will try and keep up to date!"/>
<meta property="og:url" content="https://james-bell.co.uk"/>
<meta property="og:image" content="https://james-bell.co.uk/dist/img/opengraph.png"/>
<meta name="twitter:site" content="@jamesryanbell">
<link rel="dns-prefetch" href="https://www.googletagmanager.com">
<link rel="dns-prefetch" href="https://www.google-analytics.com">
<style>
*{box-sizing:border-box;margin:0;border:0;padding:0}html{font-size:13px}body{background:#272822;color:#f8f8f2}main{padding:19.5px;padding:1.5rem;max-width:660.4px;max-width:50.8rem;margin:0 auto}html{font:400 13px monospace}code,pre{font-size:13px;font-size:1rem}h1,h2{font-size:13px;font-size:1rem;font-weight:400;display:inline;margin:0}p{margin:0}em{font-style:normal}main{counter-reset:line-numbers}pre{margin:0;overflow:inherit;white-space:normal;word-break:break-word}code{display:block;counter-increment:line-numbers;position:relative;margin:0;margin-left:-6.5px;margin-left:-.5rem}code:before{content:counter(line-numbers);position:absolute;top:0;bottom:0;left:-6.5px;left:-.5rem;color:#8f908a}code pre{display:inline-block;padding-left:13px;padding-left:1rem}.element{color:#f92672}.comment{color:#75715e}.comment code{padding-left:13px;padding-left:1rem;white-space:pre-line}.comment a{color:#75715e}.text{color:#f8f8f2}.logo,.logo a{color:#f7941d}.attr{color:#a6e22e}.quotes{color:#e6db74}a{text-decoration:none;color:#f8f8f2}.bullet{display:list-item;margin-left:6.5px;margin-left:.5rem} </style>
</head>
<body>
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PMW3C9" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-PMW3C9');</script>
<main>
<section>
<pre class="comment">
<code>/**</code>
<code>* <em class="element">@author</em> <span class="logo"><h1>James Bell</h1> <<a target="_blank" href="https://twitter.com/jamesryanbell">@jamesryanbell</a>></span></code>
<code>* <em class="element">@description</em> <h2>A showcase of my work which I will try and keep up to date!</h2></code>
<code>* <em class="element">@uses</em> HTML5, Sass, JS, Grunt</code>
<code>* <em class="element">@link</em> <a target="_blank" href="https://github.com/jamesryanbell/portfolio">https://github.com/jamesryanbell/portfolio</a></code>
<code>*/</code>
</pre>
</section>
<section>
<code><br></code>
<code><pre><em class="element"><span class="text"><</span>main<span class="text">></span></em></pre></code>
<code><br></code>
<pre class="comment">
<code><pre>/**</pre></code>
<code><pre>* Welcome to my portfolio</pre></code>
<code><pre>* <pre>I'm happiest when I get to spend my time within Sublime tinkering with sass, node, php or another language I can get my hands on.</pre></pre></code>
<code><pre>*/</pre></code>
</pre>
<code><pre><pre><em class="element"><span class="text"><</span>section<span class="text">></span></em></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"><</span>article <em class="attr">id</em><em class="text">=</em><em class="quotes">"about-me"</em><span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><pre><pre><p><<em class="element">p</em>>As far back as I can remember I have been fascinated with technology.<<em class="element">/p</em>></p></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><p><<em class="element">p</em>>Thankfully for me I've managed to make that passion my day job.<<em class="element">/p</em>></p></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><p><<em class="element">p</em>>When I'm not coding I enjoy running long distances to raise money for <<em class="element">a</em> <em class="attr">href</em><em class="text">=</em><em class="quotes">"http://justgiving.com/jamesryanbell"</em>><a href="http://justgiving.com/jamesryanbell">Diabetes UK</a><<em class="element">/a</em>>.<<em class="element">/p</em>></p></pre></pre></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"></</span>article<span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><em class="element"><span class="text"></</span>section<span class="text">></span></em></pre></pre></code>
<code><br></code>
<pre class="comment">
<code><pre>/**</pre></code>
<code><pre>* My work</pre></code>
<code><pre>* <pre>The web has changed for the better and no longer is a random set of screenshots a true reflection of the interactive and responsive nature of the work I can produce. With this is in mind I'd rather just give you the links and let you explore.</pre></pre></code>
<code><pre>*/</pre></code>
</pre>
<code><pre><pre><em class="element"><span class="text"><</span>section<span class="text">></span></em></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"><</span>article <em class="attr">id</em><em class="text">=</em><em class="quotes">"my-work"</em><span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="https://www.anytimefitness.com.au/">Anytime Fitness Australia</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="https://www.tycoifs.co.uk/">Tyco Integrated Fire & Security</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="https://www.adt.co.uk">Adt</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="https://www.castrol.com">Castrol</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="https://www.workthere.com">Workthere</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.alpamare.co.uk/">Alpamare</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.jaywingintelligence.com">Jaywing Intelligence</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Massage Envy [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Jewson - Building Better Communities [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.themanbehindthecurtain.co.uk/">The Man Behind The Curtain</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Virgin Atlantic [Private project for an event]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">LA fitness [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.goal50game.com/">Goal 50</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.showcasecinemas.co.uk/">Showcase Cinemas</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Showcase Cinemas - Big Box Office Quiz [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet"><a target="_blank" href="http://www.anglianhome.co.uk/">Anglian Home Improvements</a></span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Anglian Home Improvements - World Wide Window Machine [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Anglian Home Improvements - Win Sunshine [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><pre><span class="bullet">Bloom Agency [Since taken down]</span></pre></pre></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"></</span>article<span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><em class="element"><span class="text"></</span>section<span class="text">></span></em></pre></pre></code>
<code><br></code>
<code><pre><em class="element"><span class="text"></</span>main<span class="text">></span></em></pre></code>
<code><br></code>
<pre class="comment">
<code>/**</code>
<code>* Get in touch</code>
<code>* <pre>Want to get in touch and have a chat, well you're in luck! Drop me an email, a tweet or a LinkedIn message and I'll get back to you as soon as I can.</pre></code>
<code>*/</code>
</pre>
<code><pre><em class="element"><span class="text"><</span>footer<span class="text">></span></em></pre></code>
<code><pre><pre><<em class="element">nav</em> <em class="attr">id</em><em class="text">=</em><em class="quotes">"get-in-touch"<span class="text">></span></em></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"><</span>a <em class="attr">href</em><em class="text">=</em><em class="quotes">"https://twitter.com/jamesryanbell"</em><span class="text">></span></em><a target="_blank" href="https://twitter.com/jamesryanbell">Twitter</a><em class="element"><span class="text"></</span>a<span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"><</span>a <em class="attr">href</em><em class="text">=</em><em class="quotes">"mailto:[email protected]"</em><span class="text">></span></em><a target="_blank" href="mailto:[email protected]">Email</a><em class="element"><span class="text"></</span>a<span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><pre><em class="element"><span class="text"><</span>a <em class="attr">href</em><em class="text">=</em><em class="quotes">"http://uk.linkedin.com/in/jamesryanbell"</em><span class="text">></span></em><a target="_blank" href="http://uk.linkedin.com/in/jamesryanbell">LinkedIn</a><em class="element"><span class="text"></</span>a<span class="text">></span></em></pre></pre></pre></code>
<code><pre><pre><em class="element"><span class="text"></</span>nav<span class="text">></span></em></pre></pre></code>
<code><pre><em class="element"><span class="text"></</span>footer<span class="text">></span></em></pre></code>
</section>
</main>
</body>
</html>