code review feedback: just always use left, don't add new property

BrightspaceUI · Oct 18, 2024 · a49933f · a49933f
1 parent 89615c0
commit a49933f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 26 deletions.
diff --git a/components/filter/filter.js b/components/filter/filter.js
@@ -303,7 +303,7 @@ class Filter extends FocusMixin(LocalizeCoreElement(RtlMixin(LitElement))) {
 					prefer-fixed-positioning
 					trap-focus>
 					${header}
-					<d2l-menu label="${this.localize('components.filter.filters')}" ignore-translate>
+					<d2l-menu label="${this.localize('components.filter.filters')}">
 						${dimensions}
 					</d2l-menu>
 				</d2l-dropdown-menu>

diff --git a/components/hierarchical-view/hierarchical-view-mixin.js b/components/hierarchical-view/hierarchical-view-mixin.js
@@ -11,10 +11,6 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 
 	static get properties() {
 		return {
-			/**
-			 * @ignore
-			 */
-			ignoreTranslate: { type: Boolean, attribute: 'ignore-translate', reflect: true },
 			/**
 			 * @ignore
 			 */
@@ -53,15 +49,14 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 				display: inline-block;
 				vertical-align: top; /* DE37329: required to prevent extra spacing caused by inline-block */
 			}
-			:host([ignore-translate]) .d2l-hierarchical-view-content.d2l-child-view-show {
-				left: -100%;
+			.d2l-hierarchical-view-content {
 				position: relative;
 			}
-			:host(:not([ignore-translate])) .d2l-hierarchical-view-content.d2l-child-view-show {
+			.d2l-hierarchical-view-content.d2l-child-view-show {
 				-webkit-animation: show-child-view-animation forwards 300ms linear;
 				animation: show-child-view-animation 300ms forwards linear;
 			}
-			:host(:not([ignore-translate])) .d2l-hierarchical-view-content.d2l-child-view-hide {
+			.d2l-hierarchical-view-content.d2l-child-view-hide {
 				-webkit-animation: hide-child-view-animation forwards 300ms linear;
 				animation: hide-child-view-animation 300ms forwards linear;
 			}
@@ -70,34 +65,32 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 					-webkit-transition: none;
 					transition: none;
 				}
-				:host(:not([ignore-translate])) .d2l-hierarchical-view-content.d2l-child-view-show {
+				.d2l-hierarchical-view-content.d2l-child-view-show {
 					-webkit-animation: none;
 					animation: none;
-					-webkit-transform: translate(-100%, 0);
-					transform: translate(-100%, 0);
+					left: -100%;
 				}
-				:host(:not([ignore-translate])) .d2l-hierarchical-view-content.d2l-child-view-hide {
+				.d2l-hierarchical-view-content.d2l-child-view-hide {
 					-webkit-animation: none;
 					animation: none;
-					-webkit-transform: translate(0, 0);
-					transform: translate(0, 0);
+					left: 0;
 				}
 			}
 			@keyframes show-child-view-animation {
-				0% { transform: translate(0, 0); }
-				100% { transform: translate(-100%, 0); }
+				0% { left: 0; }
+				100% { left: -100%; }
 			}
 			@-webkit-keyframes show-child-view-animation {
-				0% { -webkit-transform: translate(0, 0); }
-				100% { -webkit-transform: translate(-100%, 0); }
+				0% { left: 0; }
+				100% { left: -100%; }
 			}
 			@keyframes hide-child-view-animation {
-				0% { transform: translate(-100%, 0); }
-				100% { transform: translate(0, 0); }
+				0% { left: -100%; }
+				100% { left: 0; }
 			}
 			@-webkit-keyframes hide-child-view-animation {
-				0% { -webkit-transform: translate(-100%, 0); }
-				100% { -webkit-transform: translate(0, 0); }
+				0% { left: -100%; }
+				100% { left: 0; }
 			}
 		`;
 	}
@@ -109,8 +102,6 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 		this.childView = false;
 		/** @ignore */
 		this.hierarchicalView = true;
-		/** @ignore */
-		this.ignoreTranslate = false;
 		this.__focusPrevious = false;
 		this.__intersectionObserver = null;
 		this.__isAutoSized = false;
@@ -453,7 +444,7 @@ export const HierarchicalViewMixin = superclass => class extends superclass {
 			const content = this.shadowRoot.querySelector('.d2l-hierarchical-view-content');
 
 			const data = e.detail.data;
-			const animate = (!!content.offsetParent && !reduceMotion && !this.ignoreTranslate);
+			const animate = (!!content.offsetParent && !reduceMotion);
 			const hideRoot = () => {
 				rootTarget.shown = false;
 				requestAnimationFrame(() => {