Commit d3862c0e5739ed09373fea2f52673c8ca1d3cbe4

Authored by randx
1 parent b58326af

CSS improvements & refactoring

app/assets/stylesheets/gitlab_bootstrap.scss
@@ -642,9 +642,7 @@ pre.logs { @@ -642,9 +642,7 @@ pre.logs {
642 .file_holder { 642 .file_holder {
643 border:1px solid #CCC; 643 border:1px solid #CCC;
644 margin-bottom:1em; 644 margin-bottom:1em;
645 - -moz-box-shadow: 0 0 3px #ddd;  
646 - -webkit-box-shadow: 0 0 3px #ddd;  
647 - box-shadow: 0 0 3px #ddd; 645 + @include shade;
648 646
649 .file_title { 647 .file_title {
650 border-bottom: 1px solid #bbb; 648 border-bottom: 1px solid #bbb;
@@ -661,10 +659,111 @@ pre.logs { @@ -661,10 +659,111 @@ pre.logs {
661 padding: 9px 10px; 659 padding: 9px 10px;
662 height:18px; 660 height:18px;
663 661
  662 + .options {
  663 + float:right;
  664 + margin-top: -5px;
  665 + }
  666 +
  667 + .file_name {
  668 + color:$style_color;
  669 + font-size:14px;
  670 + text-shadow: 0 1px 1px #fff;
  671 + small {
  672 + color:#999;
  673 + font-size:13px;
  674 + }
  675 + }
664 } 676 }
665 .file_content { 677 .file_content {
666 - &.wiki {  
667 - padding:20px;  
668 - } 678 + background:#fff;
  679 + color:#514721;
  680 + font-size: 11px;
  681 +
  682 + &.wiki {
  683 + code {
  684 + padding:0 4px;
  685 + }
  686 + padding:20px;
  687 + h1, h2 {
  688 + line-height: 46px;
  689 + }
  690 + h3, h4 {
  691 + line-height: 40px;
  692 + }
  693 + }
  694 +
  695 + &.image_file {
  696 + background:#eee;
  697 + text-align:center;
  698 + img {
  699 + padding:100px;
  700 + max-width:300px;
  701 + }
  702 + }
  703 +
  704 + &.blob_file {
  705 +
  706 + }
  707 +
  708 + /**
  709 + * Blame file
  710 + */
  711 + &.blame {
  712 + tr {
  713 + border-bottom: 1px solid #eee;
  714 + }
  715 + td {
  716 + padding:5px;
  717 + }
  718 + .author,
  719 + .blame_commit {
  720 + background:#f5f5f5;
  721 + vertical-align:top;
  722 + }
  723 + .lines {
  724 + pre {
  725 + padding:0;
  726 + margin:0;
  727 + background:none;
  728 + border:none;
  729 + }
  730 + }
  731 + }
  732 +
  733 + /**
  734 + * Code file
  735 + */
  736 + &.code {
  737 + padding:0;
  738 + td.code {
  739 + width: 100%;
  740 + .highlight {
  741 + margin-left: 55px;
  742 + overflow:auto;
  743 + overflow-y:hidden;
  744 + }
  745 + }
  746 + .highlight pre {
  747 + white-space: pre;
  748 + word-wrap:normal;
  749 + }
  750 +
  751 + table.highlighttable {
  752 + border: none;
  753 + }
  754 + body.project-page table.highlighttable td { border: none }
  755 + table.highlighttable tr:hover { background:none;}
  756 +
  757 + table.highlighttable pre{
  758 + line-height:16px !important;
  759 + font-size:12px !important;
  760 + }
  761 +
  762 + table.highlighttable .linenodiv pre {
  763 + text-align: right;
  764 + padding-right: 4px;
  765 + color:#666;
  766 + }
  767 + }
669 } 768 }
670 } 769 }
app/assets/stylesheets/notes.scss
@@ -63,18 +63,22 @@ p.notify_controls span{ @@ -63,18 +63,22 @@ p.notify_controls span{
63 63
64 tr.line_notes_row { 64 tr.line_notes_row {
65 border-bottom:1px solid #DDD; 65 border-bottom:1px solid #DDD;
  66 + border-left: 7px solid #2A79A3;
  67 +
66 &.reply { 68 &.reply {
67 background:#eee; 69 background:#eee;
68 - 70 + border-left: 7px solid #2A79A3;
  71 + border-top:1px solid #ddd;
69 td { 72 td {
70 padding:7px 10px; 73 padding:7px 10px;
71 } 74 }
72 a.line_note_reply_link { 75 a.line_note_reply_link {
73 @include round-borders-all(4px); 76 @include round-borders-all(4px);
74 - border-color:#aaa;  
75 - background: #bbb;  
76 - padding: 3px 20px; 77 + padding: 3px 10px;
  78 + margin-left:5px;
77 color: white; 79 color: white;
  80 + background: #2A79A3;
  81 + border-color: #2A79A3;
78 } 82 }
79 } 83 }
80 ul { 84 ul {
@@ -95,6 +99,9 @@ tr.line_notes_row { @@ -95,6 +99,9 @@ tr.line_notes_row {
95 td { 99 td {
96 border-bottom:1px solid #ddd; 100 border-bottom:1px solid #ddd;
97 } 101 }
  102 + .actions {
  103 + margin:0;
  104 + }
98 } 105 }
99 106
100 td .line_note_link { 107 td .line_note_link {
app/assets/stylesheets/sections/tree.scss
@@ -25,103 +25,6 @@ @@ -25,103 +25,6 @@
25 } 25 }
26 } 26 }
27 27
28 -  
29 - /** FILE CONTENT VIEW **/  
30 - .view_file_content{  
31 - .old_line, .new_line {  
32 - background:#ECECEC;  
33 - color:#777;  
34 - width:15px;  
35 - float:left;  
36 - padding: 0px 10px;  
37 - border-right: 1px solid #ccc;  
38 - }  
39 - .old_line{  
40 - display:none;  
41 - }  
42 - }  
43 -  
44 - .view_file .view_file_header,  
45 - .diff_file .diff_file_header {  
46 - border-bottom: 1px solid #bbb;  
47 - background:#eee;  
48 - background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));  
49 - background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);  
50 - background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);  
51 - background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);  
52 - margin: 0;  
53 - font-weight: normal;  
54 - font-weight: bold;  
55 - text-align: left;  
56 - color: #666;  
57 - padding: 9px 10px;  
58 - height:18px;  
59 -  
60 - .options {  
61 - float:right;  
62 - margin-top: -5px;  
63 - }  
64 -  
65 - .file_name {  
66 - color:$style_color;  
67 - font-size:14px;  
68 - text-shadow: 0 1px 1px #fff;  
69 - small {  
70 - color:#999;  
71 - font-size:13px;  
72 - }  
73 - }  
74 - }  
75 -  
76 - .view_file {  
77 - border:1px solid #CCC;  
78 - margin-bottom:1em;  
79 -  
80 - .view_file_content {  
81 - background:#fff;  
82 - color:#514721;  
83 - font-size: 11px;  
84 - }  
85 - .view_file_content_image {  
86 - background:#eee;  
87 - text-align:center;  
88 - img {  
89 - padding:100px;  
90 - max-width:300px;  
91 - }  
92 - }  
93 - }  
94 -  
95 - td.code {  
96 - width: 100%;  
97 - .highlight {  
98 - margin-left: 55px;  
99 - overflow:auto;  
100 - overflow-y:hidden;  
101 - }  
102 - }  
103 - .highlight pre {  
104 - white-space: pre;  
105 - word-wrap:normal;  
106 - }  
107 -  
108 - table.highlighttable {  
109 - border: none;  
110 - }  
111 - body.project-page table.highlighttable td { border: none }  
112 - table.highlighttable tr:hover { background:none;}  
113 -  
114 - table.highlighttable pre{  
115 - line-height:16px !important;  
116 - font-size:12px !important;  
117 - }  
118 -  
119 - table.highlighttable .linenodiv pre {  
120 - text-align: right;  
121 - padding-right: 4px;  
122 - color:#666;  
123 - }  
124 -  
125 #tree-slider { 28 #tree-slider {
126 @include border-radius(0); 29 @include border-radius(0);
127 .tree-item { 30 .tree-item {
@@ -183,21 +86,6 @@ @@ -183,21 +86,6 @@
183 color:#333; 86 color:#333;
184 } 87 }
185 88
186 - #tree-content-holder .view_file{  
187 - @include shade;  
188 - }  
189 -  
190 - #tree-readme-holder .readme {  
191 - @include shade;  
192 - margin-bottom:20px;  
193 - h1, h2 {  
194 - line-height: 56px;  
195 - }  
196 - h3, h4 {  
197 - line-height: 46px;  
198 - }  
199 - }  
200 -  
201 a.tree-commit-link { 89 a.tree-commit-link {
202 color: #666; 90 color: #666;
203 &:hover { 91 &:hover {
@@ -206,27 +94,3 @@ @@ -206,27 +94,3 @@
206 } 94 }
207 95
208 } 96 }
209 -  
210 -.blame_file {  
211 - .view_file_content {  
212 - tr {  
213 - border-bottom: 1px solid #eee;  
214 - }  
215 - td {  
216 - padding:5px;  
217 - }  
218 - .author,  
219 - .commit {  
220 - background:#f5f5f5;  
221 - vertical-align:top;  
222 - }  
223 - .lines {  
224 - pre {  
225 - padding:0;  
226 - margin:0;  
227 - background:none;  
228 - border:none;  
229 - }  
230 - }  
231 - }  
232 -}  
app/views/help/api.html.haml
@@ -8,9 +8,9 @@ @@ -8,9 +8,9 @@
8 %li 8 %li
9 %a{:href => "#README"} README 9 %a{:href => "#README"} README
10 %li 10 %li
11 - %a{:href => "#Projects"} Projects 11 + %a{:href => "#projects"} Projects
12 %li 12 %li
13 - %a{:href => "#Users"} Users 13 + %a{:href => "#users"} Users
14 14
15 .file_holder#README 15 .file_holder#README
16 .file_title 16 .file_title
app/views/keys/new.html.haml
1 -%h3 New key 1 +%h3.page_title New key
2 %hr 2 %hr
3 = render 'form' 3 = render 'form'
4 4
@@ -11,4 +11,4 @@ @@ -11,4 +11,4 @@
11 if( key_mail && key_mail.length > 0 && title.val() == '' ){ 11 if( key_mail && key_mail.length > 0 && title.val() == '' ){
12 $('#key_title').val( key_mail ); 12 $('#key_title').val( key_mail );
13 } 13 }
14 - });  
15 \ No newline at end of file 14 \ No newline at end of file
  15 + });
app/views/notes/_reply_button.html.haml
1 %tr.line_notes_row.reply 1 %tr.line_notes_row.reply
2 %td{:colspan => 3} 2 %td{:colspan => 3}
  3 + %i.icon-comment
3 = link_to "Reply", "#", :class => "line_note_reply_link", "line_code" => line_code, :title => "Add note for this line" 4 = link_to "Reply", "#", :class => "line_note_reply_link", "line_code" => line_code, :title => "Add note for this line"
app/views/refs/_tree.html.haml
@@ -37,9 +37,11 @@ @@ -37,9 +37,11 @@
37 = render :partial => "refs/submodule_item", :locals => { :content => content } 37 = render :partial => "refs/submodule_item", :locals => { :content => content }
38 38
39 - if content = contents.select{ |c| c.is_a?(Grit::Blob) and c.name =~ /^readme/i }.first 39 - if content = contents.select{ |c| c.is_a?(Grit::Blob) and c.name =~ /^readme/i }.first
40 - #tree-readme-holder  
41 - %h3= content.name  
42 - .readme 40 + .file_holder#README
  41 + .file_title
  42 + %i.icon-file
  43 + = content.name
  44 + .file_content.wiki
43 - if content.name =~ /\.(md|markdown)$/i 45 - if content.name =~ /\.(md|markdown)$/i
44 = preserve do 46 = preserve do
45 = markdown(content.data) 47 = markdown(content.data)
app/views/refs/_tree_file.html.haml
1 -.view_file  
2 - .view_file_header 1 +.file_holder
  2 + .file_title
3 %i.icon-file 3 %i.icon-file
4 %span.file_name 4 %span.file_name
5 = name 5 = name
@@ -10,26 +10,28 @@ @@ -10,26 +10,28 @@
10 = link_to "blame", blame_file_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small" 10 = link_to "blame", blame_file_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small"
11 - if file.text? 11 - if file.text?
12 - if name =~ /\.(md|markdown)$/i 12 - if name =~ /\.(md|markdown)$/i
13 - #tree-readme-holder  
14 - .readme  
15 - = preserve do  
16 - = markdown(file.data) 13 + .file_content.wiki
  14 + = preserve do
  15 + = markdown(file.data)
17 - else 16 - else
18 - .view_file_content 17 + .file_content.code
19 - unless file.empty? 18 - unless file.empty?
20 %div{:class => current_user.dark_scheme ? "black" : "white"} 19 %div{:class => current_user.dark_scheme ? "black" : "white"}
21 = preserve do 20 = preserve do
22 = raw file.colorize(options: { linenos: 'True'}) 21 = raw file.colorize(options: { linenos: 'True'})
23 - else 22 - else
24 %h4.nothing_here_message Empty file 23 %h4.nothing_here_message Empty file
  24 +
25 - elsif file.image? 25 - elsif file.image?
26 - .view_file_content_image 26 + .file_content.image_file
27 %img{ :src => "data:#{file.mime_type};base64,#{Base64.encode64(file.data)}"} 27 %img{ :src => "data:#{file.mime_type};base64,#{Base64.encode64(file.data)}"}
  28 +
28 - else 29 - else
29 - %center  
30 - = link_to blob_project_ref_path(@project, @ref, :path => params[:path]) do  
31 - %div.padded  
32 - %br  
33 - = image_tag "download.png", :width => 64  
34 - %h3  
35 - Download (#{file.mb_size}) 30 + .file_content.blob_file
  31 + %center
  32 + = link_to blob_project_ref_path(@project, @ref, :path => params[:path]) do
  33 + %div.padded
  34 + %br
  35 + = image_tag "download.png", :width => 64
  36 + %h3
  37 + Download (#{file.mb_size})
app/views/refs/blame.html.haml
@@ -11,8 +11,8 @@ @@ -11,8 +11,8 @@
11 %li= link 11 %li= link
12 .clear 12 .clear
13 13
14 - .view_file.blame_file  
15 - .view_file_header 14 + .file_holder
  15 + .file_title
16 %i.icon-file 16 %i.icon-file
17 %span.file_name 17 %span.file_name
18 = @tree.name 18 = @tree.name
@@ -21,7 +21,7 @@ @@ -21,7 +21,7 @@
21 = link_to "raw", blob_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small", :target => "_blank" 21 = link_to "raw", blob_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small", :target => "_blank"
22 = link_to "history", project_commits_path(@project, :path => params[:path], :ref => @ref), :class => "btn very_small" 22 = link_to "history", project_commits_path(@project, :path => params[:path], :ref => @ref), :class => "btn very_small"
23 = link_to "source", tree_file_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small" 23 = link_to "source", tree_file_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small"
24 - .view_file_content 24 + .file_content.blame
25 %table 25 %table
26 - @blame.each do |commit, lines| 26 - @blame.each do |commit, lines|
27 - commit = Commit.new(commit) 27 - commit = Commit.new(commit)
@@ -29,7 +29,7 @@ @@ -29,7 +29,7 @@
29 %td.author 29 %td.author
30 = image_tag gravatar_icon(commit.author_email, 16) 30 = image_tag gravatar_icon(commit.author_email, 16)
31 = commit.author_name 31 = commit.author_name
32 - %td.commit 32 + %td.blame_commit
33   33  
34 = link_to project_commit_path(@project, :id => commit.id) do 34 = link_to project_commit_path(@project, :id => commit.id) do
35 %code= commit.id.to_s[0..10] 35 %code= commit.id.to_s[0..10]
app/views/snippets/show.html.haml
@@ -7,16 +7,14 @@ @@ -7,16 +7,14 @@
7 = link_to "Edit", edit_project_snippet_path(@project, @snippet), :class => "btn small right" 7 = link_to "Edit", edit_project_snippet_path(@project, @snippet), :class => "btn small right"
8 8
9 %br 9 %br
10 -#tree-holder  
11 - #tree-content-holder  
12 - .view_file  
13 - .view_file_header  
14 - %i.icon-file  
15 - %strong= @snippet.file_name  
16 - %span.options  
17 - = link_to "raw", raw_project_snippet_path(@project, @snippet), :class => "btn very_small", :target => "_blank"  
18 - .view_file_content  
19 - %div{:class => current_user.dark_scheme ? "black" : ""}  
20 - = raw @snippet.colorize(options: { linenos: 'True'}) 10 +.file_holder
  11 + .file_title
  12 + %i.icon-file
  13 + %strong= @snippet.file_name
  14 + %span.options
  15 + = link_to "raw", raw_project_snippet_path(@project, @snippet), :class => "btn very_small", :target => "_blank"
  16 + .file_content.code
  17 + %div{:class => current_user.dark_scheme ? "black" : ""}
  18 + = raw @snippet.colorize(options: { linenos: 'True'})
21 19
22 = render "notes/notes", :tid => @snippet.id, :tt => "snippet" 20 = render "notes/notes", :tid => @snippet.id, :tt => "snippet"