123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233 |
- //
- // Misago Variables
- // --------------------------------------------------
- //== Colors
- //
- //## Basic colors for use in this flavor
- @brand-primary: #c0392b;
- @brand-secondary: #3498db;
- @brand-success: #2ecc71;
- @brand-info: #5bc0de;
- @brand-warning: #f0ad4e;
- @brand-danger: #e74c3c;
- // Background color for `<body>`.
- @body-bg: darken(#fff, 2%);
- // Global text color on `<body>`.
- @text-color: #444;
- // Headings color
- @headings-small-color: darken(@body-bg, 30%);
- // Global textual link color.
- @link-color: @brand-secondary;
- @link-hover-color: darken(@link-color, 15%);
- // Text muted color
- @text-muted: darken(@body-bg, 40%);
- @link-muted-color: @gray;
- @link-muted-hover-color: @gray-darker;
- // Components
- @component-active-bg: @brand-secondary;
- @component-active-color: #fff;
- //== Navbar
- //
- //## Navbar style
- @navbar-inverse-bg: darken(@body-bg, 5%);
- @navbar-inverse-link-color: darken(@navbar-inverse-bg, 30%);
- @navbar-inverse-link-hover-color: darken(@navbar-inverse-bg, 60%);
- @navbar-inverse-link-hover-bg: transparent;
- @navbar-inverse-link-active-color: darken(@navbar-inverse-bg, 70%);
- @navbar-inverse-link-active-bg: @navbar-inverse-bg;
- @navbar-default-bg: darken(@body-bg, 10%);
- @navbar-default-link-color: darken(@navbar-default-bg, 40%);
- @navbar-default-link-hover-color: darken(@navbar-default-bg, 60%);
- @navbar-default-link-hover-bg: darken(@navbar-default-bg, 3%);
- @navbar-default-link-active-color: darken(@navbar-inverse-bg, 70%);
- @navbar-default-link-active-bg: @navbar-inverse-bg;
- @navbar-border: 3px solid darken(@body-bg, 20%);
- //== Dropdowns
- //
- //## Misago dropdowns flavor
- // Dropdown link text color.
- @dropdown-link-color: lighten(@text-color, 10%);
- // Hover color for dropdown links.
- @dropdown-link-hover-color: #fff;
- // Hover background for dropdown links.
- @dropdown-link-hover-bg: #666;
- // Active dropdown menu item text color.
- @dropdown-link-active-color: #fff;
- // Active dropdown menu item background color.
- @dropdown-link-active-bg: #333;
- // Open dropdown shadow color.
- @dropdown-shadow: fadeOut(#333, 50%);
- //== Navs
- //
- //##
- //=== Shared nav styles
- @nav-link-hover-bg: transparent;
- @nav-link-color: @gray-light;
- @nav-link-hover-color: @text-color;
- //== Tabs
- @nav-tabs-padding: 10px 12px;
- @nav-tabs-border-color: #ddd;
- @nav-tabs-link-hover-border-color: darken(@nav-tabs-border-color, 40%);
- @nav-tabs-link-active-border-color: @brand-secondary;
- @nav-tabs-active-link-hover-bg: transparent;
- @nav-tabs-active-link-hover-color: @text-color;
- @nav-tabs-active-link-hover-border-color: @brand-primary;
- @nav-tabs-justified-link-border-color: #ddd;
- @nav-tabs-justified-active-link-border-color: @body-bg;
- //== Pills
- @nav-pills-padding: 8px 10px;
- @nav-pills-border-radius: @border-radius-base;
- @nav-pills-active-link-hover-bg: #666;
- @nav-pills-active-link-hover-color: #fff;
- //== Page header
- @page-header-border-color: darken(@body-bg, 9%);
- //== Breadcrumbs
- //
- //##
- @breadcrumb-padding-vertical: 8px;
- @breadcrumb-padding-horizontal: 0px;
- @breadcrumb-bg: transparent;
- @breadcrumb-color: darken(@body-bg, 40%);
- @breadcrumb-active-color: @text-color;
- //== Page footer
- //
- //## For each of Bootstrap's buttons, define text, background and border color.
- @footer-color: darken(@body-bg, 35%);
- // Size of Misago's branding in footer
- @misago-branding-size: @font-size-large * 1.6;
- //== Buttons
- //
- //## For each of Bootstrap's buttons, define text, background and border color.
- @btn-font-weight: normal;
- @btn-default-color: #777;
- @btn-default-bg: darken(@body-bg, 5%);
- @btn-default-border: darken(@btn-default-bg, 10%);
- @btn-default-hover-color: @text-color;
- @btn-default-hover-bg: darken(@body-bg, 2%);
- @btn-default-hover-border: #999;
- @btn-default-active-color: @text-color;
- @btn-default-active-bg: darken(@body-bg, 6%);
- @btn-default-active-border: #999;
- @btn-primary-color: #fff;
- @btn-primary-bg: @brand-secondary;
- @btn-primary-border: darken(@btn-primary-bg, 15%);
- @btn-success-color: #fff;
- @btn-success-bg: @brand-success;
- @btn-success-border: darken(@btn-success-bg, 15%);
- @btn-warning-color: #fff;
- @btn-warning-bg: @brand-warning;
- @btn-warning-border: darken(@btn-warning-bg, 15%);
- @btn-danger-color: #fff;
- @btn-danger-bg: @brand-danger;
- @btn-danger-border: darken(@btn-danger-bg, 15%);
- //== Forms
- //
- @legend-color: darken(@body-bg, 40%);
- @field-help-block-color: darken(@body-bg, 50%);
- //## Misago wraps forms into panels
- @form-panel-bg: #fff;
- @form-panel-border: darken(@body-bg, 15%);
- @form-panel-shadow: darken(@body-bg, 5%);
- @form-panel-footer-bg: darken(@body-bg, 1%);
- @form-panel-padding-vertical: (@padding-large-vertical * 1.5);
- @form-panel-padding-horizontal: @padding-large-horizontal;
- @form-panel-padding: @form-panel-padding-vertical @form-panel-padding-horizontal;
- //== Tables
- //
- @table-panel-bg: #fff;
- @table-panel-border: darken(@body-bg, 15%);
- @table-panel-shadow: darken(@body-bg, 5%);
- @table-header-color: @gray;
- @table-header-bg: darken(@body-bg, 5%);
- @table-header-border: darken(@body-bg, 15%);
- //== Error panel
- //
- //##
- @error-panel-bg: darken(@body-bg, 1%);
- @error-panel-border: darken(@body-bg, 15%);
- @error-panel-shadow: darken(@body-bg, 5%);
- //== Miscellaneous
- //
- //##
- //** Horizontal line color.
- @hr-border: darken(@body-bg, 10%);
- //== Alerts
- //
- //## Define alert colors, border radius, and padding.
- @alert-padding: 12px;
- @alert-border-radius: @border-radius-large;
- @alert-success-bg: #27ae60;
- @alert-success-text: #fff;
- @alert-info-bg: #2980b9;
- @alert-info-text: #fff;
- @alert-warning-bg: #e67e22;
- @alert-warning-text: #fff;
- @alert-danger-bg: #c0392b;
- @alert-danger-text: #fff;
|