Newer
Older
CrypticOreWallet / src / scss / _theme.scss
@Drew Lemmy Drew Lemmy on 17 Sep 2020 2 KB feat: basic table in 'my wallets' view
/* ========================================================================== */
/* BOOTSTRAP RE-SKIN
/* ========================================================================== */

/* Colours */
$light: #343a56;
$lighter: #434a6b;
$slighter: mix($light, $lighter, 50%);
$dark: #2a304a;
$darker: #242942;
$darkest: darken($darker, 5%);
$primary: #5ac6e9;
$secondary: $lighter;
$success: #38bf60;
$info: #57a3cb;
$danger: #fe4848;

/* Typography */
$body-color: #eaf0fe;
$text-muted: #8991ab;

$body-hover-color: mix($body-color, $text-muted, 50%);
$body-hover-color: mix($body-color, $text-muted, 50%);

$font-family-base: "Lato", sans-serif;

/* Basic redefinitions */
$body-bg: $dark;

$border-color: #3f4661;
$border-color-lighter: #404962;
$border-color-darker: darken($darker, 5%);

/* Shadows */
$enable-shadows: true;

$btn-box-shadow: none;
$input-box-shadow: none;

/* Border radius */
$border-radius:    6px !default;
$border-radius-lg: 12px !default;
$border-radius-sm: 3px !default;

/* Button */
$btn-active-box-shadow: none;

/* Input */
$input-bg: $lighter;
$input-border-width: 0;

$input-color: $body-color;
$input-placeholder-color: $text-muted;

$input-btn-focus-color: rgba($info, 0.5);

$input-group-addon-bg: $secondary;

.was-validated .form-control:invalid, .form-control.is-invalid {
  /* Make invalid form controls have a red glow */
  &:not(:focus) {
    box-shadow: 0 0 0 0.2rem rgba($danger, 0.35);
  }

  &:focus {
    box-shadow: 0 0 0 0.2rem rgba($danger, 0.5);
  }
}

/* Navbar */
$navbar-dark-color: $body-color;
$navbar-dark-hover-color: $body-hover-color;
$navbar-dark-disabled-color: $text-muted;

/* Modal */
$modal-content-bg: $light;
$modal-content-box-shadow-xs:    0 0.5rem 1rem rgba(#000, 0.15);
$modal-content-box-shadow-sm-up: 0 0.5rem 1rem rgba(#000, 0.15);
$modal-content-border-width: 0;
$modal-header-border-color: $border-color-lighter;
$modal-header-border-width: 1px;

$close-color: $text-muted;
$close-text-shadow: none;

.modal-header {
  /* Close button isn't vertically aligned in modal header by default. */
  align-items: center;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
  border-radius: $border-radius;
}

::-webkit-scrollbar-thumb {
  background: $secondary;
  border-radius: $border-radius;
}

::-webkit-scrollbar-thumb:hover {
  background: $slighter;
}