Show More
@@ -1,317 +1,317 b'' | |||||
1 |
|
1 | |||
2 | /** |
|
2 | /** | |
3 | * Primary styles |
|
3 | * Primary styles | |
4 | * |
|
4 | * | |
5 | * Author: IPython Development Team |
|
5 | * Author: IPython Development Team | |
6 | */ |
|
6 | */ | |
7 |
|
7 | |||
8 | @dashboard_tb_pad: 4px; |
|
8 | @dashboard_tb_pad: 4px; | |
9 | @dashboard_lr_pad: 7px; |
|
9 | @dashboard_lr_pad: 7px; | |
10 | // These are the total heights of the Bootstrap small and mini buttons. These values |
|
10 | // These are the total heights of the Bootstrap small and mini buttons. These values | |
11 | // are not less variables so we have to track them statically. |
|
11 | // are not less variables so we have to track them statically. | |
12 | @btn_small_height: 24px; |
|
12 | @btn_small_height: 24px; | |
13 | @btn_mini_height: 22px; |
|
13 | @btn_mini_height: 22px; | |
14 | @dark_dashboard_color: @breadcrumb-color; |
|
14 | @dark_dashboard_color: @breadcrumb-color; | |
15 | @list_stripe_color: lighten(@page-backdrop-color,3%); |
|
15 | @list_stripe_color: lighten(@page-backdrop-color,3%); | |
16 |
|
16 | |||
17 | // The left padding of the selector button's contents. |
|
17 | // The left padding of the selector button's contents. | |
18 | @dashboard-selectorbtn-lpad: 7px; |
|
18 | @dashboard-selectorbtn-lpad: 7px; | |
19 |
|
19 | |||
20 | ul#tabs { |
|
20 | ul#tabs { | |
21 | margin-bottom: @dashboard_tb_pad; |
|
21 | margin-bottom: @dashboard_tb_pad; | |
22 | } |
|
22 | } | |
23 |
|
23 | |||
24 | ul#tabs a { |
|
24 | ul#tabs a { | |
25 | padding-top: @dashboard_tb_pad + 2px; |
|
25 | padding-top: @dashboard_tb_pad + 2px; | |
26 | padding-bottom: @dashboard_tb_pad; |
|
26 | padding-bottom: @dashboard_tb_pad; | |
27 | } |
|
27 | } | |
28 |
|
28 | |||
29 | ul.breadcrumb { |
|
29 | ul.breadcrumb { | |
30 | a:focus, a:hover { |
|
30 | a:focus, a:hover { | |
31 | text-decoration: none; |
|
31 | text-decoration: none; | |
32 | } |
|
32 | } | |
33 | i.icon-home { |
|
33 | i.icon-home { | |
34 | font-size: 16px; |
|
34 | font-size: 16px; | |
35 | margin-right: 4px; |
|
35 | margin-right: 4px; | |
36 | } |
|
36 | } | |
37 |
|
37 | |||
38 | span { |
|
38 | span { | |
39 | color: @dark_dashboard_color; |
|
39 | color: @dark_dashboard_color; | |
40 | } |
|
40 | } | |
41 | } |
|
41 | } | |
42 |
|
42 | |||
43 | .list_toolbar { |
|
43 | .list_toolbar { | |
44 | padding: @dashboard_tb_pad 0 @dashboard_tb_pad 0; |
|
44 | padding: @dashboard_tb_pad 0 @dashboard_tb_pad 0; | |
45 | vertical-align: middle; |
|
45 | vertical-align: middle; | |
46 |
|
46 | |||
47 | .tree-buttons { |
|
47 | .tree-buttons { | |
48 | padding-top: 1px; |
|
48 | padding-top: 1px; | |
49 | } |
|
49 | } | |
50 | } |
|
50 | } | |
51 |
|
51 | |||
52 | .dynamic-buttons { |
|
52 | .dynamic-buttons { | |
53 | display: inline-block; |
|
53 | display: inline-block; | |
54 | } |
|
54 | } | |
55 |
|
55 | |||
56 | .list_toolbar [class*="span"] { |
|
56 | .list_toolbar [class*="span"] { | |
57 | min-height: @btn_small_height; |
|
57 | min-height: @btn_small_height; | |
58 | } |
|
58 | } | |
59 |
|
59 | |||
60 | .list_header { |
|
60 | .list_header { | |
61 | font-weight: bold; |
|
61 | font-weight: bold; | |
62 | background-color: @page-backdrop-color |
|
62 | background-color: @page-backdrop-color | |
63 | } |
|
63 | } | |
64 |
|
64 | |||
65 | .list_placeholder { |
|
65 | .list_placeholder { | |
66 | font-weight: bold; |
|
66 | font-weight: bold; | |
67 | padding-top: @dashboard_tb_pad; |
|
67 | padding-top: @dashboard_tb_pad; | |
68 | padding-bottom: @dashboard_tb_pad; |
|
68 | padding-bottom: @dashboard_tb_pad; | |
69 | padding-left: @dashboard_lr_pad; |
|
69 | padding-left: @dashboard_lr_pad; | |
70 | padding-right: @dashboard_lr_pad; |
|
70 | padding-right: @dashboard_lr_pad; | |
71 | } |
|
71 | } | |
72 |
|
72 | |||
73 | .list_container { |
|
73 | .list_container { | |
74 | margin-top: @dashboard_tb_pad; |
|
74 | margin-top: @dashboard_tb_pad; | |
75 | margin-bottom: 5*@dashboard_tb_pad; |
|
75 | margin-bottom: 5*@dashboard_tb_pad; | |
76 | border: 1px solid @table-border-color; |
|
76 | border: 1px solid @table-border-color; | |
77 | border-radius: @border-radius-base; |
|
77 | border-radius: @border-radius-base; | |
78 | } |
|
78 | } | |
79 |
|
79 | |||
80 | .list_container > div { |
|
80 | .list_container > div { | |
81 | border-bottom: 1px solid @table-border-color; |
|
81 | border-bottom: 1px solid @table-border-color; | |
82 | &:hover .list-item{ |
|
82 | &:hover .list-item{ | |
83 | background-color: red; |
|
83 | background-color: red; | |
84 | }; |
|
84 | }; | |
85 | } |
|
85 | } | |
86 |
|
86 | |||
87 | .list_container > div:last-child { |
|
87 | .list_container > div:last-child { | |
88 | border: none; |
|
88 | border: none; | |
89 | } |
|
89 | } | |
90 |
|
90 | |||
91 | .list_item { |
|
91 | .list_item { | |
92 | &:hover .list_item { |
|
92 | &:hover .list_item { | |
93 | background-color: @table-border-color; |
|
93 | background-color: @table-border-color; | |
94 | }; |
|
94 | }; | |
95 | a {text-decoration: none;} |
|
95 | a {text-decoration: none;} | |
96 | &:hover { |
|
96 | &:hover { | |
97 | background-color: darken(white,2%); |
|
97 | background-color: darken(white,2%); | |
98 | } |
|
98 | } | |
99 | } |
|
99 | } | |
100 |
|
100 | |||
101 | .action_col { |
|
101 | .action_col { | |
102 | text-align: right; |
|
102 | text-align: right; | |
103 | } |
|
103 | } | |
104 |
|
104 | |||
105 | .list_header>div, .list_item>div { |
|
105 | .list_header>div, .list_item>div { | |
106 | padding-top: @dashboard_tb_pad; |
|
106 | padding-top: @dashboard_tb_pad; | |
107 | padding-bottom: @dashboard_tb_pad; |
|
107 | padding-bottom: @dashboard_tb_pad; | |
108 | padding-left: @dashboard_lr_pad; |
|
108 | padding-left: @dashboard_lr_pad; | |
109 | padding-right: @dashboard_lr_pad; |
|
109 | padding-right: @dashboard_lr_pad; | |
110 | line-height: @btn_mini_height; |
|
110 | line-height: @btn_mini_height; | |
111 |
|
111 | |||
112 | input { |
|
112 | input { | |
113 | margin-right: @dashboard_lr_pad; |
|
113 | margin-right: @dashboard_lr_pad; | |
114 | margin-left: @dashboard_lr_pad + @dashboard-selectorbtn-lpad; |
|
114 | margin-left: @dashboard_lr_pad + @dashboard-selectorbtn-lpad; | |
115 | vertical-align: baseline; |
|
115 | vertical-align: baseline; | |
116 | line-height: @btn_mini_height; |
|
116 | line-height: @btn_mini_height; | |
117 | position: relative; |
|
117 | position: relative; | |
118 |
top: |
|
118 | top: 1px; | |
119 | } |
|
119 | } | |
120 |
|
120 | |||
121 | .item_link { |
|
121 | .item_link { | |
122 | margin-left: -1px; |
|
122 | margin-left: -1px; | |
123 | vertical-align: baseline; |
|
123 | vertical-align: baseline; | |
124 | line-height: @btn_mini_height; |
|
124 | line-height: @btn_mini_height; | |
125 | } |
|
125 | } | |
126 | } |
|
126 | } | |
127 |
|
127 | |||
128 | .new-file input[type=checkbox] { |
|
128 | .new-file input[type=checkbox] { | |
129 | visibility: hidden; |
|
129 | visibility: hidden; | |
130 | } |
|
130 | } | |
131 |
|
131 | |||
132 | .item_name { |
|
132 | .item_name { | |
133 | line-height: @btn_mini_height; |
|
133 | line-height: @btn_mini_height; | |
134 | height: @btn_small_height; |
|
134 | height: @btn_small_height; | |
135 | } |
|
135 | } | |
136 |
|
136 | |||
137 | .item_icon { |
|
137 | .item_icon { | |
138 | font-size: 14px; |
|
138 | font-size: 14px; | |
139 | color: @dark_dashboard_color; |
|
139 | color: @dark_dashboard_color; | |
140 | margin-right: @dashboard_lr_pad; |
|
140 | margin-right: @dashboard_lr_pad; | |
141 | margin-left: @dashboard_lr_pad; |
|
141 | margin-left: @dashboard_lr_pad; | |
142 | line-height: @btn_mini_height; |
|
142 | line-height: @btn_mini_height; | |
143 | vertical-align: baseline; |
|
143 | vertical-align: baseline; | |
144 | } |
|
144 | } | |
145 |
|
145 | |||
146 | .item_buttons { |
|
146 | .item_buttons { | |
147 | padding-top: @dashboard_tb_pad; |
|
147 | padding-top: @dashboard_tb_pad; | |
148 | line-height: 1em; |
|
148 | line-height: 1em; | |
149 | .btn-toolbar(); |
|
149 | .btn-toolbar(); | |
150 | .btn { |
|
150 | .btn { | |
151 | min-width: 13ex; |
|
151 | min-width: 13ex; | |
152 | } |
|
152 | } | |
153 | .running-indicator { |
|
153 | .running-indicator { | |
154 | color: @brand-success; |
|
154 | color: @brand-success; | |
155 | } |
|
155 | } | |
156 | } |
|
156 | } | |
157 |
|
157 | |||
158 | .toolbar_info { |
|
158 | .toolbar_info { | |
159 | height: @btn_small_height; |
|
159 | height: @btn_small_height; | |
160 | line-height: @btn_small_height; |
|
160 | line-height: @btn_small_height; | |
161 | } |
|
161 | } | |
162 |
|
162 | |||
163 | input.nbname_input, input.engine_num_input { |
|
163 | input.nbname_input, input.engine_num_input { | |
164 | // These settings give these inputs a height that matches @btn_mini_height = 22 |
|
164 | // These settings give these inputs a height that matches @btn_mini_height = 22 | |
165 | padding-top: 3px; |
|
165 | padding-top: 3px; | |
166 | padding-bottom: 3px; |
|
166 | padding-bottom: 3px; | |
167 | height: @btn_mini_height; |
|
167 | height: @btn_mini_height; | |
168 | line-height: 14px; |
|
168 | line-height: 14px; | |
169 | margin: 0px; |
|
169 | margin: 0px; | |
170 | } |
|
170 | } | |
171 |
|
171 | |||
172 | input.engine_num_input { |
|
172 | input.engine_num_input { | |
173 | width: 60px; |
|
173 | width: 60px; | |
174 | } |
|
174 | } | |
175 |
|
175 | |||
176 | .highlight_text { |
|
176 | .highlight_text { | |
177 | color: blue; |
|
177 | color: blue; | |
178 | } |
|
178 | } | |
179 |
|
179 | |||
180 | #project_name { |
|
180 | #project_name { | |
181 | display: inline-block; |
|
181 | display: inline-block; | |
182 | padding-left: @dashboard_lr_pad; |
|
182 | padding-left: @dashboard_lr_pad; | |
183 | margin-left: -2px; |
|
183 | margin-left: -2px; | |
184 |
|
184 | |||
185 | > .breadcrumb { |
|
185 | > .breadcrumb { | |
186 | padding: 0px; |
|
186 | padding: 0px; | |
187 | margin-bottom: 0px; |
|
187 | margin-bottom: 0px; | |
188 | background-color: transparent; |
|
188 | background-color: transparent; | |
189 | font-weight: bold; |
|
189 | font-weight: bold; | |
190 | } |
|
190 | } | |
191 | } |
|
191 | } | |
192 |
|
192 | |||
193 | #tree-selector { |
|
193 | #tree-selector { | |
194 | display: inline-block; |
|
194 | display: inline-block; | |
195 | padding-right: 0px; |
|
195 | padding-right: 0px; | |
196 |
|
196 | |||
197 | input[type=checkbox] { |
|
197 | input[type=checkbox] { | |
198 | margin-left: @dashboard_lr_pad; |
|
198 | margin-left: @dashboard_lr_pad; | |
199 | vertical-align: baseline; |
|
199 | vertical-align: baseline; | |
200 | } |
|
200 | } | |
201 | } |
|
201 | } | |
202 |
|
202 | |||
203 | .tab-content .row { |
|
203 | .tab-content .row { | |
204 | margin-left: 0px; |
|
204 | margin-left: 0px; | |
205 | margin-right: 0px; |
|
205 | margin-right: 0px; | |
206 | } |
|
206 | } | |
207 |
|
207 | |||
208 | .folder_icon:before { |
|
208 | .folder_icon:before { | |
209 | .icon(@fa-var-folder-o); |
|
209 | .icon(@fa-var-folder-o); | |
210 | } |
|
210 | } | |
211 |
|
211 | |||
212 | .notebook_icon:before { |
|
212 | .notebook_icon:before { | |
213 | .icon(@fa-var-book); |
|
213 | .icon(@fa-var-book); | |
214 | position: relative; |
|
214 | position: relative; | |
215 | top: -1px; |
|
215 | top: -1px; | |
216 | } |
|
216 | } | |
217 |
|
217 | |||
218 | .running_notebook_icon:before { |
|
218 | .running_notebook_icon:before { | |
219 | .icon(@fa-var-book); |
|
219 | .icon(@fa-var-book); | |
220 | position: relative; |
|
220 | position: relative; | |
221 | top: -1px; |
|
221 | top: -1px; | |
222 |
|
222 | |||
223 | color: @brand-success; |
|
223 | color: @brand-success; | |
224 | } |
|
224 | } | |
225 |
|
225 | |||
226 |
|
226 | |||
227 | .file_icon:before { |
|
227 | .file_icon:before { | |
228 | .icon(@fa-var-file-o); |
|
228 | .icon(@fa-var-file-o); | |
229 | position: relative; |
|
229 | position: relative; | |
230 | top: -2px; |
|
230 | top: -2px; | |
231 | } |
|
231 | } | |
232 |
|
232 | |||
233 | #notebook_toolbar .pull-right { |
|
233 | #notebook_toolbar .pull-right { | |
234 | padding-top: 0px; |
|
234 | padding-top: 0px; | |
235 | margin-right: -1px; |
|
235 | margin-right: -1px; | |
236 | } |
|
236 | } | |
237 |
|
237 | |||
238 | ul#new-menu { |
|
238 | ul#new-menu { | |
239 | // align right instead of left |
|
239 | // align right instead of left | |
240 | left: auto; |
|
240 | left: auto; | |
241 | right: 0; |
|
241 | right: 0; | |
242 | } |
|
242 | } | |
243 |
|
243 | |||
244 | .kernel-menu-icon { |
|
244 | .kernel-menu-icon { | |
245 | padding-right: 12px; |
|
245 | padding-right: 12px; | |
246 | width: 24px; |
|
246 | width: 24px; | |
247 | content: @fa-var-square-o; |
|
247 | content: @fa-var-square-o; | |
248 | } |
|
248 | } | |
249 |
|
249 | |||
250 | .kernel-menu-icon:before { |
|
250 | .kernel-menu-icon:before { | |
251 | content: @fa-var-square-o; |
|
251 | content: @fa-var-square-o; | |
252 | } |
|
252 | } | |
253 |
|
253 | |||
254 | .kernel-menu-icon-current:before { |
|
254 | .kernel-menu-icon-current:before { | |
255 | content: @fa-var-check; |
|
255 | content: @fa-var-check; | |
256 | } |
|
256 | } | |
257 |
|
257 | |||
258 | #tab_content { |
|
258 | #tab_content { | |
259 | padding-top: @page-header-padding; |
|
259 | padding-top: @page-header-padding; | |
260 | } |
|
260 | } | |
261 |
|
261 | |||
262 | #running { |
|
262 | #running { | |
263 | .panel-group{ |
|
263 | .panel-group{ | |
264 | .panel { |
|
264 | .panel { | |
265 | margin-top: 3px; |
|
265 | margin-top: 3px; | |
266 | margin-bottom: 1em; |
|
266 | margin-bottom: 1em; | |
267 |
|
267 | |||
268 | .panel-heading { |
|
268 | .panel-heading { | |
269 | background-color: @page-backdrop-color; |
|
269 | background-color: @page-backdrop-color; | |
270 | padding-top: @dashboard_tb_pad; |
|
270 | padding-top: @dashboard_tb_pad; | |
271 | padding-bottom: @dashboard_tb_pad; |
|
271 | padding-bottom: @dashboard_tb_pad; | |
272 | padding-left: @dashboard_lr_pad; |
|
272 | padding-left: @dashboard_lr_pad; | |
273 | padding-right: @dashboard_lr_pad; |
|
273 | padding-right: @dashboard_lr_pad; | |
274 | line-height: @btn_mini_height; |
|
274 | line-height: @btn_mini_height; | |
275 |
|
275 | |||
276 | a:focus, a:hover { |
|
276 | a:focus, a:hover { | |
277 | text-decoration: none; |
|
277 | text-decoration: none; | |
278 | } |
|
278 | } | |
279 | } |
|
279 | } | |
280 |
|
280 | |||
281 | .panel-body { |
|
281 | .panel-body { | |
282 | padding: 0px; |
|
282 | padding: 0px; | |
283 |
|
283 | |||
284 | .list_container { |
|
284 | .list_container { | |
285 | margin-top: 0px; |
|
285 | margin-top: 0px; | |
286 | margin-bottom: 0px; |
|
286 | margin-bottom: 0px; | |
287 | border: 0px; |
|
287 | border: 0px; | |
288 | border-radius: 0px; |
|
288 | border-radius: 0px; | |
289 |
|
289 | |||
290 | .list_item { |
|
290 | .list_item { | |
291 | border-bottom: 1px solid @table-border-color; |
|
291 | border-bottom: 1px solid @table-border-color; | |
292 |
|
292 | |||
293 | &:last-child { |
|
293 | &:last-child { | |
294 | border-bottom: 0px; |
|
294 | border-bottom: 0px; | |
295 | } |
|
295 | } | |
296 | } |
|
296 | } | |
297 | } |
|
297 | } | |
298 | } |
|
298 | } | |
299 | } |
|
299 | } | |
300 | } |
|
300 | } | |
301 | } |
|
301 | } | |
302 |
|
302 | |||
303 | .delete-button { |
|
303 | .delete-button { | |
304 | display: none; |
|
304 | display: none; | |
305 | } |
|
305 | } | |
306 |
|
306 | |||
307 | .duplicate-button { |
|
307 | .duplicate-button { | |
308 | display: none; |
|
308 | display: none; | |
309 | } |
|
309 | } | |
310 |
|
310 | |||
311 | .rename-button { |
|
311 | .rename-button { | |
312 | display: none; |
|
312 | display: none; | |
313 | } |
|
313 | } | |
314 |
|
314 | |||
315 | .shutdown-button { |
|
315 | .shutdown-button { | |
316 | display: none; |
|
316 | display: none; | |
317 | } |
|
317 | } |
General Comments 0
You need to be logged in to leave comments.
Login now