-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathdescription.html
153 lines (152 loc) · 6.08 KB
/
description.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://kit.fontawesome.com/7bfe4ec72d.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="assets/styles/css/styles.css">
<title>computer stores search</title>
</head>
<body>
<header class="bg-primary-nav p-sticky">
<nav class="navbar m-auto">
<div class="brand d-flex-row">
<a href="index.html">
<img src="assets/images/pc-icon.png" alt="main icon" class="d-inline">
<span>ComputerSS</span>
</a>
</div>
<ul class="d-flex-row">
<li>
<button type="button"><i class="fas fa-search"></i></button>
<a href="#" class="nav-text-display">Search Stores</a>
</li>
<li>
<button type="button"><i class="fas fa-globe-americas"></i> </button>
<a href="#" class="nav-text-display">All Stores</a>
</li>
<li>
<button type="button"><i class="far fa-user"></i></button>
<a href="#" class="nav-text-display">Log in</a>
</li>
<li>
<button type="button"><i class="fas fa-bars"></i></button>
<a href="#" class="nav-text-display">More</a>
</li>
</ul>
</nav>
</header>
<main>
<div class="description-section">
<a href="#" ><img src="assets/images/logo-web.png" alt="brand image" class="brand-description-image"></a>
<div class="central-container display-flex">
<img src="assets/images/bg-3.jpg" alt="store image">
<div class="description-container">
<div class="description-iten name-store">
<p class="mame-text">NAME: <span>Mr PC</span></p>
</div>
<div class="description-iten">
<p> CITY: <span>Cartagena</span> </p>
</div>
<div class="description-iten">
<p> TECHNOLOGY: <span>PC</span> </p>
</div>
<div class="description-iten">
<p> ARTICLE: <span>Hardware</span> </p>
</div>
<div class="description-iten">
<p class="score-container" >SCORE:
<span>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star"></i>
<i class="fas fa-star-half-alt"></i>
</span>
</p>
</div>
</div>
</div>
<button type="button" class="button button-font"> Contact</button>
</div>
<p class="text-description">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Id, dolorem debitis quod
obcaecati similique eaque nihil porro assumenda?
Pariatur placeat eaque, dolorum laboriosam ratione incidunt eum
corrupti ea voluptate obcaecati! Lorem ipsum dolor sit amet consectetur
adipisicing elit. In magni distinctio
libero consectetur facilis, aperiam laboriosam placeat,
accusamus laborum recusandae cumque officia esse nam beatae enim minima. Illo, natus exercitationem.
</p>
<section class="map-section">
<h1>MAP DIRECTION:</h1>
<iframe width="600" height="500" id="gmap_canvas"
src="https://maps.google.com/maps?q=university%20of%20san%20francisco&t=&z=13&ie=UTF8&iwloc=&output=embed">
</iframe>
</section>
</main>
<footer>
<div class="footer-header bg-black text-color-three">
<div class="ul-container">
<ul class="ul-footer">
<li><a href="#" class="text-color-three">HOME</a></li>
<li><a href="#" class="text-color-three">SEARCH</a></li>
<li><a href="#" class="text-color-three">ABOUT US</a></li>
<li><a href="#" class="text-color-three">ADVERTISE</a></li>
</ul>
<div class="logo-footer-container">
<a href="#"><img src="assets/images/pc-icon.png" alt="icon logo footer"></a>
</div>
<ul class="ul-footer ul-bottom">
<li><a href="#" class="text-color-three">FACEBOOK</a></li>
<li><a href="#" class="text-color-three">TWITTER</a></li>
<li><a href="#" class="text-color-three">BLOG</a></li>
<li><a href="#" class="text-color-three">GOOGLE +</a></li>
</ul>
</div>
<div class="more-container display-flex">
<div class="subscirbe-footer">
<h4>SUBSCRIBE</h4>
<form action="submmit">
<input type="text" placeholder="[email protected]" class="button footer-buttons">
<button type="button" class="bg-dark-gray button footer-buttons">send</button>
</form>
</div>
<div class="tex-footer center-footer">
<h4>CONTACT</h4>
<div>
<p>Have a question or submission?</p>
<a class="">[email protected]</a>
</div>
</div>
<div class="tex-footer right-footer">
<h4>ABOUT</h4>
<div>
<p>ComputerSS is an online platform that assits kwywords to find a</p>
<p>suitable store for you by simply searching by</p>
<p>City, tech article, brand etc <a href="#">learm more...</a></p>
</div>
</div>
</div>
</div>
<div class="footer-footer bg-dark-gray text-color-three display-flex">
<ul class="social-media-icons">
<li>
<a href="https://www.facebook.com/kabolivar" class="text-color-three">
<i class="fab fa-facebook-f"></i>
</a>
</li>
<li>
<a href="https://twitter.com/KBTarts" class="text-color-three"><i class="fab fa-twitter"></i>
</a>
</li>
<li><a href="https://www.linkedin.com/in/kender-bolivar-1736086b/" class="text-color-three"><i class="fab fa-linkedin-in"></i></a></li>
<li><a href="https://github.com/kenderb" class="text-color-three"><i class="fab fa-github"></i></a></li>
</ul>
<p>
ComputerSS 2020. ALL RIGHTS RESERVED. POWERED BY <a href="https://github.com/kenderb"> KENDERB</a>. AWASOMENESS.
</p>
</div>
</footer>
</body>
</html>