engelsystem/resources/assets/themes/theme13.scss

// rc3

//== Colors

$gray-darker:            #100e23;
$gray-dark:              lighten($gray-darker, 15%);
$gray:                   lighten($gray-dark, 15%);
$gray-light:             lighten($gray, 15%);
$gray-lighter:           lighten($gray-light, 15%);
$black:                  #000;

$brand-primary: #6800e7;
$primary:       $brand-primary;
$brand-success: #05b9ec;
$success:       $brand-success;
$brand-info:    #670295;
$info:          $brand-info;
$brand-warning: #fff900;
$warning:       $brand-warning;
$brand-danger:  #b239ff;
$danger:        $brand-danger;

//== Scaffolding

$body-bg:               #000;
$text-color:            $gray-lighter;
$link-color:            #fff;

//== Typography

@font-face {
    font-family: 'Montserrat';
    src: url('theme13/Montserrat-Regular.woff2') format('woff2'),
        url('theme13/Montserrat-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Orbitron';
    src: url('theme13/Orbitron-Regular.woff2') format('woff2'),
        url('theme13/Orbitron-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

$font-family-sans-serif: 'Montserrat', Helvetica Neue, Helvetica, Arial, sans-serif;
$font-family-serif:      'Orbitron', Georgia, "Times New Roman", Times, serif;
$headings-font-family:   $font-family-serif;

//== Buttons

$btn-color:                      #fff;
$btn-default-bg:                 lighten($gray-dark, 10%);

$btn-primary-color:              #fff;
$btn-primary-border:             darken($btn-default-bg, 10%);

$btn-success-color:              #fff;
$btn-success-border:             darken($btn-default-bg, 10%);

$btn-info-color:                 #fff;
$btn-info-border:                darken($btn-default-bg, 10%);

$btn-warning-color:              #fff;
$btn-warning-border:             darken($btn-default-bg, 10%);

$btn-danger-color:               #fff;
$btn-danger-border:              darken($btn-default-bg, 10%);

//== Forms

$input-bg:                       $gray-darker;
$input-bg-disabled:              darken($gray-dark, 10%);

$input-group-addon-bg:           $gray-lighter;

//== Pagination

$pagination-color:                     $black;

$pagination-hover-color:               $black;

$pagination-active-color:              $black;

//== Form states and alerts

$state-success-text:             #fff;

$state-info-text:                #fff;

$state-warning-text:             #fff;

$state-danger-text:              #fff;

//== Labels

$label-link-hover-color:      $gray-dark;

//== Badges

$badge-color:                 $black;

//== Type

$headings-small-color:        $gray-light;

// Bootswatch
// -----------------------------------------------------
@import "cyborg_variables.scss";
@import "cyborg_styles.scss";
// Forms ======================================================================

.input-group-addon {
  background-color: $btn-default-bg;
}

// Containers =================================================================

// datetimepicker

.bootstrap-datetimepicker-widget {

  .timepicker-hour,
  .timepicker-minute,
  [data-action='selectHour'],
  [data-action='selectMinute'],
  [data-action='incrementHours'],
  [data-action='decrementHours'],
  [data-action='incrementMinutes'],
  [data-action='decrementMinutes'] {

    &:hover {

      color: $gray;
    }
  }
}

// code tag
code {
  background-color: $input-bg-disabled;
  color: $input-color;
}

// Specials ===================================================================
body {
  background: #000 url('theme13/background.jpg') no-repeat top left;
}

.navbar.navbar-default {
  background: rgba(0,0,0,0.8);
  backdrop-filter: blur(6px);
}