CSS Border Radius Normalizer

A utility that normalizes CSS stylesheets by optimizing border-radius property values to their most compact form.

Requirements

Input Processing

• Accepts CSS content as a string input
• Returns the optimized CSS as a string output

Border Radius Optimization

The tool should process border-radius properties and optimize them by:

• Removing redundant slash notation when horizontal and vertical radii are identical
• Preserving the slash notation when horizontal and vertical radii differ
• Maintaining all other CSS properties unchanged

Test Cases

• Given CSS with border-radius: 10px / 10px, it returns CSS with border-radius: 10px @test
• Given CSS with border-radius: 5px 10px / 5px 10px, it returns CSS with border-radius: 5px 10px @test
• Given CSS with border-radius: 10px / 5px, it preserves the slash notation as border-radius: 10px / 5px @test
• Given CSS with multiple rules containing border-radius, it optimizes all of them correctly @test

Implementation

@generates

API

/**
 * Normalizes CSS by optimizing border-radius properties
 *
 * @param {string} css - The CSS content to normalize
 * @returns {string} The normalized CSS with optimized border-radius values
 */
function normalizeBorderRadius(css) {
  // IMPLEMENTATION HERE
}

module.exports = {
  normalizeBorderRadius
};

Dependencies { .dependencies }

clean-css { .dependency }

Provides CSS minification and optimization capabilities.

@satisfied-by