[Frontend] Messages major work

open #159
open #170
CSS, markup and JS test files initially complete;
Templates renamed for consistency;
message-type icons styled;
Added severity constant "alert";
TO-DO: check refactored CSS against mobile,
see what's broken;
This commit is contained in:
Charles Hacskaylo 2015-10-08 13:09:41 -07:00
parent 0ca9e5c952
commit 0e840ae003
15 changed files with 846 additions and 477 deletions

View File

@ -4,6 +4,7 @@
{
"key": "messageSeverity",
"value": {
"ALERT": "alert",
"ERROR": "error",
"INFO": "info",
"SUCCESS": "success"
@ -44,8 +45,8 @@
"templateUrl": "templates/message.html"
},
{
"key": "message-list",
"templateUrl": "templates/message-list.html"
"key": "overlay-message-list",
"templateUrl": "templates/overlay-message-list.html"
}
],
"containers": [

View File

@ -1,24 +0,0 @@
<mct-container key="overlay" class="t-message severity-{{ngModel.dialog.severity}}">
<div class="abs ui-symbol type-icon message-type">&#xe610;</div>
<div class="abs message-contents">
<div class="abs top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="abs editor">
<ul>
<li ng-repeat="msg in ngModel.dialog.messages">
Message: {{msg.title}}
<mct-include key="'message'" ng-model="msg.ngModel"></mct-include>
</li>
</ul>
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>
</mct-container>

View File

@ -1,22 +1,24 @@
<div class="abs ui-symbol type-icon message-type">!</div>
<div class="abs message-contents">
<div class="abs top-bar">
<div class="title">Title: {{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="abs editor">
<div class="message-action">
{{ngModel.dialog.actionText}}
<div class="l-message message-severity-{{ngModel.dialog.severity}}">
<div class="ui-symbol type-icon message-type"></div>
<div class="message-contents">
<div class="top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint" ng-hide="ngModel.dialog.hint === undefined">{{ngModel.dialog.hint}}</div>
</div>
<div class="message-body">
<div class="message-action">
{{ngModel.dialog.actionText}} message-severity-{{ngModel.dialog.severity}}
</div>
<mct-include key="'progress-bar'"
ng-model="ngModel"
ng-hide="ngModel.dialog.progress === undefined"></mct-include>
</div>
<div class="bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
<mct-include key="'progress-bar'"
ng-model="ngModel"
ng-hide="ngModel.dialog.progress === undefined"></mct-include>
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>

View File

@ -19,7 +19,7 @@
this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information.
-->
<mct-container key="overlay" class="t-message severity-{{ngModel.dialog.severity}}">
<mct-container key="overlay" class="t-message-single">
<mct-include key="'message'" ng-model="ngModel">
</mct-include>
</mct-container>

View File

@ -0,0 +1,25 @@
<mct-container key="overlay" class="t-message-list">
<div class="message-contents">
<div class="abs top-bar">
<div class="title">{{ngModel.dialog.title}}</div>
<div class="hint">Displaying {{ngModel.dialog.messages.length}} message<span ng-show="ngModel.dialog.messages.length > 1">s</span>
</div>
</div>
<div class="abs message-body">
<mct-include ng-repeat="msg in ngModel.dialog.messages" key="'message'" ng-model="msg.ngModel"></mct-include>
<!-- <ul>
<li ng-repeat="msg in ngModel.dialog.messages">
&lt;!&ndash;Message: {{msg.title}}&ndash;&gt;
</li>
</ul>-->
</div>
<div class="abs bottom-bar">
<a ng-repeat="dialogAction in ngModel.dialog.actions"
class="s-btn major"
ng-click="dialogAction.action()">
{{dialogAction.label}}
</a>
</div>
</div>
</mct-container>

View File

@ -176,7 +176,7 @@ define(
/**
* dialogModel: {
* severity: string "error" | "info",
* severity: string "error" | "info" | "alert",
* title: string,
* hint: string,
* actionText: string,
@ -258,9 +258,9 @@ define(
// Add the overlay using the OverlayService, which
// will handle actual insertion into the DOM
this.overlay = this.overlayService.createOverlay(
"message-list",
"overlay-message-list",
{dialog: dialogModel},
"t-dialog t-message-list"
"t-dialog"
);
this.dialogVisible = true;
return true;

View File

@ -47,7 +47,7 @@ $ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px;
// Overlay
$ovrTopBarH: 60px;
$ovrFooterH: 30px;
$ovrFooterH: 24px;
$overlayMargin: 25px;
// Items
$ueBrowseGridItemLg: 200px;

View File

@ -161,18 +161,92 @@
}
}
// Messages in overlays, as singleton or in list
.t-message .overlay {
// Singleton message overlay context
$iconW: 80px;
.type-icon.message-type.abs {
//color: pushBack($colorOvrFg, 40%);
@mixin messageBlock($iconW: 32px) {
.type-icon.message-type {
@include txtShdw($shdwStatusIc);
&:before { content:"\e608"; }
color: $colorStatusDefault;
font-size: $iconW;
opacity: 0.5;
right: auto;
padding-left: 1px;
width: $iconW;
}
.message-contents.abs {
left: $iconW + $overlayMargin;
.message-severity-info .type-icon.message-type {
&:before { content:"\e608"; }
color: $colorStatusOk;
}
.message-severity-alert .type-icon.message-type {
&:before { content:"\e610"; }
color: $colorStatusCaution;
}
.message-severity-error .type-icon.message-type {
&:before { content:"\21"; }
color: $colorStatusAlert;
}
}
/* Paths:
t-dialog | t-dialog-sm > t-message-single | t-message-list > overlay > holder > contents > l-message >
message-type > (icon)
message-contents >
top-bar >
title
hint
editor >
(if displaying list of messages)
ul > li > l-message >
... same as above
bottom-bar
*/
.l-message {
@include display-flex;
@include flex-direction(row);
.type-icon.message-type {
//@include test(red);
@include flex(0 1 auto);
position: relative;
}
.message-contents {
//@include test(blue);
@include flex(1 1 auto);
margin-left: $overlayMargin;
position: relative;
.top-bar,
.message-body {
margin-bottom: $interiorMarginLg * 2;
}
}
}
// Message as singleton
.t-message-single {
@include messageBlock(80px);
}
// Messages in list
.t-message-list {
@include messageBlock(32px);
.message-contents {
.l-message {
//border-bottom: 1px solid pullForward($colorOvrBg, 20%);
@include border-radius($controlCr);
background: rgba($colorOvrFg, 0.1);
margin-bottom: $interiorMargin;
margin-right: $interiorMarginLg;
padding: $interiorMarginLg;
.message-contents {
font-size: 0.9em;
.message-action { color: pushBack($colorOvrFg, 20%); }
.bottom-bar { text-align: left; }
}
.top-bar,
.message-body {
margin-bottom: $interiorMarginLg;
}
}
}
}

View File

@ -52,15 +52,17 @@
}
}
}
.contents .top-bar,
.contents .editor,
.contents .bottom-bar {
//@include test(orange);
top: auto; right: auto; bottom: auto; left: auto;
height: auto; width: auto;
margin-bottom: $interiorMarginLg * 2;
position: relative;
.contents {
.top-bar,
.editor,
.bottom-bar {
//@include test(orange);
top: auto; right: auto; bottom: auto; left: auto;
height: auto; width: auto;
margin-bottom: $interiorMarginLg * 2;
position: relative;
}
}
}
.t-dialog-sm .overlay > .holder {

View File

@ -20,6 +20,7 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
.overlay {
font-size: 90%;
.blocker {
background: $colorOvrBlocker;
z-index: 100;
@ -56,6 +57,12 @@
right: $m;
bottom: $m;
left: $m;
//.top-bar,
//.editor,
//.bottom-bar {
// @include absPosDefault();
//}
}
}
@ -70,11 +77,12 @@
color: pushBack($colorOvrFg, 20%);
}
.top-bar {
.abs.top-bar {
height: $ovrTopBarH;
}
.editor {
.abs.editor,
.abs.message-body {
top: $ovrTopBarH + ($interiorMargin * 2);
bottom: $ovrFooterH + $interiorMargin * 2;
left: 0;
@ -87,23 +95,7 @@
}
}
.l-progress-bar {
$h: $progressBarHOverlay;
display: block;
height: $h;
line-height: $h;
margin: .5em 0;
width: 100%;
}
.bottom-bar {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
//font-size: 1em;
height: $ovrFooterH;
text-align: right;
.s-btn {
$bg: $colorOvrBtnBg;
@ -115,13 +107,30 @@
line-height: $ovrFooterH;
margin-left: $interiorMargin;
padding: 0 $interiorMargin * 3;
//&.major {
// @extend .s-btn.major;
// &:hover {
// @extend .s-btn.major:hover;
// }
//}
&:first-child {
margin-left: 0;
}
}
}
.abs.bottom-bar {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
//font-size: 1em;
height: $ovrFooterH;
}
.l-progress-bar {
$h: $progressBarHOverlay;
display: block;
height: $h;
line-height: $h;
margin: .5em 0;
width: 100%;
}
}

View File

@ -600,10 +600,10 @@ mct-container {
color: #0099cc; }
/* line 34, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.alert {
color: #ff3c00; }
color: #ff533a; }
/* line 36, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.alert:hover {
color: #ff8a66; }
color: #ffaca0; }
/* line 40, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.major {
font-size: 1.65em; }
@ -637,7 +637,7 @@ mct-container {
display: none !important; }
/* line 76, ../../../../general/res/sass/_icons.scss */
.l-icon-alert:before {
color: #ff3c00;
color: #ff533a;
content: "!"; }
/* line 13, ../../../../general/res/sass/_limits.scss */
@ -827,9 +827,9 @@ mct-container {
/* line 150, ../../../../general/res/sass/helpers/_bubbles.scss */
.s-infobubble {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
box-shadow: rgba(0, 0, 0, 0.4) 0 1px 5px;
@ -1198,9 +1198,9 @@ mct-container {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 1.5px;
-webkit-border-radius: 1.5px;
border-radius: 1.5px;
-moz-border-radius: 2.25px;
-webkit-border-radius: 2.25px;
border-radius: 2.25px;
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
-webkit-transition: background-color 0.25s;
@ -1556,9 +1556,9 @@ mct-container {
margin-top: 0; }
/* line 29, ../../../../general/res/sass/controls/_controls.scss */
.accordion .accordion-head {
-moz-border-radius: 1.5px;
-webkit-border-radius: 1.5px;
border-radius: 1.5px;
-moz-border-radius: 2.25px;
-webkit-border-radius: 2.25px;
border-radius: 2.25px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@ -1651,9 +1651,9 @@ label.checkbox.custom {
min-width: 14px; }
/* line 127, ../../../../general/res/sass/controls/_controls.scss */
label.checkbox.custom em:before {
-moz-border-radius: 1.5px;
-webkit-border-radius: 1.5px;
border-radius: 1.5px;
-moz-border-radius: 2.25px;
-webkit-border-radius: 2.25px;
border-radius: 2.25px;
background: #4d4d4d;
-moz-box-shadow: inset rgba(0, 0, 0, 0.4) 0 1px 2px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.4) 0 1px 2px;
@ -1838,24 +1838,24 @@ label.checkbox.custom {
/* line 309, ../../../../general/res/sass/controls/_controls.scss */
.s-progress-bar {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: inset rgba(0, 0, 0, 0.3) 0 1px 4px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.3) 0 1px 4px;
box-shadow: inset rgba(0, 0, 0, 0.3) 0 1px 4px;
background: rgba(0, 0, 0, 0.1); }
/* line 314, ../../../../general/res/sass/controls/_controls.scss */
.s-progress-bar .progress-amt {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: rgba(0, 0, 0, 0.4) 0 0 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 0 3px;
box-shadow: rgba(0, 0, 0, 0.4) 0 0 3px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius: 1px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-transition-property: width;
-o-transition-property: width;
-webkit-transition-property: width;
@ -2165,9 +2165,9 @@ label.checkbox.custom {
position: relative; }
/* line 70, ../../../../general/res/sass/controls/_menus.scss */
.menu-element .menu {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background-color: #6e6e6e;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
@ -2399,10 +2399,10 @@ label.checkbox.custom {
margin-right: 3px; }
/* line 54, ../../../../general/res/sass/controls/_messages.scss */
.status.block.ok .status-indicator {
color: #60e68e; }
color: #44ba53; }
/* line 57, ../../../../general/res/sass/controls/_messages.scss */
.status.block.caution .status-indicator {
color: #ffa864; }
color: #ff8545; }
/* line 60, ../../../../general/res/sass/controls/_messages.scss */
.status.block .label {
-moz-transition-property: max-width;
@ -2446,14 +2446,14 @@ label.checkbox.custom {
/* Styles for messages and message banners */
/* line 84, ../../../../general/res/sass/controls/_messages.scss */
.message.block {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 10px; }
/* line 88, ../../../../general/res/sass/controls/_messages.scss */
.message.error {
background-color: rgba(255, 60, 0, 0.3);
color: #ff8a66; }
background-color: rgba(255, 83, 58, 0.3);
color: #ffaca0; }
/* line 94, ../../../../general/res/sass/controls/_messages.scss */
.l-message-banner {
@ -2548,9 +2548,9 @@ label.checkbox.custom {
color: inherit; }
/* line 147, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner .s-action {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px; }
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px; }
/* line 150, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner .close {
opacity: 0.5; }
@ -2559,40 +2559,145 @@ label.checkbox.custom {
opacity: 1; }
/* line 156, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok {
background-color: #189543;
background-color: #1b4a21;
color: #ccc; }
/* line 28, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok:hover {
background-color: #1ec256; }
background-color: #296f32; }
/* line 31, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok .s-action {
background-color: #11692f; }
background-color: #0d2510; }
/* line 33, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok .s-action:hover {
background-color: #189543; }
background-color: #1b4a21; }
/* line 159, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution {
background-color: #ca5900;
background-color: #ab3b00;
color: #ccc; }
/* line 28, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution:hover {
background-color: #fd6f00; }
background-color: #de4c00; }
/* line 31, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution .s-action {
background-color: #974200; }
background-color: #782900; }
/* line 33, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution .s-action:hover {
background-color: #ca5900; }
background-color: #ab3b00; }
/* line 168, ../../../../general/res/sass/controls/_messages.scss */
.t-message .overlay .type-icon.message-type.abs, .t-message .overlay .s-menu span.type-icon.message-type.l-click-area, .s-menu .t-message .overlay span.type-icon.message-type.l-click-area {
/* Paths:
t-dialog | t-dialog-sm > t-message-single | t-message-list > overlay > holder > contents > l-message >
message-type > (icon)
message-contents >
top-bar >
title
hint
editor >
(if displaying list of messages)
ul > li > l-message >
... same as above
bottom-bar
*/
/* line 201, ../../../../general/res/sass/controls/_messages.scss */
.l-message {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row; }
/* line 204, ../../../../general/res/sass/controls/_messages.scss */
.l-message .type-icon.message-type {
-webkit-flex: 0 1 auto;
flex: 0 1 auto;
position: relative; }
/* line 209, ../../../../general/res/sass/controls/_messages.scss */
.l-message .message-contents {
-webkit-flex: 1 1 auto;
flex: 1 1 auto;
margin-left: 25px;
position: relative; }
/* line 215, ../../../../general/res/sass/controls/_messages.scss */
.l-message .message-contents .top-bar,
.l-message .message-contents .message-body {
margin-bottom: 20px; }
/* line 165, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .type-icon.message-type {
text-shadow: rgba(0, 0, 0, 0.4) 0 1px 2px;
color: #ccc;
font-size: 80px;
opacity: 0.5;
right: auto;
padding-left: 1px;
width: 80px; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message .overlay .message-contents.abs, .t-message .overlay .s-menu span.message-contents.l-click-area, .s-menu .t-message .overlay span.message-contents.l-click-area {
left: 105px; }
/* line 167, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .type-icon.message-type:before {
content: "\e608"; }
/* line 174, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-info .type-icon.message-type {
color: #44ba53; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-info .type-icon.message-type:before {
content: "\e608"; }
/* line 178, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-alert .type-icon.message-type {
color: #ff8545; }
/* line 179, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-alert .type-icon.message-type:before {
content: "\e610"; }
/* line 182, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-error .type-icon.message-type {
color: #ff533a; }
/* line 183, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-error .type-icon.message-type:before {
content: "\21"; }
/* line 165, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .type-icon.message-type {
text-shadow: rgba(0, 0, 0, 0.4) 0 1px 2px;
color: #ccc;
font-size: 32px;
padding-left: 1px;
width: 32px; }
/* line 167, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .type-icon.message-type:before {
content: "\e608"; }
/* line 174, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-info .type-icon.message-type {
color: #44ba53; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-info .type-icon.message-type:before {
content: "\e608"; }
/* line 178, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-alert .type-icon.message-type {
color: #ff8545; }
/* line 179, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-alert .type-icon.message-type:before {
content: "\e610"; }
/* line 182, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-error .type-icon.message-type {
color: #ff533a; }
/* line 183, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-error .type-icon.message-type:before {
content: "\21"; }
/* line 232, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: rgba(230, 230, 230, 0.1);
margin-bottom: 5px;
margin-right: 10px;
padding: 10px; }
/* line 240, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents {
font-size: 0.9em; }
/* line 242, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents .message-action {
color: #b3b3b3; }
/* line 243, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents .bottom-bar {
text-align: left; }
/* line 246, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .top-bar,
.t-message-list .message-contents .l-message .message-body {
margin-bottom: 10px; }
/* line 1, ../../../../general/res/sass/controls/_time-controller.scss */
.l-time-controller {
@ -2749,9 +2854,9 @@ label.checkbox.custom {
*****************************************************************************/
/* line 22, ../../../../general/res/sass/forms/_elems.scss */
.section-header {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: rgba(0, 0, 0, 0.2);
color: #cccccc;
font-size: 0.8em;
@ -2876,9 +2981,9 @@ label.form-control.checkbox input {
vertical-align: top; }
/* line 156, ../../../../general/res/sass/forms/_elems.scss */
.l-result div.s-hint {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
background: rgba(255, 51, 0, 0.8);
display: block;
color: #ffad99;
@ -4100,9 +4205,9 @@ span.req {
visibility: visible; }
/* line 178, ../../../../general/res/sass/search/_search.scss */
.search .active-filter-display {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
@ -4195,152 +4300,166 @@ span.req {
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .blocker {
background: rgba(0, 0, 0, 0.7);
z-index: 100; }
/* line 27, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .clk-icon.close {
font-size: 0.8rem;
position: absolute;
top: 10px;
right: 10px;
bottom: auto;
left: auto;
z-index: 100; }
/* line 36, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder {
background-color: #4d4d4d;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #e6e6e6;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #595959), color-stop(100%, #4d4d4d));
background-image: -moz-linear-gradient(#595959, #4d4d4d);
background-image: -webkit-linear-gradient(#595959, #4d4d4d);
background-image: linear-gradient(#595959, #4d4d4d);
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
color: #e6e6e6;
top: 50%;
right: auto;
bottom: auto;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
height: 70%;
width: 50%;
min-height: 300px;
max-height: 800px;
min-width: 600px;
max-width: 1000px;
z-index: 101; }
/* line 53, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder > .contents {
top: 25px;
right: 25px;
bottom: 25px;
left: 25px; }
/* line 62, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 1.2em;
line-height: 120%;
margin-bottom: 5px; }
/* line 69, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .hint {
color: #b3b3b3; }
/* line 73, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .top-bar {
height: 60px; }
/* line 77, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .editor {
top: 70px;
bottom: 40px;
left: 0;
right: 0;
overflow: auto; }
/* line 22, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay {
font-size: 90%; }
/* line 24, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .blocker {
background: rgba(0, 0, 0, 0.7);
z-index: 100; }
/* line 28, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .clk-icon.close {
font-size: 0.8rem;
position: absolute;
top: 10px;
right: 10px;
bottom: auto;
left: auto;
z-index: 100; }
/* line 37, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder {
background-color: #4d4d4d;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #e6e6e6;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #595959), color-stop(100%, #4d4d4d));
background-image: -moz-linear-gradient(#595959, #4d4d4d);
background-image: -webkit-linear-gradient(#595959, #4d4d4d);
background-image: linear-gradient(#595959, #4d4d4d);
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
border-radius: 9px;
color: #e6e6e6;
top: 50%;
right: auto;
bottom: auto;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
height: 70%;
width: 50%;
min-height: 300px;
max-height: 800px;
min-width: 600px;
max-width: 1000px;
z-index: 101; }
/* line 54, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder > .contents {
top: 25px;
right: 25px;
bottom: 25px;
left: 25px; }
/* line 69, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 1.2em;
line-height: 120%;
margin-bottom: 5px; }
/* line 76, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .hint {
color: #b3b3b3; }
/* line 80, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.top-bar, .overlay .s-menu span.top-bar.l-click-area, .s-menu .overlay span.top-bar.l-click-area {
height: 60px; }
/* line 84, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .editor .field.l-med input[type='text'] {
.overlay .abs.editor, .overlay .s-menu span.editor.l-click-area, .s-menu .overlay span.editor.l-click-area,
.overlay .abs.message-body,
.overlay .s-menu span.message-body.l-click-area,
.s-menu .overlay span.message-body.l-click-area {
top: 70px;
bottom: 34px;
left: 0;
right: 0;
overflow: auto; }
/* line 92, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.editor .field.l-med input[type='text'], .overlay .s-menu span.editor.l-click-area .field.l-med input[type='text'], .s-menu .overlay span.editor.l-click-area .field.l-med input[type='text'],
.overlay .abs.message-body .field.l-med input[type='text'],
.overlay .s-menu span.message-body.l-click-area .field.l-med input[type='text'],
.s-menu .overlay span.message-body.l-click-area .field.l-med input[type='text'] {
width: 100%; }
/* line 98, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar {
text-align: right; }
/* line 100, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn, .overlay .bottom-bar .s-menu {
font-size: 95%;
height: 24px;
line-height: 24px;
margin-left: 5px;
padding: 0 15px; }
/* line 102, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:not(.major), .overlay .bottom-bar .s-menu:not(.major) {
background-color: gray;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhjOGM4YyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #8c8c8c), color-stop(100%, #808080));
background-image: -moz-linear-gradient(#8c8c8c, #808080);
background-image: -webkit-linear-gradient(#8c8c8c, #808080);
background-image: linear-gradient(#8c8c8c, #808080);
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
-moz-transition: background, 0.25s;
-o-transition: background, 0.25s;
-webkit-transition: background, 0.25s;
transition: background, 0.25s;
text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px; }
/* line 289, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major) .icon, .overlay .bottom-bar .s-menu:not(.major) .icon {
color: #fff; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 294, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover {
background: linear-gradient(#a6a6a6, #999999); }
/* line 296, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover > .icon, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover > .icon {
color: white; } }
/* line 110, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:first-child, .overlay .bottom-bar .s-menu:first-child {
margin-left: 0; }
/* line 117, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.bottom-bar, .overlay .s-menu span.bottom-bar.l-click-area, .s-menu .overlay span.bottom-bar.l-click-area {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
height: 24px; }
/* line 127, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .l-progress-bar {
display: block;
height: 15px;
line-height: 15px;
margin: .5em 0;
width: 100%; }
/* line 90, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .l-progress-bar {
display: block;
height: 15px;
line-height: 15px;
margin: .5em 0;
width: 100%; }
/* line 99, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
height: 30px;
text-align: right; }
/* line 108, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn, .overlay .bottom-bar .s-menu {
font-size: 95%;
height: 30px;
line-height: 30px;
margin-left: 5px;
padding: 0 15px; }
/* line 110, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:not(.major), .overlay .bottom-bar .s-menu:not(.major) {
background-color: gray;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhjOGM4YyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #8c8c8c), color-stop(100%, #808080));
background-image: -moz-linear-gradient(#8c8c8c, #808080);
background-image: -webkit-linear-gradient(#8c8c8c, #808080);
background-image: linear-gradient(#8c8c8c, #808080);
-moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
-moz-transition: background, 0.25s;
-o-transition: background, 0.25s;
-webkit-transition: background, 0.25s;
transition: background, 0.25s;
text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px; }
/* line 289, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major) .icon, .overlay .bottom-bar .s-menu:not(.major) .icon {
color: #fff; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 294, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover {
background: linear-gradient(#a6a6a6, #999999); }
/* line 296, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover > .icon, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover > .icon {
color: white; } }
/* line 128, ../../../../general/res/sass/overlay/_overlay.scss */
/* line 137, ../../../../general/res/sass/overlay/_overlay.scss */
.t-dialog-sm .overlay > .holder {
min-height: 275px;
height: 275px; }
@ -4393,7 +4512,7 @@ span.req {
/* line 50, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .editor .form .form-row > .label:after {
float: none; }
/* line 56, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 57, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .contents .top-bar,
.overlay > .holder .contents .editor,
.overlay > .holder .contents .bottom-bar {
@ -4406,12 +4525,12 @@ span.req {
margin-bottom: 20px;
position: relative; }
/* line 66, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 68, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.t-dialog-sm .overlay > .holder {
height: auto;
max-height: 100%; } }
@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
/* line 74, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 76, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .contents .bottom-bar {
text-align: center; } }
/*****************************************************************************
@ -4462,9 +4581,9 @@ ul.tree {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
-webkit-transition: background-color 0.25s;
@ -4524,7 +4643,7 @@ ul.tree {
/* line 90, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon .icon.l-icon-alert,
.search-result-item .label .type-icon .icon.l-icon-alert {
color: #ff3c00;
color: #ff533a;
font-size: 8px;
line-height: 8px;
height: 8px;

View File

@ -8,7 +8,7 @@ $colorKeySelectedBg: #005177;
$colorKeyFg: #fff;
$colorInteriorBorder: rgba($colorBodyFg, 0.1);
$contrastRatioPercent: 7%;
$basicCr: 2px;
$basicCr: 3px;
$controlCr: 3px;
$smallCr: 2px;
@ -23,7 +23,7 @@ $contrastInvokeMenuPercent: 20%;
// General Colors
$colorAlt1: #ffc700;
$colorAlert: #ff3c00;
$colorAlert: #ff533a;
$colorIconLink: #49dedb;
$colorPausedBg: #c56f01;
$colorPausedFg: #fff;
@ -61,13 +61,14 @@ $colorInputIcon: pushBack($colorBodyFg, 15%);
// Status colors, mainly used for messaging and item ancillary symbols
$colorStatusFg: #ccc;
$colorStatusDefault: #ccc;
$colorStatusOk: #60e68e;
$colorStatusCaution: #ffa864;
$colorStatusOk: #44ba53;
$colorStatusCaution: #ff8545;
$colorStatusAlert: $colorAlert;
$colorProgressBarOuter: rgba(#000, 0.1);
$colorProgressBarAmt: $colorKey;
$progressBarHOverlay: 15px;
$progressBarStripeW: 20px;
$shdwStatusIc: rgba(black, 0.4) 0 1px 2px;
// Selects
$colorSelectBg: $colorBtnBg;

View File

@ -600,10 +600,10 @@ mct-container {
color: #0099cc; }
/* line 34, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.alert {
color: #ff3c00; }
color: #ff533a; }
/* line 36, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.alert:hover {
color: #ff8a66; }
color: #ffaca0; }
/* line 40, ../../../../general/res/sass/_icons.scss */
.ui-symbol.icon.major {
font-size: 1.65em; }
@ -637,7 +637,7 @@ mct-container {
display: none !important; }
/* line 76, ../../../../general/res/sass/_icons.scss */
.l-icon-alert:before {
color: #ff3c00;
color: #ff533a;
content: "!"; }
/* line 13, ../../../../general/res/sass/_limits.scss */
@ -2347,10 +2347,10 @@ label.checkbox.custom {
margin-right: 3px; }
/* line 54, ../../../../general/res/sass/controls/_messages.scss */
.status.block.ok .status-indicator {
color: #60e68e; }
color: #44ba53; }
/* line 57, ../../../../general/res/sass/controls/_messages.scss */
.status.block.caution .status-indicator {
color: #ffa864; }
color: #ff8545; }
/* line 60, ../../../../general/res/sass/controls/_messages.scss */
.status.block .label {
-moz-transition-property: max-width;
@ -2400,8 +2400,8 @@ label.checkbox.custom {
padding: 10px; }
/* line 88, ../../../../general/res/sass/controls/_messages.scss */
.message.error {
background-color: rgba(255, 60, 0, 0.3);
color: #ff8a66; }
background-color: rgba(255, 83, 58, 0.3);
color: #ffaca0; }
/* line 94, ../../../../general/res/sass/controls/_messages.scss */
.l-message-banner {
@ -2507,40 +2507,145 @@ label.checkbox.custom {
opacity: 1; }
/* line 156, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok {
background-color: #189543;
background-color: #1b4a21;
color: #fff; }
/* line 28, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok:hover {
background-color: #1ec256; }
background-color: #296f32; }
/* line 31, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok .s-action {
background-color: #11692f; }
background-color: #0d2510; }
/* line 33, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.ok .s-action:hover {
background-color: #189543; }
background-color: #1b4a21; }
/* line 159, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution {
background-color: #ca5900;
background-color: #ab3b00;
color: #fff; }
/* line 28, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution:hover {
background-color: #fd6f00; }
background-color: #de4c00; }
/* line 31, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution .s-action {
background-color: #974200; }
background-color: #782900; }
/* line 33, ../../../../general/res/sass/controls/_messages.scss */
.s-message-banner.caution .s-action:hover {
background-color: #ca5900; }
background-color: #ab3b00; }
/* line 168, ../../../../general/res/sass/controls/_messages.scss */
.t-message .overlay .type-icon.message-type.abs, .t-message .overlay .s-menu span.type-icon.message-type.l-click-area, .s-menu .t-message .overlay span.type-icon.message-type.l-click-area {
/* Paths:
t-dialog | t-dialog-sm > t-message-single | t-message-list > overlay > holder > contents > l-message >
message-type > (icon)
message-contents >
top-bar >
title
hint
editor >
(if displaying list of messages)
ul > li > l-message >
... same as above
bottom-bar
*/
/* line 201, ../../../../general/res/sass/controls/_messages.scss */
.l-message {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
flex-direction: row; }
/* line 204, ../../../../general/res/sass/controls/_messages.scss */
.l-message .type-icon.message-type {
-webkit-flex: 0 1 auto;
flex: 0 1 auto;
position: relative; }
/* line 209, ../../../../general/res/sass/controls/_messages.scss */
.l-message .message-contents {
-webkit-flex: 1 1 auto;
flex: 1 1 auto;
margin-left: 25px;
position: relative; }
/* line 215, ../../../../general/res/sass/controls/_messages.scss */
.l-message .message-contents .top-bar,
.l-message .message-contents .message-body {
margin-bottom: 20px; }
/* line 165, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .type-icon.message-type {
text-shadow: rgba(255, 255, 255, 0.8) 0 0px 5px;
color: #ccc;
font-size: 80px;
opacity: 0.5;
right: auto;
padding-left: 1px;
width: 80px; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message .overlay .message-contents.abs, .t-message .overlay .s-menu span.message-contents.l-click-area, .s-menu .t-message .overlay span.message-contents.l-click-area {
left: 105px; }
/* line 167, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .type-icon.message-type:before {
content: "\e608"; }
/* line 174, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-info .type-icon.message-type {
color: #44ba53; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-info .type-icon.message-type:before {
content: "\e608"; }
/* line 178, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-alert .type-icon.message-type {
color: #ff8545; }
/* line 179, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-alert .type-icon.message-type:before {
content: "\e610"; }
/* line 182, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-error .type-icon.message-type {
color: #ff533a; }
/* line 183, ../../../../general/res/sass/controls/_messages.scss */
.t-message-single .message-severity-error .type-icon.message-type:before {
content: "\21"; }
/* line 165, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .type-icon.message-type {
text-shadow: rgba(255, 255, 255, 0.8) 0 0px 5px;
color: #ccc;
font-size: 32px;
padding-left: 1px;
width: 32px; }
/* line 167, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .type-icon.message-type:before {
content: "\e608"; }
/* line 174, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-info .type-icon.message-type {
color: #44ba53; }
/* line 175, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-info .type-icon.message-type:before {
content: "\e608"; }
/* line 178, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-alert .type-icon.message-type {
color: #ff8545; }
/* line 179, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-alert .type-icon.message-type:before {
content: "\e610"; }
/* line 182, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-error .type-icon.message-type {
color: #ff533a; }
/* line 183, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-severity-error .type-icon.message-type:before {
content: "\21"; }
/* line 232, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message {
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background: rgba(102, 102, 102, 0.1);
margin-bottom: 5px;
margin-right: 10px;
padding: 10px; }
/* line 240, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents {
font-size: 0.9em; }
/* line 242, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents .message-action {
color: #999999; }
/* line 243, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .message-contents .bottom-bar {
text-align: left; }
/* line 246, ../../../../general/res/sass/controls/_messages.scss */
.t-message-list .message-contents .l-message .top-bar,
.t-message-list .message-contents .l-message .message-body {
margin-bottom: 10px; }
/* line 1, ../../../../general/res/sass/controls/_time-controller.scss */
.l-time-controller {
@ -4127,134 +4232,148 @@ span.req {
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 23, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .blocker {
background: rgba(0, 0, 0, 0.7);
z-index: 100; }
/* line 27, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .clk-icon.close {
font-size: 0.8rem;
position: absolute;
top: 10px;
right: 10px;
bottom: auto;
left: auto;
z-index: 100; }
/* line 36, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder {
background-color: #fcfcfc;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #666;
display: inline-block;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;
color: #666;
top: 50%;
right: auto;
bottom: auto;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
height: 70%;
width: 50%;
min-height: 300px;
max-height: 800px;
min-width: 600px;
max-width: 1000px;
z-index: 101; }
/* line 53, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder > .contents {
top: 25px;
right: 25px;
bottom: 25px;
left: 25px; }
/* line 62, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 1.2em;
line-height: 120%;
margin-bottom: 5px; }
/* line 69, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .hint {
color: #999999; }
/* line 73, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .top-bar {
height: 60px; }
/* line 77, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .editor {
top: 70px;
bottom: 40px;
left: 0;
right: 0;
overflow: auto; }
/* line 22, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay {
font-size: 90%; }
/* line 24, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .blocker {
background: rgba(0, 0, 0, 0.7);
z-index: 100; }
/* line 28, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .clk-icon.close {
font-size: 0.8rem;
position: absolute;
top: 10px;
right: 10px;
bottom: auto;
left: auto;
z-index: 100; }
/* line 37, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder {
background-color: #fcfcfc;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #666;
display: inline-block;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;
color: #666;
top: 50%;
right: auto;
bottom: auto;
left: 50%;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
height: 70%;
width: 50%;
min-height: 300px;
max-height: 800px;
min-width: 600px;
max-width: 1000px;
z-index: 101; }
/* line 54, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay > .holder > .contents {
top: 25px;
right: 25px;
bottom: 25px;
left: 25px; }
/* line 69, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .title {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 1.2em;
line-height: 120%;
margin-bottom: 5px; }
/* line 76, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .hint {
color: #999999; }
/* line 80, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.top-bar, .overlay .s-menu span.top-bar.l-click-area, .s-menu .overlay span.top-bar.l-click-area {
height: 60px; }
/* line 84, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .editor .field.l-med input[type='text'] {
.overlay .abs.editor, .overlay .s-menu span.editor.l-click-area, .s-menu .overlay span.editor.l-click-area,
.overlay .abs.message-body,
.overlay .s-menu span.message-body.l-click-area,
.s-menu .overlay span.message-body.l-click-area {
top: 70px;
bottom: 34px;
left: 0;
right: 0;
overflow: auto; }
/* line 92, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.editor .field.l-med input[type='text'], .overlay .s-menu span.editor.l-click-area .field.l-med input[type='text'], .s-menu .overlay span.editor.l-click-area .field.l-med input[type='text'],
.overlay .abs.message-body .field.l-med input[type='text'],
.overlay .s-menu span.message-body.l-click-area .field.l-med input[type='text'],
.s-menu .overlay span.message-body.l-click-area .field.l-med input[type='text'] {
width: 100%; }
/* line 98, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar {
text-align: right; }
/* line 100, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn, .overlay .bottom-bar .s-menu {
font-size: 95%;
height: 24px;
line-height: 24px;
margin-left: 5px;
padding: 0 15px; }
/* line 102, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:not(.major), .overlay .bottom-bar .s-menu:not(.major) {
background-color: #969696;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
display: inline-block;
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
-moz-transition: background, 0.25s;
-o-transition: background, 0.25s;
-webkit-transition: background, 0.25s;
transition: background, 0.25s;
text-shadow: none; }
/* line 289, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major) .icon, .overlay .bottom-bar .s-menu:not(.major) .icon {
color: #fff; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 294, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover {
background: #7d7d7d; }
/* line 296, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover > .icon, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover > .icon {
color: white; } }
/* line 110, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:first-child, .overlay .bottom-bar .s-menu:first-child {
margin-left: 0; }
/* line 117, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .abs.bottom-bar, .overlay .s-menu span.bottom-bar.l-click-area, .s-menu .overlay span.bottom-bar.l-click-area {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
height: 24px; }
/* line 127, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .l-progress-bar {
display: block;
height: 15px;
line-height: 15px;
margin: .5em 0;
width: 100%; }
/* line 90, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .l-progress-bar {
display: block;
height: 15px;
line-height: 15px;
margin: .5em 0;
width: 100%; }
/* line 99, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar {
top: auto;
right: 0;
bottom: 0;
left: 0;
overflow: visible;
height: 30px;
text-align: right; }
/* line 108, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn, .overlay .bottom-bar .s-menu {
font-size: 95%;
height: 30px;
line-height: 30px;
margin-left: 5px;
padding: 0 15px; }
/* line 110, ../../../../general/res/sass/overlay/_overlay.scss */
.overlay .bottom-bar .s-btn:not(.major), .overlay .bottom-bar .s-menu:not(.major) {
background-color: #969696;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #fff;
display: inline-block;
-moz-user-select: -moz-none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
-moz-transition: background, 0.25s;
-o-transition: background, 0.25s;
-webkit-transition: background, 0.25s;
transition: background, 0.25s;
text-shadow: none; }
/* line 289, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major) .icon, .overlay .bottom-bar .s-menu:not(.major) .icon {
color: #fff; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 294, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover {
background: #7d7d7d; }
/* line 296, ../../../../general/res/sass/_mixins.scss */
.overlay .bottom-bar .s-btn:not(.major):not(.disabled):hover > .icon, .overlay .bottom-bar .s-menu:not(.major):not(.disabled):hover > .icon {
color: white; } }
/* line 128, ../../../../general/res/sass/overlay/_overlay.scss */
/* line 137, ../../../../general/res/sass/overlay/_overlay.scss */
.t-dialog-sm .overlay > .holder {
min-height: 275px;
height: 275px; }
@ -4307,7 +4426,7 @@ span.req {
/* line 50, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .editor .form .form-row > .label:after {
float: none; }
/* line 56, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 57, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .contents .top-bar,
.overlay > .holder .contents .editor,
.overlay > .holder .contents .bottom-bar {
@ -4320,12 +4439,12 @@ span.req {
margin-bottom: 20px;
position: relative; }
/* line 66, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 68, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.t-dialog-sm .overlay > .holder {
height: auto;
max-height: 100%; } }
@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
/* line 74, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
/* line 76, ../../../../general/res/sass/mobile/overlay/_overlay.scss */
.overlay > .holder .contents .bottom-bar {
text-align: center; } }
/*****************************************************************************
@ -4437,7 +4556,7 @@ ul.tree {
/* line 90, ../../../../general/res/sass/tree/_tree.scss */
.tree-item .label .type-icon .icon.l-icon-alert,
.search-result-item .label .type-icon .icon.l-icon-alert {
color: #ff3c00;
color: #ff533a;
font-size: 8px;
line-height: 8px;
height: 8px;

View File

@ -23,7 +23,7 @@ $contrastInvokeMenuPercent: 40%;
// General Colors
$colorAlt1: #ff6600;
$colorAlert: #ff3c00;
$colorAlert: #ff533a;
$colorIconLink: #49dedb;
$colorPausedBg: #ff9900;
$colorPausedFg: #fff;
@ -61,13 +61,14 @@ $colorInputIcon: pushBack($colorBodyFg, 25%);
// Status colors, mainly used for messaging and item ancillary symbols
$colorStatusFg: #fff;
$colorStatusDefault: #ccc;
$colorStatusOk: #60e68e;
$colorStatusCaution: #ffa864;
$colorStatusOk: #44ba53;
$colorStatusCaution: #ff8545;
$colorStatusAlert: $colorAlert;
$colorProgressBarOuter: rgba(#000, 0.1);
$colorProgressBarAmt: #0a0;
$progressBarHOverlay: 15px;
$progressBarStripeW: 20px;
$shdwStatusIc: rgba(white, 0.8) 0 0px 5px;
// Selects
$colorSelectBg: #ddd;

View File

@ -115,31 +115,71 @@ define(
],
messages: []
};
function getExampleActionText() {
var actionTexts = [
"Adipiscing turpis mauris in enim elementu hac, enim aliquam etiam.",
"Eros turpis, pulvinar turpis eros eu",
"Lundium nascetur a, lectus montes ac, parturient in natoque, duis risus risus pulvinar pid rhoncus, habitasse auctor natoque!"
];
return actionTexts[Math.floor(Math.random()*3)];
}
function getExampleActions() {
var actions = [
{
label: "Try Again",
action: function () {
$log.debug("Try Again pressed");
}
},
{
label: "Remove",
action: function () {
$log.debug("Remove pressed");
}
},
{
label: "Cancel",
action: function () {
$log.debug("Cancel pressed");
}
}
];
// Randomly remove some actions off the top; leave at least one
actions.splice(0,Math.floor(Math.random() * actions.length));
return actions;
}
function getExampleSeverity() {
var severities = [
messageSeverity.INFO,
messageSeverity.ALERT,
messageSeverity.ERROR
];
return severities[Math.floor(Math.random() * severities.length)];
}
function createMessage (messageNumber) {
var messageModel = {
ngModel: {
dialog: {
title: "Message " + messageNumber,
severity: messageSeverity.INFO,
actions: [
{
label: "Cancel Duplication",
action: function () {
$log.debug("Cancel Duplication pressed");
$log.debug("Message should be dismissed");
}
}
]
ngModel: {
dialog: {
title: "Message Title " + messageNumber,
actionText: getExampleActionText(),
severity: getExampleSeverity(),
actions: getExampleActions()
}
}
}
};
return messageModel;
}
if (dialogService.showMessageList(model)) {
//Do processing here
for (var i = 0; i < 4; i++) {
for (var i = 0; i < 10; i++) {
model.messages.push(createMessage(i));
}
} else {