Subversion Repositories SmartDukaan

Rev

Rev 8818 | Go to most recent revision | Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
8817 anupam.sin 1 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 
<html xmlns="http://www.w3.org/1999/xhtml">
3 
<head>
4 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
5 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
6 
 
7 
<!-- Prevent MS Office toolbar from changing layout -->
8 
<meta http-equiv="imagetoolbar" content="false">
9 
<meta name="MSSmartTagsPreventParsing" content="true">
10 
 
11 
<title>Home Page</title>
12 
<script language="javascript" type="text/javascript" src="/js/jquery-1.4.2.js"></script>
13 
<!-- start of new code -->
14 
<style type="text/css">
15 
 
16 
.main-left-banner img {
17 
    width: 980px;
18 
}
19 
label.error{
20 
	color:red;
21 
	font-size:13px;
22 
	padding: 2px 10px;
23 
}
24 
 
25 
.left {
26 
	float:left;
27 
	}
28 
.right {
29 
	float:right;
30 
	}
31 
 
32 
.header-bottom {
33 
	height:40px;
34 
	line-height:40px;
35 
}
36 
.cart-icon {
37 
	background-image:url('/images/cart-icon.png');
38 
	height:40px;
39 
	width:40px;
40 
}
41 
.menu-icon {
42 
	background-image:url('/images/menu-icon.png');
43 
	height:40px;
44 
	width:40px;
45 
}
46 
.account-icon {
47 
	background-image:url('/images/account-icon.png');
48 
	height:40px;
49 
	width:40px;
50 
}
51 
.site-logo {
52 
	background-image:url('/images/site-logo.png');
53 
	height:40px;
54 
	width:125px;
55 
}
56 
.header-bottom {
57 
	background-image:url('/images/BG_NavBar.png');
58 
	background-repeat:repeat-x;
59 
	height:45px;
60 
	line-height:45px;
61 
	text-align:center;
62 
	margin-top:10px;
63 
}
64 
 
65 
.header-top a {
66 
	display:inline-block;
67 
	margin-right:10px;
68 
}
69 
 
70 
body {
71 
	padding:0;
72 
	margin:0;
73 
}
74 
 
75 
.search-bar {
76 
	width: 80%;
77 
    height: 25px;
78 
    border: 0;
79 
    padding-left: 20px;
80 
    font-size: 18px;
81 
    color: #888888;
82 
}
83 
 
84 
.search-button {
85 
	height: 25px;
86 
    color: #666666;
87 
    background-color: white;
88 
    border: 0;
89 
    margin-left: -30px;
90 
	background-image:url('/images/search-icon.png');
91 
	width:25px;
92 
	line-height: 25px !important;
93 
}
94 
 
95 
.banner img{
96 
	width:100%;
97 
}
98 
 
99 
.banner {
100 
	margin:10px 0 10px 0;
101 
}
102 
 
103 
.expandable ul {
104 
	display:none;
105 
	list-style-type:none;margin:0;padding:0;
106 
}
107 
 
108 
.expandable ul li {
109 
	height:45px;
110 
	line-height:45px;
111 
	border-bottom:1px solid #AAAAAA;
112 
	padding-left:25px;
113 
	background-color:#EEEEEE;
114 
}
115 
 
116 
.expandable ul li a{
117 
	text-decoration:none;
118 
	color:#666666;
119 
	display:inline-block;
120 
	width:100%;
121 
}
122 
 
123 
.menu-container {
124 
	border:1px solid #AAAAAA;
125 
	margin:10px;
126 
	background-color:white;
127 
}
128 
 
129 
.expandable {
130 
	line-height:45px;
131 
	color:#666666;
132 
	cursor:pointer;
133 
}
134 
 
135 
.plus {
136 
	background:url('/images/plus.png') no-repeat right top;
137 
}
138 
 
139 
.minus {
140 
	background:url('/images/minus.png') no-repeat right top;
141 
}
142 
 
143 
.non-expandable {
144 
	height:45px;
145 
	line-height:45px;
146 
	color:#666666;
147 
	padding-left:10px;
148 
	border-bottom:1px solid #AAAAAA;
149 
}
150 
 
151 
.menu-container-header {
152 
	height:45px;
153 
	line-height:45px;
154 
	color:#333333;
155 
	padding-left:10px;
156 
	font-size:18px;
157 
	border-bottom:2px solid #2789c1;
158 
}
159 
 
160 
.non-expandable a {
161 
	text-decoration:none;
162 
	color:#666666;
163 
	display:inline-block;
164 
	width:100%;
165 
}
166 
 
167 
.header {
168 
	background-color:white;
169 
}
170 
 
171 
.footer {
172 
	border-top:4px solid #2789c1;
173 
	background-color:white;
174 
	height:30px;
175 
	line-height:30px;
176 
	font-size:13px;
177 
	color:#666666;
178 
	padding-left:25px;
179 
}
180 
 
181 
.footer a {
182 
	color:#666666;
183 
	text-decoration:none;
184 
}
185 
 
186 
.expandable div img, .non-expandable a img {
187 
	vertical-align: middle;
188 
}
189 
</style>
190 
 
191 
</head>
192 
 
193 
<body  style='background-color:#BBBBBB;'>
194 
	<div class='header'>
195 
		<div class='header-top'>
196 
			<a class='site-logo left' href="/"></a>
197 
			<a class='cart-icon right' href='/cart'></a>
198 
			<a class='account-icon right' href='/my-account'></a>
199 
			<a class='menu-icon right' href='#'></a>
200 
		</div>
201 
		<div style='clear:both;'></div>
202 
		<form class='header-bottom'>
203 
			<input class='search-bar' type='text'></input>
204 
			<input class='search-button' type='submit' value=''></input>
205 
		</form>
206 
	</div>
207 
	<div>
208 
		<div class='banner'>
209 
			<img src='/images/bannerImage.jpg'></img>
210 
		</div>
211 
 
212 
		<div class='menu-container'>
213 
			<div class='menu-container-header'>Shop by category</div>
214 
    		<div class='expandable plus'>
215 
				<div style='border-bottom:1px solid #AAAAAA;padding-left:10px;'><img src='/images/mobile.png'></img>Mobiles</div>
216 
    			<ul>
217 
    				<li><a href='/search?q=mobile'>All Mobiles</a></li>
218 
    				<li><a href='/search?q=android'>Android Phones</a></li>
219 
    			</ul>
220 
    		</div>
221 
    		<div class='non-expandable'>
222 
    			<a href='/search?q=tablets'><img src='/images/tablet.png'></img>Tablets</a>
223 
    		</div>
224 
    		<div class='expandable plus'>
225 
				<div style='border-bottom:1px solid #AAAAAA;padding-left:10px;'><img src='/images/laptop.png'></img>Laptops</div>
226 
    			<ul>
227 
    				<li><a href='/search?q=tablets'>Windows</a></li>
228 
    				<li><a href='/search?q=tablets'>Mac</a></li>
229 
    				<li><a href='/search?q=tablets'>DOS/Linux</a></li>
230 
    			</ul>
231 
    		</div>
232 
			<div class='expandable plus'>
233 
				<div style='border-bottom:1px solid #AAAAAA;padding-left:10px;'><img src='/images/mobile.png'></img>Accessories</div>
234 
    			<ul>
235 
    				<li><a href='/search?q=tablets'>Laptop Accessories</a></li>
236 
    				<li><a href='/search?q=tablets'>Mobile Accessories</a></li>
237 
    			</ul>
238 
    		</div>
239 
			<div class='expandable plus'>
240 
				<div style='border-bottom:1px solid #AAAAAA;padding-left:10px;'><img src='/images/camera.png'></img>Cameras</div>
241 
    			<ul>
242 
    				<li><a href='/search?q=tablets'>DSLR</a></li>
243 
    				<li><a href='/search?q=tablets'>Compact Cameras</a></li>
244 
    			</ul>
245 
    		</div>
246 
			<div class='non-expandable'>
247 
    			<a href='/recharge'><img src='/images/mobile.png'></img>Quick Recharge</a>
248 
    		</div>
249 
			<div class='non-expandable'>
250 
    			<a href='/best-deals'><img src='/images/tablet.png'></img> Best Deals</a>
251 
    		</div>
252 
		</div>
253 
	</div>
254 
	<div class='footer'>
255 
		<a href='www.saholic.com'>Full Site</a>&nbsp;|&nbsp;
256 
		<a href='/contact-us'>Contact us</a>&nbsp;|&nbsp;
257 
		<a href='/terms'>Policies</a>
258 
 
259 
	</div>
260 
<script>
261 
	jQuery('.expandable').click(function() {
262 
		if(jQuery(this).hasClass('plus')) {
263 
			jQuery(this).removeClass('plus');
264 
			jQuery(this).addClass('minus');
265 
		} else {
266 
			jQuery(this).removeClass('minus');
267 
			jQuery(this).addClass('plus');
268 
		}
269 
 
270 
		jQuery(this).find('ul').slideToggle("fast");
271 
	});
272 
</script>
273 
</body>
274 
</html>