• Resolved herculesdesign

    (@herculesdesign)


    Hi there,

    I noticed a small problem with the font preview in the typography field. If I select white for the font, the background is also white and you can’t see the letters. Is there a way to fix this quickly ?

    Thank you.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Kev Provance

    (@kprovance)

    You could use some custom CSS to change the background color.

    Thread Starter herculesdesign

    (@herculesdesign)

    There is no way to change the css of the p.typography-preview when style is changed using plain css. I modified the redux-typography.js file by replacing this part of the code:

    if ( color ) {
    that.find( '.typography-previewf' ).css( 'color', color );
    }

    to :

    function hexToInt(hexColor) {
        // Remove the '#' if present
        if (hexColor.indexOf('#') === 0) {
            hexColor = hexColor.slice(1);
        }
        // Convert hex to integer
        return parseInt(hexColor, 16);
    }
    
    if (color) {
        that.find('.typography-preview').css('color', color);
       
        // Convert the color and range values to integers
        let colorInt = hexToInt(color);
        let whiteInt = hexToInt('ffffff');
        let lightGreyInt = hexToInt('dddddd');
    
        // Check if the color is within the specified range
        if (colorInt >= lightGreyInt && colorInt <= whiteInt) {
            that.find('.typography-preview').css('background-color', 'black');
        } else {
            // Optionally reset the background color if the text color is not within the range
            that.find('.typography-preview').css('background-color', ''); // Or set to a default color
        }
    }

    What do you think about my solution?

    Plugin Author Kev Provance

    (@kprovance)

    That works out nice, actually. I added it to the latest beta in our GitHub repo and credited you for the snippet. Thanks for the contribution!

    Thread Starter herculesdesign

    (@herculesdesign)

    That’s great. Thank you ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Typography field issue’ is closed to new replies.