Responsive sticky top

[jahanzaibsuleman07]

This is solution for creating responsive sticky top class which closes #28311.

cc: @mdo

[MartijnCuppens]

Hi @jahanzaibsuleman07

• Could you move @supports (position: sticky) around the loop, this prevents the supports query from being generated multiple times
• This needs to be documented in our docs
• We also need documentation for if you want to use the mixin below a specific size. I guess we'll need to work with the .position-static utility class then?

[jahanzaibsuleman07]

Hi @jahanzaibsuleman07

• Could you move @supports (position: sticky) around the loop, this prevents the supports query from being generated multiple times
• This needs to be documented in our docs
• We also need documentation for if you want to use the mixin below a specific size. I guess we'll need to work with the .position-static utility class then?

Hi @MartijnCuppens and @mdo :

I have addressed the first two points. Please review.
For third point, do you want something in the documentation like below?

Mixins

Sass mixin can be used to create a class up to specific view port like below:

@include media-breakpoint-down(sm) {
    $infix: breakpoint-infix(sm, $grid-breakpoints);

    .position#{$infix}-static {
        position: static !important;
    }
} 

[jahanzaibsuleman07]

Hi @MartijnCuppens and @mdo, do we need any further changes here?
Also please see my previous comment. Thanks!