1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
8 box-sizing: border-box;
23 background-color: #000000;
24 font-family: "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
28 body:not(.connected) button.device-action {
37 /********* SIDEBAR ***********/
43 flex-direction: column;
47 background-color: #000000;
49 border-right: 1px solid #9C9CFF;
57 #project-list:not([projects-count="0"]) > #no-project {
62 padding: 100px 20px 0;
69 /********* PROJECT MENU ***********/
74 background-color: #000000;
75 border-top: 1px solid #9C9CFF;
84 background-color: #FFCF00;
88 .project-item:hover strong,
89 .project-item:hover p,
90 .project-item:hover span {
98 .project-item.selected {
99 background-color: #008484;
102 .project-item.selected strong {
106 .project-item.selected p,
107 .project-item.selected span {
112 background-image: url('remove.svg');
113 background-size: 20px;
122 .project-item:hover .button-remove {
126 .project-item-status {
129 border-right: 1px solid #9C9CFF;
132 .project-item-status[status="valid"] {
133 background-color: #008484;
136 .project-item-status[status~="warning"] {
137 background-color: #FFCF00;
140 .project-item-status[status~="error"] {
141 background-color: #FF0000;
152 flex-shrink: 1 !important;
161 text-transform: uppercase;
164 .project-item-description {
169 /********* ADD PROJECT ***********/
171 #new-packaged-project {
172 background-position: calc(100% - 10px) 10px;
175 #new-packaged-project,
176 #new-hosted-project {
177 background-color: #000000;
179 border-top: 1px solid #9C9CFF;
184 #new-packaged-project:hover,
185 #new-hosted-project:hover {
186 background-color: #FFCF00;
190 #new-hosted-project-wrapper {
195 #new-packaged-project,
196 #new-hosted-project-click {
197 background-image: url('plus.svg');
198 background-size: 20px;
199 background-repeat: no-repeat;
203 #new-hosted-project-click {
204 background-position: top right;
215 border: 1px solid #9C9CFF;
221 /********* LENSE ***********/
230 background-color: #000000;
231 background-image: url('rocket.svg');
232 background-repeat: no-repeat, repeat;
233 background-size: 35%, auto;
234 background-position: center center, top left;
240 flex-direction: column;
244 /********* PROJECT ***********/
248 background-color: #000000;
252 flex-direction: column;
266 align-items: flex-start;
267 padding-bottom: 10px;
268 border-bottom: 1px solid #A09090;
272 .project-title > h1 {
281 font-family: monospace;
284 .project-location:hover {
285 text-decoration: underline;
290 border-bottom: 1px solid #A09090;
291 margin: 10px 20px 10px 20px;
292 padding-bottom: 10px;
307 .project-description {
312 .project-status > p {
313 text-transform: uppercase;
321 .project-validation {
327 .project-validation.valid {
328 background-color: #008484;
331 .project-validation.warning {
332 background-color: #FF9F00;
335 .project-validation.error {
336 background-color: #FF0000;
339 [status="valid"] > .project-validation.valid,
340 [status~="warning"] > .project-validation.warning,
341 [status~="error"] > .project-validation.error {
346 /********* PROJECT BUTTONS ***********/
356 .project-buttons > button {
359 border-left-width: 0;
362 -moz-padding-start: .5em;
363 -moz-padding-end: calc(.5em + 1px);
365 border-radius: 300px;
367 background-color: #C09070;
368 text-transform: uppercase;
371 .project-buttons > button:hover:active {
374 -moz-padding-start: calc(.5em + 1px);
375 -moz-padding-end: .5em;
378 .project-buttons > button:not([disabled]):hover {
379 background-color: #FFCF00;
383 .project-buttons > button[disabled] {
384 background-color: #402858;
386 pointer-events: none;
389 .project-buttons > button:first-child {
390 border-left-width: 1px;
393 .project-button-debug {
397 .project-button-debug:hover {
398 background-color: #3498DB;
402 .project-button-debug[disabled] {
406 .project-button-update {
410 .project-button-update:hover {
411 background-color: #777;
415 .project-button-update[disabled] {
421 /********* ERRORS AND WARNINGS ***********/
425 .project-item-warnings,
426 .project-item-errors {
430 [status~="warning"] .project-item-warnings,
431 [status~="error"] .project-item-errors {
432 display: inline-block;
435 [status~="warning"] > .project-warnings,
436 [status~="error"] > .project-errors {
444 font-family: monospace;
449 border-left: 3px solid #9C9CFF;
450 background-color: #FF9F00;
454 border-left: 3px solid #9C9CFF;
455 background-color: #FF0000;
458 .project-item-warnings {
459 background-image: url('warning.svg');
463 .project-item-errors {
464 background-image: url('error.svg');
468 .project-item-warnings,
469 .project-item-errors {
470 background-repeat: no-repeat;
471 background-size: 12px;
472 background-position: left center;
476 .project-item-warnings > span,
477 .project-item-errors > span {
484 /********* MANIFEST EDITOR ***********/
488 flex-direction: column;
490 background-color: #000000;
498 .manifest-header > h2 {
500 margin: 1em 15px 1em 30px;
504 .manifest-header > button {
507 border-right-width: 0;
510 -moz-padding-start: .5em;
511 -moz-padding-end: calc(.5em + 1px);
513 border-radius: 300px;
515 background-color: #C09070;
516 text-transform: uppercase;
520 .manifest-header > button:hover:active {
523 -moz-padding-start: calc(.5em + 1px);
524 -moz-padding-end: .5em;
527 .manifest-header > button:not([disabled]):hover {
528 background-color: #FFCF00;
532 .manifest-header > button[disabled] {
533 background-color: #402858;
535 pointer-events: none;
538 .manifest-header > button:last-child {
539 border-right-width: 1px;
542 [type="packaged"] > .editable {
546 [type="hosted"] > .viewable {
550 .manifest-button-save {
554 .manifest-button-save:hover {
555 background-color: #777;
559 .manifest-button-save[disabled] {
566 border-top: 5px solid #9C9CFF;
569 /* Bug 925921: Remove when the manifest editor is always on */
579 #lense[manifest-editable] .manifest-editor {
583 #lense[manifest-editable] .project-details {
587 /* End blocks to remove */