diaspora/public/stylesheets/sass/application.sass
2010-08-26 15:02:13 -07:00

744 lines
11 KiB
Sass

@font-face
:font-family 'BrandonGrotesqueLightRegular'
:src url('brandongrotesque_light/Brandon_light-webfont.eot')
:src local('☺'), url('brandongrotesque_light/Brandon_light-webfont.woff') format('woff'), url('brandongrotesque_light/Brandon_light-webfont.ttf') format('truetype'), url('brandongrotesque_light/Brandon_light-webfont.svg#webfont') format('svg')
font
:weight normal
:style normal
body
:padding 2em
:margin 0
a
:color #556270
:text
:decoration none
&:hover
:color #fff
:background
:color #556270
.avatar
:width 50px
:height 50px
#flash_notice,
#flash_error,
#flash_alert
:z-index 3
:top 32px
:position absolute
:color #000
:width 400px
:margin 0 0 0 -200px
:left 50%
:text
:align center
:font
:size 14px
:padding 3px 0
#flash_notice
:background-color #CFC
:border solid 1px #6C6
#flash_error,
#flash_alert
:background-color #FCC
:border solid 1px #C66
.fieldWithErrors
:display inline
.error_messages
:width 400px
:border 2px solid #CF0000
:padding 0
:padding-bottom 12px
:margin-bottom 20px
:background-color #f0f0f0
:font
:size 12px
h2
:text-align left
:padding 5px 5px 5px 15px
:margin 0
:font
:weight bold
:size 12px
:background-color #c00
p
:margin 8px 10px
ul
:margin 0
header
:z-index 4
:position relative
:margin -2em
:bottom 0
:color #000
:background
:color #333
:border
:bottom 2px solid #666
:padding 0
#diaspora_text
:position absolute
:display inline
:font
:family 'BrandonGrotesqueLightRegular'
:size 16px
:border none
:color #fff
:text
:shadow 0 2px 0 #000
:top 3px
a
:color #666
a:hover
:color #fff
:background none
span.sub_text
:text
:shadow none
#session_action
:position relative
:display inline
:float right
a
&.new_requests
:color #DF0101
:padding-right 10px
#sub_header
:margin 0 -2em
:padding 0.5em 0
:background
:color black
:margin
:bottom 2em
#show_filters
:z-index 100
:position absolute
:right 0
:text-align right
#show_filters > a
:border 1px solid #666
:padding 5px
#main
:width 100%
ul#stream
:margin 0
:padding 0
> li
:min-height 50px
:list-style none
:padding 12px 0
:border
:bottom 1px solid #eee
li.message
:position relative
:line-height 140%
:font
:family 'Lucida Grande', sans-serif
:color #999
.avatar
:float left
:margin
:right 15px
.delete:hover
:background #eee
.content
span.from
:color #000
:font
:weight normal
:margin
:right 0.2em
:font
:size 110%
div.info
:color #bababa
:font-size 70%
h1
:position relative
:font
:size 21px
:weight bold
:line-height 36px
p.description, span.description, .description
:font
:weight 200
:color #999
h3
:position relativex
:font
:size 18px
:weight bold
form
:position relative
:font
:size 120%
:margin 1em
:left 0em
#user_name
:margin
:bottom 20px
img
:margin
:right 10px
:display inline-block
:float left
:height 40px
h1
:margin
:bottom 7px
:line-height 18px
a
:color #000
span
:size small
:font
:weight normal
:color #999
#latest_message_time
:font-style italic
ul
:display inline
:margin 0
:padding 0
:list-style none
> li
:display inline
:margin
:right 1em
#stream div.comments
:display none
.avatar
:width 30px
:height 30px
:margin
:right 10px
#stream ul.comment_set
:padding 0
:left 65px
input.comment_submit
:display none
:margin
:right -10px
ul.comment_set
:margin 0
:top 1em
:padding 0
:list-style none
:width 495px
textarea
:width 100%
li.comment
:margin
:bottom 0.5em
:background
:color rgba(10,81,109,0.05)
:padding 0.6em
:border
:bottom 1px solid #ccc
.from
:font
:weight normal
a
:font
:weight bold
div.time
:color #666
:font-size 70%
form
:margin
:top -5px
:bottom 0
.profile_photo
:float left
:margin-right 10px
#profile
ul
:list-style-type none
#stream, #profile,
.comments
img.person_picture
:border-radius 3px
:-webkit-border-radius 3px
:-moz-border-radius 3px
:display inline block
:height 30px
:display absolute
:float left
:margin
:right 10px
.pagination
a
:padding 3px
.destroy_link, .request_button
:position absolute
:right 0
:bottom 15px
a
:color #999
:font
:weight normal
.destroy_link
:display none
:font-size smaller
.request_buttons
:position absolute
:right 0
:display inline
:list-style none
:margin 0
:padding 0
> li
:display inline
&:first-child
:margin-right 1em
#show_photo
:text-align center
:min-height 200px
img
:max-width 100%
.caption
:margin
:top 10px
:bottom 25px
:font
:size larger
#debug_info
:margin-top 20px
input[type='text'], textarea
:font
:family 'lucida grande', 'sans-serif'
:size 14px
:padding 0.3em
:display block
:width 66%
:border-top 1px solid #666
:height auto
#submit_block
:text
:align right
:font
:size 12px
form p
:position relative
:padding 0
:margin 0
label
:color #999
:position absolute
:top 3px
:left 0.48em
:font
:weight normal
#publisher
:border
:bottom 2px #999 solid
:color #999
:position relative
:height 63px
:margin
:bottom 5px
.avatar
:float left
:margin
:right 15px
p
:position absolute
:left 0
form
:display inline
input[type='submit']
:float right
:margin
:right 20px
:top 28px
textarea
:width 485px
:height 40px
:margin
:top 0
ul.group_selector
:left 510px
:padding 0
:margin 0
:width 110px
:z-index 10
:position absolute
:height auto
:overflow visible
:list
:style none
> li
:height auto
:font-size smaller
:padding 2px
:display none
:background
:color #eee
&:active
:background
:color yellow
&:hover li
:display block
.button
:margin-left 100px
#image_picker
.small_photo
:height 100px
:position relative
:display inline-block
:margin
:right 1em
:bottom 1em
img
:border-radius 3px
input[type='checkbox']
:position absolute
.selected
:-webkit-box-shadow 0 3px 6px #000
:-moz-box-shadow 0 3px 6px #000
:border 1px solid #fff
/* cycle it! */
.album
:position relative
:height 300px
:width 300px
:display inline-block
.name
:position absolute
:z-index 6
:padding 1em
:background rgba(0,0,0,0.8)
:bottom 20px
:font
:size 18px
:text-shadow 0 2px 0 #000
.time
:font
:size 12px
a
:font
:weight normal
div.image_cycle
img
:display none
.field_with_submit
input[type='text']
:width 82%
:display inline
h1.big_text
:position relative
:line-height auto
:border
:bottom 1px solid #666
.right
:top -6px
#content_bottom
.right
:top -5px
.right
:display inline
:float right
.back
:font
:size 12px
:weight normal
#content_bottom
:position relative
:line-height 36px
:margin
:top 25px
:bottom 25px
:min-height 36px
:border
:top 1px solid #999
:bottom 2px solid #eee
.show_post_comments ul.comment_set
:width 100%
.sub_header
:position relative
:text
:align center
:font
:style italic
:margin
:bottom 20px
:color #999
.image_thumb
:display inline-block
:width 100px
:min-width 100px
:height 100px
:min-height 100px
img
:display none
.image_cycle
img
:display none
#group_nav
:color #000
ul
:margin 0
:bottom -5px
:padding 0
:list
:style none
:font
:size 14px
> li
:display inline
:margin
:right 1.5em
:padding 0.3em 0.5em
:right 0.3em
&:hover
:background
:color #333
a
:color #999
a
:color #999
&:hover
:background none
&.editable:hover
:background yellow
.
:margin
:left 4px
a
:color #000
.selected
:background
:color #fff
:color #000
&:hover
:background
:color #eee
.
a
:color #333
#add_photo_loader
:position absolute
:display none
:left -25px
:top 4px
#user_menu
:position absolute
:z-index 10
:top 0
:right 0
:display inline-block
:padding 0
:margin 0
:list
:style none
> li
:display none
:background
:color #fff
:width 180px
:height 29px
:border
:left 2px solid #000
:right 2px solid #000
&:hover
:background
:color #eee
&:first-child
:display block
:background none
:border
:left 2px solid #333
:right 2px solid #333
a
:color #999
img
:position absolute
:width 20px
:height 20px
:top 3px
:left 9px
&:last-child
:border
:bottom 2px solid #000
a
:display block
:height 100%
:padding
:left 40px
:top 5px
:color #000
&:hover
:background
:color transparent
.requests
:background
:image url('/images/glyphish-icons/icons/40-inbox.png')
:repeat no-repeat
:position 5px
.settings
:background
:image url('/images/glyphish-icons/icons/20-gear2.png')
:repeat no-repeat
:position 5px
.logout
:background
:image url('/images/glyphish-icons/icons/54-lock.png')
:repeat no-repeat
:position 5px
&:hover li
:display block
#global_search
:display inline
:position relative
:padding
:right 167px
form
:display inline
input
:margin
:top 5px
:display inline
:font
:size 12px
:border none
:border-radius 0
input[type='text']
:width 200px
:padding 2px
:background
:image url('/images/glyphish-icons/icons/06-magnifying-glass.png')
:repeat no-repeat
:position 187px
:size 12px
label
:font
:size 12px
:margin
:top -3px
.editing, .editing:hover
:background
:color yellow
:border 1px #666 solid