Convert Bootstrap grid to css display:grid

displaygrid.css

/*migrate bootstrap columns to display:grid*/
@supports (display: grid) {
    .row {
        display: grid;
        grid-template-columns: repeat(12, minmax(10px, 1fr));
        grid-gap: 0;
        margin: 0;
    }

    .col-md-1, .col-xs-1, .col-lg-1 {
        grid-column: span 1;
    }

    .col-md-2, .col-xs-2, .col-lg-2 {
        grid-column: span 2;
    }

    .col-md-3, .col-xs-3, .col-lg-3 {
        grid-column: span 3;
    }

    .col-md-4, .col-xs-4, .col-lg-4 {
        grid-column: span 4;
    }

    .col-md-5, .col-xs-5, .col-lg-5 {
        grid-column: span 5;
    }

    .col-md-6, .col-xs-6, .col-lg-6 {
        grid-column: span 6;
    }

    .col-md-7, .col-xs-7, .col-lg-7 {
        grid-column: span 7;
    }

    .col-md-8, .col-xs-8, .col-lg-8 {
        grid-column: span 8;
    }

    .col-md-9, .col-xs-9, .col-lg-9 {
        grid-column: span 9;
    }

    .col-md-10, .col-xs-10, .col-lg-10 {
        grid-column: span 10;
    }

    .col-md-11, .col-xs-11, .col-lg-11 {
        grid-column: span 11;
    }

    .col-md-12, .col-xs-12, .col-lg-12 {
        grid-column: span 12;
    }

    .col-md-1,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9,
    .col-xs-1,
    .col-xs-10,
    .col-xs-11,
    .col-xs-12,
    .col-xs-2,
    .col-xs-3,
    .col-xs-4,
    .col-xs-5,
    .col-xs-6,
    .col-xs-7,
    .col-xs-8,
    .col-xs-9,
    .col-lg-1,
    .col-lg-10,
    .col-lg-11,
    .col-lg-12,
    .col-lg-2,
    .col-lg-3,
    .col-lg-4,
    .col-lg-5,
    .col-lg-6,
    .col-lg-7,
    .col-lg-8,
    .col-lg-9 {
        width: 100%;
        float: none;
        padding: 0;
        margin: 0;
    }

    .row:after,
    .row:before {
        display: none;
    }
}