##// END OF EJS Templates
ui: file headers should be flexible, to expand on long paths
dan -
r3405:c3563bf3 default
parent child Browse files
Show More
@@ -1,287 +1,285 b''
1 // summary.less
1 // summary.less
2 // For use in RhodeCode applications;
2 // For use in RhodeCode applications;
3 // Used for headers and file detail summary screens.
3 // Used for headers and file detail summary screens.
4
4
5 .summary {
5 .summary {
6 float: left;
6 float: left;
7 position: relative;
7 position: relative;
8 width: 100%;
8 width: 100%;
9 margin: 0;
9 margin: 0;
10 padding: 0;
10 padding: 0;
11
11
12 .summary-detail-header {
12 .summary-detail-header {
13 float: left;
13 float: left;
14 display: block;
14 display: block;
15 width: 100%;
15 width: 100%;
16 margin-bottom: @textmargin;
16 margin-bottom: @textmargin;
17 padding: 0 0 .5em 0;
17 padding: 0 0 .5em 0;
18 border-bottom: @border-thickness solid @border-default-color;
18 border-bottom: @border-thickness solid @border-default-color;
19
19
20 .breadcrumbs {
20 .breadcrumbs {
21 float: left;
21 float: left;
22 display: inline;
22 display: inline;
23 margin: 0;
23 margin: 0;
24 padding: 0;
24 padding: 0;
25 }
25 }
26 h4 {
26 h4 {
27 float: left;
27 float: left;
28 margin: 0 1em 0 0;
28 margin: 0 1em 0 0;
29 padding: 0;
29 padding: 0;
30 line-height: 1.2em;
30 line-height: 1.2em;
31 font-size: @basefontsize;
31 font-size: @basefontsize;
32 }
32 }
33
33
34 .action_link {
34 .action_link {
35 float: right;
35 float: right;
36 }
36 }
37
37
38 .new-file {
38 .new-file {
39 float: right;
39 float: right;
40 margin-top: -1.5em;
40 margin-top: -1.5em;
41 }
41 }
42 }
42 }
43
43
44 .summary-detail {
44 .summary-detail {
45 float: left;
45 float: left;
46 position: relative;
46 position: relative;
47 width: 73%;
47 width: 73%;
48 margin: 0 3% @space 0;
48 margin: 0 3% @space 0;
49 padding: 0;
49 padding: 0;
50
50
51 .file_diff_buttons {
51 .file_diff_buttons {
52 margin-top: @space;
52 margin-top: @space;
53 }
53 }
54
54
55 // commit message
55 // commit message
56 .commit {
56 .commit {
57 white-space: pre-wrap;
57 white-space: pre-wrap;
58 }
58 }
59
59
60 .left-clone {
60 .left-clone {
61 float: left;
61 float: left;
62 height: 30px;
62 height: 30px;
63 margin: 0;
63 margin: 0;
64 padding: 0;
64 padding: 0;
65 font-weight: @text-semibold-weight;
65 font-weight: @text-semibold-weight;
66 font-family: @text-semibold;
66 font-family: @text-semibold;
67 }
67 }
68
68
69 .right-clone {
69 .right-clone {
70 float: right;
70 float: right;
71 width: 83%;
71 width: 83%;
72 }
72 }
73
73
74 .clone_url_input {
74 .clone_url_input {
75 width: ~"calc(100% - 35px)";
75 width: ~"calc(100% - 35px)";
76 padding: 5px;
76 padding: 5px;
77 }
77 }
78
78
79 &.directory {
79 &.directory {
80 margin-bottom: 0;
80 margin-bottom: 0;
81 }
81 }
82
82
83 .desc {
83 .desc {
84 white-space: pre-wrap;
84 white-space: pre-wrap;
85 }
85 }
86 .disabled {
86 .disabled {
87 opacity: .5;
87 opacity: .5;
88 cursor: inherit;
88 cursor: inherit;
89 }
89 }
90 .help-block {
90 .help-block {
91 color: inherit;
91 color: inherit;
92 margin: 0;
92 margin: 0;
93 }
93 }
94 }
94 }
95
95
96 .sidebar-right {
96 .sidebar-right {
97 float: left;
97 float: left;
98 width: 24%;
98 width: 24%;
99 margin: 0;
99 margin: 0;
100 padding: 0;
100 padding: 0;
101
101
102 ul {
102 ul {
103 margin-left: 0;
103 margin-left: 0;
104 padding-left: 0;
104 padding-left: 0;
105
105
106 li {
106 li {
107 list-style-type: none;
107 list-style-type: none;
108 }
108 }
109 }
109 }
110 }
110 }
111
111
112 #clone_by_name, #clone_by_id{
112 #clone_by_name, #clone_by_id{
113 display: inline-block;
113 display: inline-block;
114 margin-left: 0px;
114 margin-left: 0px;
115 }
115 }
116
116
117 .codeblock {
117 .codeblock {
118 border: none;
118 border: none;
119 background-color: transparent;
119 background-color: transparent;
120 }
120 }
121
121
122 .code-body {
122 .code-body {
123 border: @border-thickness solid @border-default-color;
123 border: @border-thickness solid @border-default-color;
124 .border-radius(@border-radius);
124 .border-radius(@border-radius);
125 }
125 }
126 }
126 }
127
127
128 // this is used outside of just the summary
128 // this is used outside of just the summary
129 .fieldset, // similar to form fieldset
129 .fieldset, // similar to form fieldset
130 .summary .sidebar-right-content { // these have to match
130 .summary .sidebar-right-content { // these have to match
131 clear: both;
131 clear: both;
132 float: left;
132 float: left;
133 position: relative;
133 position: relative;
134 display:block;
134 display:block;
135 width: 100%;
135 width: 100%;
136 min-height: 1em;
136 min-height: 1em;
137 margin-bottom: @textmargin;
137 margin-bottom: @textmargin;
138 padding: 0;
138 padding: 0;
139 line-height: 1.2em;
139 line-height: 1.2em;
140
140
141 &:after { // clearfix
141 &:after { // clearfix
142 content: "";
142 content: "";
143 clear: both;
143 clear: both;
144 width: 100%;
144 width: 100%;
145 height: 1em;
145 height: 1em;
146 }
146 }
147 }
147 }
148
148
149 .summary .sidebar-right-content {
149 .summary .sidebar-right-content {
150 margin-bottom: @space;
150 margin-bottom: @space;
151
151
152 .rc-user {
152 .rc-user {
153 min-width: 0;
153 min-width: 0;
154 }
154 }
155 }
155 }
156
156
157 .fieldset {
157 .fieldset {
158
158
159 .left-label { // similar to form legend
159 .left-label { // similar to form legend
160 float: left;
160 float: left;
161 display: block;
161 display: block;
162 width: 25%;
162 width: 25%;
163 margin: 0;
163 margin: 0;
164 padding: 0;
164 padding: 0;
165 font-weight: @text-semibold-weight;
165 font-weight: @text-semibold-weight;
166 font-family: @text-semibold;
166 font-family: @text-semibold;
167 }
167 }
168
168
169 .left-label-summary {
169 .left-label-summary {
170 .left-label;
170 .left-label;
171 width: 150px;
171 width: 150px;
172 }
172 }
173
173
174 .right-content { // similar to form fields
174 .right-content { // similar to form fields
175 float: left;
175 float: left;
176 display: block;
176 display: block;
177 width: 75%;
177 width: 75%;
178 margin: 0 0 0 -15%;
178 margin: 0 0 0 -15%;
179 padding: 0 0 0 15%;
179 padding: 0 0 0 15%;
180
180
181 .truncate-wrap,
181 .truncate-wrap,
182 .truncate {
182 .truncate {
183 max-width: 100%;
183 max-width: 100%;
184 width: 100%;
184 width: 100%;
185 }
185 }
186
186
187 .commit-long {
187 .commit-long {
188 overflow-x: auto;
188 overflow-x: auto;
189 }
189 }
190 }
190 }
191 .commit.truncate-wrap {
191 .commit.truncate-wrap {
192 overflow:hidden;
192 overflow:hidden;
193 text-overflow: ellipsis;
193 text-overflow: ellipsis;
194 }
194 }
195 }
195 }
196
196
197 // expand commit message
197 // expand commit message
198 #message_expand {
198 #message_expand {
199 clear: both;
199 clear: both;
200 display: block;
200 display: block;
201 color: @rcblue;
201 color: @rcblue;
202 cursor: pointer;
202 cursor: pointer;
203 }
203 }
204
204
205 #trimmed_message_box {
205 #trimmed_message_box {
206 max-height: floor(2 * @basefontsize * 1.2); // 2 lines * line-height
206 max-height: floor(2 * @basefontsize * 1.2); // 2 lines * line-height
207 overflow: hidden;
207 overflow: hidden;
208 }
208 }
209
209
210 // show/hide comments button
210 // show/hide comments button
211 .show-inline-comments {
211 .show-inline-comments {
212 display: inline;
212 display: inline;
213 cursor: pointer;
213 cursor: pointer;
214
214
215 .comments-show { display: inline; }
215 .comments-show { display: inline; }
216 .comments-hide { display: none; }
216 .comments-hide { display: none; }
217
217
218 &.comments-visible {
218 &.comments-visible {
219 .comments-show { display: none; }
219 .comments-show { display: none; }
220 .comments-hide { display: inline; }
220 .comments-hide { display: inline; }
221 }
221 }
222 }
222 }
223
223
224 // Quick Start section
224 // Quick Start section
225 .quick_start {
225 .quick_start {
226 float: left;
226 float: left;
227 display: block;
227 display: block;
228 position: relative;
228 position: relative;
229 width: 100%;
229 width: 100%;
230
230
231 // adds some space to make copy and paste easier
231 // adds some space to make copy and paste easier
232 .left-label,
232 .left-label,
233 .right-content {
233 .right-content {
234 line-height: 1.6em;
234 line-height: 1.6em;
235 }
235 }
236 }
236 }
237
237
238 .submodule {
238 .submodule {
239 .summary-detail {
239 .summary-detail {
240 width: 100%;
240 width: 100%;
241
241
242 .btn-collapse {
242 .btn-collapse {
243 display: none;
243 display: none;
244 }
244 }
245 }
245 }
246 }
246 }
247
247
248 .codeblock-header {
248 .codeblock-header {
249 float: left;
249 float: left;
250 display: block;
250 display: block;
251 width: 100%;
251 width: 100%;
252 margin: 0;
252 margin: 0;
253 padding: @space 0 10px 0;
253 padding: @space 0 10px 0;
254 border-top: @border-thickness solid @border-default-color;
254 border-top: @border-thickness solid @border-default-color;
255
255
256 .stats {
256 .stats {
257 float: left;
257 float: left;
258 width: 50%;
259 }
258 }
260 .stats-filename {
259 .stats-filename {
261 font-size: 120%;
260 font-size: 120%;
262 }
261 }
263 .stats-first-item {
262 .stats-first-item {
264 padding: 0px 0px 0px 3px;
263 padding: 0px 0px 0px 3px;
265 }
264 }
266
265
267 .buttons {
266 .buttons {
268 float: right;
267 float: right;
269 width: 50%;
270 text-align: right;
268 text-align: right;
271 color: @grey4;
269 color: @grey4;
272 }
270 }
273 }
271 }
274
272
275 #summary-menu-stats {
273 #summary-menu-stats {
276
274
277 .stats-bullet {
275 .stats-bullet {
278 color: @grey3;
276 color: @grey3;
279 min-width: 3em;
277 min-width: 3em;
280 }
278 }
281
279
282 .repo-size {
280 .repo-size {
283 margin-bottom: .5em;
281 margin-bottom: .5em;
284 }
282 }
285
283
286 }
284 }
287
285
General Comments 0
You need to be logged in to leave comments. Login now