Styles the chatarea with the new layout

Signed-off-by: Akash Manohar J <akash@akash.im>
kandanapp · Mar 29, 2012 · 4fd18f9 · 4fd18f9
1 parent 6137b77
commit 4fd18f9
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 17 deletions.
diff --git a/app/assets/javascripts/backbone/views/paginated_activities.js.coffee b/app/assets/javascripts/backbone/views/paginated_activities.js.coffee
@@ -1,7 +1,7 @@
 class Kandan.Views.PaginatedActivities extends Backbone.View
 
   tagName: 'div'
-  className: 'paginated_activities'
+  className: 'paginated-activities'
   template: JST['paginated_activities']
 
   events:

diff --git a/app/assets/stylesheets/_chat_area.scss b/app/assets/stylesheets/_chat_area.scss
@@ -1,6 +1,3 @@
-
-
-
 #channels {
   border-right: 1px solid #CDD1D4;
   margin-top: 0px;
@@ -26,19 +23,16 @@
   }
 
   .ui-tabs-panel {
-    @include box-shadow(5px 0px 5px -3px #CCC, -5px 0px 5px -3px #CCC);
-    @include border-top-radius(4px);
     margin-top: $header-height + 10;
     margin-right: 20px;
     margin-left: 20px;
-    background: #FFF;
+    padding: 0px;
   }
 
   .ui-widget-content {
-    // position: relative;
-    overflow-y: scroll;
     margin-top: 20px;
     bottom: 80px;
+    height: 100%;
   }
 
   .ui-tabs-nav
@@ -67,21 +61,35 @@
   font-size: 13px;
 }
 
-.pagination {
-  text-decoration: underline;
-  cursor: pointer;
+.paginated-activities {
+  @include box-shadow(5px 0px 5px -3px #CCC, -5px 0px 5px -3px #CCC, 5px 10px 5px -3px #CCC, -5px 10px 5px -3px #CCC);
+  @include border-top-radius(4px);
+  overflow-y: scroll;
+  float: left;
+  width: 100%;
+  min-height: 88%;
+  height: 88%;
+  background: #FFF;
+  padding: 10px;
+
+  .pagination {
+    text-decoration: underline;
+    cursor: pointer;
+  }
+
+  .channel-activities {
+    width: 100%;
+  }
 }
 
 .chatbox {
   @include border-bottom-radius(4px);
   @include background-image(linear-gradient($chatbox-bg-1, $chatbox-bg-2));
   @include box-shadow(5px 0px 5px -3px #CCC, -5px 0px 5px -3px #CCC, 0px 5px 5px 0px #CCC);
+  float: left;
   border-top: 1px solid #EBEFF1;
   padding: 10px 0px 10px 10px;
-  position: relative;
-  bottom: 20px;
-  margin-left: 20px;
-  margin-right: 21px;
+  width: 100%;
 
   textarea {
     @include border-top-left-radius(4px);
@@ -90,8 +98,8 @@
     width: 92%;
     padding: 0px;
     margin: 0px;
-    resize: none;
     height: 40px;
+    resize: none;
   }
 
   button {