scinote-web/app/assets/stylesheets/dashboard/show.scss

.dashboard-container {
  --dashboard-widgets-gap: 30px;
  display: grid;
  grid-column-gap: var(--dashboard-widgets-gap);
  grid-row-gap: var(--dashboard-widgets-gap);
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, 1fr);
  min-height: calc(100vh - 51px);
  padding: var(--dashboard-widgets-gap) calc(var(--dashboard-widgets-gap) - 15px);
  width: 100%;

  .basic-widget {
    border-radius: $border-radius-modal;
    box-shadow: $flyout-shadow;
    position: relative;

    .widget-header {
      align-items: center;
      border-bottom: $border-tertiary;
      display: flex;
      height: 44px;

      h2 {
        line-height: 18px;
        margin: 10px 16px;
        padding: 4px 0;
      }
    }

    .widget-body {
      height: calc(100% - 44px);
      position: absolute;
      width: 100%;
    }
  }
}

@media (max-width: 1300px) {
  .dashboard-container {
    --dashboard-widgets-gap: 16px;
  }
}