User-Interface-Project-Week/contact.html at master · codejoncode/User-Interface-Project-Week · GitHub

188 lines (171 loc) · 6.17 KB

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

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="utf-8">

<title>Contact Us</title>

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">

<link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">

<link rel="stylesheet" href="css/index.css">

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt" crossorigin="anonymous">

<script src="js/bootstrap.bundle.min.js"></script>

<!--[if IE]>

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

<![endif]-->

</head>

<body>

<div class="container-fluid fixed-top menu-head ">

<nav class= "navbar">

<a id ="brand-company" class="navbar-brand2" href="index.html"> <h1 class = "h1">S&J</h1> </a>

<div>

<a class = "openIcon" href="#" onclick= "menuOpen()">☰</a>

</div>

</nav>

<div id= "hidden-menu" class="dropdown-content ">

<nav class="navbar second-nav">

<span class = "logo">S&J</span>

<div>

<a href="javascript:void(0)" class="close-menu" onclick="menuClose()">×</a>

</div>

</nav>

<div class="dropdown-content2">

<div class="row mt-0">

<div class="col-12">

<a class="dropdown-link text-center" href="index.html" target="_blank" >Home</a>

</div>

</div>

<div class="row mt-2">

<div class="col-12">

<a class="dropdown-link text-center" href="services.html" target="_blank">Services</a>

</div>

</div>

<div class="row mt-2">

<div class="col-12">

<a class="dropdown-link text-center" href="contact.html" target="_blank">Contact</a>

</div>

</div>

<div class="row mt-2">

<div class="col-12">

<a class="dropdown-link text-center" href="projects.html" target="_blank">Projects</a>

</div>

</div>

<div class="row mt-2">

<div class="col-12">

<a class="dropdown-link text-center" href="aboutUs.html" target="_blank">About us</a>

</div>

</div>

</div>

</div>

</div>

<div class="container">

<div class="row">

<div class="col">

<img class = "card-img jumbo-img" src="img/contact/contact-jumbotron.png" alt="building">

<img class = "jumbo-mobile" src="img/contact/contact-mobile-jumbotron.png" alt="building">

<h1 class = "text-block contact-us">Contact Us</h1>

</div>

</div>

<div class="row mt-5 getInTouch">

<div class="col-lg-8 col-sm-12">

<h1 class="h2 mb-4">Get In Touch</h1>

<label for="emailInput">Email address</label> <br>

<input class = "emailInput2" type="emailOfClient" placeholder="Enter email">

<small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>

<br>

<div class="selectdiv">

<label for="buildingsPlanned">How many buildings do you need planned?</label><br>

<select size="1" name="buildings" id="buildings" >

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

</select>

</div>

<br>

<br>

<label for="briefDescription">Provide a brief overview of your project needs:</label><br>

<input class ="briefDescription" type="description">

<br>

<br>

<input type="radio" name="typeOfClient">

<label>I am a small busines</label> <br>

<input type="radio" name="typeOfClient">

<label>I am a residential owner</label> <br>

<input type="radio" name="typeOfClient">

<label>I am a corporation</label>

<br>

<br>

<div class="submitBtn">

<a href="#" >Submit</a>

</div>

</div>

<div class="col-lg-4 col-sm-12 mt-4">

<h1 class="h2">Where We Work</h1>

<br>

<h2 class ="h3 font-weight-bold mt-5">New York</h2>

<p>123 Lane</p>

<p>Suite 100</p>

<p>Albany, NY 12345</p>

<p>202 555 0144</p>

<h2 class ="h3 font-weight-bold mt-5">Florida</h2>

<p>Ocean Drive</p>

<p>Suite 201</p>

<p>Orlando, FL 22345</p>

<p>502 555 0144</p>

<h2 class ="h3 font-weight-bold mt-5">California</h2>

<p>Mountain Street</p>

<p>Suite 105</p>

<p>San Diego, CA 22345</p>

<p>702 555 0144</p>

</div>

</div>

<div class="container-fluid">

<div class = "row footer mr-5">

<div class="col-sm-12 col-lg-5">

<h1>Interested in starting a project?</h1>

<h1>Let’s talk:</h1>

<input type="text" value = "Enter email">

<p>We'll never share your email with anyone else.</p>

</div>

<div class="col-sm-12 col-lg-2">

<h1 class="h1">New York</h1>

<p>123 Lane</p>

<p>Suite 100</p>

<p>Albany, NY 12345</p>

<p>202 555 0144</p>

</div>

<div class="col-sm-12 col-lg-2">

<h1 class="h1">Florida</h1>

<p>Ocean Drive</p>

<p>Suite 201</p>

<p>Orlando, FL 22345</p>

<p>502 555 0144</p>

</div>

<div class="col-sm-12 col-lg-2">

<h1 class="h1">California</h1>

<p>Mountain Street</p>

<p>Suite 105</p>

<p>San Diego, CA 22345</p>

<p>702 555 0144</p>

</div>

</div>

<div class="row">

<div class="copyright col-sm-12">

<p>Copyright © 2018 Smith and Jones</p>

</div>

</div>

</div>

</div>

<script src="js/index.js"></script>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

</div>

</body>

</html>