PDP Susy Layout Example

pdp-layout-example.scss

// grid layout
@include with-grid-settings( $columns: 12, $width: 58px, $gutter: 24px, $padding: 24px ) {
    .pdp {
        @include susy-grid-background;
        @include container;

        > .breadcrumbs {
            @include span-columns( 12 );
        }
    }

    .pdp__images {
        @include span-columns( 7 );
    }

    .pdp__article {
        @include prefix( 1 );
        @include span-columns( 4 omega );
        width: gutter() + columns( 4 );
        margin-left: -#{gutter()};
    }
}