Performing read and write operations on targeted CSS classes using C#

Question

Performing read and write operations on targeted CSS classes using C#

I'm currently developing a C# application that needs to manipulate CSS files. Imagine you have the following CSS code snippet:

.ClassOne
{   
    color: #FFFFFF;    
    font-weight:normal;
    font-size: 9pt;
    font-family: Tahoma;                    
    vertical-align: middle;
    border: solid 1px #7F7F7F;  
    padding: 1px 1px 1px 1px;
    background-color: #B48410;
    background-position: center center;
}

.ClassTwo
{
    color: #FFFFFF;        
        background-repeat: repeat-x;
    background-color: #000000;
}

.ClassThree
{   
    color: #000000;    
    font-weight:normal;
    font-size: 9pt;
    font-family: Tahoma;                    
    vertical-align: left;
    border: solid 1px #F3Dc51;  
    padding: 1px 1px 1px 1px;
    background-color: #A32DF1;
}

My goal is to search for specific classes in the file, such as ClassOne, and extract the corresponding background-color property for those classes. This task only needs to be done for certain classes in the CSS file - for example, I may only want to extract the background-color values for ClassOne and ClassThree.

The resulting application should then transfer these stored values to another CSS file with the same set of classes.

I am aware of ExCSS but unsure about its utility in this context and how to effectively leverage it. Can someone provide guidance on this matter?

c#css parsing

Answer 1

Answer №1

To kickstart your journey with ExCss, you can begin by focusing on the parsing aspect. Here's a snippet to guide you:

    [Test]
    public void Apple([Values (".ClassThree")] string targetClass, [Values ("#A32DF1")] string expectedColor)
    {
        var parser = new Parser();
        var sheet = parser.Parse(sample);
        var result = sheet.Rulesets
            .Where(s => s.Selector.ToString() == targetClass)
            .SelectMany(r => r.Declarations)
            .FirstOrDefault(d => d.Name.Equals("background-color", StringComparison.InvariantCultureIgnoreCase))
            .Term
            .ToString();
        Assert.AreEqual(expectedColor, result);            
    }

Instead of relying on Linq, you may consider iterating through your CSS and constructing a new CSS containing values from declarations that match your target criteria. Here's an example approach:

        var targetClasses = new List<string> { ".ClassOne", ".ClassThree" };
        var targetDecls = new List<string> { "background-color" };

        var parser = new Parser();
        var sheet = parser.Parse(sample);
        foreach (var r in sheet.Rulesets)
        {
            if (targetClasses.Contains(r.Selector.ToString()))
            {
                Debug.WriteLine(r.Selector.ToString());
                Debug.WriteLine("{");
                foreach (var d in r.Declarations)
                {
                    if (targetDecls.Contains(d.Name))
                    {
                        Debug.WriteLine("\t" + d);
                    }
                }
                Debug.WriteLine("}");
            }
        }

Answer 2

To kickstart your journey with ExCss, you can begin by focusing on the parsing aspect. Here's a snippet to guide you:

    [Test]
    public void Apple([Values (".ClassThree")] string targetClass, [Values ("#A32DF1")] string expectedColor)
    {
        var parser = new Parser();
        var sheet = parser.Parse(sample);
        var result = sheet.Rulesets
            .Where(s => s.Selector.ToString() == targetClass)
            .SelectMany(r => r.Declarations)
            .FirstOrDefault(d => d.Name.Equals("background-color", StringComparison.InvariantCultureIgnoreCase))
            .Term
            .ToString();
        Assert.AreEqual(expectedColor, result);            
    }

Instead of relying on Linq, you may consider iterating through your CSS and constructing a new CSS containing values from declarations that match your target criteria. Here's an example approach:

        var targetClasses = new List<string> { ".ClassOne", ".ClassThree" };
        var targetDecls = new List<string> { "background-color" };

        var parser = new Parser();
        var sheet = parser.Parse(sample);
        foreach (var r in sheet.Rulesets)
        {
            if (targetClasses.Contains(r.Selector.ToString()))
            {
                Debug.WriteLine(r.Selector.ToString());
                Debug.WriteLine("{");
                foreach (var d in r.Declarations)
                {
                    if (targetDecls.Contains(d.Name))
                    {
                        Debug.WriteLine("\t" + d);
                    }
                }
                Debug.WriteLine("}");
            }
        }

Performing read and write operations on targeted CSS classes using C#

Answer №1

Similar questions

What could be causing the header's height to remain unchanged when using a percentage for its size?

Cross-browser compatibility issues with animated SVG line drawing glow effect

Deciphering the creation process behind the "WhatsApp Web" front-end page

Adjusting the height of one element based on the height of another element in multiple cases using jQuery

"Create a new instance of a child object using a parent class

Tips for creating a responsive carousel slider for images

Adjusting the size of h1 when hovering over an image

Navigating JSON data in a POST request using C# in .NET Core version 3.1

Overflow and contain a flex item within another flex item

Implementing a Custom CSS Theme in JavaFX

The background of the ACTK Modal Popup vanishes after multiple instances of scrolling up and down

How can I remove the outline when focusing with the mouse, but still retain it when focusing with the

Accessing and manipulating web elements using either XPath or CSS selectors

The JQuery loading symbol does not prevent keyboard interactions

Is it possible to turn off the shadow on just one side?

What is the best way to toggle a specific div element within an ng-repeat loop?

Discovering the ASP.NET Core HTTP response header in an Angular application using an HTTP interceptor

What is the best way to generate multiple progress bars by leveraging a for loop?

CSS navbar with a unique design: Issue with List Hover not Persisting

What methods does Coinbase use to achieve this effect? Is it possible to recreate it in a React application? (Dropdown menu positioned relative to a button on hover or click