bosun.org@v0.0.0-20210513094433-e25bc3e69a1f/cmd/bosun/web/static/css/variables.less (about)

     1  /*! Generated by Live LESS Theme Customizer - not used in runtime, but for reference */
     2  
     3  @gray-base: rgb(0, 0, 0);
     4  @gray-darker: lighten(@gray-base, 13.5%);
     5  @gray-dark: lighten(@gray-base, 20%);
     6  @gray: lighten(@gray-base, 33.5%);
     7  @gray-light: lighten(@gray-base, 46.7%);
     8  @gray-lighter: lighten(@gray-base, 93.5%);
     9  @brand-primary: darken(#428bca, 6.5%);
    10  @brand-success: rgb(92, 184, 92);
    11  @brand-info: rgb(91, 192, 222);
    12  @brand-warning: rgb(240, 173, 78);
    13  @brand-danger: rgb(217, 83, 79);
    14  @body-bg: rgb(255, 255, 255);
    15  @text-color: @gray-dark;
    16  @link-color: @brand-primary;
    17  @link-hover-color: darken(@link-color, 15%);
    18  @link-hover-decoration: underline;
    19  @font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif;
    20  @font-family-serif: Georgia, "Times New Roman", Times, serif;
    21  @font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
    22  @font-family-base: @font-family-sans-serif;
    23  @font-size-base: 13.5px;
    24  @font-size-large: ceil((@font-size-base * 1.25));
    25  @font-size-small: ceil((@font-size-base * 0.85));
    26  @font-size-h1: floor((@font-size-base * 2.25));
    27  @font-size-h2: floor((@font-size-base * 2));
    28  @font-size-h3: ceil((@font-size-base * 1.5));
    29  @font-size-h4: ceil((@font-size-base * 1.25));
    30  @font-size-h5: @font-size-base;
    31  @font-size-h6: ceil((@font-size-base * 0.85));
    32  @line-height-base: 1.3333333;
    33  @line-height-computed: floor((@font-size-base * @line-height-base));
    34  @headings-font-family: inherit;
    35  @headings-font-weight: 500;
    36  @headings-line-height: 1.1;
    37  @headings-color: inherit;
    38  @icon-font-path: "../fonts/";
    39  @icon-font-name: "glyphicons-halflings-regular";
    40  @icon-font-svg-id: "glyphicons_halflingsregular";
    41  @padding-base-vertical: 5px;
    42  @padding-base-horizontal: 12px;
    43  @padding-large-vertical: 6px;
    44  @padding-large-horizontal: 16px;
    45  @padding-small-vertical: 4px;
    46  @padding-small-horizontal: 10px;
    47  @padding-xs-vertical: 1px;
    48  @padding-xs-horizontal: 5px;
    49  @line-height-large: 1.3333333;
    50  @line-height-small: 1.5;
    51  @border-radius-base: 4px;
    52  @border-radius-large: 6px;
    53  @border-radius-small: 3px;
    54  @component-active-color: rgb(255, 255, 255);
    55  @component-active-bg: @brand-primary;
    56  @caret-width-base: 4px;
    57  @caret-width-large: 5px;
    58  @table-cell-padding: 8px;
    59  @table-condensed-cell-padding: 5px;
    60  @table-bg: transparent;
    61  @table-bg-accent: rgb(249, 249, 249);
    62  @table-bg-hover: rgb(245, 245, 245);
    63  @table-bg-active: @table-bg-hover;
    64  @table-border-color: rgb(221, 221, 221);
    65  @btn-font-weight: normal;
    66  @btn-default-color: rgb(51, 51, 51);
    67  @btn-default-bg: rgb(255, 255, 255);
    68  @btn-default-border: rgb(204, 204, 204);
    69  @btn-primary-color: rgb(255, 255, 255);
    70  @btn-primary-bg: @brand-primary;
    71  @btn-primary-border: darken(@btn-primary-bg, 5%);
    72  @btn-success-color: rgb(255, 255, 255);
    73  @btn-success-bg: @brand-success;
    74  @btn-success-border: darken(@btn-success-bg, 5%);
    75  @btn-info-color: rgb(255, 255, 255);
    76  @btn-info-bg: @brand-info;
    77  @btn-info-border: darken(@btn-info-bg, 5%);
    78  @btn-warning-color: rgb(255, 255, 255);
    79  @btn-warning-bg: @brand-warning;
    80  @btn-warning-border: darken(@btn-warning-bg, 5%);
    81  @btn-danger-color: rgb(255, 255, 255);
    82  @btn-danger-bg: @brand-danger;
    83  @btn-danger-border: darken(@btn-danger-bg, 5%);
    84  @btn-link-disabled-color: @gray-light;
    85  @btn-border-radius-base: @border-radius-base;
    86  @btn-border-radius-large: @border-radius-large;
    87  @btn-border-radius-small: @border-radius-small;
    88  @input-bg: rgb(255, 255, 255);
    89  @input-bg-disabled: @gray-lighter;
    90  @input-color: @gray;
    91  @input-border: rgb(204, 204, 204);
    92  @input-border-radius: @border-radius-base;
    93  @input-border-radius-large: @border-radius-large;
    94  @input-border-radius-small: @border-radius-small;
    95  @input-border-focus: rgb(102, 175, 233);
    96  @input-color-placeholder: rgb(153, 153, 153);
    97  @input-height-base: (@line-height-computed + (@padding-base-vertical * 2) + 2);
    98  @input-height-large: (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
    99  @input-height-small: (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
   100  @form-group-margin-bottom: 10px;
   101  @legend-color: @gray-dark;
   102  @legend-border-color: rgb(229, 229, 229);
   103  @input-group-addon-bg: @gray-lighter;
   104  @input-group-addon-border-color: @input-border;
   105  @cursor-disabled: not-allowed;
   106  @dropdown-bg: rgb(255, 255, 255);
   107  @dropdown-border: rgba(0, 0, 0, 0.15);
   108  @dropdown-fallback-border: rgb(204, 204, 204);
   109  @dropdown-divider-bg: rgb(229, 229, 229);
   110  @dropdown-link-color: @gray-dark;
   111  @dropdown-link-hover-color: darken(@gray-dark, 5%);
   112  @dropdown-link-hover-bg: rgb(245, 245, 245);
   113  @dropdown-link-active-color: @component-active-color;
   114  @dropdown-link-active-bg: @component-active-bg;
   115  @dropdown-link-disabled-color: @gray-light;
   116  @dropdown-header-color: @gray-light;
   117  @dropdown-caret-color: rgb(0, 0, 0);
   118  @zindex-navbar: 1000;
   119  @zindex-dropdown: 1000;
   120  @zindex-popover: 1060;
   121  @zindex-tooltip: 1070;
   122  @zindex-navbar-fixed: 1030;
   123  @zindex-modal-background: 1040;
   124  @zindex-modal: 1050;
   125  @screen-xs: 480px;
   126  @screen-xs-min: @screen-xs;
   127  @screen-phone: @screen-xs-min;
   128  @screen-sm: 768px;
   129  @screen-sm-min: @screen-sm;
   130  @screen-tablet: @screen-sm-min;
   131  @screen-md: 992px;
   132  @screen-md-min: @screen-md;
   133  @screen-desktop: @screen-md-min;
   134  @screen-lg: 1200px;
   135  @screen-lg-min: @screen-lg;
   136  @screen-lg-desktop: @screen-lg-min;
   137  @screen-xs-max: (@screen-sm-min - 1);
   138  @screen-sm-max: (@screen-md-min - 1);
   139  @screen-md-max: (@screen-lg-min - 1);
   140  @grid-columns: 12;
   141  @grid-gutter-width: 30px;
   142  @grid-float-breakpoint: @screen-sm-min;
   143  @grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
   144  @container-tablet: (720px + @grid-gutter-width);
   145  @container-sm: @container-tablet;
   146  @container-desktop: (940px + @grid-gutter-width);
   147  @container-md: @container-desktop;
   148  @container-large-desktop: (1140px + @grid-gutter-width);
   149  @container-lg: @container-large-desktop;
   150  @navbar-height: 40px;
   151  @navbar-margin-bottom: @line-height-computed;
   152  @navbar-border-radius: @border-radius-base;
   153  @navbar-padding-horizontal: floor((@grid-gutter-width / 2));
   154  @navbar-padding-vertical: ((@navbar-height - @line-height-computed) / 2);
   155  @navbar-collapse-max-height: 340px;
   156  @navbar-default-color: rgb(119, 119, 119);
   157  @navbar-default-bg: rgb(248, 248, 248);
   158  @navbar-default-border: darken(@navbar-default-bg, 6.5%);
   159  @navbar-default-link-color: rgb(119, 119, 119);
   160  @navbar-default-link-hover-color: rgb(51, 51, 51);
   161  @navbar-default-link-hover-bg: transparent;
   162  @navbar-default-link-active-color: rgb(85, 85, 85);
   163  @navbar-default-link-active-bg: darken(@navbar-default-bg, 6.5%);
   164  @navbar-default-link-disabled-color: rgb(204, 204, 204);
   165  @navbar-default-link-disabled-bg: transparent;
   166  @navbar-default-brand-color: @navbar-default-link-color;
   167  @navbar-default-brand-hover-color: darken(@navbar-default-brand-color, 10%);
   168  @navbar-default-brand-hover-bg: transparent;
   169  @navbar-default-toggle-hover-bg: rgb(221, 221, 221);
   170  @navbar-default-toggle-icon-bar-bg: rgb(136, 136, 136);
   171  @navbar-default-toggle-border-color: rgb(221, 221, 221);
   172  @navbar-inverse-color: lighten(@gray-light, 15%);
   173  @navbar-inverse-bg: rgb(34, 34, 34);
   174  @navbar-inverse-border: darken(@navbar-inverse-bg, 10%);
   175  @navbar-inverse-link-color: lighten(@gray-light, 15%);
   176  @navbar-inverse-link-hover-color: rgb(255, 255, 255);
   177  @navbar-inverse-link-hover-bg: transparent;
   178  @navbar-inverse-link-active-color: @navbar-inverse-link-hover-color;
   179  @navbar-inverse-link-active-bg: darken(@navbar-inverse-bg, 10%);
   180  @navbar-inverse-link-disabled-color: rgb(68, 68, 68);
   181  @navbar-inverse-link-disabled-bg: transparent;
   182  @navbar-inverse-brand-color: @navbar-inverse-link-color;
   183  @navbar-inverse-brand-hover-color: rgb(255, 255, 255);
   184  @navbar-inverse-brand-hover-bg: transparent;
   185  @navbar-inverse-toggle-hover-bg: rgb(51, 51, 51);
   186  @navbar-inverse-toggle-icon-bar-bg: rgb(255, 255, 255);
   187  @navbar-inverse-toggle-border-color: rgb(51, 51, 51);
   188  @nav-link-padding: 10px 15px;
   189  @nav-link-hover-bg: @gray-lighter;
   190  @nav-disabled-link-color: @gray-light;
   191  @nav-disabled-link-hover-color: @gray-light;
   192  @nav-tabs-border-color: rgb(221, 221, 221);
   193  @nav-tabs-link-hover-border-color: @gray-lighter;
   194  @nav-tabs-active-link-hover-bg: @body-bg;
   195  @nav-tabs-active-link-hover-color: @gray;
   196  @nav-tabs-active-link-hover-border-color: rgb(221, 221, 221);
   197  @nav-tabs-justified-link-border-color: rgb(221, 221, 221);
   198  @nav-tabs-justified-active-link-border-color: @body-bg;
   199  @nav-pills-border-radius: @border-radius-base;
   200  @nav-pills-active-link-hover-bg: @component-active-bg;
   201  @nav-pills-active-link-hover-color: @component-active-color;
   202  @pagination-color: @link-color;
   203  @pagination-bg: rgb(255, 255, 255);
   204  @pagination-border: rgb(221, 221, 221);
   205  @pagination-hover-color: @link-hover-color;
   206  @pagination-hover-bg: @gray-lighter;
   207  @pagination-hover-border: rgb(221, 221, 221);
   208  @pagination-active-color: rgb(255, 255, 255);
   209  @pagination-active-bg: @brand-primary;
   210  @pagination-active-border: @brand-primary;
   211  @pagination-disabled-color: @gray-light;
   212  @pagination-disabled-bg: rgb(255, 255, 255);
   213  @pagination-disabled-border: rgb(221, 221, 221);
   214  @pager-bg: @pagination-bg;
   215  @pager-border: @pagination-border;
   216  @pager-border-radius: 15px;
   217  @pager-hover-bg: @pagination-hover-bg;
   218  @pager-active-bg: @pagination-active-bg;
   219  @pager-active-color: @pagination-active-color;
   220  @pager-disabled-color: @pagination-disabled-color;
   221  @jumbotron-padding: 30px;
   222  @jumbotron-color: inherit;
   223  @jumbotron-bg: @gray-lighter;
   224  @jumbotron-heading-color: inherit;
   225  @jumbotron-font-size: ceil((@font-size-base * 1.5));
   226  @jumbotron-heading-font-size: ceil((@font-size-base * 4.5));
   227  @state-success-text: rgb(60, 118, 61);
   228  @state-success-bg: rgb(223, 240, 216);
   229  @state-success-border: darken(spin(@state-success-bg, -10), 5%);
   230  @state-info-text: rgb(49, 112, 143);
   231  @state-info-bg: rgb(217, 237, 247);
   232  @state-info-border: darken(spin(@state-info-bg, -10), 7%);
   233  @state-warning-text: rgb(138, 109, 59);
   234  @state-warning-bg: rgb(252, 248, 227);
   235  @state-warning-border: darken(spin(@state-warning-bg, -10), 5%);
   236  @state-danger-text: rgb(169, 68, 66);
   237  @state-danger-bg: rgb(242, 222, 222);
   238  @state-danger-border: darken(spin(@state-danger-bg, -10), 5%);
   239  @tooltip-max-width: 200px;
   240  @tooltip-color: rgb(255, 255, 255);
   241  @tooltip-bg: rgb(0, 0, 0);
   242  @tooltip-opacity: .9;
   243  @tooltip-arrow-width: 5px;
   244  @tooltip-arrow-color: @tooltip-bg;
   245  @popover-bg: rgb(255, 255, 255);
   246  @popover-max-width: 276px;
   247  @popover-border-color: rgba(0, 0, 0, 0.2);
   248  @popover-fallback-border-color: rgb(204, 204, 204);
   249  @popover-title-bg: darken(@popover-bg, 3%);
   250  @popover-arrow-width: 10px;
   251  @popover-arrow-color: @popover-bg;
   252  @popover-arrow-outer-width: (@popover-arrow-width + 1);
   253  @popover-arrow-outer-color: fadein(@popover-border-color, 5%);
   254  @popover-arrow-outer-fallback-color: darken(@popover-fallback-border-color, 20%);
   255  @label-default-bg: @gray-light;
   256  @label-primary-bg: @brand-primary;
   257  @label-success-bg: @brand-success;
   258  @label-info-bg: @brand-info;
   259  @label-warning-bg: @brand-warning;
   260  @label-danger-bg: @brand-danger;
   261  @label-color: rgb(255, 255, 255);
   262  @label-link-hover-color: rgb(255, 255, 255);
   263  @modal-inner-padding: 15px;
   264  @modal-title-padding: 15px;
   265  @modal-title-line-height: @line-height-base;
   266  @modal-content-bg: rgb(255, 255, 255);
   267  @modal-content-border-color: rgba(0, 0, 0, 0.2);
   268  @modal-content-fallback-border-color: rgb(153, 153, 153);
   269  @modal-backdrop-bg: rgb(0, 0, 0);
   270  @modal-backdrop-opacity: .5;
   271  @modal-header-border-color: rgb(229, 229, 229);
   272  @modal-footer-border-color: @modal-header-border-color;
   273  @modal-lg: 900px;
   274  @modal-md: 600px;
   275  @modal-sm: 300px;
   276  @alert-padding: 15px;
   277  @alert-border-radius: @border-radius-base;
   278  @alert-link-font-weight: bold;
   279  @alert-success-bg: @state-success-bg;
   280  @alert-success-text: @state-success-text;
   281  @alert-success-border: @state-success-border;
   282  @alert-info-bg: @state-info-bg;
   283  @alert-info-text: @state-info-text;
   284  @alert-info-border: @state-info-border;
   285  @alert-warning-bg: @state-warning-bg;
   286  @alert-warning-text: @state-warning-text;
   287  @alert-warning-border: @state-warning-border;
   288  @alert-danger-bg: @state-danger-bg;
   289  @alert-danger-text: @state-danger-text;
   290  @alert-danger-border: @state-danger-border;
   291  @progress-bg: rgb(245, 245, 245);
   292  @progress-bar-color: rgb(255, 255, 255);
   293  @progress-border-radius: @border-radius-base;
   294  @progress-bar-bg: @brand-primary;
   295  @progress-bar-success-bg: @brand-success;
   296  @progress-bar-warning-bg: @brand-warning;
   297  @progress-bar-danger-bg: @brand-danger;
   298  @progress-bar-info-bg: @brand-info;
   299  @list-group-bg: rgb(255, 255, 255);
   300  @list-group-border: rgb(221, 221, 221);
   301  @list-group-border-radius: @border-radius-base;
   302  @list-group-hover-bg: rgb(245, 245, 245);
   303  @list-group-active-color: @component-active-color;
   304  @list-group-active-bg: @component-active-bg;
   305  @list-group-active-border: @list-group-active-bg;
   306  @list-group-active-text-color: lighten(@list-group-active-bg, 40%);
   307  @list-group-disabled-color: @gray-light;
   308  @list-group-disabled-bg: @gray-lighter;
   309  @list-group-disabled-text-color: @list-group-disabled-color;
   310  @list-group-link-color: rgb(85, 85, 85);
   311  @list-group-link-hover-color: @list-group-link-color;
   312  @list-group-link-heading-color: rgb(51, 51, 51);
   313  @panel-bg: rgb(255, 255, 255);
   314  @panel-body-padding: 10px;
   315  @panel-heading-padding: 8px 15px;
   316  @panel-footer-padding: @panel-heading-padding;
   317  @panel-border-radius: @border-radius-base;
   318  @panel-inner-border: rgb(221, 221, 221);
   319  @panel-footer-bg: rgb(245, 245, 245);
   320  @panel-default-text: @gray-dark;
   321  @panel-default-border: rgb(221, 221, 221);
   322  @panel-default-heading-bg: rgb(245, 245, 245);
   323  @panel-primary-text: rgb(255, 255, 255);
   324  @panel-primary-border: @brand-primary;
   325  @panel-primary-heading-bg: @brand-primary;
   326  @panel-success-text: @state-success-text;
   327  @panel-success-border: @state-success-border;
   328  @panel-success-heading-bg: @state-success-bg;
   329  @panel-info-text: @state-info-text;
   330  @panel-info-border: @state-info-border;
   331  @panel-info-heading-bg: @state-info-bg;
   332  @panel-warning-text: @state-warning-text;
   333  @panel-warning-border: @state-warning-border;
   334  @panel-warning-heading-bg: @state-warning-bg;
   335  @panel-danger-text: @state-danger-text;
   336  @panel-danger-border: @state-danger-border;
   337  @panel-danger-heading-bg: @state-danger-bg;
   338  @thumbnail-padding: 4px;
   339  @thumbnail-bg: @body-bg;
   340  @thumbnail-border: rgb(221, 221, 221);
   341  @thumbnail-border-radius: @border-radius-base;
   342  @thumbnail-caption-color: @text-color;
   343  @thumbnail-caption-padding: 9px;
   344  @well-bg: rgb(245, 245, 245);
   345  @well-border: darken(@well-bg, 7%);
   346  @badge-color: rgb(255, 255, 255);
   347  @badge-link-hover-color: rgb(255, 255, 255);
   348  @badge-bg: @gray-light;
   349  @badge-active-color: @link-color;
   350  @badge-active-bg: rgb(255, 255, 255);
   351  @badge-font-weight: bold;
   352  @badge-line-height: 1;
   353  @badge-border-radius: 10px;
   354  @breadcrumb-padding-vertical: 8px;
   355  @breadcrumb-padding-horizontal: 15px;
   356  @breadcrumb-bg: rgb(245, 245, 245);
   357  @breadcrumb-color: rgb(204, 204, 204);
   358  @breadcrumb-active-color: @gray-light;
   359  @breadcrumb-separator: "/";
   360  @carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6);
   361  @carousel-control-color: rgb(255, 255, 255);
   362  @carousel-control-width: 15%;
   363  @carousel-control-opacity: .5;
   364  @carousel-control-font-size: 20px;
   365  @carousel-indicator-active-bg: rgb(255, 255, 255);
   366  @carousel-indicator-border-color: rgb(255, 255, 255);
   367  @carousel-caption-color: rgb(255, 255, 255);
   368  @close-font-weight: bold;
   369  @close-color: rgb(0, 0, 0);
   370  @close-text-shadow: 0 1px 0 #fff;
   371  @code-color: rgb(199, 37, 78);
   372  @code-bg: rgb(249, 242, 244);
   373  @kbd-color: rgb(255, 255, 255);
   374  @kbd-bg: rgb(51, 51, 51);
   375  @pre-bg: rgb(245, 245, 245);
   376  @pre-color: @gray-dark;
   377  @pre-border-color: rgb(204, 204, 204);
   378  @pre-scrollable-max-height: 340px;
   379  @component-offset-horizontal: 180px;
   380  @text-muted: @gray-light;
   381  @abbr-border-color: @gray-light;
   382  @headings-small-color: @gray-light;
   383  @blockquote-small-color: @gray-light;
   384  @blockquote-font-size: (@font-size-base * 1.25);
   385  @blockquote-border-color: @gray-lighter;
   386  @page-header-border-color: @gray-lighter;
   387  @dl-horizontal-offset: @component-offset-horizontal;
   388  @dl-horizontal-breakpoint: @grid-float-breakpoint;
   389  @hr-border: @gray-lighter;