bootstrap/source/custom.scss

// Functions
@import "../node_modules/bootstrap/scss/functions";

// Variables
@import "../node_modules/bootstrap/scss/variables";
@import "../node_modules/bootstrap/scss/variables-dark";

// Custom variable overrides
$font-family-sans-serif: "Inter", sans-serif;
$headings-font-family: $font-family-sans-serif;
$table-cell-padding-y: 0.75rem;
$table-cell-padding-x: 0.75rem;
$table-bg: transparent;
$table-accent-bg: transparent;
$link-color: #0011cc;

// Merge custom colors after variables but before maps
$theme-colors: map-merge(
  $theme-colors,
  (
    "warning": #f49703
  )
);

// Basics
@import "../node_modules/bootstrap/scss/maps";
@import "../node_modules/bootstrap/scss/mixins";
@import "../node_modules/bootstrap/scss/root";
@import "../node_modules/bootstrap/scss/utilities";

// Shims
@import "reboot-shim";

// Components
@import "../node_modules/bootstrap/scss/accordion";
@import "../node_modules/bootstrap/scss/alert";
@import "../node_modules/bootstrap/scss/badge";
@import "../node_modules/bootstrap/scss/breadcrumb";
@import "../node_modules/bootstrap/scss/button-group";
@import "../node_modules/bootstrap/scss/buttons";
@import "../node_modules/bootstrap/scss/card";
@import "../node_modules/bootstrap/scss/carousel";
@import "../node_modules/bootstrap/scss/close";
@import "../node_modules/bootstrap/scss/containers";
@import "../node_modules/bootstrap/scss/dropdown";
@import "../node_modules/bootstrap/scss/forms";
@import "../node_modules/bootstrap/scss/grid";
@import "../node_modules/bootstrap/scss/helpers";
@import "../node_modules/bootstrap/scss/images";
@import "../node_modules/bootstrap/scss/list-group";
@import "../node_modules/bootstrap/scss/modal";
@import "../node_modules/bootstrap/scss/nav";
@import "../node_modules/bootstrap/scss/navbar";
@import "../node_modules/bootstrap/scss/offcanvas";
@import "../node_modules/bootstrap/scss/pagination";
@import "../node_modules/bootstrap/scss/placeholders";
@import "../node_modules/bootstrap/scss/popover";
@import "../node_modules/bootstrap/scss/progress";
@import "../node_modules/bootstrap/scss/spinners";
@import "../node_modules/bootstrap/scss/tables";
@import "../node_modules/bootstrap/scss/toasts";
@import "../node_modules/bootstrap/scss/tooltip";
@import "../node_modules/bootstrap/scss/transitions";
@import "../node_modules/bootstrap/scss/type";

// Configure utilities before importing the API

$utilities: map-merge(
  $utilities,
  (
    "width": map-merge(
      map-get($utilities, "width"),
      (
        responsive: true,
        values: map-merge(
          map-get(map-get($utilities, "width"), "values"),
          (
            10: 10%,
            15: 15%,
            20: 20%,
            30: 30%,
            35: 35%,
            40: 40%,
            45: 45%,
            55: 55%,
            60: 60%,
            65: 65%,
            70: 70%,
            80: 80%,
            85: 85%,
            90: 90%
          )
        )
      )
    )
  )
);

// Utilities
@import "../node_modules/bootstrap/scss/utilities/api";

// Custom styles
table.atr-data th {
  @extend .border-end;
  @extend .bg-body-tertiary;
}

th {
  color: $dark;
  font-weight: 525;
  @extend .align-middle;
}

.atr-sans {
  font-family: $font-family-sans-serif;
}

small, .text-muted {
  font-variation-settings: "opsz" 14;
}

.btn, input[type="submit"] {
  font-family: $font-family-sans-serif;
  font-size: 17px;
  font-weight: 475 !important;
}

.btn:disabled {
  background-color: #cccccc;
  border-color: #cccccc;
}

.btn-primary:disabled {
  background-color: #004477;
  border-color: #004477;
}

.btn-primary {
  background-color: #004477;
  border-color: #004477;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: darken(#004477, 10%);
  border-color: darken(#004477, 10%);
}

// Patch for btn-link due to using reboot-shim
.btn-link {
  // Set base state - remove underline from shim's a rule
  text-decoration: none;
}

.nav-link {
  cursor: pointer;
}