diff --git a/platform/commonUI/general/res/sass/_object-label.scss b/platform/commonUI/general/res/sass/_object-label.scss index 55bc5d5920..5523a60a28 100644 --- a/platform/commonUI/general/res/sass/_object-label.scss +++ b/platform/commonUI/general/res/sass/_object-label.scss @@ -44,10 +44,6 @@ mct-representation { $spinD: 0; @include spinner($spinBW); content: ""; - display: block; - position: absolute; - left: 50%; - top: 50%; padding: 30%; width: $spinD; height: $spinD; @@ -64,6 +60,6 @@ mct-representation { } } .selected mct-representation.s-status-pending .t-object-label .t-item-icon:before { - border-color: rgba($colorItemTreeSelectedFg, 0.25); - border-top-color: rgba($colorItemTreeSelectedFg, 1.0); + border-color: rgba($colorItemTreeSelectedFg, 0.25) !important; + border-top-color: rgba($colorItemTreeSelectedFg, 1.0) !important; } \ No newline at end of file diff --git a/platform/commonUI/general/res/sass/helpers/_wait-spinner.scss b/platform/commonUI/general/res/sass/helpers/_wait-spinner.scss index 14abf7c817..015bf05187 100644 --- a/platform/commonUI/general/res/sass/helpers/_wait-spinner.scss +++ b/platform/commonUI/general/res/sass/helpers/_wait-spinner.scss @@ -20,62 +20,37 @@ * at runtime from the About dialog for additional information. *****************************************************************************/ @include keyframes(rotation) { - 0% { transform: rotate(0deg); } - 100% { transform: rotate(359deg); } + 100% { @include transform(rotate(360deg)); } } -@mixin spinner($b: 5px) { - @include keyframes(rotateCentered) { - 0% { @include transform(translateX(-50%) translateY(-50%) rotate(0deg)); } - 100% { @include transform(translateX(-50%) translateY(-50%) rotate(359deg)); } - } - @include animation-name(rotateCentered); +@include keyframes(rotation-centered) { + 0% { @include transform(translate(-50%, -50%) rotate(0deg)); } + 100% { @include transform(translate(-50%, -50%) rotate(360deg)); } +} + +@mixin spinner($b: 5px, $c: $colorKey) { + @include transform-origin(center); + @include animation-name(rotation-centered); @include animation-duration(0.5s); @include animation-iteration-count(infinite); @include animation-timing-function(linear); - @include transform-origin(center); - border-style: solid; - border-width: $b; @include border-radius(100%); -} - - -@mixin wait-spinner2($b: 5px, $c: $colorAlt1) { - @include spinner($b); @include box-sizing(border-box); border-color: rgba($c, 0.25); border-top-color: rgba($c, 1.0); + border-style: solid; + border-width: $b; display: block; position: absolute; - height: 0; width: 0; - padding: 7%; left: 50%; top: 50%; } -@mixin wait-spinner($b: 5px, $c: $colorAlt1) { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; - border-color: rgba($c, 0.25); - border-top-color: rgba($c, 1.0); - border-style: solid; - border-width: $b; - @include border-radius(100%); -} - -.t-wait-spinner, .wait-spinner { $d: 5%; - @include wait-spinner(0.5em, $colorKey); - top: 50%; left: 50%; + @include spinner(0.5em, $colorKey); height: auto; width: auto; padding: $d; // Will size object based on parent container WIDTH pointer-events: none; - margin-top: $d / -1; - margin-left: $d / -1; z-index: 2; &.inline { display: inline-block !important; @@ -85,46 +60,15 @@ } } -.l-wait-spinner-holder { - pointer-events: none; - position: absolute; - &.align-left { - .t-wait-spinner { - left: 0; - margin-left: 0; - } - } - &.full-size { - display: inline-block; - height: 100%; width: 100%; - .t-wait-spinner { - top: 0; - margin-top: 0; - padding: 30%; - } - } -} - - .treeview .wait-spinner { + // Only used in subtree.html, which I don't think this is actually being used $d: 10px; - @include wait-spinner(0.25em, $colorKey); height: $d; width: $d; margin: 0 !important; padding: 0 !important; top: 2px; left: 0; } -.wait-spinner.sm { - $d: 13px; - @include wait-spinner(0.25em, $colorKey); - height: $d; width: $d; - margin-left: 0 !important; - margin-top: 0 !important; - padding: 0 !important; - top: 0; left: 0; -} - .loading { // Can be applied to any block element with height and width pointer-events: none; @@ -133,7 +77,8 @@ content: ''; } &:before { - @include wait-spinner2(5px, $colorLoadingFg); + @include spinner(5px, $colorLoadingFg); + padding: 5%; z-index: 10; } &:after { @@ -146,5 +91,4 @@ padding: $menuLineH / 4; border-width: 2px; } - } \ No newline at end of file diff --git a/platform/commonUI/themes/espresso/res/css/theme-espresso.css b/platform/commonUI/themes/espresso/res/css/theme-espresso.css index 5c0be0289a..9fea0a877b 100644 --- a/platform/commonUI/themes/espresso/res/css/theme-espresso.css +++ b/platform/commonUI/themes/espresso/res/css/theme-espresso.css @@ -1284,87 +1284,90 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { * at runtime from the About dialog for additional information. *****************************************************************************/ @-moz-keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } + -moz-transform: rotate(360deg); + transform: rotate(360deg); } } @-webkit-keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } + -webkit-transform: rotate(360deg); + transform: rotate(360deg); } } @keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } -/* line 69, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.t-wait-spinner, + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -webkit-transform: rotate(360deg); + transform: rotate(360deg); } } +@-moz-keyframes rotation-centered { + 0% { + -moz-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -moz-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +@-webkit-keyframes rotation-centered { + 0% { + -webkit-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -webkit-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +@keyframes rotation-centered { + 0% { + -moz-transform: translate(-50%, -50%) rotate(0deg); + -ms-transform: translate(-50%, -50%) rotate(0deg); + -webkit-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -moz-transform: translate(-50%, -50%) rotate(360deg); + -ms-transform: translate(-50%, -50%) rotate(360deg); + -webkit-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +/* line 48, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .wait-spinner { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; + -moz-animation-duration: 0.5s; + -webkit-animation-duration: 0.5s; + animation-duration: 0.5s; + -moz-animation-iteration-count: infinite; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -moz-animation-timing-function: linear; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -moz-border-radius: 100%; + -webkit-border-radius: 100%; + border-radius: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; border-color: rgba(0, 153, 204, 0.25); border-top-color: #0099cc; border-style: solid; border-width: 0.5em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; - top: 50%; + display: block; + position: absolute; left: 50%; + top: 50%; height: auto; width: auto; padding: 5%; pointer-events: none; - margin-top: -5%; - margin-left: -5%; z-index: 2; } - /* line 80, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .t-wait-spinner.inline, + /* line 55, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .wait-spinner.inline { display: inline-block !important; margin-right: 5px; position: relative !important; vertical-align: middle; } -/* line 88, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.l-wait-spinner-holder { - pointer-events: none; - position: absolute; } - /* line 92, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.align-left .t-wait-spinner { - left: 0; - margin-left: 0; } - /* line 97, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.full-size { - display: inline-block; - height: 100%; - width: 100%; } - /* line 100, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.full-size .t-wait-spinner { - top: 0; - margin-top: 0; - padding: 30%; } - -/* line 109, ../../../../general/res/sass/helpers/_wait-spinner.scss */ +/* line 63, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .treeview .wait-spinner { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; - border-color: rgba(0, 153, 204, 0.25); - border-top-color: #0099cc; - border-style: solid; - border-width: 0.25em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; height: 10px; width: 10px; margin: 0 !important; @@ -1372,40 +1375,21 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { top: 2px; left: 0; } -/* line 118, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.wait-spinner.sm { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; - border-color: rgba(0, 153, 204, 0.25); - border-top-color: #0099cc; - border-style: solid; - border-width: 0.25em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; - height: 13px; - width: 13px; - margin-left: 0 !important; - margin-top: 0 !important; - padding: 0 !important; - top: 0; - left: 0; } - -/* line 128, ../../../../general/res/sass/helpers/_wait-spinner.scss */ +/* line 72, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading { pointer-events: none; } - /* line 131, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 75, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:before, .loading:after { content: ''; } - /* line 135, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 79, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -1415,12 +1399,6 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 5px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; @@ -1429,40 +1407,15 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { box-sizing: border-box; border-color: rgba(255, 199, 0, 0.25); border-top-color: #ffc700; + border-style: solid; + border-width: 5px; display: block; position: absolute; - height: 0; - width: 0; - padding: 7%; left: 50%; top: 50%; + padding: 5%; z-index: 10; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } - /* line 139, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 84, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:after { overflow: hidden; position: absolute; @@ -1475,7 +1428,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { background: rgba(153, 153, 153, 0.2); display: block; z-index: 9; } - /* line 145, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 90, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading.tree-item:before { padding: 0.375rem; border-width: 2px; } @@ -6278,9 +6231,13 @@ ul.tree { /* line 131, ../../../../general/res/sass/tree/_tree.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -6290,42 +6247,22 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 4px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-color: rgba(0, 153, 204, 0.25); + border-top-color: #0099cc; + border-style: solid; + border-width: 4px; + display: block; + position: absolute; + left: 50%; + top: 50%; border-color: rgba(0, 153, 204, 0.25); border-top-color: #0099cc; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } /* line 137, ../../../../general/res/sass/tree/_tree.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { display: none; } @@ -6448,9 +6385,13 @@ mct-representation.s-status-pending .t-object-label .t-title-label { /* line 42, ../../../../general/res/sass/_object-label.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -6460,48 +6401,24 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 4px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; - content: ""; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-color: rgba(0, 153, 204, 0.25); + border-top-color: #0099cc; + border-style: solid; + border-width: 4px; display: block; position: absolute; left: 50%; top: 50%; + content: ""; padding: 30%; width: 0; height: 0; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } /* line 55, ../../../../general/res/sass/_object-label.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { display: none; } diff --git a/platform/commonUI/themes/snow/res/css/theme-snow.css b/platform/commonUI/themes/snow/res/css/theme-snow.css index 40681fb90b..4866a5e379 100644 --- a/platform/commonUI/themes/snow/res/css/theme-snow.css +++ b/platform/commonUI/themes/snow/res/css/theme-snow.css @@ -1265,87 +1265,90 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { * at runtime from the About dialog for additional information. *****************************************************************************/ @-moz-keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } + -moz-transform: rotate(360deg); + transform: rotate(360deg); } } @-webkit-keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } + -webkit-transform: rotate(360deg); + transform: rotate(360deg); } } @keyframes rotation { - 0% { - transform: rotate(0deg); } 100% { - transform: rotate(359deg); } } -/* line 69, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.t-wait-spinner, + -moz-transform: rotate(360deg); + -ms-transform: rotate(360deg); + -webkit-transform: rotate(360deg); + transform: rotate(360deg); } } +@-moz-keyframes rotation-centered { + 0% { + -moz-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -moz-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +@-webkit-keyframes rotation-centered { + 0% { + -webkit-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -webkit-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +@keyframes rotation-centered { + 0% { + -moz-transform: translate(-50%, -50%) rotate(0deg); + -ms-transform: translate(-50%, -50%) rotate(0deg); + -webkit-transform: translate(-50%, -50%) rotate(0deg); + transform: translate(-50%, -50%) rotate(0deg); } + 100% { + -moz-transform: translate(-50%, -50%) rotate(360deg); + -ms-transform: translate(-50%, -50%) rotate(360deg); + -webkit-transform: translate(-50%, -50%) rotate(360deg); + transform: translate(-50%, -50%) rotate(360deg); } } +/* line 48, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .wait-spinner { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; + -moz-animation-duration: 0.5s; + -webkit-animation-duration: 0.5s; + animation-duration: 0.5s; + -moz-animation-iteration-count: infinite; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -moz-animation-timing-function: linear; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -moz-border-radius: 100%; + -webkit-border-radius: 100%; + border-radius: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; border-color: rgba(0, 153, 204, 0.25); border-top-color: #0099cc; border-style: solid; border-width: 0.5em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; - top: 50%; + display: block; + position: absolute; left: 50%; + top: 50%; height: auto; width: auto; padding: 5%; pointer-events: none; - margin-top: -5%; - margin-left: -5%; z-index: 2; } - /* line 80, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .t-wait-spinner.inline, + /* line 55, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .wait-spinner.inline { display: inline-block !important; margin-right: 5px; position: relative !important; vertical-align: middle; } -/* line 88, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.l-wait-spinner-holder { - pointer-events: none; - position: absolute; } - /* line 92, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.align-left .t-wait-spinner { - left: 0; - margin-left: 0; } - /* line 97, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.full-size { - display: inline-block; - height: 100%; - width: 100%; } - /* line 100, ../../../../general/res/sass/helpers/_wait-spinner.scss */ - .l-wait-spinner-holder.full-size .t-wait-spinner { - top: 0; - margin-top: 0; - padding: 30%; } - -/* line 109, ../../../../general/res/sass/helpers/_wait-spinner.scss */ +/* line 63, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .treeview .wait-spinner { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; - border-color: rgba(0, 153, 204, 0.25); - border-top-color: #0099cc; - border-style: solid; - border-width: 0.25em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; height: 10px; width: 10px; margin: 0 !important; @@ -1353,40 +1356,21 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { top: 2px; left: 0; } -/* line 118, ../../../../general/res/sass/helpers/_wait-spinner.scss */ -.wait-spinner.sm { - display: block; - position: absolute; - -webkit-animation: rotation .6s infinite linear; - -moz-animation: rotation .6s infinite linear; - -o-animation: rotation .6s infinite linear; - animation: rotation .6s infinite linear; - border-color: rgba(0, 153, 204, 0.25); - border-top-color: #0099cc; - border-style: solid; - border-width: 0.25em; - -moz-border-radius: 100%; - -webkit-border-radius: 100%; - border-radius: 100%; - height: 13px; - width: 13px; - margin-left: 0 !important; - margin-top: 0 !important; - padding: 0 !important; - top: 0; - left: 0; } - -/* line 128, ../../../../general/res/sass/helpers/_wait-spinner.scss */ +/* line 72, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading { pointer-events: none; } - /* line 131, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 75, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:before, .loading:after { content: ''; } - /* line 135, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 79, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -1396,12 +1380,6 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 5px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; @@ -1410,40 +1388,15 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { box-sizing: border-box; border-color: rgba(119, 107, 162, 0.25); border-top-color: #776ba2; + border-style: solid; + border-width: 5px; display: block; position: absolute; - height: 0; - width: 0; - padding: 7%; left: 50%; top: 50%; + padding: 5%; z-index: 10; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } - /* line 139, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 84, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading:after { overflow: hidden; position: absolute; @@ -1456,7 +1409,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before { background: rgba(119, 107, 162, 0.1); display: block; z-index: 9; } - /* line 145, ../../../../general/res/sass/helpers/_wait-spinner.scss */ + /* line 90, ../../../../general/res/sass/helpers/_wait-spinner.scss */ .loading.tree-item:before { padding: 0.375rem; border-width: 2px; } @@ -6151,9 +6104,13 @@ ul.tree { /* line 131, ../../../../general/res/sass/tree/_tree.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -6163,42 +6120,22 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 4px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-color: rgba(0, 153, 204, 0.25); + border-top-color: #0099cc; + border-style: solid; + border-width: 4px; + display: block; + position: absolute; + left: 50%; + top: 50%; border-color: rgba(0, 153, 204, 0.25); border-top-color: #0099cc; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } /* line 137, ../../../../general/res/sass/tree/_tree.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { display: none; } @@ -6321,9 +6258,13 @@ mct-representation.s-status-pending .t-object-label .t-title-label { /* line 42, ../../../../general/res/sass/_object-label.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon:before { - -moz-animation-name: rotateCentered; - -webkit-animation-name: rotateCentered; - animation-name: rotateCentered; + -moz-transform-origin: center 50%; + -ms-transform-origin: center 50%; + -webkit-transform-origin: center 50%; + transform-origin: center 50%; + -moz-animation-name: rotation-centered; + -webkit-animation-name: rotation-centered; + animation-name: rotation-centered; -moz-animation-duration: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; @@ -6333,48 +6274,24 @@ mct-representation.s-status-pending .t-object-label .t-item-icon:before { -moz-animation-timing-function: linear; -webkit-animation-timing-function: linear; animation-timing-function: linear; - -moz-transform-origin: center 50%; - -ms-transform-origin: center 50%; - -webkit-transform-origin: center 50%; - transform-origin: center 50%; - border-style: solid; - border-width: 4px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; - content: ""; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + border-color: rgba(0, 153, 204, 0.25); + border-top-color: #0099cc; + border-style: solid; + border-width: 4px; display: block; position: absolute; left: 50%; top: 50%; + content: ""; padding: 30%; width: 0; height: 0; } -@-moz-keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@-webkit-keyframes rotateCentered { - 0% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } -@keyframes rotateCentered { - 0% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(0deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(0deg); - transform: translateX(-50%) translateY(-50%) rotate(0deg); } - 100% { - -moz-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -ms-transform: translateX(-50%) translateY(-50%) rotate(359deg); - -webkit-transform: translateX(-50%) translateY(-50%) rotate(359deg); - transform: translateX(-50%) translateY(-50%) rotate(359deg); } } /* line 55, ../../../../general/res/sass/_object-label.scss */ mct-representation.s-status-pending .t-object-label .t-item-icon .t-item-icon-glyph { display: none; } diff --git a/platform/features/plot/res/templates/plot.html b/platform/features/plot/res/templates/plot.html index 57ee69b0af..3dc50408ee 100644 --- a/platform/features/plot/res/templates/plot.html +++ b/platform/features/plot/res/templates/plot.html @@ -61,7 +61,8 @@
+ ng-mouseleave="subplot.isHovering(false)" + ng-class="{ loading: plot.isRequestPending() }">
@@ -118,8 +119,6 @@
-