Refactor css

jhass · Aug 23, 2014 · d682821 · d682821
1 parent c4970b4
commit d682821
Show file tree

Hide file tree

Showing 9 changed files with 124 additions and 182 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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_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
@@ -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
@@ -58,6 +58,8 @@
 
 /* stream */
 @import 'tag';
+@import 'stream-faces';
 
 /* contacts */
-@import 'contacts';
+@import 'contacts';
+@import 'leftnavbar';