Update Lite to Pro gradient styling

classes/helpers/FrmAppHelper.php

@@ -1369,6 +1369,7 @@ public static function print_admin_banner( $should_show_lite_upgrade ) {
 		}
 		?>
 		<div class="frm-upgrade-bar">
+			<div class="frm-upgrade-bar-inner">
 				<?php
 				$cta_text = FrmSalesApi::get_best_sale_value( 'lite_banner_cta_text' );
 				if ( ! $cta_text ) {
@@ -1393,6 +1394,7 @@ public static function print_admin_banner( $should_show_lite_upgrade ) {
 					'</a>'
 				);
 				?>
+			</div>
 		</div>
 		<?php
 	}

css/frm_admin.css

@@ -485,9 +485,40 @@ td.column-title .frm_actions_dropdown {
 	border: 0 !important;
 }
 
+.frm-gradient.frm-button-primary:not([disabled]),
 .frm-gradient.frm-button-primary:not([disabled]):hover,
 .frm-gradient.frm-button-primary:not([disabled]):focus {
-	background: linear-gradient(90deg, #2871E6, #9989FB) !important;
+	background: linear-gradient(90deg, #1961D5, #816CFA) !important;
+}
+
+.frm-upgrade-bar,
+.frm-gradient {
+	position: relative;
+}
+
+.frm-upgrade-bar:before,
+.frm-gradient:before {
+	content: '';
+	display: none;
+	position: absolute;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
+	background-color: rgba(255, 255, 255, 0.1);
+	z-index: 0;
+}
+
+.frm-upgrade-bar:hover:before,
+.frm-gradient:hover:before,
+.frm-gradient:focus:before {
+	display: block;
+}
+
+.frm-upgrade-bar-inner,
+.frm-gradient > * {
+	position: relative;
+	z-index: 1;
 }
 
 .frm-upgrade-bar {

js/admin/applications.js

@@ -117,7 +117,7 @@
 					div({
 						className: 'frm2',
 						child: a({
-							className: 'button button-primary frm-gradient',
+							className: 'frm-button-primary frm-gradient',
 							text: __( 'Upgrade to Pro', 'formidable' ),
 							href: frmApplicationsVars.proUpgradeUrl
 						})