ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-04-09 04:14:32 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Fronted] Significant refactoring of btn classes

Browse Source 
WTD-839
Refactoring in advance of style mods to switcher when in frame;
Moved btn styles from _controls.scss to _buttons.scss;
Markup cleaned up with css classing simplified;
This commit is contained in:
Charles Hacskaylo 2015-06-10 17:23:08 -07:00
parent 5219105887
commit 0b8d5ceb86
11 changed files with 356 additions and 368 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
platform/commonUI/browse/res/templates/browse-object.html
View File

@ -21,14 +21,12 @@
-->
<span>
<div class="object-browse-bar bar abs">
<div class="items-select left abs">
<mct-representation key="'object-header'" mct-object="domainObject">
</mct-representation>
</div>
<div class="view-controls sort-controls btn-bar right abs">
<mct-representation key="'action-group'"
mct-object="domainObject"
parameters="{ category: 'view-control' }">
@ -39,7 +37,6 @@
ng-model="representation">
</mct-representation>
</div>
</div>
<div class='object-holder abs vscroll'>

2
platform/commonUI/browse/res/templates/browse/object-header.html
View File

@ -24,5 +24,5 @@
<span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span>
<span class='type'>{{type.getName()}}</span>
<span class='title'>{{model.name}}</span>
<a id='actions-menu' class='ui-symbol invoke-menu' onclick="alert('Not yet functional. This will display a dropdown menu of options for this object.');">v</a>
<!--a id='actions-menu' class='ui-symbol invoke-menu' onclick="alert('Not yet functional. This will display a dropdown menu of options for this object.');">v</a-->
</div>

2
platform/commonUI/browse/res/templates/create/create-button.html
View File

@ -21,7 +21,7 @@
-->
<div class="menu-element wrapper" ng-controller="ClickAwayController as createController">
<div class="btn btn-menu create-btn major" ng-click="createController.toggle()">
<span class='ui-symbol major' href=''>+</span> Create<!--span class='ui-symbol invoke-menu'>v</span-->
<span class='ui-symbol' href=''>+</span> Create
</div>
<div class="menu dropdown super-menu" ng-show="createController.isActive()">
<mct-representation mct-object="domainObject" key="'create-menu'">

2
platform/commonUI/dialog/res/templates/overlay.html
View File

@ -25,7 +25,7 @@
<a href=""
ng-click="ngModel.cancel()"
ng-if="ngModel.cancel"
class="btn normal outline ui-symbol close">
class="btn normal ui-symbol close">
x
</a>
<div class="abs contents" ng-transclude>

2
platform/commonUI/edit/res/templates/topbar-edit.html
View File

@ -33,8 +33,6 @@
<mct-representation key="'edit-action-buttons'"
mct-object="domainObject"
class='conclude-editing'>
<!--a class='btn major' href=''>Save<span id='save-actions-menu' class='ui-symbol invoke-menu'>v</span></a>
<a class='btn subtle' href=''>Cancel</a-->
</mct-representation>
</div>
</div>

550
platform/commonUI/general/res/css/theme-espresso.css
View File

@ -368,7 +368,7 @@ span {
display: none !important; }
/* line 121, ../sass/_global.scss */
.paused:not(.s-btn):not(.s-icon-btn) {
.paused:not(.s-btn):not(.icon-btn) {
border-color: #c56f01 !important;
color: #c56f01 !important; }
@ -856,7 +856,8 @@ span {
.s-about .s-logo-openmctweb {
background-image: url("../images/logo-openmctweb-shdw.svg"); }
/* line 81, ../sass/_about.scss */
.s-about .s-btn, .s-about .s-icon-btn {
.s-about .s-btn, .s-about .icon-btn,
.s-about .s-icon-btn {
line-height: 2em; }
/* line 85, ../sass/_about.scss */
.s-about .l-licenses-software .l-license-software {
@ -1338,14 +1339,43 @@ span {
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/*********************************** TYPE STYLES */
/* line 25, ../sass/controls/_buttons.scss */
.t-btn {
cursor: pointer; }
/******* LAYOUT AND SIZING */
/* line 26, ../sass/controls/_buttons.scss */
.btn,
.l-btn {
line-height: 1.2em;
padding: 0 7.5px;
text-decoration: none; }
/* line 31, ../sass/controls/_buttons.scss */
.btn.lg, .btn.create-btn,
.l-btn.lg,
.l-btn.create-btn {
height: 25px;
line-height: 25px;
padding: 0 22.5px; }
/* line 39, ../sass/controls/_buttons.scss */
.btn.create-btn .menu,
.l-btn.create-btn .menu {
margin-left: -7.5px; }
/* line 42, ../sass/controls/_buttons.scss */
.btn.create-btn > .ui-symbol,
.l-btn.create-btn > .ui-symbol {
font-size: 1.1em; }
/* line 46, ../sass/controls/_buttons.scss */
.btn.sm,
.l-btn.sm {
padding: 0 5px; }
/* line 49, ../sass/controls/_buttons.scss */
.btn.vsm,
.l-btn.vsm {
padding: 0 2.5px; }
/*********************************** STYLE STYLES */
/* line 30, ../sass/controls/_buttons.scss */
.s-btn, .s-icon-btn {
/* line 55, ../sass/controls/_buttons.scss */
.btn,
.s-btn,
.icon-btn,
.s-icon-btn {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
@ -1353,10 +1383,141 @@ span {
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px;
line-height: 1.2em;
cursor: pointer;
text-decoration: none; }
/* line 36, ../sass/controls/_buttons.scss */
.s-btn.s-very-subtle, .s-very-subtle.s-icon-btn {
/* line 63, ../sass/controls/_buttons.scss */
.btn.major,
.s-btn.major,
.major.icon-btn,
.major.s-icon-btn {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYWNlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #00bfff), color-stop(100%, #00ace6));
background-image: -moz-linear-gradient(#00bfff, #00ace6);
background-image: -webkit-linear-gradient(#00bfff, #00ace6);
background-image: linear-gradient(#00bfff, #00ace6);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #33ccff;
color: #999;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMzY2NmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwOTljYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #33ccff), color-stop(100%, #0099cc));
background-image: -moz-linear-gradient(#33ccff, #0099cc);
background-image: -webkit-linear-gradient(#33ccff, #0099cc);
background-image: linear-gradient(#33ccff, #0099cc);
color: #ccf2ff; }
/* line 197, ../sass/_mixins.scss */
.btn.major:not(.disabled):hover,
.s-btn.major:not(.disabled):hover,
.major.icon-btn:not(.disabled):hover,
.major.s-icon-btn:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #66d9ff), color-stop(100%, #00bfff));
background-image: -moz-linear-gradient(#66d9ff, #00bfff);
background-image: -webkit-linear-gradient(#66d9ff, #00bfff);
background-image: linear-gradient(#66d9ff, #00bfff); }
/* line 68, ../sass/controls/_buttons.scss */
.btn.major:hover,
.s-btn.major:hover,
.major.icon-btn:hover,
.major.s-icon-btn:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ac6ff), color-stop(100%, #00bfff));
background-image: -moz-linear-gradient(#1ac6ff, #00bfff);
background-image: -webkit-linear-gradient(#1ac6ff, #00bfff);
background-image: linear-gradient(#1ac6ff, #00bfff);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #4dd2ff;
color: #999;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkZDJmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYWNlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4dd2ff), color-stop(100%, #00ace6));
background-image: -moz-linear-gradient(#4dd2ff, #00ace6);
background-image: -webkit-linear-gradient(#4dd2ff, #00ace6);
background-image: linear-gradient(#4dd2ff, #00ace6);
color: #ccf2ff; }
/* line 197, ../sass/_mixins.scss */
.btn.major:hover:not(.disabled):hover,
.s-btn.major:hover:not(.disabled):hover,
.major.icon-btn:hover:not(.disabled):hover,
.major.s-icon-btn:hover:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwZGZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #80dfff), color-stop(100%, #1ac6ff));
background-image: -moz-linear-gradient(#80dfff, #1ac6ff);
background-image: -webkit-linear-gradient(#80dfff, #1ac6ff);
background-image: linear-gradient(#80dfff, #1ac6ff); }
/* line 72, ../sass/controls/_buttons.scss */
.btn.major .invoke-menu,
.s-btn.major .invoke-menu,
.major.icon-btn .invoke-menu,
.major.s-icon-btn .invoke-menu {
color: #ccf2ff; }
/* line 76, ../sass/controls/_buttons.scss */
.btn.subtle,
.s-btn.subtle,
.subtle.icon-btn,
.subtle.s-icon-btn {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #808080), color-stop(100%, #737373));
background-image: -moz-linear-gradient(#808080, #737373);
background-image: -webkit-linear-gradient(#808080, #737373);
background-image: linear-gradient(#808080, #737373);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #999999;
color: #cccccc;
display: inline-block; }
/* line 189, ../sass/_mixins.scss */
.btn.subtle:not(.disabled):hover,
.s-btn.subtle:not(.disabled):hover,
.subtle.icon-btn:not(.disabled):hover,
.subtle.s-icon-btn:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk5OTk5OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #999999), color-stop(100%, #808080));
background-image: -moz-linear-gradient(#999999, #808080);
background-image: -webkit-linear-gradient(#999999, #808080);
background-image: linear-gradient(#999999, #808080); }
/* line 79, ../sass/controls/_buttons.scss */
.btn.very-subtle, .btn.s-very-subtle,
.s-btn.very-subtle,
.very-subtle.icon-btn,
.very-subtle.s-icon-btn,
.s-btn.s-very-subtle,
.s-very-subtle.icon-btn,
.s-very-subtle.s-icon-btn {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d4d4d), color-stop(100%, #404040));
@ -1377,15 +1538,27 @@ span {
color: #999;
display: inline-block; }
/* line 144, ../sass/_mixins.scss */
.s-btn.s-very-subtle:hover, .s-very-subtle.s-icon-btn:hover {
.btn.very-subtle:hover, .btn.s-very-subtle:hover,
.s-btn.very-subtle:hover,
.very-subtle.icon-btn:hover,
.very-subtle.s-icon-btn:hover,
.s-btn.s-very-subtle:hover,
.s-very-subtle.icon-btn:hover,
.s-very-subtle.s-icon-btn:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #666666), color-stop(100%, #595959));
background-image: -moz-linear-gradient(#666666, #595959);
background-image: -webkit-linear-gradient(#666666, #595959);
background-image: linear-gradient(#666666, #595959); }
/* line 38, ../sass/controls/_buttons.scss */
.s-btn.s-very-subtle.paused, .s-very-subtle.paused.s-icon-btn {
/* line 82, ../sass/controls/_buttons.scss */
.btn.very-subtle.paused, .btn.s-very-subtle.paused,
.s-btn.very-subtle.paused,
.very-subtle.paused.icon-btn,
.very-subtle.paused.s-icon-btn,
.s-btn.s-very-subtle.paused,
.s-very-subtle.paused.icon-btn,
.s-very-subtle.paused.s-icon-btn {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y4OGMwMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2RlN2QwMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f88c01), color-stop(100%, #de7d01));
@ -1406,39 +1579,59 @@ span {
color: #fff;
display: inline-block; }
/* line 144, ../sass/_mixins.scss */
.s-btn.s-very-subtle.paused:hover, .s-very-subtle.paused.s-icon-btn:hover {
.btn.very-subtle.paused:hover, .btn.s-very-subtle.paused:hover,
.s-btn.very-subtle.paused:hover,
.very-subtle.paused.icon-btn:hover,
.very-subtle.paused.s-icon-btn:hover,
.s-btn.s-very-subtle.paused:hover,
.s-very-subtle.paused.icon-btn:hover,
.s-very-subtle.paused.s-icon-btn:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlYTMyZSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZlOTgxNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fea32e), color-stop(100%, #fe9815));
background-image: -moz-linear-gradient(#fea32e, #fe9815);
background-image: -webkit-linear-gradient(#fea32e, #fe9815);
background-image: linear-gradient(#fea32e, #fe9815); }
/* line 40, ../sass/controls/_buttons.scss */
.s-btn.s-very-subtle.paused .icon:before, .s-very-subtle.paused.s-icon-btn .icon:before {
/* line 84, ../sass/controls/_buttons.scss */
.btn.very-subtle.paused .icon:before, .btn.s-very-subtle.paused .icon:before,
.s-btn.very-subtle.paused .icon:before,
.very-subtle.paused.icon-btn .icon:before,
.very-subtle.paused.s-icon-btn .icon:before,
.s-btn.s-very-subtle.paused .icon:before,
.s-very-subtle.paused.icon-btn .icon:before,
.s-very-subtle.paused.s-icon-btn .icon:before {
content: "\0000EF"; }
/* line 47, ../sass/controls/_buttons.scss */
/* line 91, ../sass/controls/_buttons.scss */
.icon-btn,
.s-icon-btn {
font-size: 1.2em; }
/* line 50, ../sass/controls/_buttons.scss */
font-size: 1em; }
/* line 95, ../sass/controls/_buttons.scss */
.icon-btn .icon,
.s-icon-btn .icon {
color: #0099cc; }
/* line 54, ../sass/controls/_buttons.scss */
/* line 99, ../sass/controls/_buttons.scss */
.icon-btn.paused .icon,
.s-icon-btn.paused .icon {
color: #fff; }
/* line 62, ../sass/controls/_buttons.scss */
/* line 107, ../sass/controls/_buttons.scss */
.icon-btn:not(.disabled):not(.paused):hover .icon,
.s-icon-btn:not(.disabled):not(.paused):hover .icon {
color: #33ccff; }
/* line 69, ../sass/controls/_buttons.scss */
/* line 114, ../sass/controls/_buttons.scss */
.icon-btn.labeled,
.s-icon-btn.labeled {
padding: 0 3.75px; }
/* line 71, ../sass/controls/_buttons.scss */
/* line 116, ../sass/controls/_buttons.scss */
.icon-btn.labeled .icon,
.s-icon-btn.labeled .icon {
font-size: 1.5em; }
/* line 74, ../sass/controls/_buttons.scss */
/* line 119, ../sass/controls/_buttons.scss */
.icon-btn.labeled .title-label,
.s-icon-btn.labeled .title-label {
margin-left: 5px; }
/* line 80, ../sass/controls/_buttons.scss */
/* line 125, ../sass/controls/_buttons.scss */
.icon-btn.pause-play.paused,
.s-icon-btn.pause-play.paused {
-moz-animation-name: pulse;
-webkit-animation-name: pulse;
@ -1455,31 +1648,27 @@ span {
-moz-animation-timing-function: ease-in-out;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out; }
/* line 83, ../sass/controls/_buttons.scss */
/* line 128, ../sass/controls/_buttons.scss */
.icon-btn.pause-play .icon:before,
.s-icon-btn.pause-play .icon:before {
content: "\0000F1"; }
/* line 89, ../sass/controls/_buttons.scss */
/* line 134, ../sass/controls/_buttons.scss */
.icon-btn.show-thumbs .icon:before,
.s-icon-btn.show-thumbs .icon:before {
content: "\000039"; }
/*********************************** LAYOUT STYLES */
/* line 96, ../sass/controls/_buttons.scss */
/* line 141, ../sass/controls/_buttons.scss */
span.btn,
span.btn span,
span.l-btn,
span.l-btn span,
a.btn,
a.btn span,
a.l-btn,
a.l-btn span {
display: inline-block; }
/* line 103, ../sass/controls/_buttons.scss */
.l-btn {
padding: 0 7.5px; }
/* line 105, ../sass/controls/_buttons.scss */
.l-btn.sm {
padding: 0 5px; }
/* line 108, ../sass/controls/_buttons.scss */
.l-btn.vsm {
padding: 0 2.5px; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
@ -1658,195 +1847,20 @@ a.l-btn span {
overflow-y: auto;
overflow-x: hidden; }
/* line 95, ../sass/controls/_controls.scss */
.btn {
-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;
text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px;
padding: 0 10px;
text-decoration: none; }
/* line 105, ../sass/controls/_controls.scss */
.btn.create-btn {
height: 25px;
line-height: 25px;
padding: 0 22.5px; }
/* line 112, ../sass/controls/_controls.scss */
.btn.create-btn .menu {
margin-left: -22.5px; }
/* line 115, ../sass/controls/_controls.scss */
.btn.create-btn .ui-symbol.major {
font-size: 1.1em; }
/* line 119, ../sass/controls/_controls.scss */
.btn.major {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYWNlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #00bfff), color-stop(100%, #00ace6));
background-image: -moz-linear-gradient(#00bfff, #00ace6);
background-image: -webkit-linear-gradient(#00bfff, #00ace6);
background-image: linear-gradient(#00bfff, #00ace6);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #33ccff;
color: #999;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzMzY2NmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwOTljYyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #33ccff), color-stop(100%, #0099cc));
background-image: -moz-linear-gradient(#33ccff, #0099cc);
background-image: -webkit-linear-gradient(#33ccff, #0099cc);
background-image: linear-gradient(#33ccff, #0099cc);
color: #ccf2ff; }
/* line 197, ../sass/_mixins.scss */
.btn.major:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #66d9ff), color-stop(100%, #00bfff));
background-image: -moz-linear-gradient(#66d9ff, #00bfff);
background-image: -webkit-linear-gradient(#66d9ff, #00bfff);
background-image: linear-gradient(#66d9ff, #00bfff); }
/* line 124, ../sass/controls/_controls.scss */
.btn.major:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1ac6ff), color-stop(100%, #00bfff));
background-image: -moz-linear-gradient(#1ac6ff, #00bfff);
background-image: -webkit-linear-gradient(#1ac6ff, #00bfff);
background-image: linear-gradient(#1ac6ff, #00bfff);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #4dd2ff;
color: #999;
display: inline-block;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkZDJmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYWNlNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4dd2ff), color-stop(100%, #00ace6));
background-image: -moz-linear-gradient(#4dd2ff, #00ace6);
background-image: -webkit-linear-gradient(#4dd2ff, #00ace6);
background-image: linear-gradient(#4dd2ff, #00ace6);
color: #ccf2ff; }
/* line 197, ../sass/_mixins.scss */
.btn.major:hover:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwZGZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #80dfff), color-stop(100%, #1ac6ff));
background-image: -moz-linear-gradient(#80dfff, #1ac6ff);
background-image: -webkit-linear-gradient(#80dfff, #1ac6ff);
background-image: linear-gradient(#80dfff, #1ac6ff); }
/* line 128, ../sass/controls/_controls.scss */
.btn.major .invoke-menu {
color: #ccf2ff; }
/* line 132, ../sass/controls/_controls.scss */
.btn.normal {
padding: 11.25px 15.75px; }
/* line 136, ../sass/controls/_controls.scss */
.btn.outline:hover {
background: rgba(255, 255, 255, 0.1); }
/* line 140, ../sass/controls/_controls.scss */
.btn.subtle {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #808080), color-stop(100%, #737373));
background-image: -moz-linear-gradient(#808080, #737373);
background-image: -webkit-linear-gradient(#808080, #737373);
background-image: linear-gradient(#808080, #737373);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #999999;
color: #cccccc;
display: inline-block; }
/* line 189, ../sass/_mixins.scss */
.btn.subtle:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk5OTk5OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #999999), color-stop(100%, #808080));
background-image: -moz-linear-gradient(#999999, #808080);
background-image: -webkit-linear-gradient(#999999, #808080);
background-image: linear-gradient(#999999, #808080); }
/* line 144, ../sass/controls/_controls.scss */
.btn.very-subtle {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4d4d4d), color-stop(100%, #404040));
background-image: -moz-linear-gradient(#4d4d4d, #404040);
background-image: -webkit-linear-gradient(#4d4d4d, #404040);
background-image: linear-gradient(#4d4d4d, #404040);
-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;
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border: none;
border-top: 1px solid #666666;
color: #b3b3b3;
display: inline-block; }
/* line 189, ../sass/_mixins.scss */
.btn.very-subtle:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #666666), color-stop(100%, #4d4d4d));
background-image: -moz-linear-gradient(#666666, #4d4d4d);
background-image: -webkit-linear-gradient(#666666, #4d4d4d);
background-image: linear-gradient(#666666, #4d4d4d); }
/* line 147, ../sass/controls/_controls.scss */
.btn.lg {
-moz-border-radius: 4.5px;
-webkit-border-radius: 4.5px;
border-radius: 4.5px;
font-size: 1.2em;
padding: 7px 25px; }
/* line 153, ../sass/controls/_controls.scss */
.btn.icon-btn .icon {
color: #0099cc; }
/* line 157, ../sass/controls/_controls.scss */
.btn.icon-btn:not(.disabled):hover .icon {
color: #33ccff; }
/* line 165, ../sass/controls/_controls.scss */
/* line 97, ../sass/controls/_controls.scss */
.btn-bar .btn,
.btn-bar .btn-set,
.btn-bar .t-btn {
display: inline-block; }
/* line 179, ../sass/controls/_controls.scss */
/* line 111, ../sass/controls/_controls.scss */
.l-composite-control {
vertical-align: middle; }
/* line 182, ../sass/controls/_controls.scss */
/* line 114, ../sass/controls/_controls.scss */
.l-composite-control.l-checkbox .composite-control-label {
line-height: 18px; }
/* line 188, ../sass/controls/_controls.scss */
/* line 120, ../sass/controls/_controls.scss */
.l-control-group {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@ -1855,27 +1869,27 @@ a.l-btn span {
display: inline-block;
padding: 0 5px;
position: relative; }
/* line 196, ../sass/controls/_controls.scss */
/* line 128, ../sass/controls/_controls.scss */
.l-control-group:first-child {
border-left: none;
padding-left: 0; }
/* line 202, ../sass/controls/_controls.scss */
/* line 134, ../sass/controls/_controls.scss */
.l-local-controls {
position: absolute;
top: 5px;
right: 5px;
z-index: 5; }
/* line 211, ../sass/controls/_controls.scss */
/* line 143, ../sass/controls/_controls.scss */
.s-local-controls {
font-size: 0.7rem; }
/* line 215, ../sass/controls/_controls.scss */
/* line 147, ../sass/controls/_controls.scss */
.btn-set {
display: inline-block;
position: relative; }
/* line 219, ../sass/controls/_controls.scss */
/* line 151, ../sass/controls/_controls.scss */
.btn-set .btn,
.btn-set .t-btn {
-moz-border-radius: 0;
@ -1883,7 +1897,7 @@ a.l-btn span {
border-radius: 0;
border-left: 1px solid #666666;
margin-left: 0; }
/* line 224, ../sass/controls/_controls.scss */
/* line 156, ../sass/controls/_controls.scss */
.btn-set .btn:first-child,
.btn-set .t-btn:first-child {
border-left: none;
@ -1893,7 +1907,7 @@ a.l-btn span {
-moz-border-radius-bottomleft: 3px;
-webkit-border-bottom-left-radius: 3px;
border-bottom-left-radius: 3px; }
/* line 228, ../sass/controls/_controls.scss */
/* line 160, ../sass/controls/_controls.scss */
.btn-set .btn:last-child,
.btn-set .t-btn:last-child {
-moz-border-radius-topright: 3px;
@ -1903,7 +1917,7 @@ a.l-btn span {
-webkit-border-bottom-right-radius: 3px;
border-bottom-right-radius: 3px; }
/* line 234, ../sass/controls/_controls.scss */
/* line 166, ../sass/controls/_controls.scss */
.object-browse-bar .btn,
.object-browse-bar .t-btn,
.top-bar .buttons-main .btn,
@ -1914,7 +1928,7 @@ a.l-btn span {
font-size: 11.25px;
height: 25px;
line-height: 25px; }
/* line 245, ../sass/controls/_controls.scss */
/* line 177, ../sass/controls/_controls.scss */
.object-browse-bar .btn .icon:not(.invoke-menu),
.object-browse-bar .t-btn .icon:not(.invoke-menu),
.top-bar .buttons-main .btn .icon:not(.invoke-menu),
@ -1924,7 +1938,7 @@ a.l-btn span {
font-size: 150%;
vertical-align: middle; }
/* line 253, ../sass/controls/_controls.scss */
/* line 185, ../sass/controls/_controls.scss */
label.checkbox.custom {
cursor: pointer;
display: inline-block;
@ -1933,13 +1947,13 @@ label.checkbox.custom {
padding-left: 19px;
position: relative;
vertical-align: top; }
/* line 264, ../sass/controls/_controls.scss */
/* line 196, ../sass/controls/_controls.scss */
label.checkbox.custom em {
color: #999;
display: inline-block;
height: 14px;
min-width: 14px; }
/* line 269, ../sass/controls/_controls.scss */
/* line 201, ../sass/controls/_controls.scss */
label.checkbox.custom em:before {
-moz-border-radius: 2.25px;
-webkit-border-radius: 2.25px;
@ -1958,51 +1972,51 @@ label.checkbox.custom {
top: 0;
position: absolute;
text-align: center; }
/* line 287, ../sass/controls/_controls.scss */
/* line 219, ../sass/controls/_controls.scss */
label.checkbox.custom.no-text {
overflow: hidden;
margin-right: 0;
padding-left: 0;
height: 14px;
width: 14px; }
/* line 293, ../sass/controls/_controls.scss */
/* line 225, ../sass/controls/_controls.scss */
label.checkbox.custom.no-text em {
overflow: hidden; }
/* line 297, ../sass/controls/_controls.scss */
/* line 229, ../sass/controls/_controls.scss */
label.checkbox.custom input {
display: none; }
/* line 299, ../sass/controls/_controls.scss */
/* line 231, ../sass/controls/_controls.scss */
label.checkbox.custom input:checked ~ em:before {
background: #0099cc;
color: #ccf2ff;
content: "2"; }
/* line 307, ../sass/controls/_controls.scss */
/* line 239, ../sass/controls/_controls.scss */
.input-labeled {
margin-left: 5px; }
/* line 309, ../sass/controls/_controls.scss */
/* line 241, ../sass/controls/_controls.scss */
.input-labeled label {
display: inline-block;
margin-right: 3px; }
/* line 313, ../sass/controls/_controls.scss */
/* line 245, ../sass/controls/_controls.scss */
.input-labeled.inline {
display: inline-block; }
/* line 316, ../sass/controls/_controls.scss */
/* line 248, ../sass/controls/_controls.scss */
.input-labeled:first-child {
margin-left: 0; }
/* line 321, ../sass/controls/_controls.scss */
/* line 253, ../sass/controls/_controls.scss */
.btn-menu label.checkbox.custom {
margin-left: 5px; }
/* line 326, ../sass/controls/_controls.scss */
/* line 258, ../sass/controls/_controls.scss */
.item .checkbox.checked label {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
border-bottom: none; }
/* line 332, ../sass/controls/_controls.scss */
/* line 264, ../sass/controls/_controls.scss */
.btn-menu {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2033,42 +2047,42 @@ label.checkbox.custom {
background-image: -moz-linear-gradient(#666666, #4d4d4d);
background-image: -webkit-linear-gradient(#666666, #4d4d4d);
background-image: linear-gradient(#666666, #4d4d4d); }
/* line 339, ../sass/controls/_controls.scss */
/* line 271, ../sass/controls/_controls.scss */
.btn-menu.dropdown {
padding-left: 10px;
padding-right: 10px; }
/* line 345, ../sass/controls/_controls.scss */
/* line 277, ../sass/controls/_controls.scss */
.btn-menu:not(.disabled):hover {
color: #cccccc; }
/* line 349, ../sass/controls/_controls.scss */
/* line 281, ../sass/controls/_controls.scss */
.btn-menu.btn-invoke-menu {
color: #0099cc;
padding: 0 5px; }
/* line 353, ../sass/controls/_controls.scss */
/* line 285, ../sass/controls/_controls.scss */
.btn-menu.btn-invoke-menu:hover {
color: deepskyblue; }
/* line 363, ../sass/controls/_controls.scss */
/* line 295, ../sass/controls/_controls.scss */
.btn-menu .type-icon {
margin-right: 5px; }
/* line 366, ../sass/controls/_controls.scss */
/* line 298, ../sass/controls/_controls.scss */
.btn-menu .menu {
position: absolute;
left: 0;
text-align: left; }
/* line 371, ../sass/controls/_controls.scss */
/* line 303, ../sass/controls/_controls.scss */
.btn-menu .menu .ui-symbol.icon {
width: 12px; }
/* line 377, ../sass/controls/_controls.scss */
/* line 309, ../sass/controls/_controls.scss */
.top-bar .btn-menu {
height: 25px;
line-height: 25px;
padding-right: 10px; }
/* line 385, ../sass/controls/_controls.scss */
/* line 317, ../sass/controls/_controls.scss */
.top-bar .btn-menu.browse-btn {
margin-right: 5px;
padding-left: 25px; }
/* line 388, ../sass/controls/_controls.scss */
/* line 320, ../sass/controls/_controls.scss */
.top-bar .btn-menu.browse-btn .badge {
-moz-border-radius: 4.5px;
-webkit-border-radius: 4.5px;
@ -2085,30 +2099,30 @@ label.checkbox.custom {
height: auto; }
/******************************************************** OBJECT-HEADER */
/* line 405, ../sass/controls/_controls.scss */
/* line 337, ../sass/controls/_controls.scss */
.object-header {
display: inline-block;
font-size: 1em; }
/* line 408, ../sass/controls/_controls.scss */
/* line 340, ../sass/controls/_controls.scss */
.object-header .title {
color: white; }
/* line 411, ../sass/controls/_controls.scss */
/* line 343, ../sass/controls/_controls.scss */
.object-header .type-icon {
font-size: 1.5em;
margin-right: 5px;
vertical-align: middle; }
/* line 420, ../sass/controls/_controls.scss */
/* line 352, ../sass/controls/_controls.scss */
.top-bar .object-header,
.object-browse-bar .object-header {
font-size: 1.1em; }
/* line 422, ../sass/controls/_controls.scss */
/* line 354, ../sass/controls/_controls.scss */
.top-bar .object-header span,
.object-browse-bar .object-header span {
display: inline-block; }
/******************************************************** VIEW-CONTROLS */
/* line 430, ../sass/controls/_controls.scss */
/* line 362, ../sass/controls/_controls.scss */
.view-controls .view-type {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
@ -2120,16 +2134,16 @@ label.checkbox.custom {
line-height: 20px;
padding-left: 5px;
padding-right: 5px; }
/* line 441, ../sass/controls/_controls.scss */
/* line 373, ../sass/controls/_controls.scss */
.view-controls .view-type.cur {
background: #666666; }
/* line 446, ../sass/controls/_controls.scss */
/* line 378, ../sass/controls/_controls.scss */
.edit-mode .top-bar .control-set.edit-view-controls {
margin-right: 50px; }
/******************************************************** SLIDERS */
/* line 457, ../sass/controls/_controls.scss */
/* line 389, ../sass/controls/_controls.scss */
.slider .slot {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -2150,7 +2164,7 @@ label.checkbox.custom {
right: 0;
bottom: auto;
left: 0; }
/* line 468, ../sass/controls/_controls.scss */
/* line 400, ../sass/controls/_controls.scss */
.slider .knob {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2201,12 +2215,12 @@ label.checkbox.custom {
/* line 182, ../sass/_mixins.scss */
.slider .knob:not(.disabled):hover:before {
border-color: rgba(0, 153, 204, 0.9); }
/* line 479, ../sass/controls/_controls.scss */
/* line 411, ../sass/controls/_controls.scss */
.slider .knob:before {
top: 1px;
bottom: 3px;
left: 5px; }
/* line 486, ../sass/controls/_controls.scss */
/* line 418, ../sass/controls/_controls.scss */
.slider .range {
background: rgba(0, 153, 204, 0.6);
cursor: ew-resize;
@ -2217,12 +2231,12 @@ label.checkbox.custom {
left: auto;
height: auto;
width: auto; }
/* line 496, ../sass/controls/_controls.scss */
/* line 428, ../sass/controls/_controls.scss */
.slider .range:hover {
background: rgba(0, 153, 204, 0.7); }
/******************************************************** BROWSER ELEMENTS */
/* line 504, ../sass/controls/_controls.scss */
/* line 436, ../sass/controls/_controls.scss */
::-webkit-scrollbar {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -2239,7 +2253,7 @@ label.checkbox.custom {
height: 10px;
width: 10px; }
/* line 510, ../sass/controls/_controls.scss */
/* line 442, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2257,7 +2271,7 @@ label.checkbox.custom {
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
border-top: 1px solid gray; }
/* line 517, ../sass/controls/_controls.scss */
/* line 449, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2266,7 +2280,7 @@ label.checkbox.custom {
background-image: -webkit-linear-gradient(#808080, #737373 20px);
background-image: linear-gradient(#808080, #737373 20px); }
/* line 522, ../sass/controls/_controls.scss */
/* line 454, ../sass/controls/_controls.scss */
::-webkit-scrollbar-corner {
background: rgba(0, 0, 0, 0.4); }

71
platform/commonUI/general/res/sass/controls/_buttons.scss
View File

@ -19,20 +19,64 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
$pad: $interiorMargin * 1.5;
$baseRatio: 1.5;
$pad: $interiorMargin * $baseRatio;
/*********************************** TYPE STYLES */
.t-btn {
cursor: pointer;
/******* LAYOUT AND SIZING */
.btn,
.l-btn {
line-height: 1.2em;
padding: 0 $pad;
text-decoration: none;
&.lg,
&.create-btn {
$h: $ueTopBarH - $interiorMargin;
height: $h;
line-height: $h;
padding: 0 $pad * 3;
}
&.create-btn {
.menu {
margin-left: $pad * -1;
}
>.ui-symbol {
font-size: 1.1em;
}
}
&.sm {
padding: 0 $pad / $baseRatio;
}
&.vsm {
padding: 0 ($pad / $baseRatio) / 2;
}
}
/*********************************** STYLE STYLES */
.btn,
.s-btn {
$base: lighten($colorBodyBg, 20%); // Moved to s-btn
@include border-radius($controlCr);
@include box-sizing(border-box);
@include text-shadow(rgba(black, 0.3) 0 1px 1px);
line-height: 1.2em;
cursor: pointer;
text-decoration: none;
&.major {
$bg: $colorKey;
@include btnNoticeable($bg);
$fg: lighten($bg, 50%);
color: $fg;
&:hover {
@include btnNoticeable(lighten($bg, 5%));
color: $fg;
}
.invoke-menu {
color: $fg;
}
}
&.subtle {
@include btnSubtle($base, lighten($base, 40%));
}
&.very-subtle,
&.s-very-subtle {
@include containerSubtle($colorBodyBg, $colorBodyFg, true);
&.paused {
@ -44,9 +88,10 @@ $pad: $interiorMargin * 1.5;
}
}
.icon-btn,
.s-icon-btn {
@extend .s-btn;
font-size: 1.2em;
font-size: 1em;
.icon {
color: $colorKey;
}
@ -93,19 +138,13 @@ $pad: $interiorMargin * 1.5;
}
/*********************************** LAYOUT STYLES */
span.btn,
span.btn span,
span.l-btn,
span.l-btn span,
a.btn,
a.btn span,
a.l-btn,
a.l-btn span {
display: inline-block;
}
.l-btn {
padding: 0 $pad;
&.sm {
padding: 0 $interiorMargin;
}
&.vsm {
padding: 0 $interiorMargin/2;
}
}

68
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@ -92,74 +92,6 @@
}
}
.btn {
$base: lighten($colorBodyBg, 20%); // Moved to s-btn
$p: 10px; // Moved to s-btn
@include border-radius($controlCr); // Moved to s-btn
@include box-sizing(border-box); // Moved to s-btn
@include text-shadow(rgba(black, 0.3) 0 1px 1px); // Moved to s-btn
// display: inline-block;
// margin-right: 10px;
padding: 0 ($interiorMargin * 2); // Moved to s-btn
text-decoration: none; // Moved to s-btn
&.create-btn {
$h: $ueTopBarH - $interiorMargin; //$btnStdH * 1.5;;
$p: $p * 2.25;
height: $h;
line-height: $h;
//font-size: 1.1em;
padding: 0 $p;
.menu {
margin-left: $p * -1;
}
.ui-symbol.major {
font-size: 1.1em;
}
}
&.major {
$bg: $colorKey;
@include btnNoticeable($bg);
$fg: lighten($bg, 50%);
color: $fg;
&:hover {
@include btnNoticeable(lighten($bg, 5%));
color: $fg;
}
.invoke-menu {
color: $fg;
}
}
&.normal {
padding: $p * 0.5 $p * 0.7;
}
&.outline {
&:hover {
background: rgba(#fff, 0.1);
}
}
&.subtle {
@include btnSubtle($base, lighten($base, 40%));
}
&.very-subtle {
@include btnSubtle($colorBodyBg, lighten($colorBodyBg, 50%));
}
&.lg {
@include border-radius($controlCr * 1.5);
font-size: 1.2em;
padding: 7px 25px;
}
&.icon-btn {
.icon {
color: $colorKey;
}
&:not(.disabled):hover .icon {
color: lighten($colorKey, $ltGamma);
}
}
}
.btn-bar {
// position: relative;
.btn,

2
platform/commonUI/general/res/templates/controls/action-button.html
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.
-->
<a class="t-btn l-btn s-btn s-icon-btn s-very-subtle key-{{parameters.action.getMetadata().key}}"
<a class="btn s-btn s-icon-btn s-very-subtle key-{{parameters.action.getMetadata().key}}"
ng-class="{ labeled: parameters.labeled }"
title="{{parameters.action.getMetadata().description}}"
ng-click="parameters.action.perform()">

20
platform/commonUI/general/res/templates/controls/switcher.html
View File

@ -21,14 +21,22 @@
-->
<span ng-controller="ViewSwitcherController">
<div class="menu-element btn icon-btn very-subtle btn-menu dropdown click-invoke"
ng-if="view.length > 1"
ng-controller="ClickAwayController as toggle">
<div
class="menu-element icon-btn btn btn-menu dropdown click-invoke"
ng-if="view.length > 1"
ng-controller="ClickAwayController as toggle"
>
<span class="l-click-area" ng-click="toggle.toggle()"></span>
<span
class="l-click-area"
ng-click="toggle.toggle()"
title="{{ngModel.selected.name}}"
></span>
<span class="ui-symbol icon type-icon">{{ngModel.selected.glyph}}</span>
<span>{{ngModel.selected.name}}</span>
<span class="ui-symbol icon type-icon">
{{ngModel.selected.glyph}}
</span>
<span class="name">{{ngModel.selected.name}}</span>
<span class='ui-symbol icon invoke-menu'>v</span>

2
platform/features/plot/res/templates/plot.html
View File

@ -108,7 +108,7 @@
<span class="ui-symbol icon">I</span>
</a>
<div class="menu-element btn icon-btn very-subtle btn-menu dropdown click-invoke"
<div class="menu-element btn icon-btn s-very-subtle btn-menu dropdown click-invoke"
ng-if="plot.getModeOptions().length > 1"
ng-controller="ClickAwayController as toggle">