Remove dashicons workarounds #53

mreishus · 2025-01-30T18:12:19Z

Now that we've switched our CSS engine to one that preserves unicode escape sequences ( #51 ), we no longer need these dashicons workarounds.

To Test

Visit

http://localhost:4747/get?url=https://wordpress.org/wp-includes/css/dashicons.css

And verify the escape sequences are still there. For example, .dashicons-media-text:before{content:"\f491"}.

Make a /tmp/dashtest.html and open it:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dashicons Test</title>
    <link rel="stylesheet" href="http://localhost:4747/get?url=https://wordpress.org/wp-includes/css/dashicons.css">
    <style>
        body {
            font-family: Arial, sans-serif;
            padding: 20px;
        }
        .icon-container {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 20px;
        }
        .icon-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        .dashicons {
            font-size: 24px;
            width: 24px;
            height: 24px;
            margin-bottom: 5px;
        }
    </style>
</head>
<body>
    <h1>Dashicons Test Page</h1>
    
    <div class="icon-container">
        <div class="icon-item">
            <span class="dashicons dashicons-admin-home"></span>
            <span>Home</span>
        </div>
        <div class="icon-item">
            <span class="dashicons dashicons-admin-users"></span>
            <span>Users</span>
        </div>
        <div class="icon-item">
            <span class="dashicons dashicons-admin-settings"></span>
            <span>Settings</span>
        </div>
        <div class="icon-item">
            <span class="dashicons dashicons-smiley"></span>
            <span>Smiley</span>
        </div>
        <div class="icon-item">
            <span class="dashicons dashicons-admin-post"></span>
            <span>Post</span>
        </div>
    </div>

    <script>
        // Check if dashicons loaded successfully
        window.addEventListener('load', () => {
            const icons = document.querySelectorAll('.dashicons');
            icons.forEach(icon => {
                const computedStyle = window.getComputedStyle(icon);
                const fontFamily = computedStyle.getPropertyValue('font-family');
                if (fontFamily.includes('dashicons')) {
                    console.log('Dashicons loaded successfully!');
                } else {
                    console.log('Dashicons failed to load.');
                }
            });
        });
    </script>
</body>
</html>

Remove dashicons workarounds

bac34e1

mreishus merged commit 9ef07db into trunk Jan 30, 2025
1 check passed

mreishus deleted the remove/dashicons-workarounds branch January 30, 2025 18:16

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Remove dashicons workarounds #53

Remove dashicons workarounds #53

mreishus commented Jan 30, 2025 •

edited

Loading

Remove dashicons workarounds #53

Remove dashicons workarounds #53

Conversation

mreishus commented Jan 30, 2025 • edited Loading

To Test

mreishus commented Jan 30, 2025 •

edited

Loading