← All changes | includes/widgets/common.php +587 -14 3.9.2 → 3.10.0-dev1 View file →

		@@ -255,9 +255,9 @@
255	255	],
256	256	],
257	257	'size_units' => [ 'px', '%', 'vw' ],
258	258	'selectors' => [
259		- '{{WRAPPER}}' => '--container-widget-width: {{SIZE}}{{UNIT}}; --container-widget-flex-grow: 0; width: var( --container-widget-width, {{SIZE}}{{UNIT}} ); max-width: {{SIZE}}{{UNIT}}',
	259	+ '{{WRAPPER}}' => 'width: {{SIZE}}{{UNIT}}; max-width: {{SIZE}}{{UNIT}}',
260	260	],
261	261	'condition' => [ '_element_width' => 'initial' ],
262	262	]
263	263	);
		@@ -662,9 +662,586 @@
662	662
663	663	$this->end_controls_section();
664	664	}
665	665
666		- /** Register the Background section.
	666	+ private function register_transform_section() {
	667	+ $this->start_controls_section(
	668	+ '_section_transform',
	669	+ [
	670	+ 'label' => esc_html__( 'Transform', 'elementor' ),
	671	+ 'tab' => Controls_Manager::TAB_ADVANCED,
	672	+ ]
	673	+ );
	674	+
	675	+ $this->start_controls_tabs( '_tabs_positioning' );
	676	+
	677	+ $transform_prefix_class = 'e-';
	678	+ $transform_return_value = 'transform';
	679	+
	680	+ foreach ( [ '', '_hover' ] as $tab ) {
	681	+ $state = '_hover' === $tab ? ':hover' : '';
	682	+
	683	+ $this->start_controls_tab(
	684	+ "_tab_positioning{$tab}",
	685	+ [
	686	+ 'label' => '' === $tab ? esc_html__( 'Normal', 'elementor' ) : esc_html__( 'Hover', 'elementor' ),
	687	+ ]
	688	+ );
	689	+
	690	+ $this->add_control(
	691	+ "_transform_rotate_popover{$tab}",
	692	+ [
	693	+ 'label' => esc_html__( 'Rotate', 'elementor' ),
	694	+ 'type' => Controls_Manager::POPOVER_TOGGLE,
	695	+ 'prefix_class' => $transform_prefix_class,
	696	+ 'return_value' => $transform_return_value,
	697	+ ]
	698	+ );
	699	+
	700	+ $this->start_popover();
	701	+
	702	+ $this->add_responsive_control(
	703	+ "_transform_rotateZ_effect{$tab}",
	704	+ [
	705	+ 'label' => esc_html__( 'Rotate', 'elementor' ),
	706	+ 'type' => Controls_Manager::SLIDER,
	707	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
	708	+ 'range' => [
	709	+ 'deg' => [
	710	+ 'min' => -360,
	711	+ 'max' => 360,
	712	+ ],
	713	+ 'grad' => [
	714	+ 'min' => -400,
	715	+ 'max' => 400,
	716	+ ],
	717	+ 'rad' => [
	718	+ 'min' => -6.2832,
	719	+ 'max' => 6.2832,
	720	+ ],
	721	+ 'turn' => [
	722	+ 'min' => -1,
	723	+ 'max' => 1,
	724	+ ],
	725	+ ],
	726	+ 'selectors' => [
	727	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-rotateZ: {{SIZE}}{{UNIT}};',
	728	+ ],
	729	+ 'condition' => [
	730	+ "_transform_rotate_popover{$tab}!" => '',
	731	+ ],
	732	+ 'frontend_available' => true,
	733	+ ]
	734	+ );
	735	+
	736	+ $this->add_control(
	737	+ "_transform_rotate_3d{$tab}",
	738	+ [
	739	+ 'label' => esc_html__( '3D Rotate', 'elementor' ),
	740	+ 'type' => Controls_Manager::SWITCHER,
	741	+ 'label_on' => esc_html__( 'On', 'elementor' ),
	742	+ 'label_off' => esc_html__( 'Off', 'elementor' ),
	743	+ 'selectors' => [
	744	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-rotateX: 1deg; --e-transform-perspective: 20px;',
	745	+ ],
	746	+ 'condition' => [
	747	+ "_transform_rotate_popover{$tab}!" => '',
	748	+ ],
	749	+ ]
	750	+ );
	751	+
	752	+ $this->add_responsive_control(
	753	+ "_transform_rotateX_effect{$tab}",
	754	+ [
	755	+ 'label' => esc_html__( 'Rotate X', 'elementor' ),
	756	+ 'type' => Controls_Manager::SLIDER,
	757	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
	758	+ 'range' => [
	759	+ 'deg' => [
	760	+ 'min' => -360,
	761	+ 'max' => 360,
	762	+ ],
	763	+ 'grad' => [
	764	+ 'min' => -400,
	765	+ 'max' => 400,
	766	+ ],
	767	+ 'rad' => [
	768	+ 'min' => -6.2832,
	769	+ 'max' => 6.2832,
	770	+ ],
	771	+ 'turn' => [
	772	+ 'min' => -1,
	773	+ 'max' => 1,
	774	+ ],
	775	+ ],
	776	+ 'condition' => [
	777	+ "_transform_rotate_3d{$tab}!" => '',
	778	+ "_transform_rotate_popover{$tab}!" => '',
	779	+ ],
	780	+ 'selectors' => [
	781	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-rotateX: {{SIZE}}{{UNIT}};',
	782	+ ],
	783	+ 'frontend_available' => true,
	784	+ ]
	785	+ );
	786	+
	787	+ $this->add_responsive_control(
	788	+ "_transform_rotateY_effect{$tab}",
	789	+ [
	790	+ 'label' => esc_html__( 'Rotate Y', 'elementor' ),
	791	+ 'type' => Controls_Manager::SLIDER,
	792	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
	793	+ 'range' => [
	794	+ 'deg' => [
	795	+ 'min' => -360,
	796	+ 'max' => 360,
	797	+ ],
	798	+ 'grad' => [
	799	+ 'min' => -400,
	800	+ 'max' => 400,
	801	+ ],
	802	+ 'rad' => [
	803	+ 'min' => -6.2832,
	804	+ 'max' => 6.2832,
	805	+ ],
	806	+ 'turn' => [
	807	+ 'min' => -1,
	808	+ 'max' => 1,
	809	+ ],
	810	+ ],
	811	+ 'condition' => [
	812	+ "_transform_rotate_3d{$tab}!" => '',
	813	+ "_transform_rotate_popover{$tab}!" => '',
	814	+ ],
	815	+ 'selectors' => [
	816	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-rotateY: {{SIZE}}{{UNIT}};',
	817	+ ],
	818	+ 'frontend_available' => true,
	819	+ ]
	820	+ );
	821	+
	822	+ $this->add_responsive_control(
	823	+ "_transform_perspective_effect{$tab}",
	824	+ [
	825	+ 'label' => esc_html__( 'Perspective', 'elementor' ),
	826	+ 'type' => Controls_Manager::SLIDER,
	827	+ 'range' => [
	828	+ 'px' => [
	829	+ 'min' => 0,
	830	+ 'max' => 1000,
	831	+ ],
	832	+ ],
	833	+ 'condition' => [
	834	+ "_transform_rotate_popover{$tab}!" => '',
	835	+ "_transform_rotate_3d{$tab}!" => '',
	836	+ ],
	837	+ 'selectors' => [
	838	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-perspective: {{SIZE}}px',
	839	+ ],
	840	+ 'frontend_available' => true,
	841	+ ]
	842	+ );
	843	+
	844	+ $this->end_popover();
	845	+
	846	+ $this->add_control(
	847	+ "_transform_translate_popover{$tab}",
	848	+ [
	849	+ 'label' => esc_html__( 'Offset', 'elementor' ),
	850	+ 'type' => Controls_Manager::POPOVER_TOGGLE,
	851	+ 'prefix_class' => $transform_prefix_class,
	852	+ 'return_value' => $transform_return_value,
	853	+ ]
	854	+ );
	855	+
	856	+ $this->start_popover();
	857	+
	858	+ $this->add_responsive_control(
	859	+ "_transform_translateX_effect{$tab}",
	860	+ [
	861	+ 'label' => esc_html__( 'Offset X', 'elementor' ),
	862	+ 'type' => Controls_Manager::SLIDER,
	863	+ 'size_units' => [ '%', 'px' ],
	864	+ 'range' => [
	865	+ '%' => [
	866	+ 'min' => -100,
	867	+ 'max' => 100,
	868	+ ],
	869	+ 'px' => [
	870	+ 'min' => -1000,
	871	+ 'max' => 1000,
	872	+ ],
	873	+ ],
	874	+ 'condition' => [
	875	+ "_transform_translate_popover{$tab}!" => '',
	876	+ ],
	877	+ 'selectors' => [
	878	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-translateX: {{SIZE}}{{UNIT}};',
	879	+ ],
	880	+ 'frontend_available' => true,
	881	+ ]
	882	+ );
	883	+
	884	+ $this->add_responsive_control(
	885	+ "_transform_translateY_effect{$tab}",
	886	+ [
	887	+ 'label' => esc_html__( 'Offset Y', 'elementor' ),
	888	+ 'type' => Controls_Manager::SLIDER,
	889	+ 'size_units' => [ '%', 'px' ],
	890	+ 'range' => [
	891	+ '%' => [
	892	+ 'min' => -100,
	893	+ 'max' => 100,
	894	+ ],
	895	+ 'px' => [
	896	+ 'min' => -1000,
	897	+ 'max' => 1000,
	898	+ ],
	899	+ ],
	900	+ 'condition' => [
	901	+ "_transform_translate_popover{$tab}!" => '',
	902	+ ],
	903	+ 'selectors' => [
	904	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-translateY: {{SIZE}}{{UNIT}};',
	905	+ ],
	906	+ 'frontend_available' => true,
	907	+ ]
	908	+ );
	909	+
	910	+ $this->end_popover();
	911	+
	912	+ $this->add_control(
	913	+ "_transform_scale_popover{$tab}",
	914	+ [
	915	+ 'label' => esc_html__( 'Scale', 'elementor' ),
	916	+ 'type' => Controls_Manager::POPOVER_TOGGLE,
	917	+ 'prefix_class' => $transform_prefix_class,
	918	+ 'return_value' => $transform_return_value,
	919	+ ]
	920	+ );
	921	+
	922	+ $this->start_popover();
	923	+
	924	+ $this->add_control(
	925	+ "_transform_keep_proportions{$tab}",
	926	+ [
	927	+ 'label' => esc_html__( 'Keep Proportions', 'elementor' ),
	928	+ 'type' => Controls_Manager::SWITCHER,
	929	+ 'label_on' => esc_html__( 'On', 'elementor' ),
	930	+ 'label_off' => esc_html__( 'Off', 'elementor' ),
	931	+ 'default' => 'yes',
	932	+ ]
	933	+ );
	934	+
	935	+ $this->add_responsive_control(
	936	+ "_transform_scale_effect{$tab}",
	937	+ [
	938	+ 'label' => esc_html__( 'Scale', 'elementor' ),
	939	+ 'type' => Controls_Manager::SLIDER,
	940	+ 'range' => [
	941	+ 'px' => [
	942	+ 'min' => 0,
	943	+ 'max' => 2,
	944	+ 'step' => 0.1,
	945	+ ],
	946	+ ],
	947	+ 'condition' => [
	948	+ "_transform_scale_popover{$tab}!" => '',
	949	+ "_transform_keep_proportions{$tab}!" => '',
	950	+ ],
	951	+ 'selectors' => [
	952	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-scale: {{SIZE}};',
	953	+ ],
	954	+ 'frontend_available' => true,
	955	+ ]
	956	+ );
	957	+
	958	+ $this->add_responsive_control(
	959	+ "_transform_scaleX_effect{$tab}",
	960	+ [
	961	+ 'label' => esc_html__( 'Scale X', 'elementor' ),
	962	+ 'type' => Controls_Manager::SLIDER,
	963	+ 'range' => [
	964	+ 'px' => [
	965	+ 'min' => 0,
	966	+ 'max' => 2,
	967	+ 'step' => 0.1,
	968	+ ],
	969	+ ],
	970	+ 'condition' => [
	971	+ "_transform_scale_popover{$tab}!" => '',
	972	+ "_transform_keep_proportions{$tab}" => '',
	973	+ ],
	974	+ 'selectors' => [
	975	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-scaleX: {{SIZE}};',
	976	+ ],
	977	+ 'frontend_available' => true,
	978	+ ]
	979	+ );
	980	+
	981	+ $this->add_responsive_control(
	982	+ "_transform_scaleY_effect{$tab}",
	983	+ [
	984	+ 'label' => esc_html__( 'Scale Y', 'elementor' ),
	985	+ 'type' => Controls_Manager::SLIDER,
	986	+ 'range' => [
	987	+ 'px' => [
	988	+ 'min' => 0,
	989	+ 'max' => 2,
	990	+ 'step' => 0.1,
	991	+ ],
	992	+ ],
	993	+ 'condition' => [
	994	+ "_transform_scale_popover{$tab}!" => '',
	995	+ "_transform_keep_proportions{$tab}" => '',
	996	+ ],
	997	+ 'selectors' => [
	998	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-scaleY: {{SIZE}};',
	999	+ ],
	1000	+ 'frontend_available' => true,
	1001	+ ]
	1002	+ );
	1003	+
	1004	+ $this->end_popover();
	1005	+
	1006	+ $this->add_control(
	1007	+ "_transform_skew_popover{$tab}",
	1008	+ [
	1009	+ 'label' => esc_html__( 'Skew', 'elementor' ),
	1010	+ 'type' => Controls_Manager::POPOVER_TOGGLE,
	1011	+ 'prefix_class' => $transform_prefix_class,
	1012	+ 'return_value' => $transform_return_value,
	1013	+ ]
	1014	+ );
	1015	+
	1016	+ $this->start_popover();
	1017	+
	1018	+ $this->add_responsive_control(
	1019	+ "_transform_skewX_effect{$tab}",
	1020	+ [
	1021	+ 'label' => esc_html__( 'Skew X', 'elementor' ),
	1022	+ 'type' => Controls_Manager::SLIDER,
	1023	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
	1024	+ 'range' => [
	1025	+ 'deg' => [
	1026	+ 'min' => -360,
	1027	+ 'max' => 360,
	1028	+ ],
	1029	+ 'grad' => [
	1030	+ 'min' => -400,
	1031	+ 'max' => 400,
	1032	+ ],
	1033	+ 'rad' => [
	1034	+ 'min' => -6.2832,
	1035	+ 'max' => 6.2832,
	1036	+ ],
	1037	+ 'turn' => [
	1038	+ 'min' => -1,
	1039	+ 'max' => 1,
	1040	+ ],
	1041	+ ],
	1042	+ 'condition' => [
	1043	+ "_transform_skew_popover{$tab}!" => '',
	1044	+ ],
	1045	+ 'selectors' => [
	1046	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-skewX: {{SIZE}}{{UNIT}};',
	1047	+ ],
	1048	+ 'frontend_available' => true,
	1049	+ ]
	1050	+ );
	1051	+
	1052	+ $this->add_responsive_control(
	1053	+ "_transform_skewY_effect{$tab}",
	1054	+ [
	1055	+ 'label' => esc_html__( 'Skew Y', 'elementor' ),
	1056	+ 'type' => Controls_Manager::SLIDER,
	1057	+ 'size_units' => [ 'deg', 'grad', 'rad', 'turn' ],
	1058	+ 'range' => [
	1059	+ 'deg' => [
	1060	+ 'min' => -360,
	1061	+ 'max' => 360,
	1062	+ ],
	1063	+ 'grad' => [
	1064	+ 'min' => -400,
	1065	+ 'max' => 400,
	1066	+ ],
	1067	+ 'rad' => [
	1068	+ 'min' => -6.2832,
	1069	+ 'max' => 6.2832,
	1070	+ ],
	1071	+ 'turn' => [
	1072	+ 'min' => -1,
	1073	+ 'max' => 1,
	1074	+ ],
	1075	+ ],
	1076	+ 'condition' => [
	1077	+ "_transform_skew_popover{$tab}!" => '',
	1078	+ ],
	1079	+ 'selectors' => [
	1080	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-skewY: {{SIZE}}{{UNIT}};',
	1081	+ ],
	1082	+ 'frontend_available' => true,
	1083	+ ]
	1084	+ );
	1085	+
	1086	+ $this->end_popover();
	1087	+
	1088	+ $this->add_control(
	1089	+ "_transform_flipX_effect{$tab}",
	1090	+ [
	1091	+ 'label' => esc_html__( 'Flip Horizontal', 'elementor' ),
	1092	+ 'type' => Controls_Manager::CHOOSE,
	1093	+ 'options' => [
	1094	+ 'transform' => [
	1095	+ 'title' => esc_html__( 'Flip Horizontal', 'elementor' ),
	1096	+ 'icon' => 'eicon-flip eicon-tilted',
	1097	+ ],
	1098	+ ],
	1099	+ 'prefix_class' => $transform_prefix_class,
	1100	+ 'selectors' => [
	1101	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-flipX: -1',
	1102	+ ],
	1103	+ 'frontend_available' => true,
	1104	+ ]
	1105	+ );
	1106	+
	1107	+ $this->add_control(
	1108	+ "_transform_flipY_effect{$tab}",
	1109	+ [
	1110	+ 'label' => esc_html__( 'Flip Vertical', 'elementor' ),
	1111	+ 'type' => Controls_Manager::CHOOSE,
	1112	+ 'options' => [
	1113	+ 'transform' => [
	1114	+ 'title' => esc_html__( 'Flip Vertical', 'elementor' ),
	1115	+ 'icon' => 'eicon-flip',
	1116	+ ],
	1117	+ ],
	1118	+ 'prefix_class' => $transform_prefix_class,
	1119	+ 'selectors' => [
	1120	+ "{{WRAPPER}} > .elementor-widget-container{$state}" => '--e-transform-flipY: -1',
	1121	+ ],
	1122	+ 'frontend_available' => true,
	1123	+ ]
	1124	+ );
	1125	+
	1126	+ if ( '_hover' === $tab ) {
	1127	+ $this->add_control(
	1128	+ '_transform_transition_hover',
	1129	+ [
	1130	+ 'label' => esc_html__( 'Transition Duration', 'elementor' ),
	1131	+ 'type' => Controls_Manager::SLIDER,
	1132	+ 'size_units' => [ 's', 'ms' ],
	1133	+ 'default' => [
	1134	+ 'unit' => 'ms',
	1135	+ ],
	1136	+ 'range' => [
	1137	+ 's' => [
	1138	+ 'max' => 10,
	1139	+ ],
	1140	+ 'ms' => [
	1141	+ 'max' => 10000,
	1142	+ ],
	1143	+ ],
	1144	+ 'selectors' => [
	1145	+ '{{WRAPPER}} > .elementor-widget-container' => '--e-transform-transition-duration: {{SIZE}}{{UNIT}}',
	1146	+ ],
	1147	+ ]
	1148	+ );
	1149	+ }
	1150	+
	1151	+ ${"transform_origin_conditions{$tab}"} = [
	1152	+ [
	1153	+ 'name' => "_transform_scale_popover{$tab}",
	1154	+ 'operator' => '!=',
	1155	+ 'value' => '',
	1156	+ ],
	1157	+ [
	1158	+ 'name' => "_transform_rotate_popover{$tab}",
	1159	+ 'operator' => '!=',
	1160	+ 'value' => '',
	1161	+ ],
	1162	+ [
	1163	+ 'name' => "_transform_flipX_effect{$tab}",
	1164	+ 'operator' => '!=',
	1165	+ 'value' => '',
	1166	+ ],
	1167	+ [
	1168	+ 'name' => "_transform_flipY_effect{$tab}",
	1169	+ 'operator' => '!=',
	1170	+ 'value' => '',
	1171	+ ],
	1172	+ ];
	1173	+
	1174	+ $this->end_controls_tab();
	1175	+ }
	1176	+
	1177	+ $this->end_controls_tabs();
	1178	+
	1179	+ $transform_origin_conditions = [
	1180	+ 'relation' => 'or',
	1181	+ 'terms' => array_merge( $transform_origin_conditions, $transform_origin_conditions_hover ),
	1182	+ ];
	1183	+
	1184	+ // Will override motion effect transform-origin
	1185	+ $this->add_responsive_control(
	1186	+ 'motion_fx_transform_x_anchor_point',
	1187	+ [
	1188	+ 'label' => esc_html__( 'X Anchor Point', 'elementor' ),
	1189	+ 'type' => Controls_Manager::CHOOSE,
	1190	+ 'options' => [
	1191	+ 'left' => [
	1192	+ 'title' => esc_html__( 'Left', 'elementor' ),
	1193	+ 'icon' => 'eicon-h-align-left',
	1194	+ ],
	1195	+ 'center' => [
	1196	+ 'title' => esc_html__( 'Center', 'elementor' ),
	1197	+ 'icon' => 'eicon-h-align-center',
	1198	+ ],
	1199	+ 'right' => [
	1200	+ 'title' => esc_html__( 'Right', 'elementor' ),
	1201	+ 'icon' => 'eicon-h-align-right',
	1202	+ ],
	1203	+ ],
	1204	+ 'conditions' => $transform_origin_conditions,
	1205	+ 'separator' => 'before',
	1206	+ 'selectors' => [
	1207	+ '{{WRAPPER}}' => '--e-transform-origin-x: {{VALUE}}',
	1208	+ ],
	1209	+ ]
	1210	+ );
	1211	+
	1212	+ // Will override motion effect transform-origin
	1213	+ $this->add_responsive_control(
	1214	+ 'motion_fx_transform_y_anchor_point',
	1215	+ [
	1216	+ 'label' => esc_html__( 'Y Anchor Point', 'elementor' ),
	1217	+ 'type' => Controls_Manager::CHOOSE,
	1218	+ 'options' => [
	1219	+ 'top' => [
	1220	+ 'title' => esc_html__( 'Top', 'elementor' ),
	1221	+ 'icon' => 'eicon-v-align-top',
	1222	+ ],
	1223	+ 'center' => [
	1224	+ 'title' => esc_html__( 'Center', 'elementor' ),
	1225	+ 'icon' => 'eicon-v-align-middle',
	1226	+ ],
	1227	+ 'bottom' => [
	1228	+ 'title' => esc_html__( 'Bottom', 'elementor' ),
	1229	+ 'icon' => 'eicon-v-align-bottom',
	1230	+ ],
	1231	+ ],
	1232	+ 'conditions' => $transform_origin_conditions,
	1233	+ 'selectors' => [
	1234	+ '{{WRAPPER}}' => '--e-transform-origin-y: {{VALUE}}',
	1235	+ ],
	1236	+ ]
	1237	+ );
	1238	+
	1239	+ $this->end_controls_section();
	1240	+ }
	1241	+
	1242	+ /**
	1243	+ * Register the Background section.
667	1244	*
668	1245	* @return void
669	1246	*/
670	1247	private function register_background_section() {
		@@ -723,18 +1300,16 @@
723	1300	'_background_hover_transition',
724	1301	[
725	1302	'label' => esc_html__( 'Transition Duration', 'elementor' ),
726	1303	'type' => Controls_Manager::SLIDER,
727		- 'range' => [
728		- 'px' => [
729		- 'max' => 3,
730		- 'step' => 0.1,
731		- ],
	1304	+ 'size_units' => [ 's', 'ms' ],
	1305	+ 'default' => [
	1306	+ 'unit' => 's',
732	1307	],
733	1308	'render_type' => 'ui',
734	1309	'separator' => 'before',
735	1310	'selectors' => [
736		- '{{WRAPPER}} > .elementor-widget-container' => 'transition: background {{SIZE}}s',
	1311	+ '{{WRAPPER}} > .elementor-widget-container' => 'transition: background {{SIZE}}{{UNIT}}',
737	1312	],
738	1313	]
739	1314	);
740	1315
		@@ -838,16 +1413,14 @@
838	1413	[
839	1414	'label' => esc_html__( 'Transition Duration', 'elementor' ),
840	1415	'type' => Controls_Manager::SLIDER,
841	1416	'separator' => 'before',
842		- 'range' => [
843		- 'px' => [
844		- 'max' => 3,
845		- 'step' => 0.1,
846		- ],
	1417	+ 'size_units' => [ 's', 'ms' ],
	1418	+ 'default' => [
	1419	+ 'unit' => 's',
847	1420	],
848	1421	'selectors' => [
849		- '{{WRAPPER}} .elementor-widget-container' => 'transition: background {{_background_hover_transition.SIZE}}s, border {{SIZE}}s, border-radius {{SIZE}}s, box-shadow {{SIZE}}s',
	1422	+ '{{WRAPPER}} .elementor-widget-container' => 'transition: background {{_background_hover_transition.SIZE}}{{_background_hover_transition.UNIT}}, border {{SIZE}}{{UNIT}}, border-radius {{SIZE}}{{UNIT}}, box-shadow {{SIZE}}{{UNIT}}',
850	1423	],
851	1424	]
852	1425	);
853	1426