Grid layout for addon

[creaky]

I'm using one of Bob's addons and trying to get a grid layout working with the dark/light theme.

This is the CSS for the dark style which works. There is more which does the grid, this is just the main background I'm attempting to change.

.structItemContainerDsListView {
    display: block;
    background: #0E1116;
    border: 1px solid #161c24;
    border-radius: 6px;
    padding: 15px;
    transition: all .2s ease;
    text-align: center
}

This is what I've tried to switch between the styles which doesn't work

.structItemContainerDsListView {
    .m-colorScheme(light,
        {
                    display: block;
            background: #ffffff;
            border: 1px solid #161c24;
            border-radius: 6px;
            padding: 15px;
            transition: all .2s ease;
            text-align: center;
        }
    );
    .m-colorScheme(dark,
        {
                    display: block;
            background: #0E1116;
            border: 1px solid #161c24;
            border-radius: 6px;
            padding: 15px;
            transition: all .2s ease;
            text-align: center;
        }
    );
}

The original code works and gives the grid layout, when adding the light/dark version the grid turns in to a list.

 

[Russ]

It's not how I'd approach the CSS.

If the main style is light, I'd take this approach:

.structItemContainerDsListView {
    display: block;
     background: #ffffff;
            border: 1px solid #161c24;
    border-radius: 6px;
    padding: 15px;
    transition: all .2s ease;
    text-align: center;

        .m-colorScheme(dark,
        {
    background: #0E1116;
    border: 1px solid #161c24;
  
    }
    );
}

The CSS for the colors should really only change things related to the color.