Skip to content

Commit 4aabbed

Browse files
committed
updated
updated
1 parent 9e6e48f commit 4aabbed

4 files changed

Lines changed: 72 additions & 64 deletions

File tree

.vscode/settings.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"liveServer.settings.port": 5501
3+
}

css/style.css

Lines changed: 26 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -200,34 +200,37 @@ padding-left: 4rem;
200200
}
201201
.store-form{
202202
/* border: 5px solid blue; */
203-
margin-left: 7rem;
204-
margin-right: 7rem;
205-
width: 60rem;
206-
padding: 5rem;
203+
margin-left: 10rem;
204+
margin-right: 10rem;
205+
width: 50rem;
206+
/* padding: 3rem; */
207207
/* min-height: 53rem; */
208-
/* height: 53rem; */
208+
height: 53rem;
209209

210210
}
211211
.store-image{
212-
height: 57rem;
213-
width: 50rem;
212+
height: 38rem;
213+
width: 43rem;
214214
padding-left: 5rem;
215215
}
216216

217217
input[type=text] {
218-
width: 100%;
219-
padding: 12px 20px;
220-
margin: 8px 0;
218+
width: 80%;
219+
/* padding: 12px 20px; */
220+
/* margin: 8px 0; */
221221
box-sizing: border-box;
222222
border-radius: 4px;
223223
}
224224
.first{
225225
display: flex;
226226
justify-content: space-between;
227+
margin-bottom: 1rem;
227228
}
228229
.city{
230+
229231
display: flex;
230-
margin: 8px 0;
232+
flex-direction: row;
233+
/* margin: 8px 2px; */
231234
border-radius: 4px;
232235
margin-top: 1rem;
233236
margin-bottom: 1rem;
@@ -237,12 +240,12 @@ input[type=text] {
237240
.selectcolour{
238241
display: flex;
239242
justify-content:space-between;
240-
padding-right: 25rem;
243+
/* padding-right: 20rem; */
241244

242245
}
243246
.checkbox{
244247
display: flex;
245-
margin-top: 2.5rem;
248+
/* margin-top: 2.5rem; */
246249
margin-bottom: 1rem;
247250

248251

@@ -251,14 +254,16 @@ button{
251254
background-color:#c05326;
252255
border: none;
253256
color: white;
254-
padding: 16px 32px;
257+
padding: 4px 10px;
255258
text-decoration: none;
256-
margin: 4px 2px;
259+
/* margin: 4px 2px; */
260+
border-radius: 0.70rem;
257261

258262
}
259263
.checkbox p{
260264
color: grey;
261-
padding: 0.3rem;
265+
padding: 0.5rem;
266+
262267
}
263268
.text{
264269
text-decoration: underline;
@@ -268,7 +273,8 @@ button{
268273

269274
.label-city{
270275
/* color: blue; */
271-
width: 100%;
276+
width: 50%;
277+
margin-right: 2rem;
272278

273279
}
274280

@@ -278,9 +284,10 @@ margin-top: 3rem;
278284
}
279285

280286
.store-karma{
281-
font-size: 20px;
287+
font-size: 15px;
282288
color: #c05326;
283-
margin-top: 2rem;
289+
/* margin-top: 2rem; */
284290
padding-bottom: 2rem;
285291

292+
286293
}

index.html

Lines changed: 40 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -12,46 +12,46 @@
1212
</head>
1313
<body>
1414
<header class="flex-header">
15-
<div class="header-logo">
16-
<img
17-
src="img/karma-logo.svg" alt="Logo for karma"class="header-logo"/>
18-
19-
</div>
15+
<div class="header-logo">
16+
<img
17+
src="img/karma-logo.svg" alt="Logo for karma"class="header-logo"/>
18+
19+
</div>
2020
<div class="header-nav-items">
2121

22-
<nav>
23-
<span class="navigation-item meet-karma-item">
24-
Meet karma
25-
</span>
26-
27-
<span class="navigation-item">
28-
How it works
29-
</span>
30-
<span class="navigation-item">
31-
<a class="navigation-link" href="./store.html"> Store</a>
22+
<nav>
23+
<span class="navigation-item meet-karma-item">
24+
Meet karma
25+
</span>
3226

33-
</span>
34-
<span class="navigation-item">
35-
Blog
36-
</span>
37-
<span class="navigation-item">
38-
Help
39-
</span>
40-
<span class="navigation-item">
41-
Login
42-
</span>
43-
44-
</nav>
45-
</div>
27+
<span class="navigation-item">
28+
How it works
29+
</span>
30+
<span class="navigation-item">
31+
<a class="navigation-link" href="./store.html"> Store</a>
32+
33+
</span>
34+
<span class="navigation-item">
35+
Blog
36+
</span>
37+
<span class="navigation-item">
38+
Help
39+
</span>
40+
<span class="navigation-item">
41+
Login
42+
</span>
43+
44+
</nav>
45+
</div>
4646
</header>
4747

4848
<div class="Content">
4949
<main class="main">
50-
<div class="karma">
51-
<h1>Introducing Karma</h1>
52-
<p>Bring Wifi with you,everywhere you go.</p>
53-
<button class="learn-more">Learn More</button>
54-
</div>
50+
<div class="karma">
51+
<h1>Introducing Karma</h1>
52+
<p>Bring Wifi with you,everywhere you go.</p>
53+
<button class="learn-more">Learn More</button>
54+
</div>
5555
<div>
5656
<div class="karma2">
5757

@@ -77,17 +77,15 @@ <h2>Everyone needs a little Karma.</h2>
7777
</div>
7878
<div class="homepage-parent">
7979
<!-- <div class="homepage-feature"> -->
80-
<div class="img-feature">
81-
<img src="level-2/homepage-feature.png"alt="homepage-feature"class="img-feature"/ >
82-
</div>
80+
<div class="img-feature">
81+
<img src="level-2/homepage-feature.png"alt="homepage-feature"class="img-feature"/ >
82+
</div>
8383

84-
<div class="connection">
85-
86-
<blockquote class="get-karma-quote">Where I am, I just don't worry about my connection anymore!</blockquote>
84+
<div class="connection">
8785

88-
89-
<button class="get-karma-today"><a href="./store.html">Get Karma today</a> </button>
90-
</div>
86+
<blockquote class="get-karma-quote">Where I am, I just don't worry about my connection anymore!</blockquote>
87+
<button class="get-karma-today"><a href="./store.html">Get Karma today</a> </button>
88+
</div>
9189
</div>
9290
</div>
9391

store.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,9 +47,9 @@
4747

4848
<main class="main-store">
4949
<div class="store-form">
50-
<div class="store-karma">
51-
<h1>Order your Karma wifi device today!</h1>
52-
</div>
50+
<div class="store-karma">
51+
<h1>Order your Karma wifi device today!</h1>
52+
</div>
5353
<div class="first">
5454
<div>
5555
<label form="firstname">First Name</label><br>

0 commit comments

Comments
 (0)