File tree Expand file tree Collapse file tree 4 files changed +163
-4
lines changed Expand file tree Collapse file tree 4 files changed +163
-4
lines changed Original file line number Diff line number Diff line change
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
+ }
Original file line number Diff line number Diff line change 1
1
<!DOCTYPE html>
2
2
< 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 >
6
7
< 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 >
8
35
</ body >
9
36
</ html >
You can’t perform that action at this time.
0 commit comments