osompress / simple-social-icons

Plugin: Simple Social Icons
62 stars 33 forks source link

Allow empty background colors to denote transparency #15

Closed nickcernis closed 6 years ago

nickcernis commented 9 years ago

We currently validate colors with this in the update() method:

/** Validate hex code colors */
elseif ( strpos( $key, '_color' ) && 0 == preg_match( '/^#(([a-fA-F0-9]{3}$)|([a-fA-F0-9]{6}$))/', $value ) ) {
    $newinstance[$key] = $oldinstance[$key];
}

As originally suggested here, we should allow users to clear the hex field and save their changes to denote a transparent color:

elseif ( strpos( $key, '_color' ) && 0 == preg_match( '/^#(([a-fA-F0-9]{3}$)|([a-fA-F0-9]{6}$))/', $value ) && ! empty( $value ) ) {
    $newinstance[$key] = $oldinstance[$key];
}

We'd also need to modify the css() function to output 'transparent' if $instance['background_color'] or $instance['background_color_hover'] is empty.

helgatheviking commented 9 years ago

:+1: from me since it was me that opened the original thread at the WP forums.

Here's my modification to the update() method:

/** Accept empty colors */
elseif ( strpos( $key, '_color' ) && '' == trim( $value ) ) {
    $newinstance[$key] = '';
}

/** Validate hex code colors */
elseif ( strpos( $key, '_color' ) && 0 == preg_match( '/^#(([a-fA-F0-9]{3}$)|([a-fA-F0-9]{6}$))/', $value ) ) {
    $newinstance[$key] = $oldinstance[$key];
}

This "works" as is, though as mentioned it is probably a good idea to adjust the CSS output.

dreamwhisper commented 6 years ago

@nickcernis This works as described.

It is possible to now have transparent icons. I'm not entirely sure there's a use case for that, but if icons aren't showing for someone, they may be transparent. Do we want that here?

nickcernis commented 6 years ago

@dreamwhisper Thanks for testing, and I agree — I opened https://github.com/studiopress/simple-social-icons/issues/82 and will address this for 2.1.

dreamwhisper commented 6 years ago

@nickcernis Thanks! I'll mark this confirmed for the background.