freeipa/install/ui/less/patternfly/variables.less
Petr Vobornik 6a8eeff22d webui: add PaternFly css
To update install/ui/css/patternfly.css you should:

1. clone Bootstrap 3, Font-Awesome, Bootstrap-Select and PatternFly
   to the same parent directory as for FreeIPA (or use symlinks)
2. checkout desired versions of each component
3. run install/ui/util/make-patternfly.css
4. when changing component versions, copy xxx/variables.less from each
   component to install/ui/less/xxx/ so we can use the variables in our
   less files

This commit contain css made from component versions as follows:
- PatternFly: 0.2.5
- Bootstrap: 3.1.1
- Bootstrap-select: 1.4.3
- Font-Awesome: 4.0.3

Reviewed-By: Endi Sukma Dewata <edewata@redhat.com>
2014-06-10 10:23:21 +02:00

195 lines
16 KiB
Plaintext
Executable File

//
// Variables
// --------------------------------------------------
// Bootstrap overrides and PatternFly-specific variables
/* Bootstrap overrides */
@alert-danger-bg: @body-bg;
@alert-danger-border: @brand-danger;
@alert-danger-text: @gray-dark;
@alert-info-bg: @body-bg;
@alert-info-border: #ccc;
@alert-info-text: @gray-dark;
@alert-link-font-weight: 500;
@alert-padding: 7px;
@alert-success-bg: @body-bg;
@alert-success-border: @brand-success;
@alert-success-text: @gray-dark;
@alert-warning-bg: @body-bg;
@alert-warning-border: @brand-warning;
@alert-warning-text: @gray-dark;
@badge-border-radius: @border-radius-base;
@border-radius-base: 1px;
@border-radius-large: @border-radius-base;
@border-radius-small: @border-radius-base;
@brand-primary: #1cace9;
@brand-success: #5cb75c;
@brand-info: #27799c;
@brand-warning: #eb7720;
@brand-danger: #c90813;
@breadcrumb-active-color: @gray-pf;
@breadcrumb-bg: transparent;
@breadcrumb-color: @gray-pf;
@breadcrumb-separator: @fa-var-angle-right;
@btn-danger-bg: #ab070f;
@btn-danger-border: #781919;
@btn-default-bg: @gray-lighter;
@btn-default-border: #b7b7b7;
@btn-default-color: @gray-pf;
@btn-font-weight: 600;
@btn-primary-bg: #189AD1;
@btn-primary-border: #267DA1;
@caret-width-base: 0;
@caret-width-large: @caret-width-base;
@dropdown-border: #b6b6b6;
@dropdown-divider-bg: #e5e5e5;
@dropdown-fallback-border: @dropdown-border;
@dropdown-link-active-bg: @link-color;
@dropdown-link-active-color: #fff;
@dropdown-link-hover-bg: #d4edfa;
@dropdown-link-hover-color: @gray-pf;
@font-family-base: "Open Sans", Helvetica, Arial, sans-serif;
@font-size-base: 12px;
@font-size-h1: ceil(@font-size-base * 2); // ~24px
@font-size-h2: ceil(@font-size-base * 1.8333); // ~22px
@font-size-h3: ceil(@font-size-base * 1.3333); // ~16px
@font-size-h5: ceil(@font-size-base * 1.0833); // ~13px
@font-size-large: ceil(@font-size-base * 1.1666); // ~14px
@font-size-small: ceil(@font-size-base * .9166); // ~11px
@grid-gutter-width: 40px;
@icon-font-path: "../../components/bootstrap/dist/fonts/";
@input-bg-disabled: #F8F8F8;
@input-border: #BABABA;
@input-color: @gray-dark;
@line-height-base: 1.66666667; // 20/12
@link-color: #0099d3;
@list-group-border: #f2f2f2;
@list-group-border-radius: 0;
@list-group-hover-bg: #d4edfa;
@link-hover-color: #00618a;
@nav-tabs-active-link-hover-color: @link-color;
@nav-tabs-border-color: #e9e8e8;
@nav-tabs-justified-link-border-color: @nav-tabs-border-color;
@nav-tabs-link-hover-border-color: transparent;
@padding-base-horizontal: 6px;
@padding-base-vertical: 2px;
@padding-large-horizontal: 10px;
@padding-large-vertical: 6px;
@padding-small-horizontal: @padding-base-horizontal;
@padding-small-vertical: @padding-base-vertical;
@pager-border-radius: 0;
@pager-disabled-color: #969696;
@pagination-bg: #f5f5f5;
@pagination-border: #bbbbbb;
@pagination-hover-bg: #ededed;
@panel-danger-border: @brand-danger;
@panel-danger-heading-bg: @brand-danger;
@panel-danger-text: @panel-primary-text;
@panel-info-border: @brand-info;
@panel-info-heading-bg: @brand-info;
@panel-info-text: @panel-primary-text;
@panel-inner-border: #cecdcd;
@panel-success-border: @brand-success;
@panel-success-heading-bg: @brand-success;
@panel-success-text: @panel-primary-text;
@panel-warning-border: @brand-warning;
@panel-warning-heading-bg: @brand-warning;
@panel-warning-text: @panel-primary-text;
@popover-arrow-color: #fff;
@popover-arrow-outer-color: #bbb;
@popover-border-color: #bbb;
@popover-max-width: 220px;
@popover-title-bg: #f5f5f5;
@table-bg-accent: #f5f5f5;
@table-bg-hover: #d5ecf9;
@table-border-color: #d1d1d1;
@table-cell-padding: 10px;
@tooltip-arrow-width: 8px;
@tooltip-bg: #434343;
@tooltip-max-width: 220px;
/* PatternFly-specific */
@btn-danger-bg-img-start: #d60915;
@btn-danger-bg-img-stop: #ac0710;
@btn-default-bg-img-start: #fafafa;
@btn-default-bg-img-stop: #ededed;
@btn-primary-bg-img-start: #1CACE8;
@btn-primary-bg-img-stop: #1998CC;
@btn-xs-font-weight: 400;
@dropdown-divider-margin: 4px 1px;
@dropdown-link-active-border-color: #0076b7;
@dropdown-link-hover-border-color: #b3d3e7;
@dropdown-link-focus-bg: @link-color;
@dropdown-link-focus-color: #fff;
@fa-font-path: "../../components/font-awesome/fonts";
@font-path: "../fonts";
@gray-light-pf: #aaa;
@gray-pf: #4d5258;
@icon-font-name-fa: "FontAwesome";
@icon-font-name-pf: "PatternFlyIcons-webfont";
@icon-prefix: pficon;
@img-badge-ie8: "logo.png";
@img-badge-ie8-height: 69px;
@img-badge-ie8-width: 73px;
@img-bg-login: "bg-login.jpg";
@img-brand-ie8: "brand.png";
@img-brand-lg-ie8: "brand-lg.png";
@img-path: "../img";
@img-path-alt: @img-path;
@input-border-disabled: #d4d4d4;
@list-group-top-border: #e9e8e8;
@login-bg-color: #080808;
@login-container-bg-color: #181818;
@login-container-bg-color-rgba: rgba(255, 255, 255, 0.055);
@modal-title-padding-horizontal: 18px;
@modal-title-padding-vertical: 10px;
@nav-tabs-color: @gray-pf;
@navbar-pf-bg-color: #030303; //#393F45
@navbar-pf-border-color: #199dde;
@navbar-pf-active-color: #f1f1f1;
@navbar-pf-color: #cfcfcf;
@navbar-pf-icon-bar-bg-color: #fff;
@navbar-pf-navbar-header-border-color: lighten(@navbar-pf-bg-color, 15%);
@navbar-pf-navbar-nav-active-bg-color: lighten(@navbar-pf-bg-color, 12.5%);
@navbar-pf-navbar-nav-active-active-bg-color: lighten(@navbar-pf-bg-color, 8%);
@navbar-pf-navbar-nav-active-active-open-bg-color: lighten(@navbar-pf-bg-color, 11%);
@navbar-pf-navbar-navbar-brand-padding: 8px 0 7px;
@navbar-pf-navbar-navbar-brand-min-width: 270px;
@navbar-pf-navbar-navbar-persistent-bg-color: #f6f6f6;
@navbar-pf-navbar-navbar-persistent-border-color: #cecdcd;
@navbar-pf-navbar-primary-active-bg-color-start: lighten(@navbar-pf-navbar-primary-hover-bg-color-start, 5%);
@navbar-pf-navbar-primary-active-bg-color-stop: lighten(@navbar-pf-navbar-primary-hover-bg-color-stop, 7.5%);
@navbar-pf-navbar-primary-active-border-color: lighten(@navbar-pf-navbar-primary-hover-border-color, 5%);
@navbar-pf-navbar-primary-bg-color-start: lighten(@navbar-pf-bg-color, 10%); // #474C50;
@navbar-pf-navbar-primary-bg-color-stop: @navbar-pf-bg-color; // #383F43;
@navbar-pf-navbar-primary-context-active-bg-color-start: lighten(@navbar-pf-navbar-primary-context-hover-bg-color-start, 5%);
@navbar-pf-navbar-primary-context-active-bg-color-stop: lighten(@navbar-pf-navbar-primary-context-hover-bg-color-stop, 7.5%);
@navbar-pf-navbar-primary-context-active-border-color: lighten(@navbar-pf-navbar-primary-context-hover-border-color, 5%);
@navbar-pf-navbar-primary-context-active-border-right-color: @navbar-pf-navbar-primary-context-active-border-color;
@navbar-pf-navbar-primary-context-active-border-top-color: lighten(@navbar-pf-navbar-primary-context-hover-border-top-color, 6%);
@navbar-pf-navbar-primary-context-bg-color-start: lighten(@navbar-pf-navbar-primary-bg-color-start, 8.5%);
@navbar-pf-navbar-primary-context-bg-color-stop: lighten(@navbar-pf-navbar-primary-bg-color-stop, 11%);
@navbar-pf-navbar-primary-context-border-color: lighten(@navbar-pf-navbar-header-border-color, 8%);
@navbar-pf-navbar-primary-context-border-top-color: lighten(@navbar-pf-navbar-header-border-color, 7%);
@navbar-pf-navbar-primary-context-hover-bg-color-start: lighten(@navbar-pf-navbar-primary-context-bg-color-start, 5%);
@navbar-pf-navbar-primary-context-hover-bg-color-stop: lighten(@navbar-pf-navbar-primary-context-bg-color-stop, 7.5%);
@navbar-pf-navbar-primary-context-hover-border-color: lighten(@navbar-pf-navbar-primary-context-border-color, 5%);
@navbar-pf-navbar-primary-context-hover-border-top-color: lighten(@navbar-pf-navbar-primary-context-border-top-color, 6%);
@navbar-pf-navbar-primary-hover-bg-color-start: lighten(@navbar-pf-navbar-primary-bg-color-start, 10%);
@navbar-pf-navbar-primary-hover-bg-color-stop: lighten(@navbar-pf-navbar-primary-bg-color-stop, 10%);
@navbar-pf-navbar-primary-hover-border-color: lighten(@navbar-pf-navbar-header-border-color, 20%);
@navbar-pf-navbar-utility-border-color: lighten(@navbar-pf-bg-color, 15.5%);
@navbar-pf-navbar-utility-color: @navbar-pf-color;
@navbar-pf-navbar-utility-hover-bg-color: lighten(@navbar-pf-bg-color, 12.5%);
@navbar-pf-navbar-utility-hover-border-color: lighten(@navbar-pf-navbar-utility-border-color, 5%);
@navbar-pf-navbar-utility-open-bg-color: lighten(@navbar-pf-navbar-utility-hover-bg-color, 7.5%);
@navbar-pf-navbar-utility-open-border-color: lighten(@navbar-pf-navbar-utility-hover-border-color, 5%);
@pagination-padding-small-vertical: 0;
@panel-default-border-color: #bebdbd;
@sidebar-pf-bg: #fafafa;
@sidebar-pf-border-color: #d0d0d0;
@table-border-hover: #a7cadf;
@table-cell-padding-bottom: 3px;
@table-cell-padding-top: 2px;
@tooltip-font-size: @font-size-base;