kodadot/nft-gallery

@import "initial-variables";
@import "bulma/sass/utilities/_all";
@import "derived-variables";
@import "theme";

// Setup $colors to use as bulma classes (e.g. "is-twitter")
$colors: mergeColorMaps(
  (
    "white": (
      $white,
      $black,
    ),
    "black": (
      $black,
      $white,
    ),
    "light": (
      $light,
      $light-invert,
    ),
    "dark": (
      $dark,
      $dark-invert,
    ),
    "primary": (
      $primary,
      $primary-invert,
      $primary-light,
      $primary-dark,
    ),
    "link": (
      $link,
      $link-invert,
      $link-light,
      $link-dark,
    ),
    "info": (
      $info,
      $info-invert,
      $info-light,
      $info-dark,
    ),
    "success": (
      $success,
      $success-invert,
      $success-light,
      $success-dark,
    ),
    "warning": (
      $warning,
      $warning-invert,
      $warning-light,
      $warning-dark,
    ),
    "danger": (
      $danger,
      $danger-invert,
      $danger-light,
      $danger-dark,
    ),
    "grey": (
      $grey-darker,
      $white,
    ),
    "orange": (
      $orange,
      $orange-invert,
      $orange-light,
      $orange-dark,
    ),
    "neo": (
      $white,
      $black,
    )
  ),
  $custom-colors
);

// footer
$footer-background-color: #0a0a0a;
$footer-padding: 0;

// navbar
$navbar-item-img-max-height: 60px;
$navbar-item-hover-color: $primary;
$navbar-item-hover-background-color: transparent;
$navbar-desktop-min-height: 80px;
$navbar-mobile-min-height: 64px;

// button
$button-border-color: $primary;
$button-ghost-border-color: $primary;
$button-border-width: 2px;
$button-hover-border-color: $primary;
$button-text-color: $light-text;
$button-color: $light-text;

// dropdown
$dropdown-item-hover-background-color: $primary;
$dropdown-item-active-background-color: $primary;
// $navbar-dropdown-item-hover-background-color: $primary;
$dropdown-content-shadow: 4px 4px $black;
$dropdown-content-padding-bottom: 0;

// title
$title-color: $scheme-invert;

// form
$input-placeholder-color: bulmaRgba($scheme-invert, 0.3);

// box
$box-shadow: none;

// tabs
// $tabs-link-hover-color: $primary;
$tabs-boxed-link-focus-border-bottom-color: $primary;
$tabs-boxed-link-focus-background-color: lightpink;
$tabs-boxed-link-focus-active-background-color: $primary;

//  these somehow doesn't work for profile, idk why, maybe fix whenever you spot this
// $tabs-items-focused-outline: lime;
// $tabs-link-focus-active-border-bottom-color: lime;
// $tabs-link-focus-border-bottom-color: lime;
// $tabs-boxed-link-focus-active-border-bottom-color: lime;
// $tabs-link-focus-active-border-bottom-color:lime;
// $tabs-link-hover-border-bottom-color: lime;
// $tabs-link-focus-border-bottom-color: lime;
// $tabs-boxed-link-focus-border-color: lime;
// $tabs-boxed-link-focus-active-border-bottom-color: lime;
// $tabs-items-focused-outline: lime;
$tabs-border-bottom-color: #7d7a7a;
$tabs-link-active-border-bottom-color: $primary;
$tabs-link-active-color: $primary;
$tabs-link-hover-color: lightpink;
$tabs-link-hover-border-bottom-color: lightpink;

// layout
$container-offset: (2 * $gap);
$container-max-width: $fullhd;

// table
$table-head-cell-color: $text;
$table-color: $text;

// image
$image-placeholder-blur-enabled: false;

// custom colors
$lightpink: lightpink;

$blacklight: #0909098c;
$input-color: #181818;
$select-color: #e5e5e5;
$placeholder-color: #cccccc;
$search-background-color: #1a1718;
$select-border-color: #7d7d7d;

$frosted-glass-background: rgba(12, 12, 12, 0.7);
$frosted-glass-background-dark: #b0b0b0ad;
$frosted-glass-backdrop-filter: blur(20px);
$frosted-glass-light-backdrop-filter: blur(4px);

$sleek-primary-border: 1px solid $primary;

$table-sticky-header-height: 60vh;


$body-family: $family-primary;

$fluid-container-padding: 2.5rem;
$fluid-container-padding-mobile: 1.25rem;

$tooltip-content-zindex: 999;

// Define a list of values for the margin and padding helpers
$spacing-values: (
  "0": 0,
  "1": 0.25rem,
  "2": 0.5rem,
  "3": 0.75rem,
  "4": 1rem,
  "5": 1.5rem,
  "6": 2rem,
  "7": 2.5rem,
  "8": 3rem,
  "10": 4rem,
  "auto": auto
) !default;