blog and github links

src/Screens/Home.tsx

@@ -11,6 +11,11 @@ const Home: React.FC = () => {
 	const { height, width } = useInnerWindowSize()
 
 	return <div id="home" style={{ width: width + 'px', height: height + 'px' }}>
+		<header className={'fixed'}>
+			<span><a href={'https://blog.nicco.io'}>blog</a></span>
+			<span><a href={'https://github.com/cupcakearmy'}>github</a></span>
+		</header>
+
 		<Parallax>
 			<section id={'letters-container'}>
 				<h1>
@@ -25,10 +30,10 @@ const Home: React.FC = () => {
 
 		<Cursor/>
 
-		<footer>
+		<footer className={'fixed'}>
 			<span>developer.</span>
 			<br/>
-			<span>say <a className={'email'} href={'mailto:hi@nicco.io'}>hi@nicco.io</a></span>
+			<span><a href={'mailto:hi@nicco.io'}>say <b>hi@nicco.io</b></a></span>
 			<br/>
 			<span>
 				<small>

src/styles/Footer.styl

@@ -1,23 +0,0 @@
-footer
-	font-family 'Inconsolata', monospace
-	display flex
-	align-items center
-	justify-content center
-	flex-direction column
-	font-size 1.2em
-	position absolute
-	bottom 0
-	left 0
-	text-align center
-	width 100vw
-	padding 1em
-
-	span
-		background-color hsla(0, 0%, 100%, 0.1)
-
-	a
-		text-decoration inherit
-		cursor pointer
-		color inherit
-		&.email
-			font-weight bold

src/styles/Home.styl

@@ -1,34 +1,70 @@
 @require './Breakpoints.styl'
 
 #home
-	height 100vh
-	width 100vw
-	display flex
-	align-items center
-	justify-content center
-	perspective 1em
-	cursor none
+  height 100vh
+  width 100vw
+  display flex
+  align-items center
+  justify-content center
+  perspective 1em
+  cursor none
 
-	#bg
-		position absolute
-		left 0
-		top 0
-		width 100vw
-		height 100vh
-		z-index -1
+  #bg
+    position absolute
+    left 0
+    top 0
+    width 100vw
+    height 100vh
+    z-index -1
 
-	#letters-wrapper
-		display inline-block
-		text-align center
-		font-size 1em
-		font-weight bold
-		+is-phone()
-			font-size 2.5em
-		+is-tablet()
-			font-size 3em
-		+is-netbook()
-			font-size 3.5em
-		+is-laptop()
-			font-size 4em
-		+is-desktop()
-			font-size 4.5em
+  #letters-wrapper
+    display inline-block
+    text-align center
+    font-size 1em
+    font-weight bold
+    +is-phone()
+      font-size 2.5em
+    +is-tablet()
+      font-size 3em
+    +is-netbook()
+      font-size 3.5em
+    +is-laptop()
+      font-size 4em
+    +is-desktop()
+      font-size 4.5em
+
+  footer
+    bottom 0
+    flex-direction column
+
+  header
+    top 0
+    flex-direction row
+
+    span
+      margin 0 .5em
+
+  .fixed
+    font-family 'Inconsolata', monospace
+    display flex
+    align-items center
+    justify-content center
+    font-size 1.2em
+    position absolute
+    left 0
+    text-align center
+    width 100vw
+    padding 1em
+    z-index 1
+
+    span
+      background-color hsla(0, 0%, 100%, 0.15)
+
+    a
+      cursor none
+      color inherit
+      transition all 100ms
+      display inline-block
+
+      &:hover
+        transform scale(1.2)