Refactor css

This commit is contained in:
Steffen van Bergerem 2014-08-23 15:10:38 +02:00
parent c4970b485f
commit d682821f2d
9 changed files with 124 additions and 182 deletions

View file

@ -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'

View file

@ -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;
}
}

View file

@ -27,3 +27,5 @@
.btn-group.open > .btn.green {
background: $green;
}
.btn.delete { color: desaturate($red,10%); }

View file

@ -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 {
@ -80,3 +117,10 @@
}
}
}
#no_contacts {
text-align: center;
padding: 10px;
background-color: #eee;
color: $text-dark-grey;
}

View file

@ -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;
}
}

View file

@ -58,6 +58,8 @@
/* stream */
@import 'tag';
@import 'stream-faces';
/* contacts */
@import 'contacts';
@import 'leftnavbar';

View file

@ -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 {
@ -132,8 +89,8 @@ $bluebg: #e7f2f7;
.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 ---- */
}

View file

@ -0,0 +1,7 @@
#selected_aspect_contacts .avatar {
height: 32px;
width: 32px;
margin-bottom: -2px;
}
.stream-faces a:hover { text-decoration: none; }

View file

@ -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