| @@ -177,38 +177,50 @@ | ||
| 177 | 177 | ] |
| 178 | 178 | ]; |
| 179 | 179 | } |
| 180 | 180 | public static function get_css( $attribute_value, $property = '', $device = '' ) { |
| 181 | - $value = wp_parse_args( $attribute_value, self::get_attribute_default_value( true ) ); | |
| 181 | + $value = wp_parse_args( $attribute_value, self::responsive_defaults() ); | |
| 182 | 182 | $css = []; |
| 183 | 183 | |
| 184 | 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. | |
| 185 | 187 | if ( $device ) { |
| 186 | - $widthUnit = self::get_unit([ | |
| 187 | - 'unit' => $value['unitWidth'], | |
| 188 | - 'unitTablet' => $value['unitWidthTablet'], | |
| 189 | - 'unitMobile' => $value['unitWidthMobile'], | |
| 190 | - ], $device); | |
| 188 | + $widthUnit = \ABlocks\Helper::get_responsive_value( $value, 'unitWidth', $device ); | |
| 191 | 189 | } else { |
| 192 | 190 | $widthUnit = $value['unitWidth']; |
| 193 | 191 | } |
| 194 | 192 | |
| 195 | - // Handle width | |
| 196 | - if ( $value[ 'isLinkedWidth' . $device ] ) { | |
| 197 | - if ( '' !== $value[ 'commonWidth' . $device ] ) { | |
| 198 | - $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; | |
| 199 | 201 | } |
| 200 | 202 | } else { |
| 201 | - $topWidth = ! empty( $value[ 'topWidth' . $device ] ) ? $value[ 'topWidth' . $device ] : 0; | |
| 202 | - $rightWidth = ! empty( $value[ 'rightWidth' . $device ] ) ? $value[ 'rightWidth' . $device ] : 0; | |
| 203 | - $bottomWidth = ! empty( $value[ 'bottomWidth' . $device ] ) ? $value[ 'bottomWidth' . $device ] : 0; | |
| 204 | - $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 ); | |
| 205 | 207 | |
| 206 | - $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; | |
| 207 | 216 | |
| 208 | - $css['border-width'] = $borderWidth; | |
| 209 | - } | |
| 217 | + $borderWidth = $topWidth . $widthUnit . ' ' . $rightWidth . $widthUnit . ' ' . $bottomWidth . $widthUnit . ' ' . $leftWidth . $widthUnit; | |
| 210 | 218 | |
| 219 | + $css['border-width'] = $borderWidth; | |
| 220 | + } | |
| 221 | + }//end if | |
| 222 | + | |
| 211 | 223 | // Handle border style and color |
| 212 | 224 | if ( '' !== $value['borderStyle'] && 'default' !== $value['borderStyle'] ) { |
| 213 | 225 | $css['border-style'] = $value['borderStyle']; |
| 214 | 226 | } |
| @@ -217,35 +229,32 @@ | ||
| 217 | 229 | } |
| 218 | 230 | |
| 219 | 231 | // Separate handling of radius units |
| 220 | 232 | if ( $device ) { |
| 221 | - $radiusUnit = self::get_unit([ | |
| 222 | - 'unit' => $value['unitRadius'], | |
| 223 | - 'unitTablet' => $value['unitRadiusTablet'], | |
| 224 | - 'unitMobile' => $value['unitRadiusMobile'], | |
| 225 | - ], $device); | |
| 233 | + $radiusUnit = \ABlocks\Helper::get_responsive_value( $value, 'unitRadius', $device ); | |
| 226 | 234 | } else { |
| 227 | 235 | $radiusUnit = $value['unitRadius']; |
| 228 | 236 | } |
| 229 | 237 | |
| 230 | 238 | // Handle radius |
| 231 | - if ( $value[ 'isLinkedRadius' . $device ] ) { | |
| 232 | - if ( '' !== $value[ 'commonRadius' . $device ] ) { | |
| 233 | - $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; | |
| 234 | 243 | } |
| 235 | 244 | } else { |
| 236 | - if ( '' !== $value[ 'topRadius' . $device ] ) { | |
| 237 | - $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 | + } | |
| 238 | 256 | } |
| 239 | - if ( '' !== $value[ 'rightRadius' . $device ] ) { | |
| 240 | - $css['border-top-right-radius'] = $value[ 'rightRadius' . $device ] . $radiusUnit; | |
| 241 | - } | |
| 242 | - if ( '' !== $value[ 'bottomRadius' . $device ] ) { | |
| 243 | - $css['border-bottom-right-radius'] = $value[ 'bottomRadius' . $device ] . $radiusUnit; | |
| 244 | - } | |
| 245 | - if ( '' !== $value[ 'leftRadius' . $device ] ) { | |
| 246 | - $css['border-bottom-left-radius'] = $value[ 'leftRadius' . $device ] . $radiusUnit; | |
| 247 | - } | |
| 248 | 257 | } |
| 249 | 258 | |
| 250 | 259 | // Handle transition duration |
| 251 | 260 | if ( self::has_value( $value['transitionDuration'] ) ) { |
| @@ -268,10 +277,11 @@ | ||
| 268 | 277 | |
| 269 | 278 | if ( ! empty( $value['borderStyleH'] ) && 'default' !== $value['borderStyleH'] ) { |
| 270 | 279 | // Handle hover width |
| 271 | 280 | if ( ! empty( $value[ 'isLinkedWidthH' . $device ] ) ) { |
| 272 | - if ( '' !== $value[ 'commonWidthH' . $device ] ) { | |
| 273 | - $css['border-width'] = $value[ 'commonWidthH' . $device ] . $widthUnit; | |
| 281 | + $commonWidthH = self::device_member( $value, 'commonWidthH', $device ); | |
| 282 | + if ( '' !== $commonWidthH ) { | |
| 283 | + $css['border-width'] = $commonWidthH . $widthUnit; | |
| 274 | 284 | } |
| 275 | 285 | } else { |
| 276 | 286 | $topWidth = ! empty( $value[ 'topWidthH' . $device ] ) ? $value[ 'topWidthH' . $device ] : 0; |
| 277 | 287 | $rightWidth = ! empty( $value[ 'rightWidthH' . $device ] ) ? $value[ 'rightWidthH' . $device ] : 0; |
| @@ -284,9 +294,9 @@ | ||
| 284 | 294 | // Handle hover border color |
| 285 | 295 | if ( ! empty( $value['borderColorH'] ) ) { |
| 286 | 296 | $css['border-color'] = Color::get_css( $value['borderColorH'] ); |
| 287 | 297 | } |
| 288 | - } | |
| 298 | + }//end if | |
| 289 | 299 | |
| 290 | 300 | // Handle hover border style |
| 291 | 301 | if ( ! empty( $value['borderStyleH'] ) && 'default' !== $value['borderStyleH'] ) { |
| 292 | 302 | $css['border-style'] = $value['borderStyleH']; |
