| @@ -5,8 +5,9 @@ | ||
| 5 | 5 | exit; |
| 6 | 6 | } |
| 7 | 7 | |
| 8 | 8 | use ABlocks\Classes\ControlBaseAbstract; |
| 9 | +use ABlocks\Controls\Color; | |
| 9 | 10 | |
| 10 | 11 | class Border extends ControlBaseAbstract { |
| 11 | 12 | public static function get_attribute_default_value( $is_responsive = false ) { |
| 12 | 13 | |
| @@ -176,75 +177,84 @@ | ||
| 176 | 177 | ] |
| 177 | 178 | ]; |
| 178 | 179 | } |
| 179 | 180 | public static function get_css( $attribute_value, $property = '', $device = '' ) { |
| 180 | - $value = wp_parse_args( $attribute_value, self::get_attribute_default_value( true ) ); | |
| 181 | + $value = wp_parse_args( $attribute_value, self::responsive_defaults() ); | |
| 181 | 182 | $css = []; |
| 182 | 183 | |
| 183 | 184 | // Separate handling of width units |
| 185 | + // Resolved from the full value so a custom breakpoint's own unit key | |
| 186 | + // takes part; for Tablet/Mobile this reads the same three keys as before. | |
| 184 | 187 | if ( $device ) { |
| 185 | - $widthUnit = self::get_unit([ | |
| 186 | - 'unit' => $value['unitWidth'], | |
| 187 | - 'unitTablet' => $value['unitWidthTablet'], | |
| 188 | - 'unitMobile' => $value['unitWidthMobile'], | |
| 189 | - ], $device); | |
| 188 | + $widthUnit = \ABlocks\Helper::get_responsive_value( $value, 'unitWidth', $device ); | |
| 190 | 189 | } else { |
| 191 | 190 | $widthUnit = $value['unitWidth']; |
| 192 | 191 | } |
| 193 | 192 | |
| 194 | - // Handle width | |
| 195 | - if ( $value[ 'isLinkedWidth' . $device ] ) { | |
| 196 | - if ( '' !== $value[ 'commonWidth' . $device ] ) { | |
| 197 | - $css['border-width'] = $value[ 'commonWidth' . $device ] . $widthUnit; | |
| 193 | + // Handle width. Read every device-suffixed member through device_member(): | |
| 194 | + // a custom breakpoint (or the generator's value-less probe suffix) has no | |
| 195 | + // key of its own in the control's defaults, and indexing it directly is | |
| 196 | + // what produced "Undefined array key …" notices on every page. | |
| 197 | + if ( self::device_member( $value, 'isLinkedWidth', $device ) ) { | |
| 198 | + $commonWidth = self::device_member( $value, 'commonWidth', $device ); | |
| 199 | + if ( '' !== $commonWidth ) { | |
| 200 | + $css['border-width'] = $commonWidth . $widthUnit; | |
| 198 | 201 | } |
| 199 | 202 | } else { |
| 200 | - $topWidth = ! empty( $value[ 'topWidth' . $device ] ) ? $value[ 'topWidth' . $device ] : 0; | |
| 201 | - $rightWidth = ! empty( $value[ 'rightWidth' . $device ] ) ? $value[ 'rightWidth' . $device ] : 0; | |
| 202 | - $bottomWidth = ! empty( $value[ 'bottomWidth' . $device ] ) ? $value[ 'bottomWidth' . $device ] : 0; | |
| 203 | - $leftWidth = ! empty( $value[ 'leftWidth' . $device ] ) ? $value[ 'leftWidth' . $device ] : 0; | |
| 203 | + $topWidth = self::device_member( $value, 'topWidth', $device ); | |
| 204 | + $rightWidth = self::device_member( $value, 'rightWidth', $device ); | |
| 205 | + $bottomWidth = self::device_member( $value, 'bottomWidth', $device ); | |
| 206 | + $leftWidth = self::device_member( $value, 'leftWidth', $device ); | |
| 204 | 207 | |
| 205 | - $borderWidth = $topWidth . $widthUnit . ' ' . $rightWidth . $widthUnit . ' ' . $bottomWidth . $widthUnit . ' ' . $leftWidth . $widthUnit; | |
| 208 | + // Only emit border-width when at least one side was actually set — | |
| 209 | + // otherwise every unlinked border produced "border-width:0px 0px 0px 0px". | |
| 210 | + $has_width = '' !== $topWidth || '' !== $rightWidth || '' !== $bottomWidth || '' !== $leftWidth; | |
| 211 | + if ( $has_width ) { | |
| 212 | + $topWidth = ! empty( $topWidth ) ? $topWidth : 0; | |
| 213 | + $rightWidth = ! empty( $rightWidth ) ? $rightWidth : 0; | |
| 214 | + $bottomWidth = ! empty( $bottomWidth ) ? $bottomWidth : 0; | |
| 215 | + $leftWidth = ! empty( $leftWidth ) ? $leftWidth : 0; | |
| 206 | 216 | |
| 207 | - $css['border-width'] = $borderWidth; | |
| 208 | - } | |
| 217 | + $borderWidth = $topWidth . $widthUnit . ' ' . $rightWidth . $widthUnit . ' ' . $bottomWidth . $widthUnit . ' ' . $leftWidth . $widthUnit; | |
| 209 | 218 | |
| 219 | + $css['border-width'] = $borderWidth; | |
| 220 | + } | |
| 221 | + }//end if | |
| 222 | + | |
| 210 | 223 | // Handle border style and color |
| 211 | 224 | if ( '' !== $value['borderStyle'] && 'default' !== $value['borderStyle'] ) { |
| 212 | 225 | $css['border-style'] = $value['borderStyle']; |
| 213 | 226 | } |
| 214 | 227 | if ( '' !== $value['borderColor'] ) { |
| 215 | - $css['border-color'] = $value['borderColor']; | |
| 228 | + $css['border-color'] = Color::get_css( $value['borderColor'] ); | |
| 216 | 229 | } |
| 217 | 230 | |
| 218 | 231 | // Separate handling of radius units |
| 219 | 232 | if ( $device ) { |
| 220 | - $radiusUnit = self::get_unit([ | |
| 221 | - 'unit' => $value['unitRadius'], | |
| 222 | - 'unitTablet' => $value['unitRadiusTablet'], | |
| 223 | - 'unitMobile' => $value['unitRadiusMobile'], | |
| 224 | - ], $device); | |
| 233 | + $radiusUnit = \ABlocks\Helper::get_responsive_value( $value, 'unitRadius', $device ); | |
| 225 | 234 | } else { |
| 226 | 235 | $radiusUnit = $value['unitRadius']; |
| 227 | 236 | } |
| 228 | 237 | |
| 229 | 238 | // Handle radius |
| 230 | - if ( $value[ 'isLinkedRadius' . $device ] ) { | |
| 231 | - if ( '' !== $value[ 'commonRadius' . $device ] ) { | |
| 232 | - $css['border-radius'] = $value[ 'commonRadius' . $device ] . $radiusUnit; | |
| 239 | + if ( self::device_member( $value, 'isLinkedRadius', $device ) ) { | |
| 240 | + $commonRadius = self::device_member( $value, 'commonRadius', $device ); | |
| 241 | + if ( '' !== $commonRadius ) { | |
| 242 | + $css['border-radius'] = $commonRadius . $radiusUnit; | |
| 233 | 243 | } |
| 234 | 244 | } else { |
| 235 | - if ( '' !== $value[ 'topRadius' . $device ] ) { | |
| 236 | - $css['border-top-left-radius'] = $value[ 'topRadius' . $device ] . $radiusUnit; | |
| 245 | + $corners = [ | |
| 246 | + 'topRadius' => 'border-top-left-radius', | |
| 247 | + 'rightRadius' => 'border-top-right-radius', | |
| 248 | + 'bottomRadius' => 'border-bottom-right-radius', | |
| 249 | + 'leftRadius' => 'border-bottom-left-radius', | |
| 250 | + ]; | |
| 251 | + foreach ( $corners as $member => $property_name ) { | |
| 252 | + $corner = self::device_member( $value, $member, $device ); | |
| 253 | + if ( '' !== $corner ) { | |
| 254 | + $css[ $property_name ] = $corner . $radiusUnit; | |
| 255 | + } | |
| 237 | 256 | } |
| 238 | - if ( '' !== $value[ 'rightRadius' . $device ] ) { | |
| 239 | - $css['border-top-right-radius'] = $value[ 'rightRadius' . $device ] . $radiusUnit; | |
| 240 | - } | |
| 241 | - if ( '' !== $value[ 'bottomRadius' . $device ] ) { | |
| 242 | - $css['border-bottom-right-radius'] = $value[ 'bottomRadius' . $device ] . $radiusUnit; | |
| 243 | - } | |
| 244 | - if ( '' !== $value[ 'leftRadius' . $device ] ) { | |
| 245 | - $css['border-bottom-left-radius'] = $value[ 'leftRadius' . $device ] . $radiusUnit; | |
| 246 | - } | |
| 247 | 257 | } |
| 248 | 258 | |
| 249 | 259 | // Handle transition duration |
| 250 | 260 | if ( self::has_value( $value['transitionDuration'] ) ) { |
| @@ -267,10 +277,11 @@ | ||
| 267 | 277 | |
| 268 | 278 | if ( ! empty( $value['borderStyleH'] ) && 'default' !== $value['borderStyleH'] ) { |
| 269 | 279 | // Handle hover width |
| 270 | 280 | if ( ! empty( $value[ 'isLinkedWidthH' . $device ] ) ) { |
| 271 | - if ( '' !== $value[ 'commonWidthH' . $device ] ) { | |
| 272 | - $css['border-width'] = $value[ 'commonWidthH' . $device ] . $widthUnit; | |
| 281 | + $commonWidthH = self::device_member( $value, 'commonWidthH', $device ); | |
| 282 | + if ( '' !== $commonWidthH ) { | |
| 283 | + $css['border-width'] = $commonWidthH . $widthUnit; | |
| 273 | 284 | } |
| 274 | 285 | } else { |
| 275 | 286 | $topWidth = ! empty( $value[ 'topWidthH' . $device ] ) ? $value[ 'topWidthH' . $device ] : 0; |
| 276 | 287 | $rightWidth = ! empty( $value[ 'rightWidthH' . $device ] ) ? $value[ 'rightWidthH' . $device ] : 0; |
| @@ -281,11 +292,11 @@ | ||
| 281 | 292 | } |
| 282 | 293 | |
| 283 | 294 | // Handle hover border color |
| 284 | 295 | if ( ! empty( $value['borderColorH'] ) ) { |
| 285 | - $css['border-color'] = $value['borderColorH']; | |
| 296 | + $css['border-color'] = Color::get_css( $value['borderColorH'] ); | |
| 286 | 297 | } |
| 287 | - } | |
| 298 | + }//end if | |
| 288 | 299 | |
| 289 | 300 | // Handle hover border style |
| 290 | 301 | if ( ! empty( $value['borderStyleH'] ) && 'default' !== $value['borderStyleH'] ) { |
| 291 | 302 | $css['border-style'] = $value['borderStyleH']; |
