TasksDashboard.scss

@import '~bootstrap-sass/assets/stylesheets/bootstrap/_variables';
@import '~bootstrap-sass/assets/stylesheets/bootstrap/_mixins';

@mixin create-tasks-dashboard-column($columns: 12, $screen-min: 0, $gutter: $grid-gutter-width) {
  @media (min-width: $screen-min) {
    width: percentage(($columns / $grid-columns));
    float: left;
    position: relative;
    min-height: 1px;
    padding-right: ($gutter / 2);
    padding-left: ($gutter / 2);
  }
}

.tasks-dashboard-grid {
  min-height: 200px;
  background-color: #f5f5f5;
  margin: 5px -60px 20px -60px;
  padding: 20px 50px;

  .row > div {
    @include create-tasks-dashboard-column(12, 0);
    @include create-tasks-dashboard-column(6, 800px);
    @include create-tasks-dashboard-column(3, 1500px);
  }
}