Bruno SIMON
271 lines
8.2 KiB
Stylus
271 lines
8.2 KiB
Stylus
body.project
|
|
background #31344a
|
|
color #ffffff
|
|
|
|
.label
|
|
font-size 10px
|
|
margin-bottom 2px
|
|
|
|
header
|
|
position relative
|
|
height 80px
|
|
overflow hidden
|
|
|
|
.logo
|
|
position absolute
|
|
top 40px
|
|
left -35px
|
|
|
|
.disks
|
|
.disk
|
|
position absolute
|
|
border-radius 50%
|
|
background #fff
|
|
transform translateX(-50%) translateY(-50%)
|
|
|
|
&.index-0
|
|
width 70px
|
|
height 70px
|
|
background #fff
|
|
&.index-1
|
|
width 140px
|
|
height 140px
|
|
background #666b99
|
|
&.index-2
|
|
width 210px
|
|
height 210px
|
|
background #555980
|
|
&.index-3
|
|
width 280px
|
|
height 280px
|
|
background #474a6b
|
|
&.index-4
|
|
width 350px
|
|
height 350px
|
|
background #3b3e59
|
|
.title
|
|
position absolute
|
|
top 0
|
|
left 80px
|
|
line-height 4px
|
|
font-size 28px
|
|
font-family 'Stellar'
|
|
text-transform uppercase
|
|
letter-spacing 2px
|
|
|
|
aside.aside
|
|
position fixed
|
|
top 80px
|
|
left 0
|
|
bottom 0
|
|
width 240px
|
|
|
|
header.aside-header
|
|
position relative
|
|
width 100%
|
|
height 115px
|
|
padding 12px 20px 0 20px
|
|
border-top 1px solid #515771
|
|
border-bottom 1px solid #515771
|
|
background rgba(0,0,0,0.2)
|
|
|
|
.name
|
|
position absolute
|
|
top 15px
|
|
left 20px
|
|
font-weight bold
|
|
|
|
.details
|
|
text-align right
|
|
|
|
.detail
|
|
margin-bottom 6px
|
|
|
|
.value
|
|
font-weight bold
|
|
|
|
|
|
.aside-tree
|
|
position absolute
|
|
top 115px
|
|
left 0
|
|
width 100%
|
|
bottom 110px
|
|
overflow-y scroll
|
|
|
|
nav.files-tree-nav
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
|
|
li
|
|
line-height 24px
|
|
font-size 12px
|
|
cursor pointer
|
|
|
|
.name
|
|
position relative
|
|
display inline-block
|
|
padding-left 20px
|
|
padding-right 6px
|
|
font-smoothing(auto)
|
|
+retina()
|
|
font-smoothing(antialiased)
|
|
|
|
.notif
|
|
display inline-block
|
|
height 12px
|
|
margin 0 2px 0 3px
|
|
padding 0 4px
|
|
line-height 12px
|
|
border-radius 6px
|
|
font-size 8px
|
|
font-smoothing(auto)
|
|
|
|
&.new-file
|
|
background #748bd5
|
|
|
|
&.new-version
|
|
background #ec399e
|
|
line-height 13px
|
|
|
|
> span
|
|
display block
|
|
padding-left 16px * 1
|
|
li > span
|
|
padding-left 16px * 2
|
|
li li > span
|
|
padding-left 16px * 3
|
|
li li li > span
|
|
padding-left 16px * 4
|
|
li li li li > span
|
|
padding-left 16px * 5
|
|
li li li li li > span
|
|
padding-left 16px * 6
|
|
li li li li li li > span
|
|
padding-left 16px * 7
|
|
li li li li li li li > span
|
|
padding-left 16px * 8
|
|
li li li li li li li li > span
|
|
padding-left 16px * 9
|
|
|
|
&.active
|
|
background #4d5b8d
|
|
|
|
i
|
|
position absolute
|
|
top 25%
|
|
left 0
|
|
display block
|
|
width 12px
|
|
height 50%
|
|
background center center no-repeat
|
|
|
|
&.folder
|
|
background-image url('../svg/folder.svg')
|
|
&.folder-active
|
|
background-image url('../svg/folder-active.svg')
|
|
&.js
|
|
background-image url('../svg/js.svg')
|
|
&.html
|
|
background-image url('../svg/html.svg')
|
|
&.sass
|
|
background-image url('../svg/sass.svg')
|
|
&.less
|
|
background-image url('../svg/less.svg')
|
|
&.css
|
|
background-image url('../svg/css.svg')
|
|
&.php
|
|
background-image url('../svg/php.svg')
|
|
&.json
|
|
background-image url('../svg/json.svg')
|
|
&.jade
|
|
background-image url('../svg/jade.svg')
|
|
&.md
|
|
background-image url('../svg/md.svg')
|
|
&.sql
|
|
background-image url('../svg/sql.svg')
|
|
&.apache
|
|
background-image url('../svg/apache.svg')
|
|
&.yml
|
|
background-image url('../svg/yml.svg')
|
|
&.svg
|
|
background-image url('../svg/svg.svg')
|
|
&.font
|
|
background-image url('../svg/font.svg')
|
|
&.image
|
|
background-image url('../svg/image.svg')
|
|
&.video
|
|
background-image url('../svg/video.svg')
|
|
&.audio
|
|
background-image url('../svg/audio.svg')
|
|
&.zip
|
|
background-image url('../svg/zip.svg')
|
|
&.txt
|
|
background-image url('../svg/txt.svg')
|
|
&.coffee
|
|
background-image url('../svg/coffee.svg')
|
|
&.git
|
|
background-image url('../svg/git.svg')
|
|
&.xml
|
|
background-image url('../svg/xml.svg')
|
|
&.twig
|
|
background-image url('../svg/twig.svg')
|
|
&.c
|
|
background-image url('../svg/c.svg')
|
|
&.random
|
|
background-image url('../svg/random.svg')
|
|
|
|
footer.aside-footer
|
|
position absolute
|
|
bottom 0
|
|
left 0
|
|
width 100%
|
|
height 110px
|
|
padding 15px 20px 0 20px
|
|
border-top 1px solid #515771
|
|
background rgba(0,0,0,0.2)
|
|
|
|
|
|
section.main
|
|
position fixed
|
|
top 80px
|
|
left 240px
|
|
right 0
|
|
bottom 0
|
|
|
|
section.no-file
|
|
position absolute
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
height 100%
|
|
border-top 1px solid #515771
|
|
border-left 1px solid #515771
|
|
|
|
.text
|
|
position absolute
|
|
top 50%
|
|
left 0
|
|
width 100%
|
|
text-align center
|
|
color #c6c0d8
|
|
text-transform uppercase
|
|
font-size 20px
|
|
opacity 0.2
|
|
font-weight bold
|
|
|
|
section.file
|
|
top 0
|
|
left 0
|
|
width 100%
|
|
height 100%
|
|
|
|
header.file-header
|
|
position absolute
|
|
top 0
|
|
left 200px
|
|
right 0
|
|
height 30px
|
|
background #4d5b8d |