CSS improvements & refactoring

abevoelker · Jul 10, 2012 · d3862c0 · d3862c0
1 parent b58326a
commit d3862c0
Show file tree

Hide file tree

Showing 10 changed files with 156 additions and 183 deletions.
diff --git a/app/assets/stylesheets/gitlab_bootstrap.scss b/app/assets/stylesheets/gitlab_bootstrap.scss
@@ -642,9 +642,7 @@ pre.logs {
 .file_holder { 
   border:1px solid #CCC;
   margin-bottom:1em;
-  -moz-box-shadow: 0 0 3px #ddd;
-  -webkit-box-shadow: 0 0 3px #ddd;
-  box-shadow: 0 0 3px #ddd;
+  @include shade;
 
   .file_title { 
     border-bottom: 1px solid #bbb;
@@ -661,10 +659,111 @@ pre.logs {
     padding: 9px 10px;
     height:18px;
 
+    .options { 
+      float:right;
+      margin-top: -5px;
+    }
+
+    .file_name { 
+      color:$style_color;
+      font-size:14px;
+      text-shadow: 0 1px 1px #fff;
+      small { 
+        color:#999;
+        font-size:13px;
+      }
+    }
   }
   .file_content {
-     &.wiki { 
-       padding:20px;
-     }
+    background:#fff;
+    color:#514721;
+    font-size: 11px;
+
+    &.wiki { 
+      code { 
+        padding:0 4px;
+      }
+      padding:20px;
+      h1, h2 {  
+        line-height: 46px;  
+      }  
+      h3, h4 {  
+        line-height: 40px;  
+      }  
+    }
+
+    &.image_file { 
+      background:#eee;
+      text-align:center;
+      img {
+        padding:100px;
+        max-width:300px;
+      }
+    }
+
+    &.blob_file { 
+
+    }
+
+    /**
+     *  Blame file
+     */
+    &.blame { 
+      tr { 
+        border-bottom: 1px solid #eee;
+      }
+      td { 
+        padding:5px;
+      }
+      .author, 
+      .blame_commit { 
+        background:#f5f5f5;
+        vertical-align:top;
+      }
+      .lines { 
+        pre { 
+          padding:0;
+          margin:0;
+          background:none;
+          border:none;
+        }
+      }
+    }
+
+    /**
+     *  Code file
+     */
+    &.code { 
+      padding:0;
+      td.code {
+        width: 100%;
+        .highlight {
+          margin-left: 55px;
+          overflow:auto;
+          overflow-y:hidden;
+        }
+      }
+      .highlight pre {
+        white-space: pre;
+        word-wrap:normal;
+      }
+
+      table.highlighttable {
+        border: none;
+      }
+      body.project-page table.highlighttable td { border: none }
+      table.highlighttable tr:hover { background:none;}
+
+      table.highlighttable pre{
+        line-height:16px !important;
+        font-size:12px !important;
+      }
+
+      table.highlighttable .linenodiv pre {
+        text-align: right;
+        padding-right: 4px;
+        color:#666;
+      }
+    }
   }
 }
diff --git a/app/assets/stylesheets/notes.scss b/app/assets/stylesheets/notes.scss
@@ -63,18 +63,22 @@ p.notify_controls span{
 
 tr.line_notes_row { 
   border-bottom:1px solid #DDD;
+  border-left: 7px solid #2A79A3;
+
   &.reply { 
     background:#eee;
-
+    border-left: 7px solid #2A79A3;
+    border-top:1px solid #ddd;
     td { 
       padding:7px 10px;
     }
     a.line_note_reply_link { 
       @include round-borders-all(4px);
-      border-color:#aaa;
-      background: #bbb;
-      padding: 3px 20px;
+      padding: 3px 10px;
+      margin-left:5px;
       color: white;
+      background: #2A79A3;
+      border-color: #2A79A3;
     }
   }
   ul { 
@@ -95,6 +99,9 @@ tr.line_notes_row {
   td { 
     border-bottom:1px solid #ddd;
   }
+  .actions { 
+    margin:0;
+  }
 }
 
 td .line_note_link { 

diff --git a/app/assets/stylesheets/sections/tree.scss b/app/assets/stylesheets/sections/tree.scss
@@ -25,103 +25,6 @@
     }
   }
 
-
-  /** FILE CONTENT VIEW **/
-  .view_file_content{
-    .old_line, .new_line {
-      background:#ECECEC;
-      color:#777;
-      width:15px;
-      float:left;
-      padding: 0px 10px;
-      border-right: 1px solid #ccc;
-    }
-    .old_line{
-      display:none;
-    }
-  }
-
-  .view_file .view_file_header,
-  .diff_file .diff_file_header {
-    border-bottom: 1px solid #bbb;
-    background:#eee;
-    background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
-    background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
-    background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
-    background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
-    margin: 0;
-    font-weight: normal;
-    font-weight: bold;
-    text-align: left;
-    color: #666;
-    padding: 9px 10px;
-    height:18px;
-
-    .options { 
-      float:right;
-      margin-top: -5px;
-    }
-
-    .file_name { 
-      color:$style_color;
-      font-size:14px;
-      text-shadow: 0 1px 1px #fff;
-      small { 
-        color:#999;
-        font-size:13px;
-      }
-    }
-  }
-
-  .view_file {
-    border:1px solid #CCC;
-    margin-bottom:1em;
-
-    .view_file_content {
-      background:#fff;
-      color:#514721;
-      font-size: 11px;
-    }
-    .view_file_content_image {
-      background:#eee;
-      text-align:center;
-      img {
-        padding:100px;
-        max-width:300px;
-      }
-    }
-  }
-
-  td.code {
-    width: 100%;
-    .highlight {
-      margin-left: 55px;
-      overflow:auto;
-      overflow-y:hidden;
-    }
-  }
-  .highlight pre {
-    white-space: pre;
-    word-wrap:normal;
-  }
-
-  table.highlighttable {
-    border: none;
-  }
-  body.project-page table.highlighttable td { border: none }
-  table.highlighttable tr:hover { background:none;}
-
-  table.highlighttable pre{
-    line-height:16px !important;
-    font-size:12px !important;
-  }
-
-  table.highlighttable .linenodiv pre {
-    text-align: right;
-    padding-right: 4px;
-    color:#666;
-  }
-
   #tree-slider {
     @include border-radius(0);
     .tree-item { 
@@ -183,21 +86,6 @@
     color:#333;
   }
 
-  #tree-content-holder .view_file{ 
-    @include shade;
-  }
-
-  #tree-readme-holder .readme { 
-    @include shade;
-    margin-bottom:20px;
-    h1, h2 {  
-      line-height: 56px;  
- 	  }  
-    h3, h4 {  
- 	    line-height: 46px;  
- 	  }  
-  }
-
   a.tree-commit-link { 
     color: #666;
     &:hover { 
@@ -206,27 +94,3 @@
   }
 
 }
-
-.blame_file { 
-  .view_file_content {
-    tr { 
-      border-bottom: 1px solid #eee;
-    }
-    td { 
-      padding:5px;
-    }
-    .author, 
-    .commit { 
-      background:#f5f5f5;
-      vertical-align:top;
-    }
-    .lines { 
-      pre { 
-        padding:0;
-        margin:0;
-        background:none;
-        border:none;
-      }
-    }
-  }
-}
diff --git a/app/views/help/api.html.haml b/app/views/help/api.html.haml
@@ -8,9 +8,9 @@
   %li 
     %a{:href => "#README"} README
   %li 
-    %a{:href => "#Projects"} Projects
+    %a{:href => "#projects"} Projects
   %li 
-    %a{:href => "#Users"} Users
+    %a{:href => "#users"} Users
 
 .file_holder#README
   .file_title

diff --git a/app/views/keys/new.html.haml b/app/views/keys/new.html.haml
@@ -1,4 +1,4 @@
-%h3 New key
+%h3.page_title New key
 %hr
 = render 'form'
 
@@ -11,4 +11,4 @@
     if( key_mail && key_mail.length > 0 && title.val() == '' ){
       $('#key_title').val( key_mail );
     }
-  });
+  });
diff --git a/app/views/notes/_reply_button.html.haml b/app/views/notes/_reply_button.html.haml
@@ -1,3 +1,4 @@
 %tr.line_notes_row.reply
   %td{:colspan => 3}
+    %i.icon-comment
     = link_to "Reply", "#", :class => "line_note_reply_link", "line_code" => line_code, :title => "Add note for this line"
diff --git a/app/views/refs/_tree.html.haml b/app/views/refs/_tree.html.haml
@@ -37,9 +37,11 @@
         = render :partial => "refs/submodule_item", :locals => { :content => content }
 
     - if content = contents.select{ |c| c.is_a?(Grit::Blob) and c.name =~ /^readme/i }.first
-      #tree-readme-holder
-        %h3= content.name
-        .readme
+      .file_holder#README
+        .file_title
+          %i.icon-file
+          = content.name
+        .file_content.wiki
           - if content.name =~ /\.(md|markdown)$/i
             = preserve do
               = markdown(content.data)