-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
executable file
·180 lines (168 loc) · 9.77 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
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
<!doctype html>
<html class="no-js" lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Random Door</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="img/door.png">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link href='http://fonts.googleapis.com/css?family=Sanchez:400,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,400italic' rel='stylesheet' type='text/css'>
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Add your site or application content here -->
<nav>
<i class="fa fa-bars hamburger"></i>
<div class="mobile-title hidden">
<h1>Random Door</h1>
</div>
<div class="menu">
<ul>
<li><i class="fa fa-close hamburger exit"></i></li>
<li><a href="#"><img src="img/randomDoor.svg" alt="random door logo" id="title"><img src="img/door.svg" alt="random door logo" id="logo"></a></li>
<li><a href="#store">Store</a></li>
<!-- <li><a href="#custom">Custom</a></li> -->
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</div>
</nav>
<div class="page">
<div class="header">
<div class="title">
<h4>custom woodworking and furniture design</h4>
</div>
<a href="https://www.etsy.com/shop/RandomDoor"><button>Visit the Store</button></a>
</div>
<div class="container">
<div class="intro-text clearfix">
<!-- <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro dolorem ipsam nihil a assumenda, non suscipit voluptatem inventore vitae impedit, eum numquam doloribus qui corporis quidem repellendus, labore ex mollitia! Porro dolorem ipsam nihil a assumenda, non suscipit voluptatem inventore vitae impedit, eum numquam doloribus qui corporis quidem repellendus. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p> -->
<div class="carousel">
<img id="carousel-image" src="img/desk_carousel.jpg" alt="reclaimed wood desk">
<div id="prev"><i class="fa fa-chevron-left"></i></div>
<div id="counter">
<div id="count-one" class="count-dot"></div>
<div id="count-two" class="count-dot"></div>
<div id="count-three" class="count-dot"></div>
<div id="count-four" class="count-dot"></div>
</div>
<div id="next"><i class="fa fa-chevron-right"></i></div>
</div>
</div>
<div class="section">
<div class="section-header" id="store" >
<hr>
<br>
<h2>Shop the Store</h2>
<div class="subtitle">
<p>custom orders available</p>
<p>email [email protected]</p>
</div>
</div>
<br>
<div class="section-content">
<a href="https://www.etsy.com/shop/RandomDoor"><button id="store-button">Etsy Store</button></a>
<div class="store-photos" id="tables">
<a href="https://www.etsy.com/shop/RandomDoor"><img src="img/furniture_thumbnail.jpg" alt="tables">
<p><span class="store-text">Furniture</span></p></a>
</div>
<div class="store-photos" id="coasters">
<img src="img/coaster_thumbnail.jpg" alt="coasters">
<p><span class="store-text">Small items</span></p>
</div>
<div class="store-photos" id="more">
<img src="img/more_thumbnail.jpg" alt="wood butter jar">
<p><span class="store-text">More</span></p>
</div>
</div>
</div>
<!-- <div class="section">
<div class="section-header" id="custom">
<hr>
<br>
<h2>Order Custom Tables</h2>
</div>
<div class="section-content">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro dolorem ipsam nihil a assumenda, non suscipit voluptatem inventore vitae impedit, eum numquam doloribus qui corporis quidem repellendus, labore ex mollitia!</p>
<div class="custom-photos" id="size">
<img src="img/custom-design-artwork-01.png" alt="tables">
<div class="custom-text">
<p>Specify type & dimensions</p>
</div>
</div>
<div class="custom-photos" id="wood">
<img src="img/custom-design-artwork-02.png" alt="cutting boards">
<div class="custom-text">
<p>Specify wood type</p>
</div>
</div>
<div class="custom-photos" id="legs">
<img src="img/custom-design-artwork-03.png" alt="coasters">
<div class="custom-text">
<p>Specify leg type</p>
</div>
</div>
<div class="custom-photos" id="stain">
<img src="img/custom-design-artwork-04.png" alt="wood butter jar">
<div class="custom-text">
<p>Specify stain</p>
</div>
</div>
</div>
</div> -->
<div class="section">
<div class="section-header" id="about">
<hr>
<br>
<h2>About</h2>
</div>
<div class="section-content">
<p>Random Door is a handcrafted woodworking and craft designer based in Chicago, IL. As a small shop, we pride ourselves on knowing our materials and giving new life to reused and reclaimed materials whenever possible. We love telling the story of our products and will do our best to provide you with some context and history about what materials that go into your piece. We are always up for a custom project or a unique challenge so let us know what you have in mind and we will get you a quote!</p>
<img src="img/workshop.jpg" alt="work station">
</div>
</div>
</div>
<br>
<div class="contact" id="contact">
<h2>Contact</h2>
<form action="//formspree.io/[email protected]" method="POST">
<div class="formInputs">
<input type="text" name="name" id="yourName" placeholder="Name">
<input type="email" name="email" id="yourEmail" placeholder="Email address">
<input type="text" name="subject" id="emailSubject" placeholder="Subject">
</div>
<textarea name="emailMessage" type="text" id="emailMessage" placeholder="Message"></textarea>
<br>
<input type="submit" name="submitButton" id="submitButton">
</form>
</div>
</div>
<footer>
<p>Copyright © 2016 Random Door Workshop</p>
<p>Site designed and developed by <a href="http://colleenmcginnis.com" target="_blank">Colleen McGinnis</a>.</p>
</footer>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
// (function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
// function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
// e=o.createElement(i);r=o.getElementsByTagName(i)[0];
// e.src='//www.google-analytics.com/analytics.js';
// r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
// ga('create','UA-XXXXX-X','auto');ga('send','pageview');
</script>
</body>
</html>