Skip to content

Commit b317bd9

Browse files
committed
main page back in
1 parent a949b5f commit b317bd9

File tree

4 files changed

+163
-4
lines changed

4 files changed

+163
-4
lines changed

css/primary.css

Lines changed: 132 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,132 @@
1+
html, body {
2+
width: 100%;
3+
height: 100%;
4+
margin: 0px;
5+
color: #424447;
6+
}
7+
8+
#container {
9+
display: flex;
10+
flex-direction: column;
11+
align-items: center;
12+
width: 100%;
13+
height: 100%;
14+
}
15+
16+
nav {
17+
display: flex;
18+
width: 50%;
19+
flex-direction: row;
20+
align-self: center;
21+
align-items: center;
22+
justify-content: space-between;
23+
margin-top: 10px;
24+
margin-bottom: 10px;
25+
padding-top: 15px;
26+
padding-bottom: 15px;
27+
}
28+
29+
nav > a {
30+
font-size: 2em;
31+
font-weight: bold;
32+
text-decoration: none;
33+
color: #424447;
34+
}
35+
36+
nav > a:hover {
37+
text-decoration: underline;
38+
color: black;
39+
}
40+
41+
nav > div {
42+
display: flex;
43+
align-self: flex-end;
44+
align-items: center;
45+
flex-flow: center;
46+
justify-content: space-between;
47+
}
48+
49+
nav > div > a {
50+
padding-left: 40px;
51+
padding-right: 40px;
52+
padding-top: 15px;
53+
padding-bottom: 15px;
54+
text-decoration: none;
55+
text-transform: uppercase;
56+
font-size: 1.4em;
57+
color: #424447;
58+
}
59+
60+
nav > div > a:hover {
61+
text-decoration: underline;
62+
color: black;
63+
}
64+
65+
#content {
66+
margin-top: auto;
67+
margin-bottom: auto;
68+
width: 50%;
69+
padding: 20px;
70+
box-shadow: 0px 0px 1px black;
71+
border-radius: 20px;
72+
background-color: white;
73+
}
74+
75+
.post {
76+
display: flex;
77+
flex-direction: row;
78+
align-self: center;
79+
align-items: center;
80+
justify-content: space-between;
81+
border-bottom: 1px solid #c8cace;
82+
font-weight: bold;
83+
text-decoration: none;
84+
color: #0061b4;
85+
}
86+
87+
.post:last-of-type {
88+
border-bottom: none;
89+
}
90+
91+
.post h1 {
92+
font-size: 1.8em;
93+
}
94+
95+
.post p {
96+
color: #6d6d6d;
97+
}
98+
99+
.post:hover h1 {
100+
color: black;
101+
}
102+
103+
footer {
104+
display: flex;
105+
align-items: center;
106+
justify-content: center;
107+
width: 100%;
108+
padding-bottom: 50px;
109+
border-top: 1px solid #c8cace;
110+
}
111+
112+
footer div {
113+
width: 50%;
114+
}
115+
116+
footer div .footer-title {
117+
display: flex;
118+
width: 100%;
119+
justify-content: space-between;
120+
align-items: center;
121+
}
122+
123+
footer div a {
124+
display: flex;
125+
flex-basis: content;
126+
align-items: center;
127+
text-decoration: none;
128+
}
129+
130+
footer div img {
131+
padding-right: 7px;
132+
}

img/email.png

504 Bytes
Loading

img/github.png

1.67 KB
Loading

index.html

Lines changed: 31 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,36 @@
11
<!DOCTYPE html>
22
<html>
3-
<head>
4-
<title>tomgr</title>
5-
</head>
3+
<header>
4+
<title> Home </title>
5+
<link rel="stylesheet" href="css/primary.css">
6+
</header>
67
<body>
7-
<h1> Hello </h1>
8+
<div id="container">
9+
<nav>
10+
<a href=""> Tom Richardson </a>
11+
<div>
12+
<a href="projects.html">Projects</a>
13+
<a href="tools.tomgr.io">Tools</a>
14+
</div>
15+
</nav>
16+
17+
<div id="content">
18+
<h1> Hi I'm Tom </h1>
19+
</div>
20+
21+
22+
<footer>
23+
<div>
24+
<div class="footer-title">
25+
<h3> Tom Richardson </h3>
26+
<p> University of Queensland Computer Science Student </p>
27+
</div>
28+
<a class="github" href="https://github.com/tgrkzus/"><img src="img/github.png" alt="Github logo"> Github </a>
29+
<br>
30+
<a class="email" href="mailto:[email protected]"><img src="img/email.png" alt="Email icon">[email protected]</a>
31+
</div>
32+
</footer>
33+
34+
</div>
835
</body>
936
</html>

0 commit comments

Comments
 (0)