diaspora/public/stylesheets/sass/application.sass

959 lines
14 KiB
Sass

// Copyright (c) 2010, Diaspora Inc. This file is
// licensed under the Affero General Public License version 3 or later. See
// the COPYRIGHT file.
@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
:color #107FC9
:color #019DBE
:text
:decoration none
&:hover
:color #fff
:background
:color #556270
:color #019DBE
h1
:font
:size 21px
:weight bold
:line
:height 36px
h3
:font
:size 18px
:weight bold
.avatar
:width 50px
:height 50px
#flash_notice,
#flash_error,
#flash_alert
:z-index 100
: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 2em
:color #000
:background -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666), to(#222))
:background -moz-linear-gradient(19% 75% 90deg, #222, #666)
:background
:color #666
:padding 0
:top 5px
:border
:bottom 1px solid #ccc
a
:color #999
&:hover
:background none
:color #eee
#diaspora_text
:display inline
:font
:family 'BrandonGrotesqueLightRegular'
:size 16px
:border none
:color #fff
#session_action
:position absolute
:display inline
:top 0
:right 0
ul
:list
:style none
:padding 0
:margin 0
:display inline
li
:display inline
:margin
:right 1em
&:last-child
:margin
:right 0
#aspect_header
:-webkit-box-shadow 0px -4px 6px -2px #777
:background -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F7F7F7), to(#EEEEEE))
:background -moz-linear-gradient(19% 75% 90deg, #eee, #f7f7f7)
:background
:color #eee
:border
:top 1px solid #fff
:padding 20px 0
h1
:margin
:bottom 0
:text-shadow 0 2px 0 #fff
a
:color #111
&:hover
:background none
:color #999
.page_title
:text
:transform uppercase
:shadow 0 2px 0 #fff
:margin
:top -5px
ul#stream
:margin 0
:padding 0
> li
:min-height 50px
:list-style none
:padding 12px 0
:border
:bottom 1px solid #eee
&:hover
:background -webkit-gradient(linear, 0% 0%, 0% 50%, from(#FAFAFA), to(#FCFCFC))
:background
:color #fafafa
:border
:bottom 1px solid #ddd
.destroy_link
:display inline
.right
:top 0
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
:padding
:left 65px
:width 600px
span.from
:color #000
:font
:weight normal
:font
:size 110%
div.info
:color #bababa
:font-size 70%
.time
a
:color #666
.reshare_pane
:margin
:left 5px
:right 5px
:display inline
:position relative
ul.reshare_box
:width 150px
:display none
:z-index 10
:position absolute
:margin
:top 5px
:padding 0
:background
:color #fafafa
:list
:style none
:border 5px solid #666
:-webkit-box-shadow 0 0 5px #666
:-moz-box-shadow 0 0 5px #666
:text-shadow 0 2px #fff
:color #000
> li
:font
:weight bold
:padding 8px
:right 15px
:border
:top 1px solid #fff
:bottom 1px solid #ccc
&:first-child
:border
:top none
&:last-child
:border
:bottom none
a
:display block
:height 100%
&:hover
:background
:color #eee
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
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 #ddd
.from
:font
:size 1em
div.time
:color #666
:font-size 70%
form
:margin
:top -5px
:bottom 0
:font
:size 1em
textarea
:font
:size 1em
.profile_photo
img
:height 150px
:width 150px
#profile
ul
:list-style-type none
:margin 0
:padding 0
#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 2em
:bottom 15px
a
:color #999
:font
:weight normal
&:hover
:text
:decoration underline
:background none
.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
:color #ccc
h5
:color #ccc
input[type='text'],
input[type='password'],
textarea
:font
:family 'lucida grande', 'lucida sans', 'sans-serif'
:size 14px
:padding 0.3em
:display block
:width 66%
:border 1px solid #ccc
:height auto
:border-radius 5px
:-webkit-border-radius 5px
:-moz-border-radius 5px
:box-shadow 0 1px 2px #fff
:-moz-box-shadow 0 1px 2px #fff
:-webkit-box-shadow 0 1px 2px #fff
.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
:color #999
:position relative
.avatar
:float left
:margin
:right 15px
p
:position absolute
:left 0
:top 0
form
:display inline
input[type='submit']
:float right
:margin
:right 20px
:top 26px
textarea
:width 600px
:height 42px
:margin
:top 0
:bottom 0
.button
:margin-left 100px
img
:box-shadow 0 1px 2px #fff
:-moz-box-shadow 0 1px 2px #fff
:-webkit-box-shadow 0 1px 2px #fff
:border 1px solid #bbb
:top 1px solid #666
#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 200px
:width 200px
:display inline-block
img
:width 200px
:height 200px
.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 0
: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
#aspect_nav
:color #000
:margin
:top 8px
:bottom 1px
#aspect_manage_button
:display inline
a
:color #999
ul
:margin 0
:padding 0
:list
:style none
> li
:padding 0
:display inline
:margin
:right 2px
a
:text-shadow 0 2px 0 #444
:-webkit-border-radius 3px 3px 0 0
:-moz-border-radius 3px 3px 0 0
:line
:height 22px
:background
:color #444
:border 1px solid #555
:padding 3px 8px
:bottom 3px
:color #999
&:hover
:background
:color #4e4e4e
:color #ccc
&.selected a
:-webkit-box-shadow 0px -4px 6px -2px #777
:-moz-box-shadow 0px -4px 6px -2px #777
:text-shadow 0 2px 0 #fff
:padding
:top 4px
:bottom 5px
:line
:height 18px
:font
:weight bold
:background
:color #eee
:background -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#F7F7F7))
:background -moz-linear-gradient(19% 75% 90deg, #f7f7f7, #fff)
:border 1px solid #fff
:bottom 1px solid #F7F7F7
:color #000
&:hover
:background
:color #efefef
a
:color #000
.new_requests
:color red
#global_search
:display inline
:position relative
:opacity 0.5
form
:display inline
input
:display inline
:font
:size 12px
:border none
input[type='text']
:width 200px
:padding 2px
label
:font
:size 12px
:margin
:top -3px
.aspect,
.requests,
.remove
:list
:style none
h1
:display inline-block
.tip
:display none
:color #999
:margin
:left 0.5em
.edit_name_field:hover
.tip
:display inline
.aspect_name
:position relative
ul.tools
:position absolute
:top 10px
:right 0
:display inline
:padding 0
:margin 0
:list
:style none
li
:display inline
:margin
:right 1em
&:last-child
:margin
:right 0
.grey
:color #999
:cursor default
:text-shadow 0 2px #fff
ul.dropzone
:min-height 20px
:margin 0
:bottom 25px
:background
:color #efefef
:border 1px solid #ccc
:list
:style none
:padding 15px
&.active
:background
:color #fafafa
.person,
.requested_person
:display inline-block
:padding 5px
:cursor move
:margin 5px
:z-index 10
:text
:align center
:width 125px
:height 120px
img
:height 100px
:width 100px
:display inline-block
&:active
:z-index 20
:color #666
img
:-webkit-box-shadow 0 1px 3px #333
:-moz-box-shadow 0 2px 4px #333
:opacity 0.9
ul#settings_nav
:list
:style none
:padding 0
:marign 0
:font
:size larger
> li
a
:display block
:height 100%
:border
:bottom 1px solid #eee
:padding 5px 0
.settings_pane
:display none
#fancybox-close:hover
:background
:color transparent
.aspect_tag,
.public_aspect_tag
:position absolute
:top 15px
:right 2em
:border-radius 5px
:-webkit-border-radius 5px
:-moz-border-radius 5px
:font
:size smaller
:padding 0 6px
:color #999
:text
:shadow 0 1px #fff
:border
:bottom 1px solid #eee
:cursor default
.public_aspect_tag
:background -moz-linear-gradient(19% 75% 90deg,#FFFA75, #FFF8BA)
:background -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF8BA), to(#FFFA75))
:color #FFFC7F
:border
:top 1px solid #EBE66C
.aspect_tag
:background -moz-linear-gradient(19% 75% 90deg,#E0E0E0, #F0F0F0)
:background -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F0F0F0), to(#E0E0E0))
:color #eee
:color #999
:text
:shadow 0 1px #fff
:border
:top 1px solid #ddd
ul
:display inline
:margin 0
:padding 0
:list
:style none
li
:display inline-block
:margin
:right 2px
:padding
:right 4px
:border
:right 1px solid #ccc
&:last-child
:margin
:right 0
:padding
:right 0
:border
:right none
#friend_pictures
:line-height 1em
img
:margin-right -1px
#thumbnails
:line-height 14px