123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899 |
- // RTL Grid system
- //
- // Generate semantic rtl grid columns with these mixins.
- // Generate the extra small columns
- .make-xs-column(@columns; @gutter: @grid-gutter-width) {
- float: right;
- }
- .make-xs-column-offset(@columns) {
- margin-right: percentage((@columns / @grid-columns));
- margin-left: 0;
- }
- .make-xs-column-push(@columns) {
- right: percentage((@columns / @grid-columns));
- left: auto;
- }
- .make-xs-column-pull(@columns) {
- left: percentage((@columns / @grid-columns));
- right: auto;
- }
- // Generate the small columns
- .make-sm-column(@columns; @gutter: @grid-gutter-width) {
- @media (min-width: @screen-sm-min) {
- float: right;
- }
- }
- .make-sm-column-offset(@columns) {
- @media (min-width: @screen-sm-min) {
- margin-right: percentage((@columns / @grid-columns));
- margin-left: 0;
- }
- }
- .make-sm-column-push(@columns) {
- @media (min-width: @screen-sm-min) {
- right: percentage((@columns / @grid-columns));
- left: auto;
- }
- }
- .make-sm-column-pull(@columns) {
- @media (min-width: @screen-sm-min) {
- left: percentage((@columns / @grid-columns));
- right: auto;
- }
- }
- // Generate the medium columns
- .make-md-column(@columns; @gutter: @grid-gutter-width) {
- @media (min-width: @screen-md-min) {
- float: right;
- }
- }
- .make-md-column-offset(@columns) {
- @media (min-width: @screen-md-min) {
- margin-right: percentage((@columns / @grid-columns));
- margin-left: 0;
- }
- }
- .make-md-column-push(@columns) {
- @media (min-width: @screen-md-min) {
- right: percentage((@columns / @grid-columns));
- left: auto;
- }
- }
- .make-md-column-pull(@columns) {
- @media (min-width: @screen-md-min) {
- left: percentage((@columns / @grid-columns));
- right: auto;
- }
- }
- // Generate the large columns
- .make-lg-column(@columns; @gutter: @grid-gutter-width) {
- @media (min-width: @screen-lg-min) {
- float: right;
- }
- }
- .make-lg-column-offset(@columns) {
- @media (min-width: @screen-lg-min) {
- margin-right: percentage((@columns / @grid-columns));
- margin-left: 0;
- }
- }
- .make-lg-column-push(@columns) {
- @media (min-width: @screen-lg-min) {
- right: percentage((@columns / @grid-columns));
- left: auto;
- }
- }
- .make-lg-column-pull(@columns) {
- @media (min-width: @screen-lg-min) {
- left: percentage((@columns / @grid-columns));
- right: auto;
- }
- }
|