diff --git a/app/assets/stylesheets/application.css.sass b/app/assets/stylesheets/application.css.sass index 3b3cab6e180..fcca3188170 100644 --- a/app/assets/stylesheets/application.css.sass +++ b/app/assets/stylesheets/application.css.sass @@ -6,6 +6,7 @@ @import 'new_styles/_spinner' @import 'sidebar' +@import 'leftnavbar' @import 'sprites' @import 'header' @import 'footer' @@ -16,6 +17,7 @@ @import 'publisher_blueprint' @import 'facebox' @import 'aspects' +@import 'stream-faces' @import 'popover' @import 'stream_element' @import 'report' diff --git a/app/assets/stylesheets/aspects.css.scss b/app/assets/stylesheets/aspects.css.scss index 0bd8917f13b..cfd7588a073 100644 --- a/app/assets/stylesheets/aspects.css.scss +++ b/app/assets/stylesheets/aspects.css.scss @@ -25,12 +25,6 @@ } } -.btn { - &.delete { - color: desaturate($red,10%); - } -} - .modify_aspect { background: url("icons/pencil.png") no-repeat; width: 12px; @@ -99,68 +93,6 @@ margin-bottom: -2px; } -#people_stream.contacts { - .stream_element { - padding: 10px; - min-height: 30px; - - .media { overflow: visible; } - - .float-right { - top: 16px; - - a { - @include opacity(1); - - &:hover { - @include opacity(0.6); - } - } - } - - .info { margin-top: -2px; } - } - - .avatar { - height: 30px; - width: 30px; - } - - .icons-monotone_close_exit_delete { - height: 14px; - width: 14px; - } - - .no_contacts { - text-align: center; - margin-top: 50px; - } -} - -#selected_aspect_contacts .avatar { - height: 32px; - width: 32px; - margin-bottom: -2px; -} - -.stream-faces a:hover { text-decoration: none; } - -#view_all_contacts_link { - @include border-radius(2px); - display: block; - padding: 5px; - border: 1px dotted #aaa; - text-align: center; - margin: 5px 0px; -} - -#no_contacts { - text-align: center; - padding: 10px; - background-color: #eee; - color: $text-dark-grey; -} - /* -- Used in aspects/edit.haml and in contacts/sharing.haml -- */ #aspect_edit_controls { margin-top: 8px; } #aspect_edit_pane { @@ -318,57 +250,6 @@ } } -#leftNavBar { - color: #222222; - - ul { - margin: 0px; - padding: 0px; - } - - a { - color: $link-grey; - font-weight: bold; - text-decoration: none; - } - - .selected { color: $black; } - .selected a { color: $black; } - - .hoverable { - display: block; - margin-right: 6px; - padding: 4px; - &:hover { background-color: $background-blue; } - - .label { - background-color: $background-grey; - color: $text-grey; - float: right; - padding: 3px 5px; - } - } - - .selectable { - display: block; - margin-left: 21px; - overflow: hidden; - text-overflow: ellipsis; - } - - .action { - width: 12px; - height: 12px; - display: none; - float: right; - margin: 3px; - } - - .hoverable:hover > .action { - display: block; - } -} - #new_aspect { #aspect_contacts_visible.checkbox { margin: 0px; @@ -378,4 +259,3 @@ display: inline; } } - diff --git a/app/assets/stylesheets/buttons.css.scss b/app/assets/stylesheets/buttons.css.scss index f8913255b01..2b081708670 100644 --- a/app/assets/stylesheets/buttons.css.scss +++ b/app/assets/stylesheets/buttons.css.scss @@ -27,3 +27,5 @@ .btn-group.open > .btn.green { background: $green; } + +.btn.delete { color: desaturate($red,10%); } diff --git a/app/assets/stylesheets/contacts.css.scss b/app/assets/stylesheets/contacts.css.scss index e98596f6859..d2f786321e3 100644 --- a/app/assets/stylesheets/contacts.css.scss +++ b/app/assets/stylesheets/contacts.css.scss @@ -39,6 +39,43 @@ } } } +#people_stream.contacts { + .stream_element { + padding: 10px; + min-height: 30px; + + .media { overflow: visible; } + + .float-right { + top: 16px; + + a { + @include opacity(1); + + &:hover { + @include opacity(0.6); + } + } + } + + .info { margin-top: -2px; } + } + + .avatar { + height: 30px; + width: 30px; + } + + .icons-monotone_close_exit_delete { + height: 14px; + width: 14px; + } + + .no_contacts { + text-align: center; + margin-top: 50px; + } +} #community_spotlight { .avatar { @@ -79,4 +116,11 @@ color: $text-grey; } } -} \ No newline at end of file +} + +#no_contacts { + text-align: center; + padding: 10px; + background-color: #eee; + color: $text-dark-grey; +} diff --git a/app/assets/stylesheets/leftnavbar.css.scss b/app/assets/stylesheets/leftnavbar.css.scss new file mode 100644 index 00000000000..e616aea91ff --- /dev/null +++ b/app/assets/stylesheets/leftnavbar.css.scss @@ -0,0 +1,48 @@ +#leftNavBar { + color: #222222; + + ul { + margin: 0px; + padding: 0px; + } + + a { + color: $link-grey; + font-weight: bold; + text-decoration: none; + } + + .selected { color: $black; } + .selected a { color: $black; } + + .hoverable { + display: block; + margin-right: 6px; + padding: 4px; + &:hover { background-color: $background-blue; } + + .label { + background-color: $background-grey; + color: $text-grey; + } + } + + .selectable { + display: block; + margin-left: 21px; + overflow: hidden; + text-overflow: ellipsis; + } + + .action { + width: 12px; + height: 12px; + display: none; + float: right; + margin: 3px; + } + + .hoverable:hover > .action { + display: block; + } +} diff --git a/app/assets/stylesheets/new-templates.css.scss b/app/assets/stylesheets/new-templates.css.scss index 782348799c3..0dd65fabd46 100644 --- a/app/assets/stylesheets/new-templates.css.scss +++ b/app/assets/stylesheets/new-templates.css.scss @@ -58,6 +58,8 @@ /* stream */ @import 'tag'; +@import 'stream-faces'; /* contacts */ -@import 'contacts'; \ No newline at end of file +@import 'contacts'; +@import 'leftnavbar'; diff --git a/app/assets/stylesheets/sidebar.css.scss b/app/assets/stylesheets/sidebar.css.scss index 914e9433b6e..613e78ed8f8 100644 --- a/app/assets/stylesheets/sidebar.css.scss +++ b/app/assets/stylesheets/sidebar.css.scss @@ -1,5 +1,3 @@ -$bluebg: #e7f2f7; - #home_user_badge { min-height: 50px; margin-bottom: 20px; @@ -26,47 +24,6 @@ $bluebg: #e7f2f7; float: left; margin: 0px; margin-right: 10px; - color: #222222; - - ul { - margin: 0px; - padding: 0px; - } - - a { - color: $link-grey; - font-weight: bold; - text-decoration: none; - } - - .selected { color: $black; } - .selected a { color: $black; } - - .hoverable { - display: block; - margin-right: 6px; - padding: 4px; - &:hover { background-color: $bluebg; } - } - - .selectable { - display: block; - margin-left: 21px; - overflow: hidden; - text-overflow: ellipsis; - } - - .action { - width: 12px; - height: 12px; - display: none; - float: right; - margin: 3px; - } - - .hoverable:hover > .action { - display: block; - } } #stream_selection { @@ -87,7 +44,7 @@ $bluebg: #e7f2f7; .selected { visibility: visible; } - + .selected + a { color: #333333; } @@ -104,36 +61,36 @@ $bluebg: #e7f2f7; .delete_tag_following { background: url("icons/deletelabel.png") no-repeat; } - + /* ---- override app/stylesheets/vendor/autoSuggest.css ---- */ .tag_input { width: 100%; } - + .as-result { margin-top: -1px; margin-left: 1px; } - + .as-list { em { background-color: #aabbcc; color: black; padding: 0px; } - + color: black; position: static; /* override absolute */ margin: 0px; border-radius: 0px 0px 3px 3px; box-shadow: 0px 1px 1px #666; } - + .as-result-item.active { color: black; text-shadow: none; - background-color: $bluebg; - border-color: $bluebg; + background-color: $background-blue; + border-color: $background-blue; } /* ---- end override app/stylesheets/vendor/autoSuggest.css ---- */ } @@ -141,7 +98,7 @@ $bluebg: #e7f2f7; .rightBar { .section { margin-bottom: 20px; - + .title { position: relative; border-bottom: 1px solid $border-grey; @@ -156,7 +113,7 @@ $bluebg: #e7f2f7; font-weight: bold; color: $text-dark-grey; } - + .icons-plus, .icons-heart, .icons-question, @@ -210,19 +167,19 @@ $bluebg: #e7f2f7; color: $text-dark-grey; } } - + .content { padding: 8px; color: $text-grey; font-size: 11px; - + p, ul { margin: 5px 0px; } ul { padding-left: 0; - + li { list-style: none; } diff --git a/app/assets/stylesheets/stream-faces.css.scss b/app/assets/stylesheets/stream-faces.css.scss new file mode 100644 index 00000000000..4d2ae989da2 --- /dev/null +++ b/app/assets/stylesheets/stream-faces.css.scss @@ -0,0 +1,7 @@ +#selected_aspect_contacts .avatar { + height: 32px; + width: 32px; + margin-bottom: -2px; +} + +.stream-faces a:hover { text-decoration: none; } diff --git a/app/views/contacts/_aspect_listings.haml b/app/views/contacts/_aspect_listings.haml index b72acc8ead2..bdad0799607 100644 --- a/app/views/contacts/_aspect_listings.haml +++ b/app/views/contacts/_aspect_listings.haml @@ -6,13 +6,13 @@ %li.all_aspects{:class => ("active" if params["set"] != "all" && params["set"] != "only_sharing" && !@spotlight)} %a.home_selector.hoverable{:href => contacts_path, :class => ("sub_selected" if params["a_id"])} = t('contacts.index.my_contacts') - .label + .label.pull-right = my_contacts_count %ul.sub_nav#aspects_list - all_aspects.each do |aspect| %li.hoverable{:data => {:aspect_id => aspect.id}, :class => ("active" if params["a_id"].to_i == aspect.id)} - .label + .label.pull-right = aspect.contacts.size .icons-check_yes_ok{:class => ("selected" if params["a_id"].to_i == aspect.id) } %a.selectable{:href => contacts_path(:a_id => aspect.id)} @@ -24,7 +24,7 @@ %li.all_contacts{:class => ("active" if params["set"] == "all" || params["set"] == "only_sharing")} %a.home_selector.hoverable{:href => contacts_path(:set => "all"), :class => ("sub_selected" if params["set"] == "only_sharing")} = t('contacts.index.all_contacts') - .label + .label.pull-right = all_contacts_count %ul.sub_nav @@ -32,5 +32,5 @@ .icons-check_yes_ok{:class => ("invisible" if params["set"] == "only_sharing")} %a.selectable{:href => contacts_path(:set => "only_sharing")} = t('contacts.index.only_sharing_with_me') - .label + .label.pull-right = only_sharing_count