2013-02-06 03:16:51 +08:00
|
|
|
// --------------------------------------------------
|
|
|
|
// Variables used throughout the theme
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
2014-02-10 14:04:21 +08:00
|
|
|
|
|
|
|
// Layout dimensions
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
$small-width: 950px !default;
|
|
|
|
$medium-width: 995px !default;
|
|
|
|
$large-width: 1110px !default;
|
|
|
|
|
|
|
|
// Primary color variables
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$black: #333 !default;
|
|
|
|
$white: #fff !default;
|
|
|
|
|
|
|
|
$blue: #0099e6 !default;
|
|
|
|
|
|
|
|
$yellow: lighten(#FFFF00, 15%) !default;
|
2014-02-10 14:04:21 +08:00
|
|
|
$light_yellow: lighten($yellow, 20%) !default;
|
|
|
|
$lightest_yellow: lighten($yellow, 30%) !default;
|
2014-02-24 09:47:44 +08:00
|
|
|
|
|
|
|
$red: #e45735 !default;
|
|
|
|
$pink: #fa6c8d !default;
|
|
|
|
$green: #009900 !default;
|
|
|
|
|
2014-02-10 14:04:21 +08:00
|
|
|
$google: #5b76f7 !default;
|
|
|
|
$facebook: #3b5998 !default;
|
|
|
|
$cas: #70BA61 !default;
|
|
|
|
$twitter: #00bced !default;
|
|
|
|
$yahoo: #810293 !default;
|
|
|
|
$github: #6d6d6d !default;
|
|
|
|
|
2013-02-06 03:16:51 +08:00
|
|
|
// Base
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
2013-10-21 09:59:46 +08:00
|
|
|
$base-font-size: 14px !default;
|
|
|
|
$base-line-height: 19px !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
$base-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !default;
|
2014-02-24 09:47:44 +08:00
|
|
|
$base-background-color: lighten($black, 60%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Links
|
2014-02-10 14:04:21 +08:00
|
|
|
// --------------------------------------------------
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$link-color: $blue !default;
|
|
|
|
$link-color-visited: darken($blue, 10%) !default;
|
|
|
|
$link-color-hover: darken($blue, 10%) !default;
|
|
|
|
$link-color-active: darken($blue, 10%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Badges
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
// Notification badge
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$badge-notification-background-color: lighten($black, 35%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Posts badge
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$badge-posts-color: lighten($black, 35%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Buttons
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
// Default button
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$btn-default-color: $black !default;
|
|
|
|
$btn-default-background-color: lighten($black, 50%) !default;
|
|
|
|
$btn-default-background-color-hover: lighten($black, 76%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Primary button
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$btn-primary-border-color: darken($blue, 10%) !default;
|
|
|
|
$btn-primary-background-color: $blue !default;
|
|
|
|
$btn-primary-background-color-dark: $blue !default;
|
|
|
|
$btn-primary-background-color-light: lighten($blue, 30%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2013-02-14 15:47:19 +08:00
|
|
|
// Danger button (delete, etc)
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$btn-danger-border-color: darken($red, 10%) !default;
|
|
|
|
$btn-danger-background-color: $red !default;
|
|
|
|
$btn-danger-background-color-dark: darken($red, 10%) !default;
|
|
|
|
$btn-danger-background-color-light: $red !default;
|
|
|
|
|
|
|
|
$btn-success-background: lighten($green, 5%);
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Navigation menus
|
|
|
|
// --------------------------------------------------
|
|
|
|
|
|
|
|
// Pill nav
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$nav-pills-color: $black !default;
|
|
|
|
$nav-pills-color-hover: $red !default;
|
|
|
|
$nav-pills-border-color-hover: lighten($red, 35%) !default;
|
|
|
|
$nav-pills-background-color-hover: lighten($red, 35%) !default;
|
|
|
|
$nav-pills-color-active: $red !default;
|
|
|
|
$nav-pills-border-color-active: darken($red, 10%) !default;
|
|
|
|
$nav-pills-background-color-active: $red !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Stacked nav
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$nav-stacked-color: $black !default;
|
|
|
|
$nav-stacked-border-color: lighten($black, 60%) !default;
|
|
|
|
$nav-stacked-background-color: lighten($black, 76%) !default;
|
|
|
|
$nav-stacked-divider-color: lighten($black, 60%) !default;
|
|
|
|
$nav-stacked-chevron-color: lighten($black, 50%) !default;
|
|
|
|
$nav-stacked-border-color-active: $red !default;
|
|
|
|
$nav-stacked-background-color-active: $red !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Button nav
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$nav-button-color: lighten($black, 35%) !default;
|
|
|
|
$nav-button-color-hover: $black !default;
|
|
|
|
$nav-button-background-color-hover: lighten($black, 60%) !default;
|
|
|
|
$nav-button-color-active: $black !default;
|
|
|
|
$nav-button-background-color-active: lighten($black, 60%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
// Header
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$modal-header-color: $red !default;
|
|
|
|
$modal-header-border-color: lighten($black, 50%) !default;
|
|
|
|
$modal-close-button-color: lighten($black, 50%);
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$nav-like-button-color-hover: $pink !default;
|
|
|
|
$nav-like-button-background-color-hover: lighten($pink, 22%) !default;
|
|
|
|
$nav-like-button-color-active: darken($pink, 10%) !default;
|
|
|
|
$nav-like-button-background-color-active: lighten($pink, 22%) !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-10 14:04:21 +08:00
|
|
|
// Topic list
|
2013-02-06 03:16:51 +08:00
|
|
|
// --------------------------------------------------
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$topic-list-border-color: lighten($black, 50%) !default;
|
|
|
|
$topic-list-th-color: $black !default;
|
|
|
|
$topic-list-th-border-color: lighten($black, 50%) !default;
|
|
|
|
$topic-list-th-background-color: lighten($black, 76%) !default;
|
|
|
|
$topic-list-td-color: lighten($black, 35%) !default;
|
|
|
|
$topic-list-td-border-color: lighten($black, 60%) !default;
|
|
|
|
$topic-list-star-color: lighten($black, 60%) !default;
|
|
|
|
$topic-list-starred-color: $red !default;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$quote-background: lighten($black, 76%);
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$topicMenuColor: darken($white, 80%);
|
|
|
|
$bookmarkColor: $blue;
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$tag_color: lighten($blue, 50%);
|
|
|
|
$post_footer: lighten($black, 76%);
|
2013-07-31 06:27:42 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$controls: lighten($black, 35%);
|
|
|
|
$controls_hover: $blue;
|
|
|
|
$controls_active: darken($blue, 10%);
|
2013-02-06 03:16:51 +08:00
|
|
|
|
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
// Basics
|
|
|
|
// --------------------------------------------------
|
2013-02-06 03:16:51 +08:00
|
|
|
|
2014-02-24 09:47:44 +08:00
|
|
|
$primary_border_color: lighten($black, 60%);
|
|
|
|
$secondary_border_color: lighten($black, 76%);
|
2014-03-08 13:55:02 +08:00
|
|
|
$tertiary_border_color: $white;
|
2014-02-24 09:47:44 +08:00
|
|
|
$highlight_border_color: $yellow;
|
|
|
|
$emphasis_border_color: $blue;
|
|
|
|
$warning_border_color: lighten($red, 20%);
|
|
|
|
$success_border_color: $green;
|
|
|
|
|
|
|
|
$primary_text_color: $black;
|
2014-02-27 06:15:57 +08:00
|
|
|
$secondary_text_color: lighten($black, 40%);
|
2014-02-24 09:47:44 +08:00
|
|
|
$tertiary_text_color: $white;
|
|
|
|
$warning_text_color: $red;
|
|
|
|
$success_text_color: $green;
|
|
|
|
$emphasis_text_color: $blue;
|
|
|
|
$highlight_text_color: $yellow;
|
|
|
|
$like_color: $pink;
|
|
|
|
|
|
|
|
$primary_shadow_color: $black;
|
|
|
|
$secondary_shadow_color: $white;
|
|
|
|
$warning_shadow_color: lighten($red, 20%);
|
|
|
|
$success_shadow_color: $green;
|
|
|
|
|
|
|
|
$highlight: $yellow;
|
|
|
|
|
|
|
|
$link_color: darken($blue, 10%);
|
|
|
|
$secondary_link_color: $white;
|
|
|
|
$muted-link-color: lighten($black, 35%);
|
|
|
|
$muted-important-link-color: lighten($black, 35%);
|
|
|
|
|
|
|
|
$attention_bg: lighten($blue, 50%);
|
|
|
|
$attention_fg: $blue;
|
|
|
|
|
|
|
|
$header-item-highlight: lighten($blue, 45%);
|
|
|
|
|
|
|
|
$primary_background_color: $white;
|
|
|
|
$secondary_background_color: $black;
|
|
|
|
$tertiary_background_color: lighten($black, 10%);
|
|
|
|
$moderator_background_color: lighten($yellow, 30%) !default;
|
|
|
|
$emphasis_background_color: lighten($blue, 45%);
|
|
|
|
$success_background_color: lighten($green, 50%);
|
|
|
|
$warning_background_color: lighten($red, 30%);
|
2014-02-27 06:15:57 +08:00
|
|
|
$highlight_background_color: lighten($yellow, 23%);
|
2014-02-24 09:47:44 +08:00
|
|
|
$like_background_color: lighten($pink, 25%);
|
|
|
|
|
|
|
|
$heatmap-high: lighten($red, 10%);
|
|
|
|
$heatmap-med: $red;
|
|
|
|
$heatmap-low: darken($red, 10%);
|
|
|
|
|
|
|
|
$coldmap-high: lighten($blue, 10%);
|
|
|
|
$coldmap-med: $blue;
|
|
|
|
$coldmap-low: darken($blue, 10%);
|
|
|
|
|
|
|
|
//Composer
|
|
|
|
|
|
|
|
$composer_background: lighten($black, 70%);
|