Download as
Browse Code »

Commit 71d4474684bb9bf38908e1aea296264b15f9060e

Authored by Dmitriy Zaporozhets
1 parent 13fbf488
Exists in spb-stable and in 3 other branches 6-8-stable, 7-0-stable, 7-0-stable-spb

Move diff css to separate file 

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>
Showing 3 changed files with 330 additions and 330 deletions   Show diff stats
app/assets/stylesheets/application.scss
  Diff comments   View file @71d4474
@@ -48,6 +48,7 @@ @@ -48,6 +48,7 @@
48 @import "sections/header.scss"; 48 @import "sections/header.scss";
49 @import "sections/nav.scss"; 49 @import "sections/nav.scss";
50 @import "sections/commits.scss"; 50 @import "sections/commits.scss";
  51 +@import "sections/diff.scss";
51 @import "sections/issues.scss"; 52 @import "sections/issues.scss";
52 @import "sections/projects.scss"; 53 @import "sections/projects.scss";
53 @import "sections/snippets.scss"; 54 @import "sections/snippets.scss";
app/assets/stylesheets/sections/commits.scss
  Diff comments   View file @71d4474
@@ -10,336 +10,6 @@ @@ -10,336 +10,6 @@
10 } 10 }
11 } 11 }
12 12
13 -.diff-file {  
14 - border: 1px solid #CCC;  
15 - margin-bottom: 1em;  
16 -  
17 - .diff-header {  
18 - @extend .clearfix;  
19 - background: #DDD;  
20 - border-bottom: 1px solid #CCC;  
21 - padding: 5px 5px 5px 10px;  
22 - color: #555;  
23 -  
24 - > span {  
25 - font-family: $monospace_font;  
26 - font-size: 14px;  
27 - line-height: 2;  
28 - }  
29 -  
30 - .diff-btn-group {  
31 - float: right;  
32 -  
33 - .btn {  
34 - background-color: #EEE;  
35 - color: #666;  
36 - font-weight: bolder;  
37 - }  
38 - }  
39 -  
40 - .commit-short-id {  
41 - font-family: $monospace_font;  
42 - font-size: smaller;  
43 - }  
44 -  
45 - .file-mode {  
46 - font-family: $monospace_font;  
47 - }  
48 - }  
49 - .diff-content {  
50 - overflow: auto;  
51 - overflow-y: hidden;  
52 - background: #FFF;  
53 - color: #333;  
54 - font-size: 12px;  
55 - .old {  
56 - span.idiff {  
57 - background-color: #FAA;  
58 - }  
59 - }  
60 - .new {  
61 - span.idiff {  
62 - background-color: #AFA;  
63 - }  
64 - }  
65 -  
66 - table {  
67 - width: 100%;  
68 - font-family: $monospace_font;  
69 - border: none;  
70 - margin: 0px;  
71 - padding: 0px;  
72 - td {  
73 - line-height: 18px;  
74 - font-size: 12px;  
75 - }  
76 - }  
77 - .old_line, .new_line, .diff_line {  
78 - margin: 0px;  
79 - padding: 0px;  
80 - border: none;  
81 - background: #EEE;  
82 - color: #666;  
83 - padding: 0px 5px;  
84 - border-right: 1px solid #ccc;  
85 - text-align: right;  
86 - min-width: 35px;  
87 - max-width: 50px;  
88 - width: 35px;  
89 - @include user-select(none);  
90 - a {  
91 - float: left;  
92 - width: 35px;  
93 - font-weight: normal;  
94 - color: #666;  
95 - &:hover {  
96 - text-decoration: underline;  
97 - }  
98 - }  
99 - &.new {  
100 - background: #CFD;  
101 - }  
102 - &.old {  
103 - background: #FDD;  
104 - }  
105 - }  
106 - .diff_line {  
107 - padding: 0;  
108 - }  
109 - .line_holder {  
110 - &.old .old_line,  
111 - &.old .new_line {  
112 - background: #FCC;  
113 - border-color: #E7BABA;  
114 - }  
115 - &.new .old_line,  
116 - &.new .new_line {  
117 - background: #CFC;  
118 - border-color: #B9ECB9;  
119 - }  
120 - }  
121 - .line_content {  
122 - display: block;  
123 - white-space: pre;  
124 - height: 18px;  
125 - margin: 0px;  
126 - padding: 0px 0.5em;  
127 - border: none;  
128 - &.new {  
129 - background: #CFD;  
130 - }  
131 - &.old {  
132 - background: #FDD;  
133 - }  
134 - &.matched {  
135 - color: #ccc;  
136 - background: #fafafa;  
137 - }  
138 - &.parallel {  
139 - display: table-cell;  
140 - overflow: hidden;  
141 - width: 50%;  
142 - }  
143 - }  
144 - }  
145 - .image {  
146 - background: #ddd;  
147 - text-align: center;  
148 - padding: 30px;  
149 - .wrap{  
150 - display: inline-block;  
151 - }  
152 -  
153 - .frame {  
154 - display: inline-block;  
155 - background-color: #fff;  
156 - line-height: 0;  
157 - img{  
158 - border: 1px solid #FFF;  
159 - background: url('trans_bg.gif');  
160 - max-width: 100%;  
161 - }  
162 - &.deleted {  
163 - border: 1px solid $deleted;  
164 - }  
165 -  
166 - &.added {  
167 - border: 1px solid $added;  
168 - }  
169 - }  
170 - .image-info{  
171 - font-size: 12px;  
172 - margin: 5px 0 0 0;  
173 - color: grey;  
174 - }  
175 -  
176 - .view.swipe{  
177 - position: relative;  
178 -  
179 - .swipe-frame{  
180 - display: block;  
181 - margin: auto;  
182 - position: relative;  
183 - }  
184 - .swipe-wrap{  
185 - overflow: hidden;  
186 - border-left: 1px solid #999;  
187 - position: absolute;  
188 - display: block;  
189 - top: 13px;  
190 - right: 7px;  
191 - }  
192 - .frame{  
193 - top: 0;  
194 - right: 0;  
195 - position: absolute;  
196 - &.deleted{  
197 - margin: 0;  
198 - display: block;  
199 - top: 13px;  
200 - right: 7px;  
201 - }  
202 - }  
203 - .swipe-bar{  
204 - display: block;  
205 - height: 100%;  
206 - width: 15px;  
207 - z-index: 100;  
208 - position: absolute;  
209 - cursor: pointer;  
210 - &:hover{  
211 - .top-handle{  
212 - background-position: -15px 3px;  
213 - }  
214 - .bottom-handle{  
215 - background-position: -15px -11px;  
216 - }  
217 - };  
218 - .top-handle{  
219 - display: block;  
220 - height: 14px;  
221 - width: 15px;  
222 - position: absolute;  
223 - top: 0px;  
224 - background: url('swipemode_sprites.gif') 0 3px no-repeat;  
225 - }  
226 - .bottom-handle{  
227 - display: block;  
228 - height: 14px;  
229 - width: 15px;  
230 - position: absolute;  
231 - bottom: 0px;  
232 - background: url('swipemode_sprites.gif') 0 -11px no-repeat;  
233 - }  
234 - }  
235 - } //.view.swipe  
236 - .view.onion-skin{  
237 - .onion-skin-frame{  
238 - display: block;  
239 - margin: auto;  
240 - position: relative;  
241 - }  
242 - .frame.added, .frame.deleted {  
243 - position: absolute;  
244 - display: block;  
245 - top: 0px;  
246 - left: 0px;  
247 - }  
248 - .controls{  
249 - display: block;  
250 - height: 14px;  
251 - width: 300px;  
252 - z-index: 100;  
253 - position: absolute;  
254 - bottom: 0px;  
255 - left: 50%;  
256 - margin-left: -150px;  
257 -  
258 - .drag-track{  
259 - display: block;  
260 - position: absolute;  
261 - left: 12px;  
262 - height: 10px;  
263 - width: 276px;  
264 - background: url('onion_skin_sprites.gif') -4px -20px repeat-x;  
265 - }  
266 -  
267 - .dragger {  
268 - display: block;  
269 - position: absolute;  
270 - left: 0px;  
271 - top: 0px;  
272 - height: 14px;  
273 - width: 14px;  
274 - background: url('onion_skin_sprites.gif') 0px -34px repeat-x;  
275 - cursor: pointer;  
276 - }  
277 -  
278 - .transparent {  
279 - display: block;  
280 - position: absolute;  
281 - top: 2px;  
282 - right: 0px;  
283 - height: 10px;  
284 - width: 10px;  
285 - background: url('onion_skin_sprites.gif') -2px 0px no-repeat;  
286 - }  
287 -  
288 - .opaque {  
289 - display: block;  
290 - position: absolute;  
291 - top: 2px;  
292 - left: 0px;  
293 - height: 10px;  
294 - width: 10px;  
295 - background: url('onion_skin_sprites.gif') -2px -10px no-repeat;  
296 - }  
297 - }  
298 - } //.view.onion-skin  
299 - }  
300 - .view-modes{  
301 -  
302 - padding: 10px;  
303 - text-align: center;  
304 -  
305 - background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));  
306 - background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);  
307 - background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);  
308 - background-image: -ms-linear-gradient(#eee 6.6%, #dfdfdf);  
309 - background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);  
310 -  
311 - ul, li{  
312 - list-style: none;  
313 - margin: 0;  
314 - padding: 0;  
315 - display: inline-block;  
316 - }  
317 -  
318 - li{  
319 - color: grey;  
320 - border-left: 1px solid #c1c1c1;  
321 - padding: 0 12px 0 16px;  
322 - cursor: pointer;  
323 - &:first-child{  
324 - border-left: none;  
325 - }  
326 - &:hover{  
327 - text-decoration: underline;  
328 - }  
329 - &.active{  
330 - &:hover{  
331 - text-decoration: none;  
332 - }  
333 - cursor: default;  
334 - color: #333;  
335 - }  
336 - &.disabled{  
337 - display: none;  
338 - }  
339 - }  
340 - }  
341 -}  
342 -  
343 /** COMMIT BLOCK **/ 13 /** COMMIT BLOCK **/
344 .commit-title{ 14 .commit-title{
345 display: block; 15 display: block;
app/assets/stylesheets/sections/diff.scss 0 → 100644
  Diff comments   View file @71d4474
@@ -0,0 +1,329 @@ @@ -0,0 +1,329 @@
  1 +.diff-file {
  2 + border: 1px solid #CCC;
  3 + margin-bottom: 1em;
  4 +
  5 + .diff-header {
  6 + @extend .clearfix;
  7 + background: #DDD;
  8 + border-bottom: 1px solid #CCC;
  9 + padding: 5px 5px 5px 10px;
  10 + color: #555;
  11 +
  12 + > span {
  13 + font-family: $monospace_font;
  14 + font-size: 14px;
  15 + line-height: 2;
  16 + }
  17 +
  18 + .diff-btn-group {
  19 + float: right;
  20 +
  21 + .btn {
  22 + background-color: #EEE;
  23 + color: #666;
  24 + font-weight: bolder;
  25 + }
  26 + }
  27 +
  28 + .commit-short-id {
  29 + font-family: $monospace_font;
  30 + font-size: smaller;
  31 + }
  32 +
  33 + .file-mode {
  34 + font-family: $monospace_font;
  35 + }
  36 + }
  37 + .diff-content {
  38 + overflow: auto;
  39 + overflow-y: hidden;
  40 + background: #FFF;
  41 + color: #333;
  42 + font-size: 12px;
  43 + .old {
  44 + span.idiff {
  45 + background-color: #FAA;
  46 + }
  47 + }
  48 + .new {
  49 + span.idiff {
  50 + background-color: #AFA;
  51 + }
  52 + }
  53 +
  54 + table {
  55 + width: 100%;
  56 + font-family: $monospace_font;
  57 + border: none;
  58 + margin: 0px;
  59 + padding: 0px;
  60 + td {
  61 + line-height: 18px;
  62 + font-size: 12px;
  63 + }
  64 + }
  65 + .old_line, .new_line, .diff_line {
  66 + margin: 0px;
  67 + padding: 0px;
  68 + border: none;
  69 + background: #EEE;
  70 + color: #666;
  71 + padding: 0px 5px;
  72 + border-right: 1px solid #ccc;
  73 + text-align: right;
  74 + min-width: 35px;
  75 + max-width: 50px;
  76 + width: 35px;
  77 + @include user-select(none);
  78 + a {
  79 + float: left;
  80 + width: 35px;
  81 + font-weight: normal;
  82 + color: #666;
  83 + &:hover {
  84 + text-decoration: underline;
  85 + }
  86 + }
  87 + &.new {
  88 + background: #CFD;
  89 + }
  90 + &.old {
  91 + background: #FDD;
  92 + }
  93 + }
  94 + .diff_line {
  95 + padding: 0;
  96 + }
  97 + .line_holder {
  98 + &.old .old_line,
  99 + &.old .new_line {
  100 + background: #FCC;
  101 + border-color: #E7BABA;
  102 + }
  103 + &.new .old_line,
  104 + &.new .new_line {
  105 + background: #CFC;
  106 + border-color: #B9ECB9;
  107 + }
  108 + }
  109 + .line_content {
  110 + display: block;
  111 + white-space: pre;
  112 + height: 18px;
  113 + margin: 0px;
  114 + padding: 0px 0.5em;
  115 + border: none;
  116 + &.new {
  117 + background: #CFD;
  118 + }
  119 + &.old {
  120 + background: #FDD;
  121 + }
  122 + &.matched {
  123 + color: #ccc;
  124 + background: #fafafa;
  125 + }
  126 + &.parallel {
  127 + display: table-cell;
  128 + overflow: hidden;
  129 + width: 50%;
  130 + }
  131 + }
  132 + }
  133 + .image {
  134 + background: #ddd;
  135 + text-align: center;
  136 + padding: 30px;
  137 + .wrap{
  138 + display: inline-block;
  139 + }
  140 +
  141 + .frame {
  142 + display: inline-block;
  143 + background-color: #fff;
  144 + line-height: 0;
  145 + img{
  146 + border: 1px solid #FFF;
  147 + background: url('trans_bg.gif');
  148 + max-width: 100%;
  149 + }
  150 + &.deleted {
  151 + border: 1px solid $deleted;
  152 + }
  153 +
  154 + &.added {
  155 + border: 1px solid $added;
  156 + }
  157 + }
  158 + .image-info{
  159 + font-size: 12px;
  160 + margin: 5px 0 0 0;
  161 + color: grey;
  162 + }
  163 +
  164 + .view.swipe{
  165 + position: relative;
  166 +
  167 + .swipe-frame{
  168 + display: block;
  169 + margin: auto;
  170 + position: relative;
  171 + }
  172 + .swipe-wrap{
  173 + overflow: hidden;
  174 + border-left: 1px solid #999;
  175 + position: absolute;
  176 + display: block;
  177 + top: 13px;
  178 + right: 7px;
  179 + }
  180 + .frame{
  181 + top: 0;
  182 + right: 0;
  183 + position: absolute;
  184 + &.deleted{
  185 + margin: 0;
  186 + display: block;
  187 + top: 13px;
  188 + right: 7px;
  189 + }
  190 + }
  191 + .swipe-bar{
  192 + display: block;
  193 + height: 100%;
  194 + width: 15px;
  195 + z-index: 100;
  196 + position: absolute;
  197 + cursor: pointer;
  198 + &:hover{
  199 + .top-handle{
  200 + background-position: -15px 3px;
  201 + }
  202 + .bottom-handle{
  203 + background-position: -15px -11px;
  204 + }
  205 + };
  206 + .top-handle{
  207 + display: block;
  208 + height: 14px;
  209 + width: 15px;
  210 + position: absolute;
  211 + top: 0px;
  212 + background: url('swipemode_sprites.gif') 0 3px no-repeat;
  213 + }
  214 + .bottom-handle{
  215 + display: block;
  216 + height: 14px;
  217 + width: 15px;
  218 + position: absolute;
  219 + bottom: 0px;
  220 + background: url('swipemode_sprites.gif') 0 -11px no-repeat;
  221 + }
  222 + }
  223 + } //.view.swipe
  224 + .view.onion-skin{
  225 + .onion-skin-frame{
  226 + display: block;
  227 + margin: auto;
  228 + position: relative;
  229 + }
  230 + .frame.added, .frame.deleted {
  231 + position: absolute;
  232 + display: block;
  233 + top: 0px;
  234 + left: 0px;
  235 + }
  236 + .controls{
  237 + display: block;
  238 + height: 14px;
  239 + width: 300px;
  240 + z-index: 100;
  241 + position: absolute;
  242 + bottom: 0px;
  243 + left: 50%;
  244 + margin-left: -150px;
  245 +
  246 + .drag-track{
  247 + display: block;
  248 + position: absolute;
  249 + left: 12px;
  250 + height: 10px;
  251 + width: 276px;
  252 + background: url('onion_skin_sprites.gif') -4px -20px repeat-x;
  253 + }
  254 +
  255 + .dragger {
  256 + display: block;
  257 + position: absolute;
  258 + left: 0px;
  259 + top: 0px;
  260 + height: 14px;
  261 + width: 14px;
  262 + background: url('onion_skin_sprites.gif') 0px -34px repeat-x;
  263 + cursor: pointer;
  264 + }
  265 +
  266 + .transparent {
  267 + display: block;
  268 + position: absolute;
  269 + top: 2px;
  270 + right: 0px;
  271 + height: 10px;
  272 + width: 10px;
  273 + background: url('onion_skin_sprites.gif') -2px 0px no-repeat;
  274 + }
  275 +
  276 + .opaque {
  277 + display: block;
  278 + position: absolute;
  279 + top: 2px;
  280 + left: 0px;
  281 + height: 10px;
  282 + width: 10px;
  283 + background: url('onion_skin_sprites.gif') -2px -10px no-repeat;
  284 + }
  285 + }
  286 + } //.view.onion-skin
  287 + }
  288 + .view-modes{
  289 +
  290 + padding: 10px;
  291 + text-align: center;
  292 +
  293 + background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf));
  294 + background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf);
  295 + background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf);
  296 + background-image: -ms-linear-gradient(#eee 6.6%, #dfdfdf);
  297 + background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf);
  298 +
  299 + ul, li{
  300 + list-style: none;
  301 + margin: 0;
  302 + padding: 0;
  303 + display: inline-block;
  304 + }
  305 +
  306 + li{
  307 + color: grey;
  308 + border-left: 1px solid #c1c1c1;
  309 + padding: 0 12px 0 16px;
  310 + cursor: pointer;
  311 + &:first-child{
  312 + border-left: none;
  313 + }
  314 + &:hover{
  315 + text-decoration: underline;
  316 + }
  317 + &.active{
  318 + &:hover{
  319 + text-decoration: none;
  320 + }
  321 + cursor: default;
  322 + color: #333;
  323 + }
  324 + &.disabled{
  325 + display: none;
  326 + }
  327 + }
  328 + }
  329 +}