alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] WIP remove keyframe anims

Browse Source 
Fixes #1603
Remove keyframe anims from transition to edit mode
and border-color anim in _messages.scss;
This commit is contained in:
Charles Hacskaylo
2017-06-09 11:40:58 -07:00
parent c7787aa1f0
commit a8a689f69a
2 changed files with 7 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
platform/commonUI/general/res/sass/controls/_messages.scss
View File

@@ -368,7 +368,6 @@ body.desktop .t-message-list {
.s-unsynced { .s-unsynced {
$c: $colorPausedBg; $c: $colorPausedBg;
border: 1px solid $c; border: 1px solid $c;
@include animTo($animName: pulsePaused, $propName: border-color, $propValStart: rgba($c, 0.8), $propValEnd: rgba($c, 0.5), $dur: $animPausedPulseDur, $dir: alternate, $count: infinite);
} }
.s-status-timeconductor-unsynced { .s-status-timeconductor-unsynced {

48
platform/commonUI/general/res/sass/user-environ/_layout.scss
View File

@@ -229,11 +229,11 @@ body.desktop .pane .mini-tab-icon.toggle-pane {
.l-object-wrapper { .l-object-wrapper {
padding: 0; padding: 0;
@include trans-prop-nice(padding, 0.25s); @include trans-prop-nice((padding), 0.25s);
} .l-edit-controls {
@include trans-prop-nice((height), 0.5s);
.l-object-wrapper-inner { height: 0;
@include trans-prop-nice-resize(0.25s); }
} }
.object-browse-bar .s-button, .object-browse-bar .s-button,
@@ -350,48 +350,14 @@ body.desktop {
.s-status-editing { .s-status-editing {
.l-object-wrapper { .l-object-wrapper {
$t2Dur: $browseToEditAnimMs;
$t1Dur: $t2Dur / 2;
$pulseDur: $editBorderPulseMs;
$bC0: rgba($colorEditAreaFg, 0.5);
$bC100: rgba($colorEditAreaFg, 1);
background-color: $colorEditAreaBg; background-color: $colorEditAreaBg;
border-radius: $controlCr; border-radius: $controlCr;
border: 1px dotted $bC0; border: 1px dotted $colorEditAreaFg;
padding: 5px; padding: $interiorMargin;
//// Transition 1
//@include keyframes(wrapperIn) {
// from { border: 0px dotted transparent; padding: 0; }
// to { border: 1px dotted $bC0; padding: 5px; }
//}
//
//// Do last
//@include keyframes(pulseNew) {
// from { border-color: $bC0; }
// to { border-color: $bC100; }
//}
//@include animation-name(wrapperIn, pulseNew);
//@include animation-duration($t1Dur, $pulseDur);
//@include animation-delay(0s, $t1Dur + $t2Dur);
//@include animation-direction(normal, alternate);
//@include animation-fill-mode(both, none);
//@include animation-iteration-count(1, infinite);
//@include animation-timing-function(ease-in-out, linear);
.l-edit-controls { .l-edit-controls {
//height: 0;
height: $ueEditToolBarH + $interiorMargin; margin-bottom: $interiorMargin; height: $ueEditToolBarH + $interiorMargin; margin-bottom: $interiorMargin;
border-bottom: 1px solid $colorInteriorBorder; border-bottom: 1px solid $colorInteriorBorder;
// Transition 2: reveal edit controls
//@include keyframes(editIn) {
// from { border-bottom: 0px solid transparent; height: 0; margin-bottom: 0; }
// to { border-bottom: 1px solid $colorInteriorBorder; height: $ueEditToolBarH + $interiorMargin; margin-bottom: $interiorMargin; }
//}
//@include animToParams(editIn, $dur: $t2Dur, $delay: $t1Dur);
.tool-bar { .tool-bar {
right: $interiorMargin; right: $interiorMargin;
} }