fix(page-title-actions): visual compatibility issue with WordPress 7

Author: harunbleech

assets/admin.scss

@@ -4,16 +4,6 @@
 
 .vrts-list-table-page {
 
-	.vrts-page-title-action {
-		color: #fff;
-		border-color: var(--vrts-admin-theme-color);
-
-		&:hover {
-			color: #fff;
-			border-color: var(--vrts-admin-theme-color);
-		}
-	}
-
 	tbody {
 		background-color: #f6f7f9;
 	}

components/tests-page/_style.scss

@@ -12,19 +12,12 @@
 		margin: 0;
 	}
 
-	button,
-	[type="submit"] {
-
-		&:disabled {
-			pointer-events: none;
-			opacity: 0.6;
-		}
-
-		&:active {
-			padding: 0 10px !important;
-			border-radius: 3px !important;
-			margin: 0 !important;
-		}
+	.vrts-page-title-action {
+		position: relative;
+		top: -3px;
+		min-height: 32px;
+		line-height: 2.30769231;
+		padding: 0 12px;
 	}
 }
 

components/tests-page/views/tests-page-list.php

@@ -13,7 +13,7 @@
 
 	<menu class="page-title-actions">
 		<li>
-			<button type="button" class="page-title-action vrts-page-title-action button-primary"
+			<button type="button" class="vrts-page-title-action button-primary"
 				id="<?php echo ( ! $data['is_connected'] || intval( $data['remaining_tests'] ) === 0 ) ? 'modal-add-new-disabled' : 'show-modal-add-new'; ?>"
 				<?php echo ( ! $data['is_connected'] || intval( $data['remaining_tests'] ) === 0 ) ? ' disabled' : ''; ?>>
 				<?php esc_html_e( 'Add New', 'visual-regression-tests' ); ?>
@@ -24,7 +24,7 @@
 				<form method="post" id="form-run-manual-tests">
 					<?php wp_nonce_field( 'submit_run_manual_tests', '_wpnonce' ); ?>
 					<input type="submit" name="submit_run_manual_tests" value="<?php esc_attr_e( 'Run All Tests', 'visual-regression-tests' ); ?>"
-						class="page-title-action button-secondary"
+						class="vrts-page-title-action button-secondary"
 						id="<?php echo ( ! $data['is_connected'] || ! $data['running_tests_count'] ) ? 'run-manual-tests-disabled' : 'run-manual-tests'; ?>"
 						<?php echo ( ! $data['is_connected'] || ! $data['running_tests_count'] ) ? ' disabled' : ''; ?>
 					>