css refactor

app/assets/stylesheets/application.css

@@ -8,3 +8,34 @@
  *= require_self
  *= require_tree .
 */
+
+/** COLORS **/
+.cgray { color:gray; }
+.cred { color:#D12F19; }
+.cgreen { color:#44aa22; }
+
+/** COMMON STYLES **/
+.left { 
+  float:left;
+}
+.right { 
+  float:right;
+}
+.width-50p{
+  width:50%;
+}
+.width-49p{
+  width:49%;
+}
+.width-30p{
+  width:30%;
+}
+.width-65p{
+  width:65%;
+}
+.append-bottom-10 { 
+  margin-bottom:10px;
+}
+.prepend-top-10 {
+  margin-top:10px;
+}

app/assets/stylesheets/commits.css.scss

@@ -37,4 +37,6 @@
   }
 }
 
-
+pre.commit_message {
+  white-space: pre-wrap;
+}

app/assets/stylesheets/issues.css.scss

@@ -10,14 +10,13 @@
   color: #444;
 }
 
-#issues-table-holder .issue:hover .action-links { display:block; }
-
 .issues_filter {
   margin-top:10px;
   .left { 
     margin-right:15px;
   }
 }
+
 .top_panel_issues{
   #issue_search_form {
     margin:5px 0;
@@ -36,3 +35,14 @@
     }
   }
 }
+
+/** ISSUES LIST **/
+.issue .action-links {
+  display:none; 
+  a { 
+    margin-left:10px;
+  }
+}
+.issue:hover .action-links { display:block; }
+
+

app/assets/stylesheets/projects.css.scss

-// Place all the styles related to the Projects controller here.
-// They will automatically be included in application.css.
-// You can use Sass (SCSS) here: http://sass-lang.com/
-
+/** MIXINS **/
 @mixin round-borders-bottom($radius) {
   border-top: 1px solid #eaeaea;
   -moz-border-radius-bottomright: $radius;
@@ -29,18 +26,6 @@
   border-radius: $radius;
 }
 
-@mixin hover-color {
-  background-color:#FFFFCF;
-}
-
-@mixin panel-color {
-  background: #111 !important;
-  background: -webkit-gradient(linear,left top,left bottom,from(#333),to(#111)) !important;
-  background: -moz-linear-gradient(top,#333,#111) !important;
-  background: transparent 9 !important;
-}
-
-
 /** File stat **/
 .file_stats {
   margin-bottom:10px;
@@ -66,24 +51,16 @@
   @include round-borders-all(4px);
   padding: 4px 0px;
 }
+
 table.round-borders {
   float:left;
 }
 
-
-#content-container{
-  min-height:250px;
-  background: #fff;
-  @include round-borders-bottom(8px);
-  borders:2px solid #eaeaea;
-  border-top: none;
-  padding:20px;
-}
-
 a {
   color: #111;
 }
 
+/** FILE CONTENT VIEW **/
 .view_file_content{
   .old_line, .new_line {
     background:#ECECEC;
@@ -122,10 +99,34 @@ a {
   }
 }
 
-.back_small.button{
+td.code { 
+  width: 100%;
+  .highlight { 
+    margin-left: 55px;
+    overflow:auto;
+    overflow-y:hidden;
+  }
+}
+.highlight pre { 
+  white-space: pre;
+  word-wrap:normal;
+}
 
+.highlighttable tr:hover {
+  background:white;
+}
+table.highlighttable pre{ 
+  line-height:16px !important;
+  font-size:12px !important;
 }
 
+
+table.highlighttable .linenodiv pre {
+  text-align: right;
+  padding-right: 4px;
+}
+
+/** PROJECTS **/
 input.ssh_project_url {
   padding:5px;
   margin:0px;
@@ -149,38 +150,7 @@ input.ssh_project_url {
   clear: both;
 }
 
-.top_project_menu {
-  a {
-    border-right: 1px solid #FFFFFF;
-    box-shadow: -1px 0 #DDDDDD inset;
-    color: #666;
-    display: block;
-    font-size: 16px;
-    text-decoration: none;
-    line-height: 20px;
-    padding: 11px 26px 12px 24px;
-    text-shadow: 0 1px 0 #FFFFFF;
-    float:left;
-
-    &.current {
-      background-color: #FFFFFF;
-      color: #222222;
-    }
-  }
-}
-
-.top_bar {
-  margin-top:50px;
-  background-color: #F4F4F4;
-  @include round-borders-top(8px);
-  box-shadow: 0 1px #FFFFFF inset, 0 -1px #DDDDDD inset;
-  height: 43px;
-  overflow: hidden;
-  width:990px;
-}
-
 /** FORM INPUTS **/
-
 .user_new,
 .new_key,
 .new_issue,
@@ -202,7 +172,6 @@ input.ssh_project_url {
 }
 
 .input_button {
-  //@include round-borders-all(4px);
   padding:8px;
   font-size:14px;
   cursor:pointer;
@@ -214,7 +183,6 @@ input.ssh_project_url {
 }
 
 /** FLASH **/
-
 #flash_container {
   height:40px;
   position:fixed;
@@ -236,7 +204,6 @@ input.ssh_project_url {
 }
 
 /** Buttons **/
-
 .lbutton,
 .lite_button {
   display:block;
@@ -273,126 +240,10 @@ input.ssh_project_url {
   width: 60px;
 }
 
-.project_thumb {
-  margin:20px 0;
-  width: 250px;
-  float:left;
-  padding:20px;
-  text-align:center;
-  p, h4 {
-    text-align:left;
-  }
-  .lbutton {
-    float:left;
-  }
-}
-
 .handle:hover{
   cursor: move;
 }
 
-.handle{
-  width: 12px;
-  height: 12px;
-  padding: 10px;
-}
-
-
-.tag {
-  @include round-borders-all(4px);
-  padding:2px 4px;
-  border:none;
-  text-shadow:none;
-
-  &.high {
-    background: #D12F19;
-    color:white;
-  }
-
-  &.today {
-    background: #44aa22;
-    color:white;
-  }
-
-  &.yours {
-    background: #4466cc;
-    color:white;
-  }
-  &.normal {
-    background: #2c5ca6;
-    color:white;
-  }
-  &.notes {
-    background: #2c5c66;
-    color:white;
-  }
-}
-
-
-.left { 
-  float:left;
-}
-.right { 
-  float:right;
-}
-
-.width-50p{
-  width:50%;
-}
-.width-49p{
-  width:49%;
-}
-.width-30p{
-  width:30%;
-}
-.width-65p{
-  width:65%;
-}
-pre.commit_message {
-  white-space: pre-wrap;
-}
-
-#container { 
-/*  min-height:100%;*/
-}
-.ui-selectmenu{
-  @include round-borders-all(4px);
-  margin-right:10px;
-  font-size:1.5em;
-  height:auto;
-  font-weight:bold;
-  .ui-selectmenu-status { 
-    padding:3px 10px;
-  }
-}
-
-td.code { 
-  width: 100%;
-  .highlight { 
-    margin-left: 55px;
-    overflow:auto;
-    overflow-y:hidden;
-  }
-}
-.highlight pre { 
-  white-space: pre;
-  word-wrap:normal;
-}
-
-.highlighttable tr:hover {
-  background:white;
-}
-table.highlighttable pre{ 
-  line-height:16px !important;
-  font-size:12px !important;
-}
-
-
-table.highlighttable .linenodiv pre {
-  text-align: right;
-  padding-right: 4px;
-}
-
 .project-refs-form { 
   span {
     background: none !important;
@@ -408,11 +259,6 @@ table.highlighttable .linenodiv pre {
 
 .filter .left { margin-right:15px; }
  
-
-.cgray { color:gray; }
-.cred { color:#D12F19; }
-.cgreen { color:#44aa22; }
-
 body.project-page table .commit { 
   a.tree-commit-link { 
     color:gray;
@@ -422,50 +268,80 @@ body.project-page table .commit {
   }
 }
 
-
-.snippet .action-links,
-#issues-table-holder .issue .action-links {
-  display:none; 
-  a { 
-    margin-left:10px;
-  }
-}
- 
-.snippet:hover .action-links { display:block; }
-
-
-
 /** NEW PROJECT **/
 .new-project-hodler { 
-  .icon span { 
-    background-position: -31px -70px;
-  }
-  td {
-    border-bottom: 1px solid #DEE2E3;
-  }
+  .icon span { background-position: -31px -70px; }
+  td { border-bottom: 1px solid #DEE2E3; }
 }
 
-//.message .note-title p { margin-bottom:0px; }
-
+/** Feed entry **/
 .commit,
 .snippet,
 .message { 
   .title { 
     color:#666;
-    a { 
-      color:#666 !important;
-    }
-    p { 
-      margin-top:0px;
-    }
-  }
-
-  .author { 
-    color: #999
+    a { color:#666 !important; }
+    p { margin-top:0px; }
   }
+  .author { color: #999 }
 }
 
-/** UI autocomplete **/
+/** JQuery UI **/
 .ui-autocomplete { @include round-borders-all(5px); }
 .ui-menu-item { cursor: pointer }
+.ui-selectmenu{
+  @include round-borders-all(4px);
+  margin-right:10px;
+  font-size:1.5em;
+  height:auto;
+  font-weight:bold;
+  .ui-selectmenu-status { 
+    padding:3px 10px;
+  }
+}
  
+/** Snippets **/
+.new_snippet textarea, 
+.edit_snippet textarea { 
+  height:300px;
+  padding: 8px;
+  width: 95%;
+}
+.snippet .action-links {
+  display:none; 
+  a { 
+    margin-left:10px;
+  }
+}
+.snippet:hover .action-links { display:block; }
+
+/** ISSUES TAGS **/
+.tag {
+  @include round-borders-all(4px);
+  padding:2px 4px;
+  border:none;
+  text-shadow:none;
+
+  &.high {
+    background: #D12F19;
+    color:white;
+  }
+
+  &.today {
+    background: #44aa22;
+    color:white;
+  }
+
+  &.yours {
+    background: #4466cc;
+    color:white;
+  }
+  &.normal {
+    background: #2c5ca6;
+    color:white;
+  }
+  &.notes {
+    background: #2c5c66;
+    color:white;
+  }
+}

app/views/notes/_form.html.haml

@@ -28,4 +28,4 @@
 
     .clear
     %br
-    = f.submit 'Add note', :class => "lbutton vm", :id => "submit_note"
+    = f.submit 'Add note', :class => "button", :id => "submit_note"

app/views/snippets/_form.html.haml

@@ -19,7 +19,8 @@
         %td{:colspan => 2}
           = f.label :content, "Code"
           %br
-          = f.text_area :content, :style => "height:240px;width:932px;"
+          %br
+          = f.text_area :content
 
     .actions.prepend-top
-      = f.submit 'Save', :class => "lbutton vm"
+      = f.submit 'Save', :class => "button"

app/views/snippets/index.html.haml

 %div
   - if can? current_user, :write_snippet, @project
-    .left= link_to 'New Snippet', new_project_snippet_path(@project), :class => "lbutton vm"
+    = link_to 'New Snippet', new_project_snippet_path(@project), :class => "button append-bottom-10"
 
   %table.round-borders#snippets-table
     %thead