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: 20px;
53 @buttonTextFontSize: 17px;
56 @defaultPanelWidth: 320px;
61 @import "../../lib/font-awesome/less/font-awesome.less";
62 @import "../../lib/font-onyx/lib/Icon.less";
65 font-family: @baseFont;
66 font-size: @baseFontSize;
67 background-color: @white;
71 bottom: 4px !important;
84 .xv-invisible-wrapper {
89 // This gives them 4 lines of description
90 .xv-limit-description {
93 -webkit-line-clamp: 4;
94 -webkit-box-orient: vertical;
98 /* Setting this as min-width overrides enyo-narrow 100% */
99 width: @defaultPanelWidth;
100 // TODO: replace with textured background?
101 background-color: @white;
102 .box-shadow(-2px -2px 6px rgba(0,0,0,0.20));
106 Media query for responsive design. This adapts to smaller
109 @media (max-width: 480px) {
119 margin-bottom: -4px !important;
129 -webkit-overflow-scrolling: touch;
144 .xv-error, .xv-negative {
149 Default button bar with margins and border-radius
161 background: @button-gray;
163 font-size: @buttonFontSize;
165 &[class^="icon-"]:before, &[class*=" icon-"]:before {
166 vertical-align: middle;
170 font-size: @buttonTextFontSize;
173 background: @slate-blue;
188 .xv-parameter-title {
198 background: @header-gray;
202 min-width: @defaultPanelWidth;
206 &.xv-groupbox-popup {
207 .xv-workspace-container > .xv-workspace > .xv-workspace-panel;
218 .xv-my-account-popup {
219 background-color: @white;
226 margin: 0 auto 0 auto;
235 background-color: @white;
237 .xv-groupbox > *:last-child {
247 .xv-comment-box-repeater {
250 .xv-comment-box-label {
256 text-overflow: ellipsis;
258 .xv-comment-box-textblock {
264 /* Resets the margin/padding value for blockquote tag in comments */
266 margin: 0 15px 10px 15px;
271 .icon-folder-open-alt, .icon-calendar, .icon-sort, .icon-angle-up, .icon-angle-down {
273 vertical-align: middle;
286 border: #eee 2px solid;
289 .xv-documents-picker-label {
291 padding: 16px 8px 8px 8px;
295 .xv-documents-picker {
301 // TODO: replace this image with font
304 url(../../../../../../assets/checkbox.png)
316 /* This is for styling the moved items in the more toolbar */
321 .icon-folder-open-alt, .icon-calendar, .icon-sort, .icon-angle-up, .icon-angle-down, .icon-save {
323 vertical-align: middle;
327 height: @toolbarHeight;
329 background: @header-gray;
332 .onyx-icon-button, .onyx-popup-decorator {
340 color: @light-orange;
345 .onyx-popup-decorator {
346 // cancel the margin that
347 // is on the icon if there's a menu
364 .xv-toolbar-label, .xv-search {
365 width: @searchLength;
375 @import "mixins.less";
377 @import "navigator.less";
378 @import "startup.less";
379 @import "workspace.less";
380 @import "model-decorator.less";
381 @import "picker.less";
383 @import "dashboard.less";
385 @import "pullout.less";
386 @import "relations.less";
387 @import "address.less";
388 @import "search.less";