cupcakearmy/old.nicco.io
1
0
Fork 0
mirror of https://github.com/cupcakearmy/old.nicco.io.git synced 2025-02-22 10:19:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

blog and github links

Browse Source
This commit is contained in:
cupcakearmy 2019-05-04 01:17:48 +02:00
parent 3a0047137b
commit 1fa905fb5d
3 changed files with 72 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/Screens/Home.tsx
View File

@ -11,6 +11,11 @@ const Home: React.FC = () => {
const { height, width } = useInnerWindowSize() const { height, width } = useInnerWindowSize()
return <div id="home" style={{ width: width + 'px', height: height + 'px' }}> 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> <Parallax>
<section id={'letters-container'}> <section id={'letters-container'}>
<h1> <h1>
@ -25,10 +30,10 @@ const Home: React.FC = () => {
<Cursor/> <Cursor/>
<footer> <footer className={'fixed'}>
<span>developer.</span> <span>developer.</span>
<br/> <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/> <br/>
<span> <span>
<small> <small>

23
src/styles/Footer.styl
View File

@ -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

94
src/styles/Home.styl
View File

@ -1,34 +1,70 @@
@require './Breakpoints.styl' @require './Breakpoints.styl'
#home #home
height 100vh height 100vh
width 100vw width 100vw
display flex display flex
align-items center align-items center
justify-content center justify-content center
perspective 1em perspective 1em
cursor none cursor none
#bg #bg
position absolute position absolute
left 0 left 0
top 0 top 0
width 100vw width 100vw
height 100vh height 100vh
z-index -1 z-index -1
#letters-wrapper #letters-wrapper
display inline-block display inline-block
text-align center text-align center
font-size 1em font-size 1em
font-weight bold font-weight bold
+is-phone() +is-phone()
font-size 2.5em font-size 2.5em
+is-tablet() +is-tablet()
font-size 3em font-size 3em
+is-netbook() +is-netbook()
font-size 3.5em font-size 3.5em
+is-laptop() +is-laptop()
font-size 4em font-size 4em
+is-desktop() +is-desktop()
font-size 4.5em 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)