source: admin/style/scss/themes/_dark.scss @ 3870:132b4be257c5

// ========================================================================== //
// =Couleurs
// ========================================================================== //

// Palette de base

$blue:            #76c2f1;
$green:           #9ac123;
$red:             #c44d58;
$light-blue:      #a2cbe9;
$orange:          #ff6e3a;

$gray:            #b2b5ba;
$gray-dark:       #676e78;

$gray-very-dark:    shade($gray, 72%);  // #323232
$gray-darker:       shade($gray, 50%);  // #595b5d
$gray-semi-dark:    shade($gray, 25%);  // #868686
$gray-light:        tint($gray, 30%);   // #c9c9c9
$gray-lighter:      tint($gray, 75%);   // #ececec
$gray-very-light:   tint($gray, 85%);   // #f3f3f3

$white:           #fff;
$black:           #000;

// Palette secondaire

$warning:         #fefacd;
$warning-alt:     #ffd478;

$info:            #d9edf7;
$info-alt:        #bce8f1;

$error:           #ffbaba;
$error-alt:       #ae323b;

$required:        #f783b3;

$success:         #bee74b;
$success-alt:     #9bca1c;

$link:            #76c2f1;
$link-outline:    #bee74b;

$current-page:    #f783b3;

$legacy:          #eef1ec;
$code:            #fefacd;
$tooltip:         #910ed3;

$pw-very-weak:    #c44d58;
$pw-weak:         #e1732c;
$pw-mediocre:     #ff9900;
$pw-strong:       #cdad12;
$pw-very-strong:  #9ac123;

$submit:          #25a6e1;
$submit-alt:      #188bc0;

$reset:           #eaeaea;
$reset-alt:       #f9f9f9;
$reset-ter:       #dadada;

$delete:          #ae323b;
$delete-alt:      #b33630;
$delete-ter:      #dc5f59;

$add:             #bee74b;
$add-alt:         #9bca1c;

$badge:           #d54e21;  /* bright red */
$badge-soft:      #607d8b;  /* slategray */
$badge-info:      #3f51b5;  /* soft dark blue */

// Common

$body-color:                      #dcdee0;
$body-background:                 #272b30;

$title-color:                     $gray;
$title-alt-color:                 $orange;

// Layout

$header-color:                    $body-color;
$header-background:               $body-background;
$header-background-alt:           $gray-darker;
$header-border:                   $green;
$header-border-alt:               $gray-very-dark;
$header-link-border:              $gray-semi-dark;
$header-active-color:             $white;
$header-active-background:        $gray-semi-dark;
$header-active-color-alt:         $white;
$header-active-background-alt:    $gray-semi-dark;

$wrapper-background:              $body-background;

$content-background:              $body-background;

$tabs-color:                      $gray-very-dark;
$tabs-border:                     $gray-lighter;
$tabs-background:                 $gray-light;
$tabs-active-color:               $white;
$tabs-active-background:          $gray-semi-dark;

$main-menu-background:            shade($gray-darker, 15%);
$main-menu-title-color:           $gray-light;
$main-menu-item-color:            $body-color;
$main-menu-item-border:           tint($gray-dark, 66%);
$main-menu-active-color:          $white;
$main-menu-active-background:     $gray-semi-dark;
$main-menu-border:                $light-blue;

$search-color:                    $white;
$search-border:                   $gray-light;
$search-background:               $submit;
$search-submit-color:             $white;
$search-submit-background:        $submit-alt;
$search-outline:                  $link-outline;

$footer-background:               $body-background;
$footer-border:                   tint($gray-dark, 66%);

$collapser-focus:                 $green;
$collapser-background:            $gray-darker;

$popup-title-color:               $body-color;
$popup-title-background:          $gray-darker;

// Markup

$breadcrumb-background:           $body-background;
$breadcrumb-border:               $gray-semi-dark;
$breadcrumb-current:              $current-page;

$fieldset-pretty-title-color:     $orange;
$fieldset-smart-title-color:      $gray-very-light;
$entry-sidebar-title-color:       $gray-lighter;
$title-label-color:               $gray-lighter;

$table-caption-color:             $body-color;
$head-border:                     shade($gray-very-light, 10%);
$head-background:                 $gray-darker;
$line-input-background:           $gray-light;
$line-background-over:            shade($gray-darker, 15%);
$line-focus-background:           shade($gray-darker, 15%);
$cell-border:                     $gray-lighter;
$cell-noborder-color:             shade($gray-very-light, 10%);

$hr-color:                        $gray-light;

$code-color:                      $body-background;
$code-background:                 $code;

$link-color:                      $link;
$link-border:                     $gray-semi-dark;
$discrete-link-color:             $body-color;

$outgoing-link-filter:            100%;

// Forms

$fieldset-border:                 tint($gray-dark, 66%);
$fieldset-background:             $body-background;
$fieldset-focus-background:       tint($body-background, 7%);

$legend-border:                   tint($gray-dark, 66%);
$legend-background:               $gray-darker;

$invalid-input-color:             $black;
$invalid-input-border:            $error-alt;
$invalid-input-background:        $error;
$invalid-input-shadow:            rgba($error-alt, 0.3);

$input-color:                     $black;
$input-background:                $gray-lighter;
$input-border:                    tint($gray-dark, 10%);
$input-shadow:                    $gray-lighter;
$input-focus:                     $link-outline;

$input-file-color:                $body-color;
$input-file-background:           $body-background;

$form-note-color:                 $info-alt;

$error-background:                $error;

// Buttons

$button-color:                    $black;
$button-border:                   $gray-semi-dark;
$button-shadow:                   rgba($black, 0.05);

$submit-color:                    $white;
$submit-background:               $submit;
$submit-background-alt:           $submit-alt;
$submit-border:                   $gray-semi-dark;

$reset-color:                     $black;
$reset-background:                $reset;
$reset-background-alt:            $reset-alt;
$reset-background-ter:            $reset-ter;
$reset-border:                    $gray-semi-dark;

$delete-color:                    $delete;
$delete-hover-color:              $white;
$delete-hover-background:         $delete-alt;
$delete-hover-background-alt:     $delete-ter;
$delete-hover-border:             $delete-ter;

$add-color:                       $black;
$add-background:                  $add;
$add-background-alt:              $add-alt;
$add-border:                      $add;
$add-border-alt:                  $add-alt;

$button-disabled-color:           $gray-dark;
$button-disabled-background:      $gray-very-light;
$button-disabled-background-alt:  $gray-lighter;
$button-disabled-border:          $gray-semi-dark;

$ajax-color:                      $gray-very-dark;
$ajax-background:                 $white;
$ajax-background-alt:             $light-blue;
$ajax-border:                     $gray-dark;

$gotop-color:                     $gray-very-dark;
$gotop-background:                transparent;
$gotop-border:                    none;

$addmeta-color:                   $white;
$addmeta-background:              transparent;
$addmeta-focus-color:             $black;
$addmeta-focus-background:        tint($light-blue, 10%);

// Messages

$msg-color:                       $white;
$msg-background:                  $gray-dark;
$msg-background-alt:              tint($gray-dark, 66%);
$msg-shadow:                      rgba($gray-very-dark, 0.1);

$msg-info-color:                  $gray-very-dark;
$msg-info-background:             $info;
$msg-info-border:                 $info-alt;

$msg-warn-color:                  $gray-very-dark;
$msg-warn-background:             $warning;
$msg-warn-background-alt:         $warning-alt;
$msg-warn-border:                 $warning-alt;

$msg-error-color:                 $black;
$msg-error-background:            $error;
$msg-error-background-alt:        $warning;

$msg-success-color:               $black;
$msg-success-background:          $success;
$msg-success-background-alt:      $success-alt;

$dc-update-color:                 $black;
$dc-update-background:            $light-blue;

$ajax-loader:                     shade($light-blue, 10%);

// Filters

$form-control-color:              $white;

$filter-border:                   $light-blue;
$filter-options-border:           $gray-light;
$filter-focus-background:         shade($gray-darker, 15%);

// Prelude

$prelude-color:                   $gray-very-dark;
$prelude-background:              $light-blue;
$prelude-background-alt:          $white;

// Help

$help-background:                 $gray-very-dark;
$help-border:                     $warning-alt;
$help-button-border:              $gray-dark;
$help-button-background:          $gray-very-dark;
$help-title-color:                $light-blue;

// Tooltip (in footer)

$tooltip-color:                   $tooltip;
$tooltip-background:              $gray-very-light;

// Application pages:
// - Auth (white background page)

$login-fieldset-background:       $white;
$login-fieldset-border:           $success-alt;

// - Index

$index-link-color:                $gray-lighter;
$index-link-border:               $gray-semi-dark;
$index-icon-background:           $gray-darker;
$index-icon-border:               $gray-lighter;
$index-icon-outline:              $link-outline;
$index-icon-contrast:             130%;

$quick-background:                $gray-very-dark;
$quick-border:                    shade($gray-very-light, 10%);
$quick-info-background:           $info;
$quick-info-border:               $info-alt;
$quick-info-color:                $gray-very-dark;

$index-box-border:                tint($gray-dark, 66%);

// - Blog params

$blog-user-border:                tint($gray-dark, 66%);
$blog-super-background:           rgba($info, 0.15);
$blog-super-border:               $link-outline;

// - Blog theme

$theme-box-border:                shade($gray-very-light, 10%);
$theme-box-over:                  $gray-darker;

$theme-name-color:                $gray-light;

$theme-img-background:            $gray-very-light;
$theme-img-border:                $white;
$theme-img-shadow:                rgba($gray-very-dark, 0.1);

$theme-action-background:         $gray-darker;
$theme-action-border:             transparent;

$theme-current-background:        $gray-darker;
$theme-current-border:            $gray-lighter;
$theme-current-shadow:            rgba($gray-very-dark, 0.1);

$theme-current-img-border:        $white;
$theme-current-name-color:        $orange;

// - Categories

$cat-placeholder-outline:         $link;

$cat-line-border:                 tint($gray-dark, 66%);
$subcat-line-border:              shade($gray-very-light, 10%);

$cat-post-counter:                $gray-very-light;

// - Media

$media-folder-background:         transparent;
$media-folder-border:             $gray-lighter;
$media-folderup-border:           transparent;
$media-folder-link:               $gray-light;
$media-item-border:               shade($gray-very-light, 10%);
$media-files-border:              shade($gray-very-light, 10%);

$upload-color:                    shade($success-alt, 45%);
$upload-filemsg-color:            $white;
$upload-progress-color:           $white;
$upload-progress-background:      shade($success-alt, 45%);
$upload-file-border:              shade($gray-very-light, 10%);
$upload-error-color:              $error-alt;

// - Plugins

$modules-background:              $gray-very-dark;
$modules-border:                  $light-blue;

// - Entry

$entry-sb-title-border:           $white;
$entry-sb-background:             shade($gray-darker, 15%);
$entry-sb-focus-background:       $gray-darker;

// - Preferences

$fav-list-background:             $gray-very-dark;
$fav-list-background-over:        $gray-darker;
$fav-list-border:                 $gray-lighter;
$fav-list-border-alt:             shade($gray-very-light, 10%);

$my-favs-border:                  $green;

// - Charte

$charte-title:                    $orange;
$charte-one-box-border:           shade($gray-very-light, 10%);

// Classes

$ac-results-background:           $gray-very-dark;
$ac-results-border:               $warning-alt;
$ac-results-over:                 $white;
$ac-results-over-background:      shade($link, 20%);

$nav-background:                  $body-background;
$nav-prevnext:                    $link;
$nav-prevnext-background:         $gray-very-dark;
$nav-prevnext-border:             shade($gray-very-light, 10%);

$onblog-link:                     $gray-very-dark;
$onblog-link-background:          $gray-lighter;
$onblog-link-border:              $gray-lighter;
$onblog-link-shadow:              rgba($gray-very-dark, 0.3);

$pager-link:                      $link;
$pager-active:                    $gray-light;
$pager-background:                $gray-very-light;
$pager-background-over:           shade($gray-very-light, 10%);
$pager-off-background:            $white;
$pager-input-background:          $white;
$pager-border:                    shade($gray-very-light, 10%);

$index-no-link:                   $gray-light;
$index-active:                    $white;
$index-active-background:         $gray-dark;

$step:                            $gray-dark;
$step-background:                 $gray-very-light;
$step-border:                     tint($gray-dark, 66%);

$offline:                         $gray-semi-dark;
$offline-background:              $gray-very-dark;

$mark-attach-img:                 url('../images/attach.svg');
$mark-attach-filter:              hue-rotate(260deg) saturate(100) saturate(.2) brightness(220%);

// Utils

$color-picker-border:             $black;
$color-picker-background:         $white;

$color-div-border:                $gray-light;

$badge-color:                     $white;                             // #ffffff
$badge-std-background:            $badge;                             // #d54e21
$badge-soft-background:           $badge-soft;
$badge-info-background:           $badge-info;

// Debug

$debug-color:                     $error-alt;
$debug-background:                $warning-alt;
$debug-border:                    $warning-alt;