brunosimon
214 lines
5.4 KiB
Stylus
214 lines
5.4 KiB
Stylus
body.projects
|
|
background #323759
|
|
color #fff
|
|
|
|
::-moz-selection
|
|
background #f1eff9
|
|
::selection
|
|
background #f1eff9
|
|
|
|
.gradient-backgroud
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
height 920px
|
|
background linear-gradient( 0deg, #323759, #5e50c3 33%, #c9b2cd )
|
|
|
|
p
|
|
ul
|
|
font-size 14px
|
|
line-height 18px
|
|
margin-bottom 1em
|
|
|
|
code
|
|
display block
|
|
font-family 'Ubuntu Mono'
|
|
outline none
|
|
|
|
section.landing
|
|
position relative
|
|
margin-bottom 60px
|
|
|
|
.logo
|
|
position absolute
|
|
top 315px
|
|
left 50%
|
|
|
|
.disks
|
|
.disk
|
|
position absolute
|
|
border-radius 50%
|
|
background #fff
|
|
transform translateX(-50%) translateY(-50%)
|
|
opacity 0.2
|
|
|
|
&.index-0
|
|
width 100px
|
|
height 100px
|
|
opacity 0.7
|
|
&.index-1
|
|
width 200px
|
|
height 200px
|
|
&.index-2
|
|
width 300px
|
|
height 300px
|
|
&.index-3
|
|
width 400px
|
|
height 400px
|
|
&.index-4
|
|
width 500px
|
|
height 500px
|
|
.title
|
|
font-size 45px
|
|
font-family 'Stellar'
|
|
|
|
.letter
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
line-height 8px
|
|
|
|
&.index-0
|
|
left 100px - 10px
|
|
&.index-1
|
|
left 150px - 10px
|
|
&.index-2
|
|
left 200px - 10px
|
|
&.index-3
|
|
left 250px - 10px
|
|
&.index-4
|
|
left 300px - 10px
|
|
&.index-5
|
|
left 350px - 10px
|
|
&.index-6
|
|
left 400px - 10px
|
|
|
|
.version
|
|
position absolute
|
|
top 5px
|
|
left 420px
|
|
opacity 0.2
|
|
font-size 14px
|
|
|
|
.punch-line
|
|
padding-top 600px
|
|
text-align center
|
|
|
|
.text
|
|
text-transform uppercase
|
|
font-size 18px
|
|
margin 0 0 8px 0
|
|
|
|
.links
|
|
a.link
|
|
display inline-block
|
|
padding 5px 10px
|
|
margin 0 5px
|
|
background rgba(255,255,255,0.2)
|
|
text-decoration none
|
|
transition background 0.15s
|
|
will-change transform
|
|
&:hover
|
|
background rgba(255,255,255,0.30)
|
|
|
|
section.projects
|
|
position relative
|
|
width 640px
|
|
margin 0 auto 90px auto
|
|
|
|
.head
|
|
height 45px
|
|
line-height 45px
|
|
background #333759
|
|
text-align center
|
|
font-size 14px
|
|
|
|
.content
|
|
width 100%
|
|
|
|
span.no-project
|
|
display block
|
|
padding 17px 0
|
|
background #eef0fa
|
|
text-align center
|
|
color #6c6e7c
|
|
font-size 16px
|
|
font-weight bold
|
|
|
|
.title
|
|
opacity 0.4
|
|
|
|
a.project
|
|
display block
|
|
background #eef0fa
|
|
color #6c6e7c
|
|
border-bottom 1px solid #dadada
|
|
transition background 0.15s
|
|
will-change background
|
|
|
|
.title
|
|
display inline-block
|
|
vertical-align top
|
|
width 400px
|
|
font-size 16px
|
|
font-weight bold
|
|
padding 17px
|
|
|
|
.details
|
|
display inline-block
|
|
vertical-align top
|
|
width 240px
|
|
text-align right
|
|
|
|
.detail
|
|
display inline-block
|
|
padding 11px 10px
|
|
text-align right
|
|
|
|
.label
|
|
font-size 10px
|
|
opacity 0.5
|
|
margin-bottom 2px
|
|
|
|
.value
|
|
font-weight bold
|
|
|
|
&:last-child
|
|
border-bottom none
|
|
|
|
&:hover
|
|
background #f6f7fc
|
|
|
|
section.text
|
|
position relative
|
|
width 640px
|
|
margin 0 auto 90px auto
|
|
text-align center
|
|
|
|
.title
|
|
margin-bottom 18px
|
|
font-family 'Stellar'
|
|
font-size 32px
|
|
|
|
ul
|
|
display inline-block
|
|
text-align left
|
|
|
|
pre
|
|
width 400px
|
|
margin 0 auto 2em auto
|
|
background #282c47
|
|
padding 12px 18px
|
|
text-align left
|
|
|
|
span.line
|
|
&:before
|
|
display inline-block
|
|
content '$'
|
|
padding 0 8px 0 0
|
|
.opacity-20
|
|
opacity 0.2
|
|
pointer-events none
|
|
|