chrisblakley / Nebula

Nebula is a WordPress theme framework that focuses on enhancing development. The core features of Nebula make it a powerful tool for designing, developing, and analyzing WordPress websites consistently, yet its deliberately uncomplicated code syntax also serves as a learning resource for programmers themselves.
https://nebula.gearside.com
GNU General Public License v2.0
141 stars 36 forks source link

Watch for CSS when/else conditionals [🟥 awaiting full support] #2262

Open chrisblakley opened 1 year ago

chrisblakley commented 1 year ago

Allows for conditional rules to be used within native CSS.

Simple example:

.container {
    width: 80%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 1rem;
    @when element(max-width: 400px) {
        grid-template-columns: 1fr;
        padding: 2rem;
    }
}

https://caniuse.com/css-when-else

Screen Shot 2023-09-19 at 5 26 25 PM