diaspora/public/stylesheets/sass/ui.sass
2011-07-01 16:12:14 -07:00

192 lines
3.2 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.
@import 'mixins'
.ui-autocomplete
:left -11px
.button
@include border-radius(2px)
@include linear-gradient(rgb(248,250,250),rgb(228,223,223))
@include box-shadow(0,1px,1px,#cfcfcf)
:font
:style normal
:weight bold
:display inline
:padding 4px 9px
:min-width 90px
:font-size 12px
:line
:height 13px
:min-height 10px
:border 1px solid #aaa
:top 1px solid #bbb
:bottom 1px solid darken(#aaa,13%)
:cursor pointer
:white-space nowrap
:color #444
&:hover
@include linear-gradient(#d6d6d6,#b0b0b0)
:text
:decoration none
:color #444
&:active
@include linear-gradient(#acacac,#808080)
:color #111
:text-shadow 0 1px 0 #ccc
:border 1px solid #666
:top 1px solid #444
:bottom 1px solid #999
img
:position relative
:height 20px
:width 20px
:top 6px
.button .selected
@include linear-gradient(#f0f0f0,#fafafa,29%,85%)
:border
:top 1px solid #aaa
.button.delete
:color desaturate($red,10%)
.button.in_aspects
@include linear-gradient(lighten(#76C000,8%),#76C000)
.button.creation
@include linear-gradient(lighten($creation-blue,8%), darken($creation-blue, 3%))
:color #fafafa
:border 1px solid #666
:top 1px solid #777
:bottom 1px solid darken(#666,13%)
&:hover
@include linear-gradient(lighten($creation-blue,3%), darken($creation-blue, 8%))
.right
:position absolute
:right 0
.dropdown
:position relative
:display inline-block
.button
:width 240px
.wrapper
@include box-shadow(0, 2px, 5px, #666)
:z-index 20
:position absolute
:display none
:width 140px
:padding 4px 0
:margin-top 1px
:background
:color #fff
:border 1px solid #999
ul
@include user-select(none)
:padding 0 !important
:margin 0 !important
:color #333
> li
:font-size 11px !important
:padding 3px 2px
:left 24px
:position relative
.check,
.checkWhite
:position absolute
:left 4px
:top 1px
.checkWhite
:display none
:top 0px
&.newItem
a
:color #999
:font-style italic
&:hover
:text-decoration none
&.hang_right
.wrapper
@include border-radius(3px, 0, 3px, 3px)
:right 3px
&.hang_left
.wrapper
@include border-radius(0, 3px, 3px, 3px)
:left 0px
&.active
.wrapper
:display block
.button
@include border-radius(3px, 3px, 0, 0)
:border 1px solid #444
:bottom none
.selected
:font-weight bold
.button,
.wrapper ul > li:hover
:background #666
:color #fff
:text-shadow none
.wrapper ul > li:hover
:border
:top 1px solid #444
:bottom 1px solid #444
:padding
:top 2px
:bottom 2px
a
:color #ccc
.wrapper ul > li,
.wrapper ul > li *
:cursor pointer
.selected:hover .checkWhite
:display block
.selected:hover .check
:display none