or run

tessl search
Log in

Version

Files

tile.json

task.mdevals/scenario-9/

Email Template Styler

Build a function that generates a styled MJML email template with custom CSS.

Requirements

Create a function generateStyledEmail(config) that:

  1. Takes a configuration object with:

    • title: Email preview title
    • heading: Main heading text
    • bodyText: Body paragraph text
    • linkColor: CSS color value for all links (e.g., "#0066cc")
    • backgroundColor: CSS color value for the email background
  2. Generates an MJML template that:

    • Uses mj-title and mj-preview for the title
    • Contains an mj-section with a text heading and body paragraph
    • Adds CSS to the head using mj-style to style all anchor tags with the link color
    • Applies the background color to the section
  3. Compiles the MJML to HTML using the mjml2html function and returns the compiled HTML string

Test Cases

  • Given config { title: "Welcome", heading: "Hello User", bodyText: "Thanks for signing up", linkColor: "#0066cc", backgroundColor: "#f4f4f4" }, the function returns HTML containing the text "Hello User" and "Thanks for signing up". @test

  • Given config { title: "Newsletter", heading: "Monthly Update", bodyText: "Check out our latest features", linkColor: "#cc3300", backgroundColor: "#ffffff" }, the generated HTML includes a style tag with "a { color: #cc3300" for link styling. @test

  • Given config { title: "Alert", heading: "Important Notice", bodyText: "Please review", linkColor: "#ff0000", backgroundColor: "#fff5f5" }, the function compiles MJML without errors and returns a non-empty HTML string. @test

Implementation

@generates

API

/**
 * Generates a styled MJML email template and compiles it to HTML
 *
 * @param {Object} config - Configuration object
 * @param {string} config.title - Email preview title
 * @param {string} config.heading - Main heading text
 * @param {string} config.bodyText - Body paragraph text
 * @param {string} config.linkColor - CSS color for links
 * @param {string} config.backgroundColor - CSS color for background
 * @returns {string} Compiled HTML string
 */
function generateStyledEmail(config) {
  // Implementation here
}

module.exports = { generateStyledEmail };

Dependencies { .dependencies }

mjml { .dependency }

Provides MJML to HTML compilation and custom CSS styling support.