add font awesome icons

This commit is contained in:
Riku Rouvila
2015-01-22 00:48:05 +02:00
parent 61668679a9
commit d220fe3398
7 changed files with 36 additions and 21 deletions

6
src/styles/icons.less Normal file
View File

@@ -0,0 +1,6 @@
@import '../../bower_components/font-awesome/less/variables.less';
@import '../../bower_components/font-awesome/less/path.less';
@import '../../bower_components/font-awesome/less/core.less';
.@{fa-css-prefix}-github:before { content: @fa-var-github; }
.@{fa-css-prefix}-slack:before { content: @fa-var-slack; }

116
src/styles/style.styl Normal file
View File

@@ -0,0 +1,116 @@
body, html
margin 0
font 16px 'proxima-nova', 'Helvetica Neue', helvetica, arial, sans-serif
height 100%
width 100%
font-weight 400
color #444
font-smoothing antialiased
h1, h2, h3
margin 0
margin-bottom 0.5em
.container
width 100%
height 100%
box-sizing border-box
.jumbo
width 100%
height 100%
background url('../images/jumbo.jpg')
background-size cover
.input
width 100%
height 45px
padding 1em
box-sizing border-box
font-size inherit
border 2px solid rgba(0, 0, 0, 0.3)
border-radius 5px
background transparent
color rgba(0, 0, 0, 0.5)
outline 0
&:focus
border 2px solid rgba(0, 0, 0, 0.4)
color rgba(0, 0, 0, 0.6)
.input::-webkit-input-placeholder
color rgba(0, 0, 0, 0.3)
.input:-moz-placeholder
color rgba(0, 0, 0, 0.3)
opacity 1
.input::-moz-placeholder
color rgba(0, 0, 0, 0.3)
opacity 1
.input:-ms-input-placeholder
color rgba(0, 0, 0, 0.3)
.input.has-error
border-color rgba(226, 33, 112, 0.6)
color rgba(226, 33, 112, 0.6)
.btn
border-radius 3px
border 0
padding 1em
font-size 14px
outline 0
cursor pointer
&:disabled
opacity 0.6
#invite-form
max-width 500px
margin auto
.invite-form
position relative
.btn
width 40px
height 32px
background #3090de
padding 0
position absolute
right 8px
top 50%
margin-top -15px
border-bottom 2px solid #117280
color rgba(255, 255, 255, 0.5)
&:active
border-bottom 0
.form-container
width 100%
padding 0 2em
box-sizing border-box
max-width 700px
position absolute
top 50%
left 50%
transform translateY(-50%) translateX(-50%)
p
text-align center
margin-bottom 2em
line-height 1.7em
a
color #2080CF
text-decoration none
&:hover
text-decoration underline
.footer
font-size 1em
padding 0.5em
position absolute
bottom 0
i
margin 0 7px
font-size 1.5em
color #3090de