Skip to content

Commit f9bd173

Browse files
dic14svidic14svi
committed
More refactor.
1 parent eb6b94e commit f9bd173

File tree

2 files changed

+59
-36
lines changed

2 files changed

+59
-36
lines changed

‎index.html‎

Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
<!DOCTYPE html>
22

3-
<html lang="sv">>
3+
<html lang="sv">
4+
45
<head>
56
<link rel="stylesheet" href="styles/style.css">
67
<title>Sebastian Axel Wikström :: front-end developer</title>
78
</head>
9+
810
<body>
911
<div class="page fs bg">
1012
<h1 id="name">Sebastian Axel Wikstr&#246;m</h1>
@@ -45,25 +47,25 @@ <h3>seaxwi.github.io</h3>
4547
<div class="contact-box center">
4648
<h1 id="contactme">Contact me</h1>
4749

48-
<form action="https://formspree.io/xbjpjpke"
49-
method="POST">
50+
<form action="https://formspree.io/xbjpjpke" method="POST">
5051

51-
<label for="form-name">Name</label>
52-
<input type="text" id="form-name" name="form-name" placeholder="Your name." required>
52+
<label for="form-name">Name</label>
53+
<input type="text" id="form-name" name="form-name" placeholder="Your name." required>
5354

54-
<label for="lname">Email</label>
55-
<input type="text" id="email" name="email" placeholder="Your email." required>
55+
<label for="lname">Email</label>
56+
<input type="text" id="email" name="email" placeholder="Your email." required>
5657

57-
<label for="subject">message</label>
58-
<textarea id="subject" name="subject" placeholder="Write a message." style="height:200px" required></textarea>
58+
<label for="subject">message</label>
59+
<textarea id="subject" name="subject" placeholder="Write a message." style="height:200px" required></textarea>
5960

60-
<input type="submit" value="Submit">
61-
</form>
61+
<input type="submit" value="Submit">
62+
</form>
6263

63-
<h1 id="links">Links</h1>
64-
<a href="https://github.com/seaxwi">
65-
<img src="GitHub-Mark-Light-64px.png" alt="github mark">
66-
</a>
67-
</div>
64+
<h1 id="links">Links</h1>
65+
<a href="https://github.com/seaxwi">
66+
<img src="GitHub-Mark-Light-64px.png" alt="github mark">
67+
</a>
68+
</div>
6869
</body>
70+
6971
</html>

‎styles/style.css‎

Lines changed: 41 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,25 @@
1-
<style>
1+
/* Fix this */
22
* {
33
margin: 0;
44
padding: 0;
55
}
6+
67
html {
78
font-family: sans-serif;
8-
scroll-behavior: smooth;
9+
/* scroll-behavior: smooth; */
10+
/* Unsupported for html selector? */
911
padding-top: 0;
1012
background-color: black;
1113
}
14+
1215
body {
1316
padding: 0;
1417
margin: 0;
15-
font-color: white;
18+
color: white;
1619
}
1720

1821
h1 {
19-
text-align:center;
22+
text-align: center;
2023
color: white;
2124
font-size: 300%;
2225
margin: 0em;
@@ -29,8 +32,9 @@ h1 {
2932
color: white;
3033
font-size: 300%;
3134
}
35+
3236
#job-title {
33-
text-align:center;
37+
text-align: center;
3438
color: white;
3539
font-size: 150%;
3640
font-weight: 200;
@@ -48,19 +52,20 @@ h1 {
4852
margin-bottom: 0.5em;
4953
}
5054

51-
p {
52-
text-align:left;
55+
p {
56+
text-align: left;
5357
color: white;
5458
font-size: 100%;
5559
}
60+
5661
a {
5762
color: white;
5863
text-decoration: none;
5964
font-size: 100%;
6065
}
6166

6267
#portfolio-link {
63-
text-align:center;
68+
text-align: center;
6469
color: white;
6570
font-size: 200%;
6671
font-weight: 200;
@@ -71,31 +76,39 @@ a {
7176
a.orange {
7277
color: orange;
7378
}
79+
7480
a.red {
7581
color: red;
7682
}
83+
7784
a.purple {
7885
color: purple;
7986
}
87+
8088
a.green {
8189
color: green;
8290
}
91+
8392
a.blue {
8493
color: blue;
8594
}
95+
8696
a.black {
8797
color: black;
8898
}
99+
89100
a:hover {
90101
text-decoration: underline;
91102
}
103+
92104
div.status {
93105
text-align: center;
94106
margin: auto;
95107
width: 80%;
96108
border: 0px solid green;
97109
padding: 10px;
98110
}
111+
99112
div.links {
100113
text-align: center;
101114
margin: auto;
@@ -115,7 +128,6 @@ div.page {
115128

116129
div.fs {
117130
height: 100vh;
118-
119131
/* retain height */
120132
-webkit-box-sizing: border-box;
121133
-moz-box-sizing: border-box;
@@ -124,7 +136,8 @@ div.fs {
124136

125137
div.bg {
126138
/* center background */
127-
background: url(start_background_bw.jpg) no-repeat center bottom; /* fixed */
139+
background: url(../start_background_bw.jpg) no-repeat center bottom;
140+
/* fixed */
128141
-webkit-background-size: cover;
129142
-moz-background-size: cover;
130143
-o-background-size: cover;
@@ -145,7 +158,8 @@ div.contact-box {
145158

146159
.wrapper {
147160
display: grid;
148-
grid-template-columns: all all;
161+
/* grid-template-columns: all all; */
162+
/* all all not valid */
149163
grid-gap: 10px;
150164
color: #444;
151165
margin: auto;
@@ -169,14 +183,22 @@ form {
169183

170184
/* Style inputs with type="text", select elements and textareas */
171185
input[type=text], select, textarea {
172-
width: 100%; /* Full width */
173-
padding: 12px; /* Some padding */
174-
border: 1px solid #ccc; /* Gray border */
175-
border-radius: 4px; /* Rounded borders */
176-
box-sizing: border-box; /* Make sure that padding and width stays in place */
177-
margin-top: 6px; /* Add a top margin */
178-
margin-bottom: 16px; /* Bottom margin */
179-
resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */
186+
width: 100%;
187+
/* Full width */
188+
padding: 12px;
189+
/* Some padding */
190+
border: 1px solid #ccc;
191+
/* Gray border */
192+
border-radius: 4px;
193+
/* Rounded borders */
194+
box-sizing: border-box;
195+
/* Make sure that padding and width stays in place */
196+
margin-top: 6px;
197+
/* Add a top margin */
198+
margin-bottom: 16px;
199+
/* Bottom margin */
200+
resize: vertical
201+
/* Allow the user to vertically resize the textarea (not horizontally) */
180202
}
181203

182204
/* Style the submit button with a specific background color etc */
@@ -214,4 +236,3 @@ img {
214236
display: block;
215237
margin: auto;
216238
}
217-
</style>

0 commit comments

Comments
 (0)