Pulling in all sass, css, etc. and static-markup work from warp1222 so far

This commit is contained in:
Charles Hacskaylo
2015-06-05 16:48:58 -07:00
parent 6fe6aacc38
commit e216961727
19 changed files with 942 additions and 236 deletions

View File

@@ -374,7 +374,7 @@ input[type="text"] {
margin: 0 0 2px 2px; margin: 0 0 2px 2px;
overflow: hidden; overflow: hidden;
position: relative; } position: relative; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.form-control.select:not(.disabled):hover { .form-control.select:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;

View File

@@ -119,7 +119,7 @@
margin-bottom: 3px; margin-bottom: 3px;
margin-right: 3px; margin-right: 3px;
position: relative; } position: relative; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.items-holder .item.grid-item:not(.disabled):hover { .items-holder .item.grid-item:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -210,7 +210,7 @@
background-image: -webkit-linear-gradient(#33ccff, #0099cc); background-image: -webkit-linear-gradient(#33ccff, #0099cc);
background-image: linear-gradient(#33ccff, #0099cc); background-image: linear-gradient(#33ccff, #0099cc);
color: #80dfff; } color: #80dfff; }
/* line 156, ../sass/_mixins.scss */ /* line 181, ../sass/_mixins.scss */
.items-holder .item.grid-item.selected:not(.disabled):hover { .items-holder .item.grid-item.selected:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;

View File

@@ -217,17 +217,17 @@ a.disabled {
@-moz-keyframes pulse { @-moz-keyframes pulse {
0% { 0% {
opacity: 0.2; } opacity: 0.5; }
100% { 100% {
opacity: 1; } } opacity: 1; } }
@-webkit-keyframes pulse { @-webkit-keyframes pulse {
0% { 0% {
opacity: 0.2; } opacity: 0.5; }
100% { 100% {
opacity: 1; } } opacity: 1; } }
@keyframes pulse { @keyframes pulse {
0% { 0% {
opacity: 0.2; } opacity: 0.5; }
100% { 100% {
opacity: 1; } } opacity: 1; } }
/* line 59, ../sass/_effects.scss */ /* line 59, ../sass/_effects.scss */
@@ -235,9 +235,9 @@ a.disabled {
-moz-animation-name: pulse; -moz-animation-name: pulse;
-webkit-animation-name: pulse; -webkit-animation-name: pulse;
animation-name: pulse; animation-name: pulse;
-moz-animation-duration: 1000ms; -moz-animation-duration: 750ms;
-webkit-animation-duration: 1000ms; -webkit-animation-duration: 750ms;
animation-duration: 1000ms; animation-duration: 750ms;
-moz-animation-direction: alternate; -moz-animation-direction: alternate;
-webkit-animation-direction: alternate; -webkit-animation-direction: alternate;
animation-direction: alternate; animation-direction: alternate;
@@ -367,7 +367,12 @@ span {
.hidden { .hidden {
display: none !important; } display: none !important; }
/* line 120, ../sass/_global.scss */ /* line 121, ../sass/_global.scss */
.paused:not(.s-btn):not(.s-icon-btn) {
border-color: #c56f01 !important;
color: #c56f01 !important; }
/* line 127, ../sass/_global.scss */
.sep { .sep {
color: rgba(255, 255, 255, 0.2); } color: rgba(255, 255, 255, 0.2); }
@@ -466,27 +471,23 @@ span {
.bar.abs, .btn-menu span.bar.l-click-area { .bar.abs, .btn-menu span.bar.l-click-area {
text-wrap: none; text-wrap: none;
white-space: nowrap; } white-space: nowrap; }
/* line 73, ../sass/user-environ/_layout.scss */ /* line 74, ../sass/user-environ/_layout.scss */
.bar.abs.left, .btn-menu span.bar.left.l-click-area, .bar.left,
.bar.abs .left, .bar .left {
.btn-menu span.bar.l-click-area .left { width: 45% !important;
width: 45%; right: auto !important; }
right: auto; } /* line 79, ../sass/user-environ/_layout.scss */
/* line 78, ../sass/user-environ/_layout.scss */ .bar.right,
.bar.abs.right, .btn-menu span.bar.right.l-click-area, .bar .right {
.bar.abs .right, width: 45% !important;
.btn-menu span.bar.l-click-area .right { left: auto !important;
width: 45%; text-align: right; }
left: auto; /* line 84, ../sass/user-environ/_layout.scss */
right: 0; .bar.right .icon.major,
text-align: right; } .bar .right .icon.major {
/* line 84, ../sass/user-environ/_layout.scss */ margin-left: 15px; }
.bar.abs.right .icon.major, .btn-menu span.bar.right.l-click-area .icon.major,
.bar.abs .right .icon.major,
.btn-menu span.bar.l-click-area .right .icon.major {
margin-left: 15px; }
/* line 95, ../sass/user-environ/_layout.scss */ /* line 91, ../sass/user-environ/_layout.scss */
.user-environ .browse-area, .user-environ .browse-area,
.user-environ .edit-area, .user-environ .edit-area,
.user-environ .editor { .user-environ .editor {
@@ -494,42 +495,42 @@ span {
right: 5px; right: 5px;
bottom: 30px; bottom: 30px;
left: 5px; } left: 5px; }
/* line 106, ../sass/user-environ/_layout.scss */ /* line 102, ../sass/user-environ/_layout.scss */
.user-environ .browse-area > .contents, .user-environ .browse-area > .contents,
.user-environ .edit-area > .contents { .user-environ .edit-area > .contents {
left: 0; left: 0;
right: 0; } right: 0; }
/* line 112, ../sass/user-environ/_layout.scss */ /* line 108, ../sass/user-environ/_layout.scss */
.user-environ .edit-area { .user-environ .edit-area {
top: 40px; } top: 40px; }
/* line 115, ../sass/user-environ/_layout.scss */ /* line 111, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .tool-bar { .user-environ .edit-area .tool-bar {
bottom: auto; bottom: auto;
height: 30px; height: 30px;
line-height: 25px; } line-height: 25px; }
/* line 120, ../sass/user-environ/_layout.scss */ /* line 116, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .work-area { .user-environ .edit-area .work-area {
top: 40px; } top: 40px; }
/* line 125, ../sass/user-environ/_layout.scss */ /* line 121, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar { .user-environ .bottom-bar {
top: auto; top: auto;
right: 5px; right: 5px;
bottom: 5px; bottom: 5px;
left: 5px; left: 5px;
height: 20px; } height: 20px; }
/* line 131, ../sass/user-environ/_layout.scss */ /* line 127, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar .status-holder { .user-environ .bottom-bar .status-holder {
right: 110px; } right: 110px; }
/* line 134, ../sass/user-environ/_layout.scss */ /* line 130, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar .app-logo { .user-environ .bottom-bar .app-logo {
left: auto; left: auto;
width: 105px; } width: 105px; }
/* line 141, ../sass/user-environ/_layout.scss */ /* line 137, ../sass/user-environ/_layout.scss */
.cols { .cols {
overflow: hidden; overflow: hidden;
*zoom: 1; } *zoom: 1; }
/* line 143, ../sass/user-environ/_layout.scss */ /* line 139, ../sass/user-environ/_layout.scss */
.cols .col { .cols .col {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
@@ -540,103 +541,103 @@ span {
margin-left: 1.5%; margin-left: 1.5%;
padding-left: 5px; padding-left: 5px;
position: relative; } position: relative; }
/* line 151, ../sass/user-environ/_layout.scss */ /* line 147, ../sass/user-environ/_layout.scss */
.cols .col:first-child { .cols .col:first-child {
margin-left: 0; margin-left: 0;
padding-left: 0; } padding-left: 0; }
/* line 158, ../sass/user-environ/_layout.scss */ /* line 154, ../sass/user-environ/_layout.scss */
.cols.cols-2 .col-1 { .cols.cols-2 .col-1 {
min-width: 250px; min-width: 250px;
width: 48.5%; } width: 48.5%; }
/* line 164, ../sass/user-environ/_layout.scss */ /* line 160, ../sass/user-environ/_layout.scss */
.cols.cols-2-ff .col-100px { .cols.cols-2-ff .col-100px {
width: 100px; } width: 100px; }
/* line 171, ../sass/user-environ/_layout.scss */ /* line 167, ../sass/user-environ/_layout.scss */
.cols.cols-6 .col-1 { .cols.cols-6 .col-1 {
min-width: 83.33333px; min-width: 83.33333px;
width: 15.16667%; } width: 15.16667%; }
/* line 177, ../sass/user-environ/_layout.scss */ /* line 173, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-1 { .cols.cols-16 .col-1 {
min-width: 31.25px; min-width: 31.25px;
width: 4.75%; } width: 4.75%; }
/* line 180, ../sass/user-environ/_layout.scss */ /* line 176, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-2 { .cols.cols-16 .col-2 {
min-width: 62.5px; min-width: 62.5px;
width: 11%; } width: 11%; }
/* line 183, ../sass/user-environ/_layout.scss */ /* line 179, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-7 { .cols.cols-16 .col-7 {
min-width: 218.75px; min-width: 218.75px;
width: 42.25%; } width: 42.25%; }
/* line 189, ../sass/user-environ/_layout.scss */ /* line 185, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-2 { .cols.cols-32 .col-2 {
min-width: 31.25px; min-width: 31.25px;
width: 4.75%; } width: 4.75%; }
/* line 192, ../sass/user-environ/_layout.scss */ /* line 188, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-15 { .cols.cols-32 .col-15 {
min-width: 234.375px; min-width: 234.375px;
width: 45.375%; } width: 45.375%; }
/* line 196, ../sass/user-environ/_layout.scss */ /* line 192, ../sass/user-environ/_layout.scss */
.cols .l-row { .cols .l-row {
overflow: hidden; overflow: hidden;
*zoom: 1; *zoom: 1;
padding: 5px 0; } padding: 5px 0; }
/* line 202, ../sass/user-environ/_layout.scss */ /* line 198, ../sass/user-environ/_layout.scss */
.pane { .pane {
position: absolute; } position: absolute; }
/* line 205, ../sass/user-environ/_layout.scss */ /* line 201, ../sass/user-environ/_layout.scss */
.pane.treeview .create-btn-holder { .pane.treeview .create-btn-holder {
bottom: auto; bottom: auto;
top: 0; top: 0;
height: 30px; } height: 30px; }
/* line 208, ../sass/user-environ/_layout.scss */ /* line 204, ../sass/user-environ/_layout.scss */
.pane.treeview .create-btn-holder .wrapper.menu-element { .pane.treeview .create-btn-holder .wrapper.menu-element {
position: absolute; position: absolute;
bottom: 5px; } bottom: 5px; }
/* line 213, ../sass/user-environ/_layout.scss */ /* line 209, ../sass/user-environ/_layout.scss */
.pane.treeview .tree-holder { .pane.treeview .tree-holder {
overflow: auto; overflow: auto;
top: 35px; } top: 35px; }
/* line 221, ../sass/user-environ/_layout.scss */ /* line 217, ../sass/user-environ/_layout.scss */
.pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .btn-menu span.left.l-click-area, .btn-menu .pane.items .object-browse-bar span.left.l-click-area, .pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .btn-menu span.left.l-click-area, .btn-menu .pane.items .object-browse-bar span.left.l-click-area,
.pane.items .object-browse-bar .right.abs, .pane.items .object-browse-bar .right.abs,
.pane.items .object-browse-bar .btn-menu span.right.l-click-area, .pane.items .object-browse-bar .btn-menu span.right.l-click-area,
.btn-menu .pane.items .object-browse-bar span.right.l-click-area { .btn-menu .pane.items .object-browse-bar span.right.l-click-area {
top: auto; } top: auto; }
/* line 225, ../sass/user-environ/_layout.scss */ /* line 221, ../sass/user-environ/_layout.scss */
.pane.items .object-browse-bar .right.abs, .pane.items .object-browse-bar .btn-menu span.right.l-click-area, .btn-menu .pane.items .object-browse-bar span.right.l-click-area { .pane.items .object-browse-bar .right.abs, .pane.items .object-browse-bar .btn-menu span.right.l-click-area, .btn-menu .pane.items .object-browse-bar span.right.l-click-area {
bottom: 5px; } bottom: 5px; }
/* line 229, ../sass/user-environ/_layout.scss */ /* line 225, ../sass/user-environ/_layout.scss */
.pane.items .object-holder { .pane.items .object-holder {
top: 35px; } top: 35px; }
/* line 234, ../sass/user-environ/_layout.scss */ /* line 230, ../sass/user-environ/_layout.scss */
.pane.edit-main .object-holder { .pane.edit-main .object-holder {
top: 0; } top: 0; }
/* line 240, ../sass/user-environ/_layout.scss */ /* line 236, ../sass/user-environ/_layout.scss */
.pane .object-holder { .pane .object-holder {
overflow: auto; } overflow: auto; }
/* line 248, ../sass/user-environ/_layout.scss */ /* line 244, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane { .split-layout.horizontal > .pane {
margin-top: 5px; } margin-top: 5px; }
/* line 251, ../sass/user-environ/_layout.scss */ /* line 247, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane:first-child { .split-layout.horizontal > .pane:first-child {
margin-top: 0; } margin-top: 0; }
/* line 258, ../sass/user-environ/_layout.scss */ /* line 254, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane { .split-layout.vertical > .pane {
margin-left: 5px; } margin-left: 5px; }
/* line 260, ../sass/user-environ/_layout.scss */ /* line 256, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane > .holder { .split-layout.vertical > .pane > .holder {
left: 0; left: 0;
right: 0; } right: 0; }
/* line 264, ../sass/user-environ/_layout.scss */ /* line 260, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child { .split-layout.vertical > .pane:first-child {
margin-left: 0; } margin-left: 0; }
/* line 266, ../sass/user-environ/_layout.scss */ /* line 262, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child .holder { .split-layout.vertical > .pane:first-child .holder {
right: 5px; } right: 5px; }
/* line 275, ../sass/user-environ/_layout.scss */ /* line 271, ../sass/user-environ/_layout.scss */
.vscroll { .vscroll {
overflow-y: auto; } overflow-y: auto; }
@@ -1042,7 +1043,7 @@ span {
display: inline-block; display: inline-block;
font-size: 1rem; font-size: 1rem;
vertical-align: middle; } vertical-align: middle; }
/* line 200, ../sass/_mixins.scss */ /* line 225, ../sass/_mixins.scss */
.invoke-menu:hover { .invoke-menu:hover {
color: #33ccff; } color: #33ccff; }
@@ -1054,7 +1055,7 @@ span {
/* line 70, ../sass/_icons.scss */ /* line 70, ../sass/_icons.scss */
.icon-buttons-main .invoke-menu { .icon-buttons-main .invoke-menu {
color: #666666; } color: #666666; }
/* line 200, ../sass/_mixins.scss */ /* line 225, ../sass/_mixins.scss */
.icon-buttons-main .invoke-menu:hover { .icon-buttons-main .invoke-menu:hover {
color: #999999; } color: #999999; }
@@ -1343,7 +1344,7 @@ span {
cursor: pointer; } cursor: pointer; }
/*********************************** STYLE STYLES */ /*********************************** STYLE STYLES */
/* line 31, ../sass/controls/_buttons.scss */ /* line 30, ../sass/controls/_buttons.scss */
.s-btn, .s-icon-btn { .s-btn, .s-icon-btn {
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
@@ -1353,9 +1354,8 @@ span {
box-sizing: border-box; box-sizing: border-box;
text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px; text-shadow: rgba(0, 0, 0, 0.3) 0 1px 1px;
line-height: 1.2em; line-height: 1.2em;
padding: 0 10px;
text-decoration: none; } text-decoration: none; }
/* line 39, ../sass/controls/_buttons.scss */ /* line 36, ../sass/controls/_buttons.scss */
.s-btn.s-very-subtle, .s-very-subtle.s-icon-btn { .s-btn.s-very-subtle, .s-very-subtle.s-icon-btn {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQwNDA0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1376,7 +1376,7 @@ span {
border-top: 1px solid #666666; border-top: 1px solid #666666;
color: #999; color: #999;
display: inline-block; } display: inline-block; }
/* line 103, ../sass/_mixins.scss */ /* line 128, ../sass/_mixins.scss */
.s-btn.s-very-subtle:hover, .s-very-subtle.s-icon-btn:hover { .s-btn.s-very-subtle:hover, .s-very-subtle.s-icon-btn:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1384,34 +1384,102 @@ span {
background-image: -moz-linear-gradient(#666666, #595959); background-image: -moz-linear-gradient(#666666, #595959);
background-image: -webkit-linear-gradient(#666666, #595959); background-image: -webkit-linear-gradient(#666666, #595959);
background-image: 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 {
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));
background-image: -moz-linear-gradient(#f88c01, #de7d01);
background-image: -webkit-linear-gradient(#f88c01, #de7d01);
background-image: linear-gradient(#f88c01, #de7d01);
-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 #fea32e;
color: #fff;
display: inline-block; }
/* line 128, ../sass/_mixins.scss */
.s-btn.s-very-subtle.paused: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 {
content: "\0000EF"; }
/* line 44, ../sass/controls/_buttons.scss */ /* line 47, ../sass/controls/_buttons.scss */
.s-icon-btn { .s-icon-btn {
font-size: 1.2em; } font-size: 1.2em; }
/* line 47, ../sass/controls/_buttons.scss */ /* line 50, ../sass/controls/_buttons.scss */
.s-icon-btn .icon { .s-icon-btn .icon {
color: #0099cc; } color: #0099cc; }
/* line 51, ../sass/controls/_buttons.scss */ /* line 54, ../sass/controls/_buttons.scss */
.s-icon-btn:not(.disabled):hover .icon { .s-icon-btn.paused .icon {
color: #fff; }
/* line 62, ../sass/controls/_buttons.scss */
.s-icon-btn:not(.disabled):not(.paused):hover .icon {
color: #33ccff; } color: #33ccff; }
/* line 55, ../sass/controls/_buttons.scss */ /* line 69, ../sass/controls/_buttons.scss */
.s-icon-btn.labeled { .s-icon-btn.labeled {
padding: 0 5px; } padding: 0 3.75px; }
/* line 57, ../sass/controls/_buttons.scss */ /* line 71, ../sass/controls/_buttons.scss */
.s-icon-btn.labeled .icon { .s-icon-btn.labeled .icon {
font-size: 1.5em; } font-size: 1.5em; }
/* line 60, ../sass/controls/_buttons.scss */ /* line 74, ../sass/controls/_buttons.scss */
.s-icon-btn.labeled .title-label { .s-icon-btn.labeled .title-label {
margin-left: 5px; } margin-left: 5px; }
/* line 80, ../sass/controls/_buttons.scss */
.s-icon-btn.pause-play.paused {
-moz-animation-name: pulse;
-webkit-animation-name: pulse;
animation-name: pulse;
-moz-animation-duration: 500ms;
-webkit-animation-duration: 500ms;
animation-duration: 500ms;
-moz-animation-direction: alternate;
-webkit-animation-direction: alternate;
animation-direction: alternate;
-moz-animation-iteration-count: infinite;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-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 */
.s-icon-btn.pause-play .icon:before {
content: "\0000F1"; }
/* line 89, ../sass/controls/_buttons.scss */
.s-icon-btn.show-thumbs .icon:before {
content: "\000039"; }
/*********************************** LAYOUT STYLES */ /*********************************** LAYOUT STYLES */
/* line 68, ../sass/controls/_buttons.scss */ /* line 96, ../sass/controls/_buttons.scss */
span.l-btn, span.l-btn,
span.l-btn span, span.l-btn span,
a.l-btn, a.l-btn,
a.l-btn span { a.l-btn span {
display: inline-block; } 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 * Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space * as represented by the Administrator of the National Aeronautics and Space
@@ -1640,7 +1708,7 @@ a.l-btn span {
background-image: -webkit-linear-gradient(#33ccff, #0099cc); background-image: -webkit-linear-gradient(#33ccff, #0099cc);
background-image: linear-gradient(#33ccff, #0099cc); background-image: linear-gradient(#33ccff, #0099cc);
color: #ccf2ff; } color: #ccf2ff; }
/* line 156, ../sass/_mixins.scss */ /* line 181, ../sass/_mixins.scss */
.btn.major:not(.disabled):hover { .btn.major:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2ZDlmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwYmZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1676,7 +1744,7 @@ a.l-btn span {
background-image: -webkit-linear-gradient(#4dd2ff, #00ace6); background-image: -webkit-linear-gradient(#4dd2ff, #00ace6);
background-image: linear-gradient(#4dd2ff, #00ace6); background-image: linear-gradient(#4dd2ff, #00ace6);
color: #ccf2ff; } color: #ccf2ff; }
/* line 156, ../sass/_mixins.scss */ /* line 181, ../sass/_mixins.scss */
.btn.major:hover:not(.disabled):hover { .btn.major:hover:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwZGZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwZGZmZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzFhYzZmZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1714,7 +1782,7 @@ a.l-btn span {
border-top: 1px solid #999999; border-top: 1px solid #999999;
color: #cccccc; color: #cccccc;
display: inline-block; } display: inline-block; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.btn.subtle:not(.disabled):hover { .btn.subtle:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk5OTk5OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk5OTk5OSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1743,7 +1811,7 @@ a.l-btn span {
border-top: 1px solid #666666; border-top: 1px solid #666666;
color: #b3b3b3; color: #b3b3b3;
display: inline-block; } display: inline-block; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.btn.very-subtle:not(.disabled):hover { .btn.very-subtle:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -1946,7 +2014,7 @@ label.checkbox.custom {
display: inline-block; display: inline-block;
height: 20px; height: 20px;
line-height: 20px; } line-height: 20px; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.btn-menu:not(.disabled):hover { .btn-menu:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -2100,7 +2168,7 @@ label.checkbox.custom {
auto: 0; auto: 0;
bottom: auto; bottom: auto;
left: auto; } left: auto; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.slider .knob:not(.disabled):hover { .slider .knob:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -2108,7 +2176,7 @@ label.checkbox.custom {
background-image: -moz-linear-gradient(#666666, #4d4d4d); background-image: -moz-linear-gradient(#666666, #4d4d4d);
background-image: -webkit-linear-gradient(#666666, #4d4d4d); background-image: -webkit-linear-gradient(#666666, #4d4d4d);
background-image: linear-gradient(#666666, #4d4d4d); } background-image: linear-gradient(#666666, #4d4d4d); }
/* line 120, ../sass/_mixins.scss */ /* line 145, ../sass/_mixins.scss */
.slider .knob:before { .slider .knob:before {
content: ''; content: '';
display: block; display: block;
@@ -2119,7 +2187,7 @@ label.checkbox.custom {
left: 2px; left: 2px;
bottom: 5px; bottom: 5px;
top: 5px; } top: 5px; }
/* line 141, ../sass/_mixins.scss */ /* line 166, ../sass/_mixins.scss */
.slider .knob:not(.disabled):hover:before { .slider .knob:not(.disabled):hover:before {
border-color: rgba(0, 153, 204, 0.9); } border-color: rgba(0, 153, 204, 0.9); }
/* line 466, ../sass/controls/_controls.scss */ /* line 466, ../sass/controls/_controls.scss */
@@ -2283,7 +2351,7 @@ label.checkbox.custom {
.menu-element .menu ul { .menu-element .menu ul {
margin: 0; margin: 0;
padding: 0; } padding: 0; }
/* line 208, ../sass/_mixins.scss */ /* line 233, ../sass/_mixins.scss */
.menu-element .menu ul li { .menu-element .menu ul li {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
@@ -2448,6 +2516,171 @@ label.checkbox.custom {
right: 0; right: 0;
width: auto; } width: auto; }
/* line 1, ../sass/features/_imagery.scss */
.l-image-main-wrapper,
.l-image-main,
.l-image-main-controlbar,
.l-image-main-controlbar .left,
.l-image-main-controlbar .right,
.l-image-thumbs-wrapper {
overflow: false;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: auto;
height: auto; }
/*************************************** MAIN LAYOUT */
/* line 11, ../sass/features/_imagery.scss */
.l-image-main-wrapper {
bottom: 178px;
min-height: 100px;
min-width: 150px; }
/* line 16, ../sass/features/_imagery.scss */
.l-image-main-wrapper .l-image-main {
background-color: rgba(255, 255, 255, 0.1);
bottom: 25px; }
/* line 20, ../sass/features/_imagery.scss */
.l-image-main-wrapper .l-image-main-controlbar {
top: auto;
height: 20px; }
/* line 26, ../sass/features/_imagery.scss */
.l-image-thumbs-wrapper {
top: auto;
height: 168px; }
/* line 32, ../sass/features/_imagery.scss */
.l-date,
.l-time,
.l-timezone {
display: inline-block; }
/*************************************** MAIN IMAGE */
/* line 40, ../sass/features/_imagery.scss */
.l-image-main,
.l-image-thumb-item .l-thumb {
background-size: contain;
background-position: center;
background-repeat: no-repeat; }
/* line 47, ../sass/features/_imagery.scss */
.l-image-main-controlbar {
font-size: 0.8em;
line-height: 20px; }
/* line 51, ../sass/features/_imagery.scss */
.l-image-main-controlbar .left, .l-image-main-controlbar .right {
direction: rtl;
overflow: hidden; }
/* line 55, ../sass/features/_imagery.scss */
.l-image-main-controlbar .left {
text-align: left;
width: 75% !important; }
/* line 60, ../sass/features/_imagery.scss */
.l-image-main-controlbar .right {
min-width: 40px;
width: 25% !important;
z-index: 2; }
/* line 66, ../sass/features/_imagery.scss */
.l-image-main-controlbar .l-date,
.l-image-main-controlbar .l-time {
color: #fff; }
/* line 70, ../sass/features/_imagery.scss */
.l-image-main-controlbar .l-mag {
direction: ltr;
display: inline-block; }
/* line 74, ../sass/features/_imagery.scss */
.l-image-main-controlbar .l-mag:before {
content: "\000058"; }
/* line 78, ../sass/features/_imagery.scss */
.l-image-main-controlbar .s-mag {
color: #666666; }
/* line 81, ../sass/features/_imagery.scss */
.l-image-main-controlbar .l-btn.show-thumbs {
display: none; }
/* line 86, ../sass/features/_imagery.scss */
.s-image-main {
border: 1px solid transparent; }
/* line 88, ../sass/features/_imagery.scss */
.s-image-main.paused {
border-color: #c56f01; }
/*************************************** THUMBS */
/* line 98, ../sass/features/_imagery.scss */
.l-image-thumbs-wrapper {
direction: rtl;
overflow-x: auto;
overflow-y: hidden;
padding-bottom: 5px;
white-space: nowrap;
z-index: 70; }
/* line 108, ../sass/features/_imagery.scss */
.l-image-thumb-item {
-moz-transition: background-color 0.25s;
-o-transition: background-color 0.25s;
-webkit-transition: background-color 0.25s;
transition: background-color 0.25s;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 1px;
position: relative;
cursor: pointer;
direction: ltr;
display: inline-block;
font-size: 0.8em;
margin-left: 3px;
text-align: left;
width: 122px;
white-space: normal; }
/* line 113, ../sass/features/_imagery.scss */
.l-image-thumb-item .l-thumb,
.l-image-thumb-item .l-date,
.l-image-thumb-item .l-time {
display: inline-block; }
/* line 118, ../sass/features/_imagery.scss */
.l-image-thumb-item .l-date,
.l-image-thumb-item .l-time {
padding: 2px 3px; }
/* line 130, ../sass/features/_imagery.scss */
.l-image-thumb-item:hover {
background: rgba(255, 255, 255, 0.2); }
/* line 132, ../sass/features/_imagery.scss */
.l-image-thumb-item:hover .l-date,
.l-image-thumb-item:hover .l-time {
color: #fff; }
/* line 137, ../sass/features/_imagery.scss */
.l-image-thumb-item.selected {
background: #005177; }
/* line 139, ../sass/features/_imagery.scss */
.l-image-thumb-item.selected .l-date,
.l-image-thumb-item.selected .l-time {
color: #fff; }
/* line 144, ../sass/features/_imagery.scss */
.l-image-thumb-item .l-thumb {
background-color: rgba(255, 255, 255, 0.1);
height: 120px;
width: 120px;
margin-top: 0; }
/*************************************** WHEN IN FRAME */
/* line 154, ../sass/features/_imagery.scss */
.frame .t-imagery .l-image-main-wrapper {
bottom: 0; }
/* line 156, ../sass/features/_imagery.scss */
.frame .t-imagery .l-image-main-wrapper .l-image-main-controlbar {
font-size: 0.7em; }
/* line 159, ../sass/features/_imagery.scss */
.frame .t-imagery .l-image-main-wrapper .l-btn.show-thumbs {
display: inline-block; }
/* line 163, ../sass/features/_imagery.scss */
.frame .t-imagery .l-image-thumbs-wrapper {
display: none; }
/***************************************************************************** /*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government * Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space * as represented by the Administrator of the National Aeronautics and Space
@@ -2769,7 +3002,7 @@ input[type="text"] {
margin: 0 0 2px 2px; margin: 0 0 2px 2px;
overflow: hidden; overflow: hidden;
position: relative; } position: relative; }
/* line 148, ../sass/_mixins.scss */ /* line 173, ../sass/_mixins.scss */
.form-control.select:not(.disabled):hover { .form-control.select:not(.disabled):hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzRkNGQ0ZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%; background-size: 100%;
@@ -3699,106 +3932,168 @@ input[type="text"] {
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* line 27, ../sass/helpers/_bubbles.scss */ /* line 24, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper { .l-bubble-wrapper {
-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;
position: absolute; position: absolute;
z-index: 70; } z-index: 70; }
/* line 32, ../sass/helpers/_bubbles.scss */ /* line 27, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble { .l-bubble-wrapper .l-bubble {
display: inline-block;
max-width: 250px;
padding: 5px 10px; } padding: 5px 10px; }
/* line 36, ../sass/helpers/_bubbles.scss */ /* line 29, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble:before { .l-bubble-wrapper .l-bubble .l-btn.close {
padding: 0 2px;
position: absolute;
right: 5px;
top: 5px; }
/* line 36, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper .arw {
position: absolute; }
/* line 38, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper .arw.arw-up {
bottom: 100%; }
/* line 42, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper .arw.arw-down {
top: 100%; }
/* line 47, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper .l-infobubble {
display: inline-block;
max-width: 250px; }
/* line 51, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper .l-infobubble:before {
content: ""; content: "";
position: absolute; position: absolute;
width: 0; width: 0;
height: 0; } height: 0; }
/* line 42, ../sass/helpers/_bubbles.scss */ /* line 57, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble table { .l-bubble-wrapper .l-infobubble table {
width: 100%; } width: 100%; }
/* line 45, ../sass/helpers/_bubbles.scss */ /* line 60, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble table tr td { .l-bubble-wrapper .l-infobubble table tr td {
padding: 2px 0; padding: 2px 0;
vertical-align: top; } vertical-align: top; }
/* line 52, ../sass/helpers/_bubbles.scss */ /* line 67, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble table tr td.label { .l-bubble-wrapper .l-infobubble table tr td.label {
padding-right: 10px; padding-right: 10px;
white-space: nowrap; } white-space: nowrap; }
/* line 56, ../sass/helpers/_bubbles.scss */ /* line 71, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble table tr td.value { .l-bubble-wrapper .l-infobubble table tr td.value {
white-space: nowrap; } white-space: nowrap; }
/* line 60, ../sass/helpers/_bubbles.scss */ /* line 75, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble table tr td.align-wrap { .l-bubble-wrapper .l-infobubble table tr td.align-wrap {
white-space: normal; } white-space: normal; }
/* line 66, ../sass/helpers/_bubbles.scss */ /* line 81, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper .l-infobubble .title { .l-bubble-wrapper .l-infobubble .title {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
margin-bottom: 5px; } margin-bottom: 5px; }
/* line 73, ../sass/helpers/_bubbles.scss */ /* line 88, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper.arw-left { .l-bubble-wrapper.arw-left {
margin-left: 10px; } margin-left: 20px; }
/* line 75, ../sass/helpers/_bubbles.scss */ /* line 90, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper.arw-left .l-infobubble::before { .l-bubble-wrapper.arw-left .l-infobubble::before {
right: 100%; right: 100%;
border-top: 5px solid transparent; width: 0;
border-bottom: 5px solid transparent; height: 0;
border-right: 7.5px solid #ddd; } border-top: 6.66667px solid transparent;
/* line 83, ../sass/helpers/_bubbles.scss */ border-bottom: 6.66667px solid transparent;
.l-infobubble-wrapper.arw-right { border-right: 10px solid #ddd; }
margin-right: 10px; } /* line 96, ../sass/helpers/_bubbles.scss */
/* line 85, ../sass/helpers/_bubbles.scss */ .l-bubble-wrapper.arw-right {
.l-infobubble-wrapper.arw-right .l-infobubble::before { margin-right: 20px; }
/* line 98, ../sass/helpers/_bubbles.scss */
.l-bubble-wrapper.arw-right .l-infobubble::before {
left: 100%; left: 100%;
border-top: 5px solid transparent; width: 0;
border-bottom: 5px solid transparent; height: 0;
border-left: 7.5px solid #ddd; } border-top: 6.66667px solid transparent;
/* line 94, ../sass/helpers/_bubbles.scss */ border-bottom: 6.66667px solid transparent;
.l-infobubble-wrapper.arw-top .l-infobubble::before { border-left: 10px solid #ddd; }
top: 10px; }
/* line 100, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper.arw-btm .l-infobubble::before {
bottom: 10px; }
/* line 105, ../sass/helpers/_bubbles.scss */ /* line 105, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper.arw-down { .l-bubble-wrapper.arw-top .l-infobubble::before {
margin-bottom: 10px; } top: 20px; }
/* line 107, ../sass/helpers/_bubbles.scss */ /* line 111, ../sass/helpers/_bubbles.scss */
.l-infobubble-wrapper.arw-down .l-infobubble::before { .l-bubble-wrapper.arw-btm .l-infobubble::before {
left: 50%; bottom: 20px; }
top: 100%;
margin-left: -5px;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 7.5px solid #ddd; }
/* line 120, ../sass/helpers/_bubbles.scss */ /* line 121, ../sass/helpers/_bubbles.scss */
.s-infobubble { .l-thumbsbubble-wrapper {
position: absolute;
height: 183px;
width: 100%; }
/* line 126, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper .l-thumbsbubble {
overflow: hidden;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
width: auto;
height: auto; }
/* line 128, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper .l-thumbsbubble .l-image-thumbs-wrapper {
height: auto;
top: 5px !important;
right: 25px;
bottom: 5px !important;
left: 5px; }
/* line 133, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper .arw {
z-index: 2; }
/* line 138, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper.arw-up .arw.arw-down, .l-thumbsbubble-wrapper.arw-down .arw.arw-up {
display: none; }
/* line 148, ../sass/helpers/_bubbles.scss */
.s-bubble {
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
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; }
/* line 154, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper .arw-up {
width: 0;
height: 0;
border-left: 6.66667px solid transparent;
border-right: 6.66667px solid transparent;
border-bottom: 10px solid #4d4d4d; }
/* line 157, ../sass/helpers/_bubbles.scss */
.l-thumbsbubble-wrapper .arw-down {
width: 0;
height: 0;
border-left: 6.66667px solid transparent;
border-right: 6.66667px solid transparent;
border-top: 10px solid #4d4d4d; }
/* line 161, ../sass/helpers/_bubbles.scss */
.s-infobubble {
background: #ddd; background: #ddd;
color: #666; color: #666;
font-size: 0.8rem; } font-size: 0.8rem; }
/* line 126, ../sass/helpers/_bubbles.scss */ /* line 166, ../sass/helpers/_bubbles.scss */
.s-infobubble .title { .s-infobubble .title {
color: #333333; color: #333333;
font-weight: bold; } font-weight: bold; }
/* line 131, ../sass/helpers/_bubbles.scss */ /* line 171, ../sass/helpers/_bubbles.scss */
.s-infobubble tr td { .s-infobubble tr td {
border-top: 1px solid #c4c4c4; border-top: 1px solid #c4c4c4;
font-size: 0.9em; } font-size: 0.9em; }
/* line 135, ../sass/helpers/_bubbles.scss */ /* line 175, ../sass/helpers/_bubbles.scss */
.s-infobubble tr:first-child td { .s-infobubble tr:first-child td {
border-top: none; } border-top: none; }
/* line 139, ../sass/helpers/_bubbles.scss */ /* line 179, ../sass/helpers/_bubbles.scss */
.s-infobubble .value { .s-infobubble .value {
color: #333333; } color: #333333; }
/* line 184, ../sass/helpers/_bubbles.scss */
.s-thumbsbubble {
background: #4d4d4d;
color: #b3b3b3; }
/***************************************************************************** /*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government * Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space * as represented by the Administrator of the National Aeronautics and Space
@@ -3849,7 +4144,7 @@ input[type="text"] {
right: 0; right: 0;
width: auto; width: auto;
height: 5px; } height: 5px; }
/* line 120, ../sass/_mixins.scss */ /* line 145, ../sass/_mixins.scss */
.split-layout.horizontal > .splitter:before { .split-layout.horizontal > .splitter:before {
content: ''; content: '';
display: block; display: block;
@@ -3860,7 +4155,7 @@ input[type="text"] {
top: 2px; top: 2px;
left: 5px; left: 5px;
right: 5px; } right: 5px; }
/* line 141, ../sass/_mixins.scss */ /* line 166, ../sass/_mixins.scss */
.split-layout.horizontal > .splitter:not(.disabled):hover:before { .split-layout.horizontal > .splitter:not(.disabled):hover:before {
border-color: rgba(0, 153, 204, 0.9); } border-color: rgba(0, 153, 204, 0.9); }
/* line 63, ../sass/helpers/_splitter.scss */ /* line 63, ../sass/helpers/_splitter.scss */
@@ -3878,7 +4173,7 @@ input[type="text"] {
bottom: 0; bottom: 0;
cursor: col-resize; cursor: col-resize;
width: 5px; } width: 5px; }
/* line 120, ../sass/_mixins.scss */ /* line 145, ../sass/_mixins.scss */
.split-layout.vertical > .splitter:before { .split-layout.vertical > .splitter:before {
content: ''; content: '';
display: block; display: block;
@@ -3889,7 +4184,7 @@ input[type="text"] {
left: 2px; left: 2px;
bottom: 5px; bottom: 5px;
top: 5px; } top: 5px; }
/* line 141, ../sass/_mixins.scss */ /* line 166, ../sass/_mixins.scss */
.split-layout.vertical > .splitter:not(.disabled):hover:before { .split-layout.vertical > .splitter:not(.disabled):hover:before {
border-color: rgba(0, 153, 204, 0.9); } border-color: rgba(0, 153, 204, 0.9); }

View File

@@ -86,7 +86,7 @@
ul.tree { ul.tree {
margin: 0; margin: 0;
padding: 0; } padding: 0; }
/* line 208, ../sass/_mixins.scss */ /* line 233, ../sass/_mixins.scss */
ul.tree li { ul.tree li {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;

View File

@@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg> <svg>
<metadata> <metadata>
Created by FontForge 20090622 at Mon May 4 20:21:42 2015 Created by FontForge 20090622 at Fri Jun 5 15:37:46 2015
By deploy user By deploy user
Copyright 2015 Adobe Systems Incorporated. All rights reserved. Copyright 2015 Adobe Systems Incorporated. All rights reserved.
</metadata> </metadata>
@@ -62,8 +62,10 @@ q52 -180 95 -231q42 53 88 212z" />
d="M193 787v-193h-193v193h193zM193 491v-195h-193v195h193zM193 193v-193h-193v193h193zM671 732v-82h-388v82h388zM671 435v-81h-388v81h388zM671 138v-82h-388v82h388z" /> d="M193 787v-193h-193v193h193zM193 491v-195h-193v195h193zM193 193v-193h-193v193h193zM671 732v-82h-388v82h388zM671 435v-81h-388v81h388zM671 138v-82h-388v82h388z" />
<glyph glyph-name="eight" unicode="8" horiz-adv-x="636" <glyph glyph-name="eight" unicode="8" horiz-adv-x="636"
d="M625 735v-318h-625v318h625zM625 315v-315h-625v315h625z" /> d="M625 735v-318h-625v318h625zM625 315v-315h-625v315h625z" />
<glyph glyph-name="nine" unicode="9" horiz-adv-x="636" <glyph glyph-name="nine" unicode="9"
d="M267 735v-319h-267v319h267zM267 315v-315h-267v315h267zM630 735v-319h-267v319h267zM630 315v-315h-267v315h267z" /> d="M328 469q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 19 14 33t33 14h234q20 0 33.5 -13.5t13.5 -33.5v-234zM750 469q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 20 13.5 33.5t33.5 13.5h234q19 0 33 -14
t14 -33v-234zM328 47q0 -20 -13.5 -33.5t-33.5 -13.5h-234q-19 0 -33 14t-14 33v234q0 20 13.5 33.5t33.5 13.5h234q20 0 33.5 -13.5t13.5 -33.5v-234zM750 47q0 -19 -14 -33t-33 -14h-234q-20 0 -33.5 13.5t-13.5 33.5v234q0 20 13.5 33.5t33.5 13.5h234q20 0 33.5 -13.5
t13.5 -33.5v-234z" />
<glyph glyph-name="colon" unicode=":" horiz-adv-x="625" <glyph glyph-name="colon" unicode=":" horiz-adv-x="625"
d="M625 -19l-397 397l397 397v-794zM173 756v-735h-173v735h173z" /> d="M625 -19l-397 397l397 397v-794zM173 756v-735h-173v735h173z" />
<glyph glyph-name="semicolon" unicode=";" horiz-adv-x="624" <glyph glyph-name="semicolon" unicode=";" horiz-adv-x="624"
@@ -163,8 +165,8 @@ d="M123 367l-123 123v147l123 -123l220 221v-147zM123 0l-123 123v147l123 -123l220
d="M123 93l-123 123v147l123 -123l220 220v-147zM485 262v71h313v-71h-313z" /> d="M123 93l-123 123v147l123 -123l220 220v-147zM485 262v71h313v-71h-313z" />
<glyph glyph-name="l" unicode="l" horiz-adv-x="617" <glyph glyph-name="l" unicode="l" horiz-adv-x="617"
d="M551 386h66v-386h-617v386h63v106q0 100 72 171.5t173 71.5q99 0 171 -71.5t72 -171.5v-106zM173 492v-106h267v106q0 56 -38.5 94.5t-93.5 38.5q-56 0 -95.5 -39t-39.5 -94z" /> d="M551 386h66v-386h-617v386h63v106q0 100 72 171.5t173 71.5q99 0 171 -71.5t72 -171.5v-106zM173 492v-106h267v106q0 56 -38.5 94.5t-93.5 38.5q-56 0 -95.5 -39t-39.5 -94z" />
<glyph glyph-name="m" unicode="m" horiz-adv-x="804" <glyph glyph-name="m" unicode="m" horiz-adv-x="751"
d="M804 729v-156h-804v156h804zM804 445v-160h-804v160h804zM804 158v-158h-804v158h804z" /> d="M751 563h-751v188h751v-188zM751 282h-751v187h751v-187zM751 0h-751v188h751v-188z" />
<glyph glyph-name="n" unicode="n" horiz-adv-x="738" <glyph glyph-name="n" unicode="n" horiz-adv-x="738"
d="M690 697q48 -50 48 -88q0 -18 -10 -26l-243 -243l-3 -3l-4 -2l-227 -78l77 228l2 4l3 3l242 243q22 19 57 3q29 -14 58 -41zM461 371l1 2l-3 50l-34 2h-9v10v28l-51 6l-2 -1l-32 -97l33 -33zM249 512l-134 -389l304 104v-215q-136 -8 -246.5 29t-172.5 93v561 d="M690 697q48 -50 48 -88q0 -18 -10 -26l-243 -243l-3 -3l-4 -2l-227 -78l77 228l2 4l3 3l242 243q22 19 57 3q29 -14 58 -41zM461 371l1 2l-3 50l-34 2h-9v10v28l-51 6l-2 -1l-32 -97l33 -33zM249 512l-134 -389l304 104v-215q-136 -8 -246.5 29t-172.5 93v561
q48 -42 125 -75.5t172 -43.5l-24 -25l-17 -17z" /> q48 -42 125 -75.5t172 -43.5l-24 -25l-17 -17z" />
@@ -232,6 +234,19 @@ d="M748 750l-375 -750l-374 750h749z" />
d="M-1 0l375 750l374 -750h-749z" /> d="M-1 0l375 750l374 -750h-749z" />
<glyph glyph-name="icircumflex" unicode="&#xee;" horiz-adv-x="748" <glyph glyph-name="icircumflex" unicode="&#xee;" horiz-adv-x="748"
d="M748 750l-375 -375l-374 375h749zM748 375l-375 -374l-374 374h749z" /> d="M748 750l-375 -375l-374 375h749zM748 375l-375 -374l-374 374h749z" />
<glyph glyph-name="idieresis" unicode="&#xef;"
d="M0 749l750 -375l-750 -374v749z" />
<glyph glyph-name="ntilde" unicode="&#xf1;"
d="M283 751v-751h-188v751h188zM658 751v-751h-188v751h188z" />
<glyph glyph-name="ograve" unicode="&#xf2;" horiz-adv-x="751"
d="M469 563h-102q-74 0 -126.5 -52.5t-52.5 -126.5v-102h-94q-38 0 -66 27.5t-28 65.5v282q0 38 28 66t66 28h281q39 0 66.5 -28t27.5 -66v-94zM657 469q38 0 66 -27.5t28 -66.5v-281q0 -38 -28 -66t-66 -28h-282q-38 0 -65.5 28t-27.5 66v281q0 39 27.5 66.5t65.5 27.5h282
z" />
<glyph glyph-name="oacute" unicode="&#xf3;" horiz-adv-x="751"
d="M216 375l187 -187h-309q-38 0 -66 27.5t-28 66.5v375q0 38 28 66t66 28h375q39 0 66.5 -28t27.5 -66v-309l-188 187zM751 422v-422h-422v94h234l-281 281l93 94l282 -281v234h94z" />
<glyph glyph-name="ocircumflex" unicode="&#xf4;" horiz-adv-x="751"
d="M610 751q58 0 99.5 -41.5t41.5 -99.5v-469q0 -59 -41.5 -100t-99.5 -41h-469q-59 0 -100 41t-41 100v469q0 58 41 99.5t100 41.5h469zM610 282v328h-328l93 -94l-234 -375l375 234z" />
<glyph glyph-name="odieresis" unicode="&#xf6;"
d="M328 562v-375h-328v375h328zM750 562v-375h-328v375h328z" />
<glyph glyph-name="fraction" unicode="&#x2044;" horiz-adv-x="761" <glyph glyph-name="fraction" unicode="&#x2044;" horiz-adv-x="761"
d="M380 751q158 0 269.5 -111.5t111.5 -268.5q0 -133 -82.5 -236.5t-209.5 -134.5l-4 491l-176 -490q-126 31 -207.5 134.5t-81.5 235.5q0 157 111.5 268.5t268.5 111.5zM168 488l55 20l-34 94l-56 -20zM410 530v100h-59v-100h59zM593 488l34 94l-55 20l-34 -94z" /> d="M380 751q158 0 269.5 -111.5t111.5 -268.5q0 -133 -82.5 -236.5t-209.5 -134.5l-4 491l-176 -490q-126 31 -207.5 134.5t-81.5 235.5q0 157 111.5 268.5t268.5 111.5zM168 488l55 20l-34 94l-56 -20zM410 530v100h-59v-100h59zM593 488l34 94l-55 20l-34 -94z" />
<glyph glyph-name="H.002" horiz-adv-x="803" <glyph glyph-name="H.002" horiz-adv-x="803"

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 24 KiB

View File

@@ -34,9 +34,12 @@ $colorBodyBg: #333;
$colorBodyFg: #999; $colorBodyFg: #999;
$colorFooterBg: #000; $colorFooterBg: #000;
$colorKey: #0099cc; $colorKey: #0099cc;
$colorKeySelectedBg: #005177;
$colorKeyFg: #fff; $colorKeyFg: #fff;
$colorAlt1: #ffc700; $colorAlt1: #ffc700;
$colorAlert: #ff3c00; $colorAlert: #ff3c00;
$colorPausedBg: #c56f01;
$colorPausedFg: #fff;
$colorCheck: $colorKey; $colorCheck: $colorKey;
$colorCreateBtn: $colorKey; $colorCreateBtn: $colorKey;
$colorInteriorBorder: lighten($colorBodyBg, 10%); $colorInteriorBorder: lighten($colorBodyBg, 10%);
@@ -50,7 +53,11 @@ $colorLimitYellow: #9d7500;
$colorLimitRed: #aa0000; $colorLimitRed: #aa0000;
$colorTelemFresh: #fff; $colorTelemFresh: #fff;
$colorTelemStale: #888; $colorTelemStale: #888;
$styleTelemState: italic; $styleTelemStale: italic;
$colorInfoBubbleFg: #666;
$colorInfoBubbleBg: #ddd;
$colorThumbsBubbleFg: lighten($colorBodyFg, 10%);
$colorThumbsBubbleBg: lighten($colorBodyBg, 10%);
// Ratios // Ratios
$ltGamma: 20%; $ltGamma: 20%;
@@ -124,3 +131,13 @@ $tickLblH: 15px;
$tickLblW: 50px; $tickLblW: 50px;
$tickH: $ticksH - $tickLblVMargin - $tickLblH; $tickH: $ticksH - $tickLblVMargin - $tickLblH;
$tickW: 1px; $tickW: 1px;
// Imagery
$imageMainControlBarH: 20px;
$imageThumbsD: 120px;
$imageThumbsWrapperH: $imageThumbsD * 1.4;
$imageThumbPad: 1px;
// Bubbles
$bubbleArwSize: 10px;
$bubblePad: $interiorMargin;

View File

@@ -44,7 +44,7 @@ a.disabled {
} }
@include keyframes(pulse) { @include keyframes(pulse) {
0% { opacity: 0.2; } 0% { opacity: 0.5; }
100% { opacity: 1; } 100% { opacity: 1; }
} }
@@ -57,5 +57,5 @@ a.disabled {
} }
.pulse { .pulse {
@include pulse(1000ms); @include pulse(750ms);
} }

View File

@@ -117,6 +117,13 @@ span {
display: none !important; display: none !important;
} }
.paused {
&:not(.s-btn) {
border-color: $colorPausedBg !important;
color: $colorPausedBg !important;
}
}
.sep { .sep {
color: rgba(#fff, 0.2); color: rgba(#fff, 0.2);
} }

View File

@@ -45,6 +45,7 @@
@import "controls/controls"; @import "controls/controls";
@import "controls/lists"; @import "controls/lists";
@import "controls/menus"; @import "controls/menus";
@import "features/imagery";
@import "forms/mixins"; @import "forms/mixins";
@import "forms/elems"; @import "forms/elems";
@import "forms/validation"; @import "forms/validation";

View File

@@ -62,6 +62,31 @@
border-right: $size/$ratio solid transparent; border-right: $size/$ratio solid transparent;
} }
@mixin triangle($dir: "left", $size: 5px, $ratio: 1, $color: red) {
//$size: $size*2;
width: 0;
height: 0;
$slopedB: $size/$ratio solid transparent;
$straightB: $size solid $color;
@if $dir == "up" {
border-left: $slopedB;
border-right: $slopedB;
border-bottom: $straightB;
} @else if $dir == "right" {
border-top: $slopedB;
border-bottom: $slopedB;
border-left: $straightB;
} @else if $dir == "down" {
border-left: $slopedB;
border-right: $slopedB;
border-top: $straightB;
} @else {
border-top: $slopedB;
border-bottom: $slopedB;
border-right: $straightB;
}
}
@mixin bgDiagonalStripes($c: yellow, $a: 0.1, $d: 40px) { @mixin bgDiagonalStripes($c: yellow, $a: 0.1, $d: 40px) {
@include background-image(linear-gradient(-45deg, @include background-image(linear-gradient(-45deg,
rgba($c, $a) 25%, transparent 25%, rgba($c, $a) 25%, transparent 25%,

View File

@@ -19,25 +19,28 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
$pad: $interiorMargin * 2; $pad: $interiorMargin * 1.5;
/*********************************** TYPE STYLES */ /*********************************** TYPE STYLES */
.t-btn { .t-btn {
cursor: pointer; cursor: pointer;
} }
/*********************************** STYLE STYLES */ /*********************************** STYLE STYLES */
.s-btn { .s-btn {
$base: lighten($colorBodyBg, 20%);
@include border-radius($controlCr); @include border-radius($controlCr);
@include box-sizing(border-box); @include box-sizing(border-box);
@include text-shadow(rgba(black, 0.3) 0 1px 1px); @include text-shadow(rgba(black, 0.3) 0 1px 1px);
line-height: 1.2em; line-height: 1.2em;
padding: 0 $pad;
text-decoration: none; text-decoration: none;
&.s-very-subtle { &.s-very-subtle {
@include containerSubtle($colorBodyBg, $colorBodyFg, true); @include containerSubtle($colorBodyBg, $colorBodyFg, true);
&.paused {
@include containerSubtle($colorPausedBg, $colorPausedFg, true);
.icon:before {
content:"\0000EF";
}
}
} }
} }
@@ -47,9 +50,20 @@ $pad: $interiorMargin * 2;
.icon { .icon {
color: $colorKey; color: $colorKey;
} }
&.paused {
.icon {
color: $colorPausedFg;
}
}
&:not(.disabled):hover .icon { &:not(.disabled) {
color: lighten($colorKey, $ltGamma); &:not(.paused) {
&:hover {
.icon {
color: lighten($colorKey, $ltGamma);
}
}
}
} }
&.labeled { &.labeled {
@@ -61,8 +75,22 @@ $pad: $interiorMargin * 2;
margin-left: $interiorMargin; margin-left: $interiorMargin;
} }
} }
}
&.pause-play {
&.paused {
@include pulse(500ms);
}
.icon:before {
content:"\0000F1";
}
}
&.show-thumbs {
.icon:before {
content:"\000039";
}
}
}
/*********************************** LAYOUT STYLES */ /*********************************** LAYOUT STYLES */
span.l-btn, span.l-btn,
@@ -70,4 +98,14 @@ span.l-btn span,
a.l-btn, a.l-btn,
a.l-btn span { a.l-btn span {
display: inline-block; display: inline-block;
}
.l-btn {
padding: 0 $pad;
&.sm {
padding: 0 $interiorMargin;
}
&.vsm {
padding: 0 $interiorMargin/2;
}
} }

View File

@@ -0,0 +1,166 @@
.l-image-main-wrapper,
.l-image-main,
.l-image-main-controlbar,
.l-image-main-controlbar .left,
.l-image-main-controlbar .right,
.l-image-thumbs-wrapper {
@include absPosDefault(0, false);
}
/*************************************** MAIN LAYOUT */
.l-image-main-wrapper {
//@include test();
bottom: $interiorMargin*2 + $imageThumbsWrapperH;
min-height: 100px;
min-width: 150px;
.l-image-main {
background-color: rgba(#fff, 0.1);
bottom: $imageMainControlBarH + $interiorMargin;
}
.l-image-main-controlbar {
top: auto;
height: $imageMainControlBarH;
}
}
.l-image-thumbs-wrapper {
//@include test(red);
top: auto;
height: $imageThumbsWrapperH;
}
.l-date,
.l-time,
.l-timezone {
display: inline-block;
}
/*************************************** MAIN IMAGE */
.l-image-main,
.l-image-thumb-item .l-thumb {
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
.l-image-main-controlbar {
//@include test();
font-size: 0.8em;
line-height: $imageMainControlBarH;
.left, .right {
direction: rtl;
overflow: hidden;
}
.left {
//@include test(red);
text-align: left;
width: 75% !important;
}
.right {
//@include test(green);
min-width: 40px;
width: 25% !important;
z-index: 2;
}
.l-date,
.l-time {
color: #fff;
}
.l-mag {
direction: ltr;
display: inline-block;
//white-space: nowrap;
&:before {
content: "\000058";
}
}
.s-mag {
color: darken($colorBodyFg, 20%);
}
.l-btn.show-thumbs {
display: none;
}
}
.s-image-main {
border: 1px solid transparent;
&.paused {
border-color: $colorPausedBg;
}
}
/*************************************** THUMBS */
.l-image-thumb-item {
}
.l-image-thumbs-wrapper {
//@include test(green);
direction: rtl;
overflow-x: auto;
overflow-y: hidden;
padding-bottom: $interiorMargin;
white-space: nowrap;
z-index: 70;
}
.l-image-thumb-item {
@include single-transition(background-color, 0.25s);
@include box-sizing(border-box);
padding: 1px;
position: relative;
.l-thumb,
.l-date,
.l-time {
display: inline-block;
}
.l-date,
.l-time {
padding: 2px 3px;
}
cursor: pointer;
direction: ltr;
display: inline-block;
font-size: 0.8em;
margin-left: $interiorMarginSm;
text-align: left;
width: $imageThumbsD + $imageThumbPad*2;
white-space: normal;
&:hover {
background: rgba(#fff, 0.2);
.l-date,
.l-time {
color: #fff;
}
}
&.selected {
background: $colorKeySelectedBg;
.l-date,
.l-time {
color: #fff;
}
}
.l-thumb {
background-color: rgba(#fff, 0.1);
height: $imageThumbsD;
width: $imageThumbsD;
margin-top: 0;
}
}
/*************************************** WHEN IN FRAME */
.frame .t-imagery {
.l-image-main-wrapper {
bottom: 0;
.l-image-main-controlbar {
font-size: 0.7em;
}
.l-btn.show-thumbs {
display: inline-block;
}
}
.l-image-thumbs-wrapper {
display: none;
}
}

View File

@@ -21,18 +21,33 @@
*****************************************************************************/ *****************************************************************************/
//************************************************* LAYOUT //************************************************* LAYOUT
$infoBubbleFg: #666; .l-bubble-wrapper {
$infoBubbleBg: #ddd;
.l-infobubble-wrapper {
$arwSize: 5px;
@include box-shadow(rgba(black, 0.4) 0 1px 5px);
position: absolute; position: absolute;
z-index: 70; z-index: 70;
.l-bubble {
padding: $bubblePad $bubblePad*2;
.l-btn.close {
padding: 0 2px;
position: absolute;
right: $interiorMargin;
top: $interiorMargin;
}
}
.arw {
position: absolute;
&.arw-up {
bottom: 100%;
}
&.arw-down {
top: 100%;
}
}
.l-infobubble { .l-infobubble {
display: inline-block; display: inline-block;
max-width: 250px; max-width: 250px;
padding: 5px 10px; //padding: 5px 10px;
&:before { &:before {
content:""; content:"";
position: absolute; position: absolute;
@@ -71,57 +86,82 @@ $infoBubbleBg: #ddd;
} }
&.arw-left { &.arw-left {
margin-left: $arwSize*2; margin-left: $bubbleArwSize*2;
.l-infobubble::before { .l-infobubble::before {
right: 100%; right: 100%;
border-top: $arwSize solid transparent; @include triangle('left', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
border-bottom: $arwSize solid transparent;
border-right: ($arwSize * 1.5) solid $infoBubbleBg;
} }
} }
&.arw-right { &.arw-right {
margin-right: $arwSize*2; margin-right: $bubbleArwSize*2;
.l-infobubble::before { .l-infobubble::before {
left: 100%; left: 100%;
border-top: $arwSize solid transparent; @include triangle('right', $bubbleArwSize, 1.5, $colorInfoBubbleBg);
border-bottom: $arwSize solid transparent;
border-left: ($arwSize * 1.5) solid $infoBubbleBg;
} }
} }
&.arw-top { &.arw-top {
.l-infobubble::before { .l-infobubble::before {
top: $arwSize * 2; top: $bubbleArwSize * 2;
} }
} }
&.arw-btm { &.arw-btm {
.l-infobubble::before { .l-infobubble::before {
bottom: $arwSize * 2; bottom: $bubbleArwSize * 2;
} }
} }
&.arw-down { &.arw-down {
margin-bottom: $arwSize*2;
.l-infobubble::before { }
left: 50%; }
top: 100%;
margin-left: -1 * $arwSize; .l-thumbsbubble-wrapper {
border-left: $arwSize solid transparent; $closeBtnD: 15px;
border-right: $arwSize solid transparent; position: absolute;
border-top: ($arwSize * 1.5) solid $infoBubbleBg; height: $imageThumbsWrapperH + $bubblePad*2 + $interiorMargin;
width: 100%;
.l-thumbsbubble {
@include absPosDefault();
.l-image-thumbs-wrapper {
height: auto;
top: $bubblePad !important; right: $closeBtnD + ($interiorMargin*2); bottom: $bubblePad !important; left: $bubblePad;
} }
} }
.arw {
//left: 50%;
//margin-left: $bubbleArwSize / -2;
z-index: 2;
}
&.arw-up .arw.arw-down,
&.arw-down .arw.arw-up { display: none; }
} }
//************************************************* LOOK AND FEEL //************************************************* LOOK AND FEEL
.s-infobubble { .s-bubble-wrapper {
$emFg: darken($infoBubbleFg, 20%); //@include box-shadow(rgba(black, 0.4) 0 1px 5px);
}
.s-bubble {
@include border-radius($basicCr); @include border-radius($basicCr);
background: $infoBubbleBg; @include box-shadow(rgba(black, 0.4) 0 1px 5px);
color: $infoBubbleFg; }
.l-thumbsbubble-wrapper {
.arw-up {
@include triangle('up', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
}
.arw-down {
@include triangle('down', $bubbleArwSize, 1.5, $colorThumbsBubbleBg);
}
}
.s-infobubble {
$emFg: darken($colorInfoBubbleFg, 20%);
background: $colorInfoBubbleBg;
color: $colorInfoBubbleFg;
font-size: 0.8rem; font-size: 0.8rem;
.title { .title {
color: $emFg; color: $emFg;
@@ -129,7 +169,7 @@ $infoBubbleBg: #ddd;
} }
tr { tr {
td { td {
border-top: 1px solid darken($infoBubbleBg, 10%); border-top: 1px solid darken($colorInfoBubbleBg, 10%);
font-size: 0.9em; font-size: 0.9em;
} }
&:first-child td { &:first-child td {
@@ -139,5 +179,9 @@ $infoBubbleBg: #ddd;
.value { .value {
color: $emFg; color: $emFg;
} }
}
.s-thumbsbubble {
background: $colorThumbsBubbleBg;
color: $colorThumbsBubbleFg;
} }

View File

@@ -99,7 +99,7 @@ ul.tree {
&.selected { &.selected {
$c: #fff; $c: #fff;
background: #005177; background: $colorKeySelectedBg;
color: $c; color: $c;
.view-control { .view-control {
color: $colorItemTreeIcon; color: $colorItemTreeIcon;

View File

@@ -70,23 +70,19 @@
&.abs { &.abs {
text-wrap: none; text-wrap: none;
white-space: nowrap; white-space: nowrap;
&.left, }
.left { &.left,
width: 45%; .left {
right: auto; width: 45% !important;
} right: auto !important;
&.right, }
.right { &.right,
width: 45%; .right {
left: auto; width: 45% !important;
right: 0; left: auto !important;
text-align: right; text-align: right;
.icon.major { .icon.major {
margin-left: $interiorMargin * 3; margin-left: $interiorMargin * 3;
}
// .icon.major {
// margin-left: $interiorMargin;
// }
} }
} }
} }

View File

@@ -19,27 +19,129 @@
this source code distribution or the Licensing information page available this source code distribution or the Licensing information page available
at runtime from the About dialog for additional information. at runtime from the About dialog for additional information.
--> -->
<h1>Static Markup Sandbox</h1> <div ng-init="images=[
{date:'2020/04/27',time:'16:03:43',url:'http://www.hacskaylo.com/wedding/images/moon-surface-with-ice.jpg',selected:true},
{date:'2020/04/27',time:'16:03:14',url:'http://www.lpi.usra.edu/lunar/lunar_flyovers/schrodinger/schrodinger.png',selected:false},
{date:'2020/04/27',time:'16:02:49',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false},
{date:'2020/04/27',time:'16:02:36',url:'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR0AIRCUQQ40JIImjwlp_uYAT7ftyqJcbYBytKpvp7iIFUkLbA6',selected:false},
{date:'2020/04/27',time:'16:02:29',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
{date:'2020/04/27',time:'16:02:07',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
{date:'2020/04/27',time:'16:01:37',url:'http://www.lpi.usra.edu/lunar/lunar_flyovers/schrodinger/schrodinger.png',selected:false},
{date:'2020/04/27',time:'16:01:25',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false},
{date:'2020/04/27',time:'16:01:03',url:'https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR0AIRCUQQ40JIImjwlp_uYAT7ftyqJcbYBytKpvp7iIFUkLbA6',selected:false},
{date:'2020/04/27',time:'16:01:02',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
{date:'2020/04/27',time:'16:00:57',url:'http://www.virtualmicroscope.org/sites/default/files/styles/large_carousel/public/800-15499_a15pan1463033.jpg?itok=NMQhLnuY',selected:false},
{date:'2020/04/27',time:'16:00:27',url:'http://www.arcadiastreet.com/cgvistas/images/luna_southern_hemisphere_1280.jpg',selected:false}
];
clipped=true;
showThumbsBubble=false;
"></div>
<h2>Plot limits</h2> <div class="t-imagery">
<div ng-init="limits=[ <!-- Main image -->
<div class="l-image-main-wrapper">
<div
class="l-image-main s-image-main"
ng-class="{ paused:paused, stale:false }"
style="background-image:url('http://www.hacskaylo.com/wedding/images/moon-surface-with-ice.jpg');"
></div>
<div class="l-image-main-controlbar bar">
<div class="left">
<a
class="t-btn l-btn s-btn s-icon-btn s-very-subtle show-thumbs sm"
ng-click="showThumbsBubble = (showThumbsBubble)? false:true"
><span class="ui-symbol icon"></span></a>
<span class="l-timezone">UTC</span>
<span class="l-time">16:03:43</span>
<span class="l-date">2020/04/27</span>
</div>
<div class="right">
<a
class="t-btn l-btn s-btn s-icon-btn s-very-subtle pause-play sm"
ng-click="paused = (paused)? false:true"
ng-class="{ paused:paused }"
><span class="ui-symbol icon"></span></a>
<a href=""
class="l-btn s-btn s-icon-btn l-mag s-mag ui-symbol vsm"
ng-click="clipped = false"
ng-show="clipped === true"
title="117%: Click to reset"
></a>
</div>
</div>
</div>
<div class="l-image-thumbs-wrapper">
<div
class="l-image-thumb-item s-image-thumb-item"
ng-repeat="thumb in images"
ng-class="{ selected : thumb.selected }"
>
<div class="l-thumb" style="background-image:url('{{thumb.url}}')"></div>
<div class="l-date">{{thumb.date}}</div>
<div class="l-time">{{thumb.time}}</div><span class="l-timezone">UTC</span>
</div>
</div>
</div>
<!-- NOTE: CANONICAL VERSION OF THIS MARKUP IS IN /platform/commonUI/inspect/res/thumbsbubble.html -->
<div
class="l-bubble-wrapper s-bubble-wrapper l-thumbsbubble-wrapper"
ng-class="{ 'arw-up':true }"
ng-style="{ top: '258px' }"
ng-show="showThumbsBubble === true"
>
<div
class="arw arw-up"
ng-style="{ left: '215px' }"
></div>
<div class="l-bubble s-bubble l-thumbsbubble s-thumbsbubble">
<a
ng-click="showThumbsBubble = false"
class="s-btn l-btn normal ui-symbol close"
>x</a>
<div class="l-image-thumbs-wrapper">
<div
class="l-image-thumb-item s-image-thumb-item"
ng-repeat="thumb in images"
ng-class="{ selected : thumb.selected }"
>
<div class="l-thumb" style="background-image:url('{{thumb.url}}')"></div>
<div class="l-date">{{thumb.date}}</div>
<div class="l-time">{{thumb.time}}</div>
</div>
</div>
</div>
<div
class="arw arw-down"
ng-style="{ left: '613px' }"
></div>
</div>
<div class="hidden">
<h2>Plot limits</h2>
<div ng-init="limits=[
{type: 'upr', severity: 'red', top: 0, bottom: 90}, {type: 'upr', severity: 'red', top: 0, bottom: 90},
{type: 'upr', severity: 'yellow', top: 10, bottom: 80}, {type: 'upr', severity: 'yellow', top: 10, bottom: 80},
{type: 'lwr', severity: 'yellow', top: 70, bottom: 20}, {type: 'lwr', severity: 'yellow', top: 70, bottom: 20},
{type: 'lwr', severity: 'red', top: 80, bottom: 0} {type: 'lwr', severity: 'red', top: 80, bottom: 0}
]"></div> ]"></div>
<div style="width: 1000px; height: 500px"> <div style="width: 1000px; height: 500px">
<div class="gl-plot" style="height: 100%;"> <div class="gl-plot" style="height: 100%;">
<div class="gl-plot-display-area"> <div class="gl-plot-display-area">
<div <div
ng-repeat="limit in limits" ng-repeat="limit in limits"
ng-show="1" ng-show="1"
class="t-limit l-limit s-limit-{{limit.type}}-{{limit.severity}}" class="t-limit l-limit s-limit-{{limit.type}}-{{limit.severity}}"
style="top: {{limit.top}}%; bottom: {{limit.bottom}}%" style="top: {{limit.top}}%; bottom: {{limit.bottom}}%"
></div> ></div>
</div> </div>
</div> </div>
</div> </div>
<h2>Animation</h2> <h2>Animation</h2>
<div class="pulse" style="background: #cc0000; color: #fff; padding: 10px;">This should pulse</div>
<div class="pulse" style="background: #cc0000; color: #fff; padding: 10px;">This should pulse</div>
</div>