jamdotdev / jam-dev-utilities

Lightweight utils set - fast and open-source. It's got cmd+k search & everything's client-side. No ads, your data stays local.
https://jam.dev/utilities
GNU General Public License v3.0
248 stars 26 forks source link

[Feature] - CSS Inliner for Email #45

Closed EduardoDePatta closed 2 months ago

EduardoDePatta commented 2 months ago

Hello!

This PR introduces a new CSS to Inline Converter page to the application, designed to help users easily convert CSS styles into inline styles within their HTML. This tool is especially useful for developers who need to improve email compatibility or reduce external stylesheet dependencies.

Key Changes

  1. New Utility Function:
    • A utility function was added to parse HTML and CSS, applying inline styles from the CSS to the corresponding elements in the HTML while preserving existing inline styles.
  2. Test Suite:
    • Created comprehensive tests to validate the functionality of the convertCSSToInline function, ensuring it handles various scenarios such as conflicting styles, non-matching selectors, and empty inputs.
  3. New Page Component:
    • Added a new page component that allows users to input HTML and CSS, convert the CSS to inline styles, and copy the result.
    • Includes input validation to ensure correct HTML is provided and handles errors.
    • Features copy-to-clipboard functionality for easily copying the inlined HTML output.
  4. Updated Tools List:
    • The tools array was updated to include the new converter, making it accessible from the main tools page.
  5. Documentation Update:
    • The README file was updated to include the new converter in the list of available utilities, with a direct link to the tool.

Benefits

  1. Developer Efficiency: This tool simplifies the process of converting CSS to inline styles, a common need for email template development and other scenarios where external stylesheets are not supported.
peckz commented 2 months ago

@EduardoDePatta Thank you for this amazing tool! Great idea and great execution! left few minor comments

peckz commented 2 months ago

@EduardoDePatta Thank you once again and welcome to the contributors list!

danigrant commented 2 months ago

This is SO awesome!!! Such a great idea, I needed something like this so many times!

We'd love to send you a Jam hat to say thanks – my email is dani@jam.dev, if you reach out with your mailing address, a hat will be on its way! 🧢🤩