← All changes | includes/controls/groups/flex-container.php +22 -40 4.2.2 → 3.17.2 View file →

		@@ -49,12 +49,12 @@
49	49	'default' => '',
50	50	// The `--container-widget-width` CSS variable is used for handling widgets that get an undefined width in column mode.
51	51	// The `--container-widget-flex-grow` CSS variable is used to give certain widgets a default `flex-grow: 1` value for the `flex row` combination.
52	52	'selectors_dictionary' => [
53		- 'row' => '--flex-direction: row; --container-widget-width: initial; --container-widget-height: 100%; --container-widget-flex-grow: 1; --container-widget-align-self: stretch; --flex-wrap-mobile: wrap;',
54		- 'column' => '--flex-direction: column; --container-widget-width: 100%; --container-widget-height: initial; --container-widget-flex-grow: 0; --container-widget-align-self: initial; --flex-wrap-mobile: wrap;',
55		- 'row-reverse' => '--flex-direction: row-reverse; --container-widget-width: initial; --container-widget-height: 100%; --container-widget-flex-grow: 1; --container-widget-align-self: stretch; --flex-wrap-mobile: wrap-reverse;',
56		- 'column-reverse' => '--flex-direction: column-reverse; --container-widget-width: 100%; --container-widget-height: initial; --container-widget-flex-grow: 0; --container-widget-align-self: initial; --flex-wrap-mobile: wrap;',
	53	+ 'row' => '--flex-direction: row; --container-widget-width: initial; --container-widget-height: 100%; --container-widget-flex-grow: 1; --container-widget-align-self: stretch;',
	54	+ 'column' => '--flex-direction: column; --container-widget-width: 100%; --container-widget-height: initial; --container-widget-flex-grow: 0; --container-widget-align-self: initial;',
	55	+ 'row-reverse' => '--flex-direction: row-reverse; --container-widget-width: initial; --container-widget-height: 100%; --container-widget-flex-grow: 1; --container-widget-align-self: stretch;',
	56	+ 'column-reverse' => '--flex-direction: column-reverse; --container-widget-width: 100%; --container-widget-height: initial; --container-widget-flex-grow: 0; --container-widget-align-self: initial;',
57	57	],
58	58	'selectors' => [
59	59	'{{SELECTOR}}' => '{{VALUE}};',
60	60	],
		@@ -93,17 +93,17 @@
93	93	'label_block' => true,
94	94	'default' => '',
95	95	'options' => [
96	96	'flex-start' => [
97		- 'title' => esc_html__( 'Start', 'elementor' ),
	97	+ 'title' => esc_html_x( 'Start', 'Flex Container Control', 'elementor' ),
98	98	'icon' => 'eicon-flex eicon-justify-start-h',
99	99	],
100	100	'center' => [
101		- 'title' => esc_html__( 'Center', 'elementor' ),
	101	+ 'title' => esc_html_x( 'Center', 'Flex Container Control', 'elementor' ),
102	102	'icon' => 'eicon-flex eicon-justify-center-h',
103	103	],
104	104	'flex-end' => [
105		- 'title' => esc_html__( 'End', 'elementor' ),
	105	+ 'title' => esc_html_x( 'End', 'Flex Container Control', 'elementor' ),
106	106	'icon' => 'eicon-flex eicon-justify-end-h',
107	107	],
108	108	'space-between' => [
109	109	'title' => esc_html__( 'Space Between', 'elementor' ),
		@@ -129,17 +129,17 @@
129	129	'type' => Controls_Manager::CHOOSE,
130	130	'default' => '',
131	131	'options' => [
132	132	'flex-start' => [
133		- 'title' => esc_html__( 'Start', 'elementor' ),
	133	+ 'title' => esc_html_x( 'Start', 'Flex Container Control', 'elementor' ),
134	134	'icon' => 'eicon-flex eicon-align-start-v',
135	135	],
136	136	'center' => [
137		- 'title' => esc_html__( 'Center', 'elementor' ),
	137	+ 'title' => esc_html_x( 'Center', 'Flex Container Control', 'elementor' ),
138	138	'icon' => 'eicon-flex eicon-align-center-v',
139	139	],
140	140	'flex-end' => [
141		- 'title' => esc_html__( 'End', 'elementor' ),
	141	+ 'title' => esc_html_x( 'End', 'Flex Container Control', 'elementor' ),
142	142	'icon' => 'eicon-flex eicon-align-end-v',
143	143	],
144	144	'stretch' => [
145	145	'title' => esc_html__( 'Stretch', 'elementor' ),
		@@ -160,9 +160,9 @@
160	160	'unit' => 'px',
161	161	],
162	162	'separator' => 'before',
163	163	'selectors' => [
164		- '{{SELECTOR}}' => '--gap: {{ROW}}{{UNIT}} {{COLUMN}}{{UNIT}};--row-gap: {{ROW}}{{UNIT}};--column-gap: {{COLUMN}}{{UNIT}};',
	164	+ '{{SELECTOR}}' => '--gap: {{ROW}}{{UNIT}} {{COLUMN}}{{UNIT}}',
165	165	],
166	166	'responsive' => true,
167	167	'conversion_map' => [
168	168	'old_key' => 'size',
		@@ -179,17 +179,17 @@
179	179	],
180	180	];
181	181
182	182	$fields['wrap'] = [
183		- 'label' => esc_html__( 'Wrap', 'elementor' ),
	183	+ 'label' => esc_html_x( 'Wrap', 'Flex Container Control', 'elementor' ),
184	184	'type' => Controls_Manager::CHOOSE,
185	185	'options' => [
186	186	'nowrap' => [
187		- 'title' => esc_html__( 'No Wrap', 'elementor' ),
	187	+ 'title' => esc_html_x( 'No Wrap', 'Flex Container Control', 'elementor' ),
188	188	'icon' => 'eicon-flex eicon-nowrap',
189	189	],
190	190	'wrap' => [
191		- 'title' => esc_html__( 'Wrap', 'elementor' ),
	191	+ 'title' => esc_html_x( 'Wrap', 'Flex Container Control', 'elementor' ),
192	192	'icon' => 'eicon-flex eicon-wrap',
193	193	],
194	194	],
195	195	'description' => esc_html__( 'Items within the container can stay in a single line (No wrap), or break into multiple lines (Wrap).', 'elementor' ),
		@@ -201,36 +201,18 @@
201	201	];
202	202
203	203	$fields['align_content'] = [
204	204	'label' => esc_html__( 'Align Content', 'elementor' ),
205		- 'type' => Controls_Manager::CHOOSE,
206		- 'label_block' => true,
	205	+ 'type' => Controls_Manager::SELECT,
207	206	'default' => '',
208	207	'options' => [
209		- 'flex-start' => [
210		- 'title' => esc_html__( 'Start', 'elementor' ),
211		- 'icon' => 'eicon-justify-start-v',
212		- ],
213		- 'center' => [
214		- 'title' => esc_html__( 'Middle', 'elementor' ),
215		- 'icon' => 'eicon-justify-center-v',
216		- ],
217		- 'flex-end' => [
218		- 'title' => esc_html__( 'End', 'elementor' ),
219		- 'icon' => 'eicon-justify-end-v',
220		- ],
221		- 'space-between' => [
222		- 'title' => esc_html__( 'Space Between', 'elementor' ),
223		- 'icon' => 'eicon-justify-space-between-v',
224		- ],
225		- 'space-around' => [
226		- 'title' => esc_html__( 'Space Around', 'elementor' ),
227		- 'icon' => 'eicon-justify-space-around-v',
228		- ],
229		- 'space-evenly' => [
230		- 'title' => esc_html__( 'Space Evenly', 'elementor' ),
231		- 'icon' => 'eicon-justify-space-evenly-v',
232		- ],
	208	+ '' => esc_html__( 'Default', 'elementor' ),
	209	+ 'center' => esc_html__( 'Center', 'elementor' ),
	210	+ 'flex-start' => esc_html__( 'Start', 'elementor' ),
	211	+ 'flex-end' => esc_html__( 'End', 'elementor' ),
	212	+ 'space-between' => esc_html__( 'Space Between', 'elementor' ),
	213	+ 'space-around' => esc_html__( 'Space Around', 'elementor' ),
	214	+ 'space-evenly' => esc_html__( 'Space Evenly', 'elementor' ),
233	215	],
234	216	'selectors' => [
235	217	'{{SELECTOR}}' => '--align-content: {{VALUE}};',
236	218	],