Commit d3862c0e5739ed09373fea2f52673c8ca1d3cbe4
1 parent
b58326af
Exists in
master
and in
4 other branches
CSS improvements & refactoring
Showing
10 changed files
with
156 additions
and
183 deletions
Show diff stats
app/assets/stylesheets/gitlab_bootstrap.scss
... | ... | @@ -642,9 +642,7 @@ pre.logs { |
642 | 642 | .file_holder { |
643 | 643 | border:1px solid #CCC; |
644 | 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 | 647 | .file_title { |
650 | 648 | border-bottom: 1px solid #bbb; |
... | ... | @@ -661,10 +659,111 @@ pre.logs { |
661 | 659 | padding: 9px 10px; |
662 | 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 | 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 | 63 | |
64 | 64 | tr.line_notes_row { |
65 | 65 | border-bottom:1px solid #DDD; |
66 | + border-left: 7px solid #2A79A3; | |
67 | + | |
66 | 68 | &.reply { |
67 | 69 | background:#eee; |
68 | - | |
70 | + border-left: 7px solid #2A79A3; | |
71 | + border-top:1px solid #ddd; | |
69 | 72 | td { |
70 | 73 | padding:7px 10px; |
71 | 74 | } |
72 | 75 | a.line_note_reply_link { |
73 | 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 | 79 | color: white; |
80 | + background: #2A79A3; | |
81 | + border-color: #2A79A3; | |
78 | 82 | } |
79 | 83 | } |
80 | 84 | ul { |
... | ... | @@ -95,6 +99,9 @@ tr.line_notes_row { |
95 | 99 | td { |
96 | 100 | border-bottom:1px solid #ddd; |
97 | 101 | } |
102 | + .actions { | |
103 | + margin:0; | |
104 | + } | |
98 | 105 | } |
99 | 106 | |
100 | 107 | td .line_note_link { | ... | ... |
app/assets/stylesheets/sections/tree.scss
... | ... | @@ -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 | 28 | #tree-slider { |
126 | 29 | @include border-radius(0); |
127 | 30 | .tree-item { |
... | ... | @@ -183,21 +86,6 @@ |
183 | 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 | 89 | a.tree-commit-link { |
202 | 90 | color: #666; |
203 | 91 | &:hover { |
... | ... | @@ -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
app/views/keys/new.html.haml
app/views/notes/_reply_button.html.haml
app/views/refs/_tree.html.haml
... | ... | @@ -37,9 +37,11 @@ |
37 | 37 | = render :partial => "refs/submodule_item", :locals => { :content => content } |
38 | 38 | |
39 | 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 | 45 | - if content.name =~ /\.(md|markdown)$/i |
44 | 46 | = preserve do |
45 | 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 | 3 | %i.icon-file |
4 | 4 | %span.file_name |
5 | 5 | = name |
... | ... | @@ -10,26 +10,28 @@ |
10 | 10 | = link_to "blame", blame_file_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small" |
11 | 11 | - if file.text? |
12 | 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 | 16 | - else |
18 | - .view_file_content | |
17 | + .file_content.code | |
19 | 18 | - unless file.empty? |
20 | 19 | %div{:class => current_user.dark_scheme ? "black" : "white"} |
21 | 20 | = preserve do |
22 | 21 | = raw file.colorize(options: { linenos: 'True'}) |
23 | 22 | - else |
24 | 23 | %h4.nothing_here_message Empty file |
24 | + | |
25 | 25 | - elsif file.image? |
26 | - .view_file_content_image | |
26 | + .file_content.image_file | |
27 | 27 | %img{ :src => "data:#{file.mime_type};base64,#{Base64.encode64(file.data)}"} |
28 | + | |
28 | 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 | 11 | %li= link |
12 | 12 | .clear |
13 | 13 | |
14 | - .view_file.blame_file | |
15 | - .view_file_header | |
14 | + .file_holder | |
15 | + .file_title | |
16 | 16 | %i.icon-file |
17 | 17 | %span.file_name |
18 | 18 | = @tree.name |
... | ... | @@ -21,7 +21,7 @@ |
21 | 21 | = link_to "raw", blob_project_ref_path(@project, @ref, :path => params[:path]), :class => "btn very_small", :target => "_blank" |
22 | 22 | = link_to "history", project_commits_path(@project, :path => params[:path], :ref => @ref), :class => "btn very_small" |
23 | 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 | 25 | %table |
26 | 26 | - @blame.each do |commit, lines| |
27 | 27 | - commit = Commit.new(commit) |
... | ... | @@ -29,7 +29,7 @@ |
29 | 29 | %td.author |
30 | 30 | = image_tag gravatar_icon(commit.author_email, 16) |
31 | 31 | = commit.author_name |
32 | - %td.commit | |
32 | + %td.blame_commit | |
33 | 33 | |
34 | 34 | = link_to project_commit_path(@project, :id => commit.id) do |
35 | 35 | %code= commit.id.to_s[0..10] | ... | ... |
app/views/snippets/show.html.haml
... | ... | @@ -7,16 +7,14 @@ |
7 | 7 | = link_to "Edit", edit_project_snippet_path(@project, @snippet), :class => "btn small right" |
8 | 8 | |
9 | 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 | 20 | = render "notes/notes", :tid => @snippet.id, :tt => "snippet" | ... | ... |