221V
/
Misago


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313
							//
// Misago Default Theme Variables
// --------------------------------------------------


//== Colors
//
//## Gray and brand colors for use across Bootstrap.

@gray-base:              #000;
@gray-darker:            lighten(@gray-base, 13.5%); // #222
@gray-dark:              lighten(@gray-base, 20%);   // #333
@gray:                   lighten(@gray-base, 33.5%); // #555
@gray-light:             lighten(@gray-base, 46.7%); // #777
@gray-lighter:           lighten(@gray-base, 93.5%); // #eee

@brand-info:             #e66a5d; // misago uses info state for accents

@brand-primary:          #3498db;
@brand-success:          #2ecc71;
@brand-warning:          #ffab40;
@brand-danger:           #ef5350;


//== Scaffolding
//
//## Settings for some of the most global styles.

//** Background color for `<body>`.
@body-bg:               #fff;
//** Global text color on `<body>`.
@text-color:            #111;

// Font weights
@weight-light:            300;

//** Global textual link color.
@link-color:            #2196f3;
//** Link hover color set via `darken()` function.
@link-hover-color:      #5c6bc0;
//** Link hover decoration.
@link-hover-decoration: underline;

//** Site link styles
@site-link-color:            @gray-light;
@site-link-hover-color:      @text-color;
@site-link-active-color:     @brand-info;

//** In-site navs states
@state-default:         @gray-light;
@state-hover:           @text-color;
@state-clicked:         @brand-primary;


//** Avatar radius
@avatar-radius:             8px;
@avatar-radius-small:       4px;


//== Typography
//
//## headings

//** By default, this inherits from the `<body>`.
@headings-font-weight:    200;
@headings-color:          lighten(@text-color, 8%);;


//== Badges
//
//##

@badge-color:                 #fff;
//** Linked badge text color on hover
@badge-link-hover-color:      #fff;
@badge-bg:                    @brand-info;

//** Badge text color in active nav link
@badge-active-color:          @link-color;
//** Badge background color in active nav link
@badge-active-bg:             #fff;

@badge-font-weight:           @weight-light;


//== Navbar
//
//##

// Basics of a navbar
@navbar-height:                    46px;
@navbar-margin-bottom:             @line-height-computed;
@navbar-border-radius:             @border-radius-base;
@navbar-padding-horizontal:        floor((@grid-gutter-width / 2));
@navbar-padding-vertical:          ((@navbar-height - @line-height-computed) / 2);
@navbar-collapse-max-height:       340px;

@navbar-default-color:             #777;
@navbar-default-bg:                @body-bg;
@navbar-default-border:            @gray-lighter;

// Navbar links
@navbar-link-size:                         @font-size-base + 2px;

@navbar-default-link-color:                @site-link-color;
@navbar-default-link-hover-color:          @site-link-hover-color;
@navbar-default-link-hover-bg:             transparent;
@navbar-default-link-active-color:         @site-link-active-color;
@navbar-default-link-active-bg:            transparent;

@navbar-compact-link-active-color:         @navbar-default-bg;
@navbar-compact-link-active-bg:            @site-link-active-color;

// Navbar brand label
@navbar-default-brand-color:               @headings-color;
@navbar-default-brand-hover-color:         @headings-color;

@navbar-brand-height:                      @navbar-height - @navbar-padding-vertical * 2 + 3px;

// Compact navbar, used on mobiles
@navbar-compact-height:                    40px;
@navbar-compact-padding-vertical:          ((@navbar-compact-height - @line-height-computed) / 2);

//== Site Footer
//
//##

@footer-border-color:            @gray-lighter;

@footer-color:                   @gray;

// Footer links
@footer-link-color:              @site-link-hover-color;
@footer-link-hover-color:        @site-link-hover-color;
@footer-link-active-color:       @site-link-active-color;

// Misago's branding
@misago-branding-color:          @gray-light;
@misago-branding-size:           @font-size-small;


//== Loader
//
//##

@loader-color:                   darken(@gray-lighter, 12%);

@loading-overlay-bg:             fadeOut(@gray, 30%);
@loading-overlay-color:          fadeOut(#fff, 30%);


//== Modals
//
//##

//** Modal backdrop background color
@modal-backdrop-bg:           @body-bg;
//** Modal backdrop opacity
@modal-backdrop-opacity:      .85;


//== Alerts
//
//## Define alert colors, border radius, and padding.

@alert-border-radius:         @border-radius-large;

@alert-success-bg:            #2ecc71;
@alert-success-border:        #2ecc71;
@alert-success-text:          #fff;

@alert-info-bg:               #42a5f5;
@alert-info-border:           #42a5f5;
@alert-info-text:             #fff;

@alert-warning-bg:            #ff9800;
@alert-warning-border:        #ff9800;
@alert-warning-text:          #fff;

@alert-danger-bg:             #ef5350;
@alert-danger-border:         #ef5350;
@alert-danger-text:           #fff;

//** Special non-dimissible alert used to make user refresh page
@alert-desync-bg:             fadeOut(@body-bg, 5%);
@alert-desync-text:           @text-color;


//== Form states and alerts
//
//## Define colors for form feedback states and, by default, alerts.

@state-success-text:             #2ecc71;
@state-success-bg:               #2ecc71;
@state-success-border:           darken(spin(@state-success-bg, -10), 5%);

@state-danger-text:              #e74c3c;
@state-danger-bg:                #e74c3c;
@state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);


//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.

@btn-font-weight:                300;

@btn-default-color:              #95a5a6;
@btn-default-bg:                 transparent;
@btn-default-border:             #bdc3c7;

@btn-default-hover-color:        #4fc3f7;
@btn-default-hover-bg:           transparent;
@btn-default-hover-border:       #4fc3f7;

@btn-default-active-color:       #2196f3;
@btn-default-active-bg:          transparent;
@btn-default-active-border:      #2196f3;

@btn-primary-color:              #fff;
@btn-primary-bg:                 @brand-primary;
@btn-primary-border:             @btn-primary-bg;

@btn-success-color:              #fff;
@btn-success-bg:                 @brand-success;
@btn-success-border:             @btn-success-bg;

@btn-info-color:                 #fff;
@btn-info-bg:                    @brand-info;
@btn-info-border:                @btn-info-bg;

@btn-warning-color:              #fff;
@btn-warning-bg:                 @brand-warning;
@btn-warning-border:             @btn-warning-bg;

@btn-danger-color:               #fff;
@btn-danger-bg:                  @brand-danger;
@btn-danger-border:              @btn-danger-bg;

@btn-link-disabled-color:        @gray-light;


//== Form panel
//
//## Misago uses dedicated panel for forms

@panel-form-text:                   @text-color;
@panel-form-bg:                     darken(@body-bg, 4%);
@panel-form-border:                 @body-bg;

@panel-form-body-padding:           15px;
@panel-form-heading-padding:        15px;
@panel-form-footer-padding:         @panel-heading-padding;

@panel-form-inputs-only-gutter:     @padding-large-vertical;

@panel-form-heading-color:          @gray;
@panel-form-heading-bg:             transparent;
@panel-form-heading-border:         darken(@panel-form-bg, 5%);

@panel-form-footer-bg:              @panel-form-bg;
@panel-form-footer-border:          darken(@panel-form-bg, 10%);

@panel-form-well-bg:                darken(@panel-form-bg, 5%);
@panel-form-well-border:            @panel-form-well-bg;
@panel-form-well-label:             darken(@panel-form-bg, 40%);


//== Dropdowns
//
//** Dropdown radius and shadow
@dropdown-border-radius:            @border-radius-base;
@dropdown-shadow:                   0px 0px 0px 3px fadeOut(@gray, 50%);

//** Dropdown link text color.
@dropdown-link-color:            @site-link-color;
//** Hover color for dropdown links.
@dropdown-link-hover-color:      @site-link-hover-color;
//** Hover background for dropdown links.
@dropdown-link-hover-bg:         transparent;

//** Active dropdown menu item text color.
@dropdown-link-active-color:     @site-link-active-color;
//** Active dropdown menu item background color.
@dropdown-link-active-bg:        transparent;

//** Dropdown footer bg and border
@dropdown-footer-border:         darken(@dropdown-bg, 10%);
@dropdown-footer-bg:             darken(@dropdown-bg, 3%);


//== Navs
//
//** Side nav
@sidenav-color:                   @site-link-color;
@sidenav-border:                  @gray-lighter;
@sidenav-bg:                      transparent;

@sidenav-hover-color:             @site-link-hover-color;
@sidenav-hover-bg:                transparent;

@sidenav-active-color:            @site-link-active-color;
@sidenav-active-border:           darken(@sidenav-border, 15%);
@sidenav-active-bg:               transparent;


//== Editor
//
//** Container
@misago-editor-border:            @gray-lighter;
@misago-editor-bg:                #fff;

@misago-editor-loader-color:      @gray-light;