Fix(NcActionButton): Add RTL support to NcActionButton component

Signed-off-by: Faisal Alghamdi <[email protected]>
nextcloud-libraries · Nov 19, 2024 · 0e449a2 · 0e449a2
1 parent 52e3bbd
commit 0e449a2
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 8 deletions.
diff --git a/src/assets/action.scss b/src/assets/action.scss
@@ -37,7 +37,7 @@
 		height: auto;
 		margin: 0;
 		padding: 0;
-		padding-right: $icon-margin;
+		padding-inline-end: $icon-margin;
 		box-sizing: border-box; // otherwise router-link overflows in Firefox
 
 		cursor: pointer;
@@ -109,11 +109,7 @@
 		}
 
 		&__menu-icon {
-			// Push to the right
-			margin-left: auto;
-			// Align with right end of the button
-			// This is the padding-right
-			margin-right: calc($icon-margin * -1);
+			margin-inline: auto calc($icon-margin * -1);
 		}
 	}
 }
diff --git a/src/components/NcActionButton/NcActionButton.vue b/src/components/NcActionButton/NcActionButton.vue
@@ -547,7 +547,7 @@ export default {
 @include action-item('button');
 
 .action-button__pressed-icon {
-	margin-left: auto;
-	margin-right: calc($icon-margin * -1);
+	margin-inline-start: auto;
+	margin-inline-end: calc($icon-margin * -1);
 }
 </style>