2 To compile this .less file to .css:
3 lessc screen.less > ../stylesheets/screen.css
4 Use -compress for a compressed .css with no comments
10 @bright-orange: #ff6529;
15 @dark-slate-blue: #1a4f77;
16 @lightest-gray: #efefef;
17 @button-gray: #e1e1e1;
24 @header-gray: #505050;
35 @light-orange: #ff9c00;
36 @item-hilite-background: #226b9a;
38 @text-shadow: fade(#222, 45%);
41 @control-bg: @header-gray;
45 @baseFont: 'Helvetica Neue', Helvetica, 'Nimbus Sans L', Arial, sans-serif;
46 @groupboxFont: "Lucida Sans Unicode", "Lucida Grande", arial, sans-serif;
47 @startupFont: Segoe UI, Prelude Medium, Helvetica, Verdana, sans-serif;
51 @totalsFontSize: 14px;
52 @buttonFontSize: 17px;
55 @defaultPanelWidth: 320px;
60 @import "../../lib/font-awesome/less/font-awesome.less";
61 @import "../../lib/font-onyx/lib/Icon.less";
64 font-family: @baseFont;
65 font-size: @baseFontSize;
66 background-color: @white;
70 bottom: 4px !important;
79 /* Setting this as min-width overrides enyo-narrow 100% */
80 width: @defaultPanelWidth;
81 // TODO: replace with textured background?
82 background-color: @white;
83 .box-shadow(-2px -2px 6px rgba(0,0,0,0.20));
87 Media query for responsive design. This adapts to smaller
90 @media (max-width: 480px) {
100 margin-bottom: -4px !important;
110 -webkit-overflow-scrolling: touch;
125 .xv-error, .xv-negative {
130 Default button bar with margins and border-radius
141 background: @button-gray;
145 font-size: @buttonFontSize;
146 font-family: @baseFont;
149 background: @slate-blue;
164 .xv-parameter-title {
174 background: @header-gray;
178 min-width: @defaultPanelWidth;
182 &.xv-groupbox-popup {
183 .xv-workspace-container > .xv-workspace > .xv-workspace-panel;
194 .xv-my-account-popup {
195 background-color: @white;
202 margin: 0 auto 0 auto;
211 background-color: @white;
213 .xv-groupbox > *:last-child {
223 .xv-comment-box-repeater {
226 .xv-comment-box-label {
232 text-overflow: ellipsis;
234 .xv-comment-box-textblock {
240 /* Resets the margin/padding value for blockquote tag in comments */
242 margin: 0 15px 10px 15px;
247 .icon-folder-open-alt, .icon-calendar, .icon-sort {
249 vertical-align: middle;
261 border: #eee 2px solid;
264 .xv-documents-picker-label {
266 padding: 16px 8px 8px 8px;
270 .xv-documents-picker {
276 // TODO: replace this image with font
279 url(../../../../../../assets/checkbox.png)
291 /* This is for styling the moved items in the more toolbar */
296 .icon-folder-open-alt, .icon-calendar, .icon-sort, .icon-angle-up, .icon-angle-down, .icon-save {
298 vertical-align: middle;
302 height: @toolbarHeight;
304 background: @header-gray;
307 .onyx-icon-button, .onyx-popup-decorator {
315 color: @light-orange;
320 .onyx-popup-decorator {
321 // cancel the margin that
322 // is on the icon if there's a menu
339 .xv-toolbar-label, .xv-search {
341 width: @searchLength;
348 @import "mixins.less";
350 @import "navigator.less";
351 @import "startup.less";
352 @import "workspace.less";
353 @import "model-decorator.less";
354 @import "picker.less";
356 @import "dashboard.less";
358 @import "pullout.less";
359 @import "widgets.less";
360 @import "characteristics.less";
361 @import "relations.less";
362 @import "address.less";
363 @import "search.less";