[update] Style Home page
This commit is contained in:
brunosimon
@@ -0,0 +1,201 @@
|
||||
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
|
||||
font-family 'Ubuntu Mono'
|
||||
|
||||
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
|
||||
|
||||
.letter
|
||||
position absolute
|
||||
top 0
|
||||
left 0
|
||||
line-height 0
|
||||
|
||||
&.index-0
|
||||
left 100px - 15px
|
||||
&.index-1
|
||||
left 150px - 15px
|
||||
&.index-2
|
||||
left 200px - 15px
|
||||
&.index-3
|
||||
left 250px - 15px
|
||||
&.index-4
|
||||
left 300px - 15px
|
||||
&.index-5
|
||||
left 350px - 15px
|
||||
&.index-6
|
||||
left 400px - 15px
|
||||
|
||||
.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
|
||||
&: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
|
||||
|
||||
.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
|
||||
|
||||
Reference in New Issue
Block a user