mirror of
https://github.com/nasa/openmct.git
synced 2025-01-29 23:53:56 +00:00
[Frontend] CSS change to center fixed position images
WTD-1048 WTD-957
This commit is contained in:
parent
8018c8f42e
commit
379e76af4f
@ -388,21 +388,21 @@ span {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
z-index: 0; }
|
z-index: 0; }
|
||||||
/* line 28, ../sass/_fixed-position.scss */
|
/* line 21, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item {
|
.t-fixed-position .l-fixed-position-item {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border: 1px solid transparent; }
|
border: 1px solid transparent; }
|
||||||
/* line 32, ../sass/_fixed-position.scss */
|
/* line 25, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item.s-selected {
|
.t-fixed-position .l-fixed-position-item.s-selected {
|
||||||
-webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
-webkit-box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
||||||
-moz-box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
-moz-box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
||||||
box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
box-shadow: rgba(0, 0, 0, 0.7) 0 3px 10px;
|
||||||
border-color: #0099cc;
|
border-color: #0099cc;
|
||||||
cursor: move; }
|
cursor: move; }
|
||||||
/* line 37, ../sass/_fixed-position.scss */
|
/* line 30, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item.s-not-selected {
|
.t-fixed-position .l-fixed-position-item.s-not-selected {
|
||||||
opacity: 0.8; }
|
opacity: 0.8; }
|
||||||
/* line 43, ../sass/_fixed-position.scss */
|
/* line 36, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-box,
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-box,
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-image,
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-image,
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text {
|
||||||
@ -411,20 +411,20 @@ span {
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%; }
|
width: 100%; }
|
||||||
/* line 51, ../sass/_fixed-position.scss */
|
/* line 44, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-image {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-image {
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: left top; }
|
background-position: center; }
|
||||||
/* line 57, ../sass/_fixed-position.scss */
|
/* line 50, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text {
|
||||||
text-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
|
text-shadow: rgba(0, 0, 0, 0.1) 0 1px 2px;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
font-size: 0.8rem; }
|
font-size: 0.8rem; }
|
||||||
/* line 62, ../sass/_fixed-position.scss */
|
/* line 55, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-static-text {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-static-text {
|
||||||
padding: 3px; }
|
padding: 3px; }
|
||||||
/* line 67, ../sass/_fixed-position.scss */
|
/* line 60, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -438,41 +438,41 @@ span {
|
|||||||
-moz-box-sizing: border-box;
|
-moz-box-sizing: border-box;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 50%; }
|
width: 50%; }
|
||||||
/* line 71, ../sass/_fixed-position.scss */
|
/* line 64, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-title {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-title {
|
||||||
right: auto;
|
right: auto;
|
||||||
left: 3px; }
|
left: 3px; }
|
||||||
/* line 75, ../sass/_fixed-position.scss */
|
/* line 68, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-value {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-value {
|
||||||
right: 3px;
|
right: 3px;
|
||||||
left: auto;
|
left: auto;
|
||||||
text-align: right; }
|
text-align: right; }
|
||||||
/* line 80, ../sass/_fixed-position.scss */
|
/* line 73, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-value.telem-only {
|
.t-fixed-position .l-fixed-position-item .l-fixed-position-text.l-telemetry .l-elem.l-value.telem-only {
|
||||||
left: 3px;
|
left: 3px;
|
||||||
width: auto; }
|
width: auto; }
|
||||||
/* line 91, ../sass/_fixed-position.scss */
|
/* line 84, ../sass/_fixed-position.scss */
|
||||||
.t-fixed-position .l-fixed-position-item-handle {
|
.t-fixed-position .l-fixed-position-item-handle {
|
||||||
background: rgba(0, 153, 204, 0.5);
|
background: rgba(0, 153, 204, 0.5);
|
||||||
cursor: crosshair;
|
cursor: crosshair;
|
||||||
border: 1px solid #0099cc;
|
border: 1px solid #0099cc;
|
||||||
position: absolute; }
|
position: absolute; }
|
||||||
|
|
||||||
/* line 105, ../sass/_fixed-position.scss */
|
/* line 98, ../sass/_fixed-position.scss */
|
||||||
.edit-mode .t-fixed-position.l-fixed-position .l-grid-holder .l-grid.l-grid-x {
|
.edit-mode .t-fixed-position.l-fixed-position .l-grid-holder .l-grid.l-grid-x {
|
||||||
background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: -moz-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -moz-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: -o-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -o-linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-repeat: repeat-x; }
|
background-repeat: repeat-x; }
|
||||||
/* line 109, ../sass/_fixed-position.scss */
|
/* line 102, ../sass/_fixed-position.scss */
|
||||||
.edit-mode .t-fixed-position.l-fixed-position .l-grid-holder .l-grid.l-grid-y {
|
.edit-mode .t-fixed-position.l-fixed-position .l-grid-holder .l-grid.l-grid-y {
|
||||||
background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: -o-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: -o-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-image: linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
background-image: linear-gradient(0deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 100%);
|
||||||
background-repeat: repeat-y; }
|
background-repeat: repeat-y; }
|
||||||
/* line 118, ../sass/_fixed-position.scss */
|
/* line 110, ../sass/_fixed-position.scss */
|
||||||
.edit-mode .t-fixed-position .l-fixed-position-item:not(.s-selected):hover {
|
.edit-mode .t-fixed-position .l-fixed-position-item:not(.s-selected):hover {
|
||||||
border: 1px dotted rgba(0, 153, 204, 0.5); }
|
border: 1px dotted rgba(0, 153, 204, 0.5); }
|
||||||
|
|
||||||
|
@ -14,13 +14,6 @@
|
|||||||
height: 100%; width: 100%;
|
height: 100%; width: 100%;
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
// &.l-grid-x {
|
|
||||||
// @include bgTicks($colorGridLines, 'x');
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// &.l-grid-y {
|
|
||||||
// @include bgTicks($colorGridLines, 'y');
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -51,7 +44,7 @@
|
|||||||
.l-fixed-position-image {
|
.l-fixed-position-image {
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-position: left top;
|
background-position: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.l-fixed-position-text {
|
.l-fixed-position-text {
|
||||||
@ -113,7 +106,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.l-fixed-position-item {
|
.l-fixed-position-item {
|
||||||
&:not(.s-selected):hover {
|
&:not(.s-selected):hover {
|
||||||
border: 1px dotted rgba($colorKey, 0.5);
|
border: 1px dotted rgba($colorKey, 0.5);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user