Less mixins

Contents

1. Invert button state
2. Page container
3. Product listing

Invert button state

This mixin allows to change how the button looks and swap default and hovered states.

You can see how it looks like in ArgentoPure2 theme. Take a look at the Add To Cart button at product page.

Usage example:

.block-minicart {
    .actions {
        .action {
            &.primary {
                .argento-button-primary-invert-state();
            }
        }
    }
}

Page container

Applies centering, max-width and spacing styles for the block.

Usage example:

.jumbotron {
    .argento-page-container(~"> .container");
}

Product listing

Example:

.page-products .products-grid .product-item,
.block.widget .products-grid .product-item {
    .argento-listing-squama();
}

See more examples about squama-listing in a separate article.