rhodecode-enterprise-ce Commit - r3165:07319487

fonts: use consistent fonts across whole application.

marcink -

r3165:07319487 default

parent child

rhodecode/public/css/bootstrap-variables.less

0 0 -2

             //
             // 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-primary:         darken(#428bca, 6.5%);
             @brand-success:         #5cb85c;
             @brand-info:            #5bc0de;
             @brand-warning:         #f0ad4e;
             @brand-danger:          #d9534f;
             //== Scaffolding
             //
             //## Settings for some of the most global styles.
             //** Background color for `<body>`.
             @body-bg:               #fff;
             //** Global text color on `<body>`.
             @text-color:            @gray-dark;
             //** Global textual link color.
             @link-color:            @brand-primary;
             //** Link hover color set via `darken()` function.
             @link-hover-color:      darken(@link-color, 15%);
             //** Link hover decoration.
             @link-hover-decoration: underline;
             //== Typography
             //
             //## Font, line-height, and color for body text, headings, and more.
             @font-family-sans-serif:  "Helvetica Neue", Helvetica, Arial, sans-serif;
             @font-family-serif:       Georgia, "Times New Roman", Times, serif;
-            //** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`.
-            @font-family-monospace:   Consolas, "Liberation Mono", Menlo, Monaco, Courier, monospace;
             @font-family-base:        @font-family-sans-serif;
             @font-size-base:          14px;
             @font-size-large:         ceil((@font-size-base * 1.25)); // ~18px
             @font-size-small:         ceil((@font-size-base * 0.85)); // ~12px
             @font-size-h1:            floor((@font-size-base * 2.6)); // ~36px
             @font-size-h2:            floor((@font-size-base * 2.15)); // ~30px
             @font-size-h3:            ceil((@font-size-base * 1.7)); // ~24px
             @font-size-h4:            ceil((@font-size-base * 1.25)); // ~18px
             @font-size-h5:            @font-size-base;
             @font-size-h6:            ceil((@font-size-base * 0.85)); // ~12px
             //** Unit-less `line-height` for use in components like buttons.
             @line-height-base:        1.428571429; // 20/14
             //** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
             @line-height-computed:    floor((@font-size-base * @line-height-base)); // ~20px
             //** By default, this inherits from the `<body>`.
             @headings-font-family:    inherit;
             @headings-font-weight:    500;
             @headings-line-height:    1.1;
             @headings-color:          inherit;
             //== Iconography
             //
             //## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
             //** Load fonts from this directory.
             @icon-font-path:          "../fonts/";
             //** File name for all font files.
             @icon-font-name:          "glyphicons-halflings-regular";
             //** Element ID within SVG icon file.
             @icon-font-svg-id:        "glyphicons_halflingsregular";
             //== Components
             //
             //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).
             @padding-base-vertical:     6px;
             @padding-base-horizontal:   12px;
             @padding-large-vertical:    10px;
             @padding-large-horizontal:  16px;
             @padding-small-vertical:    5px;
             @padding-small-horizontal:  10px;
             @padding-xs-vertical:       1px;
             @padding-xs-horizontal:     5px;
             @line-height-large:         1.33;
             @line-height-small:         1.5;
             @border-radius-base:        @border-radius;
             @border-radius-large:       6px;
             @border-radius-small:       3px;
             //** Global color for active items (e.g., navs or dropdowns).
             @component-active-color:    #fff;
             //** Global background color for active items (e.g., navs or dropdowns).
             @component-active-bg:       @brand-primary;
             //** Width of the `border` for generating carets that indicator dropdowns.
             @caret-width-base:          4px;
             //** Carets increase slightly in size for larger components.
             @caret-width-large:         5px;
             //== Tables
             //
             //## Customizes the `.table` component with basic values, each used across all table variations.
             //** Padding for `<th>`s and `<td>`s.
             @table-cell-padding:            8px;
             //** Padding for cells in `.table-condensed`.
             @table-condensed-cell-padding:  5px;
             //** Default background color used for all tables.
             @table-bg:                      transparent;
             //** Background color used for `.table-striped`.
             @table-bg-accent:               #f9f9f9;
             //** Background color used for `.table-hover`.
             @table-bg-hover:                #f5f5f5;
             @table-bg-active:               @table-bg-hover;
             //** Border color for table and cell borders.
             @table-border-color:            #ddd;
             //== Buttons
             //
             //## For each of Bootstrap's buttons, define text, background and border color.
             @btn-font-weight:                normal;
             @btn-default-color:              #333;
             @btn-default-bg:                 #fff;
             @btn-default-border:             #ccc;
             @btn-primary-color:              #fff;
             @btn-primary-bg:                 @brand-primary;
             @btn-primary-border:             darken(@btn-primary-bg, 5%);
             @btn-success-color:              #fff;
             @btn-success-bg:                 @brand-success;
             @btn-success-border:             darken(@btn-success-bg, 5%);
             @btn-info-color:                 #fff;
             @btn-info-bg:                    @brand-info;
             @btn-info-border:                darken(@btn-info-bg, 5%);
             @btn-warning-color:              #fff;
             @btn-warning-bg:                 @brand-warning;
             @btn-warning-border:             darken(@btn-warning-bg, 5%);
             @btn-danger-color:               #fff;
             @btn-danger-bg:                  @brand-danger;
             @btn-danger-border:              darken(@btn-danger-bg, 5%);
             @btn-link-disabled-color:        @gray-light;
             //== Forms
             //
             //##
             //** `<input>` background color
             @input-bg:                       #fff;
             //** `<input disabled>` background color
             @input-bg-disabled:              @gray-lighter;
             //** Text color for `<input>`s
             @input-color:                    @gray;
             //** `<input>` border color
             @input-border:                   #ccc;
             // TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4
             //** Default `.form-control` border radius
             @input-border-radius:            @border-radius-base;
             //** Large `.form-control` border radius
             @input-border-radius-large:      @border-radius-large;
             //** Small `.form-control` border radius
             @input-border-radius-small:      @border-radius-small;
             //** Border color for inputs on focus
             @input-border-focus:             #66afe9;
             //** Placeholder text color
             @input-color-placeholder:        #999;
             //** Default `.form-control` height
             @input-height-base:              (@line-height-computed + (@padding-base-vertical * 2) + 2);
             //** Large `.form-control` height
             @input-height-large:             (ceil(@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + 2);
             //** Small `.form-control` height
             @input-height-small:             (floor(@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + 2);
             @legend-color:                   @gray-dark;
             @legend-border-color:            #e5e5e5;
             //** Background color for textual input addons
             @input-group-addon-bg:           @gray-lighter;
             //** Border color for textual input addons
             @input-group-addon-border-color: @input-border;
             //** Disabled cursor for form controls and buttons.
             @cursor-disabled:                not-allowed;
             //== Dropdowns
             //
             //## Dropdown menu container and contents.
             //** Background for the dropdown menu.
             @dropdown-bg:                    #fff;
             //** Dropdown menu `border-color`.
             @dropdown-border:                rgba(0,0,0,.15);
             //** Dropdown menu `border-color` **for IE8**.
             @dropdown-fallback-border:       #ccc;
             //** Divider color for between dropdown items.
             @dropdown-divider-bg:            #e5e5e5;
             //** Dropdown link text color.
             @dropdown-link-color:            @gray-dark;
             //** Hover color for dropdown links.
             @dropdown-link-hover-color:      darken(@gray-dark, 5%);
             //** Hover background for dropdown links.
             @dropdown-link-hover-bg:         #f5f5f5;
             //** Active dropdown menu item text color.
             @dropdown-link-active-color:     @component-active-color;
             //** Active dropdown menu item background color.
             @dropdown-link-active-bg:        @component-active-bg;
             //** Disabled dropdown menu item background color.
             @dropdown-link-disabled-color:   @gray-light;
             //** Text color for headers within dropdown menus.
             @dropdown-header-color:          @gray-light;
             //** Deprecated `@dropdown-caret-color` as of v3.1.0
             @dropdown-caret-color:           #000;
             //-- Z-index master list
             //
             // Warning: Avoid customizing these values. They're used for a bird's eye view
             // of components dependent on the z-axis and are designed to all work together.
             //
             // Note: These variables are not generated into the Customizer.
             @zindex-navbar:            1000;
             @zindex-dropdown:          1000;
             @zindex-popover:           1060;
             @zindex-tooltip:           1070;
             @zindex-navbar-fixed:      1030;
             @zindex-modal:             1040;
             //== Media queries breakpoints
             //
             //## Define the breakpoints at which your layout will change, adapting to different screen sizes.
             // Extra small screen / phone
             //** Deprecated `@screen-xs` as of v3.0.1
             @screen-xs:                  480px;
             //** Deprecated `@screen-xs-min` as of v3.2.0
             @screen-xs-min:              @screen-xs;
             //** Deprecated `@screen-phone` as of v3.0.1
             @screen-phone:               @screen-xs-min;
             // Small screen / tablet
             //** Deprecated `@screen-sm` as of v3.0.1
             @screen-sm:                  768px;
             @screen-sm-min:              @screen-sm;
             //** Deprecated `@screen-tablet` as of v3.0.1
             @screen-tablet:              @screen-sm-min;
             // Medium screen / desktop
             //** Deprecated `@screen-md` as of v3.0.1
             @screen-md:                  992px;
             @screen-md-min:              @screen-md;
             //** Deprecated `@screen-desktop` as of v3.0.1
             @screen-desktop:             @screen-md-min;
             // Large screen / wide desktop
             //** Deprecated `@screen-lg` as of v3.0.1
             @screen-lg:                  1200px;
             @screen-lg-min:              @screen-lg;
             //** Deprecated `@screen-lg-desktop` as of v3.0.1
             @screen-lg-desktop:          @screen-lg-min;
             // So media queries don't overlap when required, provide a maximum
             @screen-xs-max:              (@screen-sm-min - 1);
             @screen-sm-max:              (@screen-md-min - 1);
             @screen-md-max:              (@screen-lg-min - 1);
             //== Grid system
             //
             //## Define your custom responsive grid.
             //** Number of columns in the grid.
             @grid-columns:              12;
             //** Padding between columns. Gets divided in half for the left and right.
             @grid-gutter-width:         30px;
             // Navbar collapse
             //** Point at which the navbar becomes uncollapsed.
             @grid-float-breakpoint:     @screen-sm-min;
             //** Point at which the navbar begins collapsing.
             @grid-float-breakpoint-max: (@grid-float-breakpoint - 1);
             //== Container sizes
             //
             //## Define the maximum width of `.container` for different screen sizes.
             // Small screen / tablet
             @container-tablet:             (720px + @grid-gutter-width);
             //** For `@screen-sm-min` and up.
             @container-sm:                 @container-tablet;
             // Medium screen / desktop
             @container-desktop:            (940px + @grid-gutter-width);
             //** For `@screen-md-min` and up.
             @container-md:                 @container-desktop;
             // Large screen / wide desktop
             @container-large-desktop:      (1140px + @grid-gutter-width);
             //** For `@screen-lg-min` and up.
             @container-lg:                 @container-large-desktop;
             //== Navbar
             //
             //##
             // Basics of a navbar
             @navbar-height:                    50px;
             @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:                #f8f8f8;
             @navbar-default-border:            darken(@navbar-default-bg, 6.5%);
             // Navbar links
             @navbar-default-link-color:                #777;
             @navbar-default-link-hover-color:          #333;
             @navbar-default-link-hover-bg:             transparent;
             @navbar-default-link-active-color:         #555;
             @navbar-default-link-active-bg:            darken(@navbar-default-bg, 6.5%);
             @navbar-default-link-disabled-color:       #ccc;
             @navbar-default-link-disabled-bg:          transparent;
             // Navbar brand label
             @navbar-default-brand-color:               @navbar-default-link-color;
             @navbar-default-brand-hover-color:         darken(@navbar-default-brand-color, 10%);
             @navbar-default-brand-hover-bg:            transparent;
             // Navbar toggle
             @navbar-default-toggle-hover-bg:           #ddd;
             @navbar-default-toggle-icon-bar-bg:        #888;
             @navbar-default-toggle-border-color:       #ddd;
             // Inverted navbar
             // Reset inverted navbar basics
             @navbar-inverse-color:                      lighten(@gray-light, 15%);
             @navbar-inverse-bg:                         #222;
             @navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);
             // Inverted navbar links
             @navbar-inverse-link-color:                 lighten(@gray-light, 15%);
             @navbar-inverse-link-hover-color:           #fff;
             @navbar-inverse-link-hover-bg:              transparent;
             @navbar-inverse-link-active-color:          @navbar-inverse-link-hover-color;
             @navbar-inverse-link-active-bg:             darken(@navbar-inverse-bg, 10%);
             @navbar-inverse-link-disabled-color:        #444;
             @navbar-inverse-link-disabled-bg:           transparent;
             // Inverted navbar brand label
             @navbar-inverse-brand-color:                @navbar-inverse-link-color;
             @navbar-inverse-brand-hover-color:          #fff;
             @navbar-inverse-brand-hover-bg:             transparent;
             // Inverted navbar toggle
             @navbar-inverse-toggle-hover-bg:            #333;
             @navbar-inverse-toggle-icon-bar-bg:         #fff;
             @navbar-inverse-toggle-border-color:        #333;
             //== Navs
             //
             //##
             //=== Shared nav styles
             @nav-link-padding:                          10px 15px;
             @nav-link-hover-bg:                         @gray-lighter;
             @nav-disabled-link-color:                   @gray-light;
             @nav-disabled-link-hover-color:             @gray-light;
             //== Tabs
             @nav-tabs-border-color:                     #ddd;
             @nav-tabs-link-hover-border-color:          @gray-lighter;
             @nav-tabs-active-link-hover-bg:             @body-bg;
             @nav-tabs-active-link-hover-color:          @gray;
             @nav-tabs-active-link-hover-border-color:   #ddd;
             @nav-tabs-justified-link-border-color:            #ddd;
             @nav-tabs-justified-active-link-border-color:     @body-bg;
             //== Pills
             @nav-pills-border-radius:                   @border-radius-base;
             @nav-pills-active-link-hover-bg:            @component-active-bg;
             @nav-pills-active-link-hover-color:         @component-active-color;
             //== Pagination
             //
             //##
             @pagination-color:                     @link-color;
             @pagination-bg:                        #fff;
             @pagination-border:                    #ddd;
             @pagination-hover-color:               @link-hover-color;
             @pagination-hover-bg:                  @gray-lighter;
             @pagination-hover-border:              #ddd;
             @pagination-active-color:              #fff;
             @pagination-active-bg:                 @brand-primary;
             @pagination-active-border:             @brand-primary;
             @pagination-disabled-color:            @gray-light;
             @pagination-disabled-bg:               #fff;
             @pagination-disabled-border:           #ddd;
             //== Pager
             //
             //##
             @pager-bg:                             @pagination-bg;
             @pager-border:                         @pagination-border;
             @pager-border-radius:                  15px;
             @pager-hover-bg:                       @pagination-hover-bg;
             @pager-active-bg:                      @pagination-active-bg;
             @pager-active-color:                   @pagination-active-color;
             @pager-disabled-color:                 @pagination-disabled-color;
             //== Jumbotron
             //
             //##
             @jumbotron-padding:              30px;
             @jumbotron-color:                inherit;
             @jumbotron-bg:                   @gray-lighter;
             @jumbotron-heading-color:        inherit;
             @jumbotron-font-size:            ceil((@font-size-base * 1.5));
             //== Form states and alerts
             //
             //## Define colors for form feedback states and, by default, alerts.
             @state-success-text:             #3c763d;
             @state-success-bg:               #dff0d8;
             @state-success-border:           darken(spin(@state-success-bg, -10), 5%);
             @state-info-text:                #31708f;
             @state-info-bg:                  #d9edf7;
             @state-info-border:              darken(spin(@state-info-bg, -10), 7%);
             @state-warning-text:             #8a6d3b;
             @state-warning-bg:               #fcf8e3;
             @state-warning-border:           darken(spin(@state-warning-bg, -10), 5%);
             @state-danger-text:              #a94442;
             @state-danger-bg:                #f2dede;
             @state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);
             //== Tooltips
             //
             //##
             //** Tooltip max width
             @tooltip-max-width:           200px;
             //** Tooltip text color
             @tooltip-color:               #fff;
             //** Tooltip background color
             @tooltip-bg:                  #000;
             @tooltip-opacity:             .9;
             //** Tooltip arrow width
             @tooltip-arrow-width:         5px;
             //** Tooltip arrow color
             @tooltip-arrow-color:         @tooltip-bg;
             //== Popovers
             //
             //##
             //** Popover body background color
             @popover-bg:                          #fff;
             //** Popover maximum width
             @popover-max-width:                   276px;
             //** Popover border color
             @popover-border-color:                rgba(0,0,0,.2);
             //** Popover fallback border color
             @popover-fallback-border-color:       #ccc;
             //** Popover title background color
             @popover-title-bg:                    darken(@popover-bg, 3%);
             //** Popover arrow width
             @popover-arrow-width:                 10px;
             //** Popover arrow color
             @popover-arrow-color:                 @popover-bg;
             //** Popover outer arrow width
             @popover-arrow-outer-width:           (@popover-arrow-width + 1);
             //** Popover outer arrow color
             @popover-arrow-outer-color:           fadein(@popover-border-color, 5%);
             //** Popover outer arrow fallback color
             @popover-arrow-outer-fallback-color:  darken(@popover-fallback-border-color, 20%);
             //== Labels
             //
             //##
             //** Default label background color
             @label-default-bg:            @gray-light;
             //** Primary label background color
             @label-primary-bg:            @brand-primary;
             //** Success label background color
             @label-success-bg:            @brand-success;
             //** Info label background color
             @label-info-bg:               @brand-info;
             //** Warning label background color
             @label-warning-bg:            @brand-warning;
             //** Danger label background color
             @label-danger-bg:             @brand-danger;
             //** Default label text color
             @label-color:                 #fff;
             //** Default text color of a linked label
             @label-link-hover-color:      #fff;
             //== Modals
             //
             //##
             //** Padding applied to the modal body
             @modal-inner-padding:         15px;
             //** Padding applied to the modal title
             @modal-title-padding:         15px;
             //** Modal title line-height
             @modal-title-line-height:     @line-height-base;
             //** Background color of modal content area
             @modal-content-bg:                             #fff;
             //** Modal content border color
             @modal-content-border-color:                   rgba(0,0,0,.2);
             //** Modal content border color **for IE8**
             @modal-content-fallback-border-color:          #999;
             //** Modal backdrop background color
             @modal-backdrop-bg:           #000;
             //** Modal backdrop opacity
             @modal-backdrop-opacity:      .5;
             //** Modal header border color
             @modal-header-border-color:   #e5e5e5;
             //** Modal footer border color
             @modal-footer-border-color:   @modal-header-border-color;
             @modal-lg:                    900px;
             @modal-md:                    600px;
             @modal-sm:                    300px;
             //== Alerts
             //
             //## Define alert colors, border radius, and padding.
             @alert-padding:               15px;
             @alert-border-radius:         @border-radius-base;
             @alert-link-font-weight:      bold;
             @alert-success-bg:            @state-success-bg;
             @alert-success-text:          @state-success-text;
             @alert-success-border:        @state-success-border;
             @alert-info-bg:               @state-info-bg;
             @alert-info-text:             @state-info-text;
             @alert-info-border:           @state-info-border;
             @alert-warning-bg:            @state-warning-bg;
             @alert-warning-text:          @state-warning-text;
             @alert-warning-border:        @state-warning-border;
             @alert-danger-bg:             @state-danger-bg;
             @alert-danger-text:           @state-danger-text;
             @alert-danger-border:         @state-danger-border;
             //== Progress bars
             //
             //##
             //** Background color of the whole progress component
             @progress-bg:                 #f5f5f5;
             //** Progress bar text color
             @progress-bar-color:          #fff;
             //** Variable for setting rounded corners on progress bar.
             @progress-border-radius:      @border-radius-base;
             //** Default progress bar color
             @progress-bar-bg:             @brand-primary;
             //** Success progress bar color
             @progress-bar-success-bg:     @brand-success;
             //** Warning progress bar color
             @progress-bar-warning-bg:     @brand-warning;
             //** Danger progress bar color
             @progress-bar-danger-bg:      @brand-danger;
             //** Info progress bar color
             @progress-bar-info-bg:        @brand-info;
             //== List group
             //
             //##
             //** Background color on `.list-group-item`
             @list-group-bg:                 #fff;
             //** `.list-group-item` border color
             @list-group-border:             #ddd;
             //** List group border radius
             @list-group-border-radius:      @border-radius-base;
             //** Background color of single list items on hover
             @list-group-hover-bg:           #f5f5f5;
             //** Text color of active list items
             @list-group-active-color:       @component-active-color;
             //** Background color of active list items
             @list-group-active-bg:          @component-active-bg;
             //** Border color of active list elements
             @list-group-active-border:      @list-group-active-bg;
             //** Text color for content within active list items
             @list-group-active-text-color:  lighten(@list-group-active-bg, 40%);
             //** Text color of disabled list items
             @list-group-disabled-color:      @gray-light;
             //** Background color of disabled list items
             @list-group-disabled-bg:         @gray-lighter;
             //** Text color for content within disabled list items
             @list-group-disabled-text-color: @list-group-disabled-color;
             @list-group-link-color:         #555;
             @list-group-link-hover-color:   @list-group-link-color;
             @list-group-link-heading-color: #333;
             //== Panels
             //
             //##
             @panel-bg:                    #fff;
             @panel-body-padding:          @padding;
             @panel-heading-padding:       10px 15px;
             @panel-footer-padding:        @panel-heading-padding;
             @panel-border-radius:         @border-radius-base;
             //** Border color for elements within panels
             @panel-inner-border:          #ddd;
             @panel-footer-bg:             #fff;
             @panel-default-text:          @text-color;
             @panel-default-border:        @grey5;
             @panel-default-heading-bg:    @grey6;
             @panel-primary-text:          #fff;
             @panel-primary-border:        @brand-primary;
             @panel-primary-heading-bg:    @brand-primary;
             @panel-success-text:          @state-success-text;
             @panel-success-border:        @state-success-border;
             @panel-success-heading-bg:    @state-success-bg;
             @panel-info-text:             @state-info-text;
             @panel-info-border:           @state-info-border;
             @panel-info-heading-bg:       @state-info-bg;
             @panel-warning-text:          @state-warning-text;
             @panel-warning-border:        @state-warning-border;
             @panel-warning-heading-bg:    @state-warning-bg;
             @panel-danger-text:           @state-danger-text;
             @panel-danger-border:         @state-danger-border;
             @panel-danger-heading-bg:     @state-danger-bg;
             //== Thumbnails
             //
             //##
             //** Padding around the thumbnail image
             @thumbnail-padding:           4px;
             //** Thumbnail background color
             @thumbnail-bg:                @body-bg;
             //** Thumbnail border color
             @thumbnail-border:            #ddd;
             //** Thumbnail border radius
             @thumbnail-border-radius:     @border-radius-base;
             //** Custom text color for thumbnail captions
             @thumbnail-caption-color:     @text-color;
             //** Padding around the thumbnail caption
             @thumbnail-caption-padding:   9px;
             //== Wells
             //
             //##
             @well-bg:                     #f5f5f5;
             @well-border:                 darken(@well-bg, 7%);
             //== Badges
             //
             //##
             @badge-color:                 #fff;
             //** Linked badge text color on hover
             @badge-link-hover-color:      #fff;
             @badge-bg:                    @gray-light;
             //** 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:           bold;
             @badge-line-height:           1;
             @badge-border-radius:         10px;
             //== Breadcrumbs
             //
             //##
             @breadcrumb-padding-vertical:   8px;
             @breadcrumb-padding-horizontal: 15px;
             //** Breadcrumb background color
             @breadcrumb-bg:                 #f5f5f5;
             //** Breadcrumb text color
             @breadcrumb-color:              #ccc;
             //** Text color of current page in the breadcrumb
             @breadcrumb-active-color:       @gray-light;
             //** Textual separator for between breadcrumb elements
             @breadcrumb-separator:          "/";
             //== Carousel
             //
             //##
             @carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6);
             @carousel-control-color:                      #fff;
             @carousel-control-width:                      15%;
             @carousel-control-opacity:                    .5;
             @carousel-control-font-size:                  20px;
             @carousel-indicator-active-bg:                #fff;
             @carousel-indicator-border-color:             #fff;
             @carousel-caption-color:                      #fff;
             //== Close
             //
             //##
             @close-font-weight:           bold;
             @close-color:                 #000;
             @close-text-shadow:           0 1px 0 #fff;
             //== Code
             //
             //##
             @code-color:                  #c7254e;
             @code-bg:                     #f9f2f4;
             @kbd-color:                   #fff;
             @kbd-bg:                      #333;
             @pre-bg:                      #f5f5f5;
             @pre-color:                   @gray-dark;
             @pre-border-color:            #ccc;
             @pre-scrollable-max-height:   340px;
             //== Type
             //
             //##
             //** Horizontal offset for forms and lists.
             @component-offset-horizontal: 180px;
             //** Text muted color
             @text-muted:                  @grey4;
             //** Abbreviations and acronyms border color
             @abbr-border-color:           @gray-light;
             //** Headings small color
             @headings-small-color:        @gray-light;
             //** Blockquote small color
             @blockquote-small-color:      @gray-light;
             //** Blockquote font size
             @blockquote-font-size:        (@font-size-base * 1.25);
             //** Blockquote border color
             @blockquote-border-color:     @gray-lighter;
             //** Page header border color
             @page-header-border-color:    @gray-lighter;
             //** Width of horizontal description list titles
             @dl-horizontal-offset:        @component-offset-horizontal;
             //** Horizontal line color.
             @hr-border:                   @gray-lighter;

rhodecode/public/css/code-block.less

0 +5 -5

             // Default styles
             .diff-collapse {
                 margin: @padding 0;
                 text-align: right;
             }
             .diff-container {
                 margin-bottom: @space;
                 .diffblock {
                     margin-bottom: @space;
                 }
                 &.hidden {
                     display: none;
                     overflow: hidden;
                 }
             }
             div.diffblock .sidebyside {
              background: #ffffff;
             }
             div.diffblock {
                 overflow-x: auto;
                 overflow-y: hidden;
                 clear: both;
                 padding: 0px;
                 background: @grey6;
                 border: @border-thickness solid @grey5;
                 -webkit-border-radius: @border-radius @border-radius 0px 0px;
                 border-radius: @border-radius @border-radius 0px 0px;
                 .comments-number {
                     float: right;
                 }
                 // BEGIN CODE-HEADER STYLES
                 .code-header {
                     background: @grey6;
                     padding: 10px 0 10px 0;
                     height: auto;
                     width: 100%;
                     .hash {
                         float: left;
                         padding: 2px 0 0 2px;
                     }
                     .date {
                         float: left;
                         text-transform: uppercase;
                         padding: 4px 0px 0px 2px;
                     }
                     div {
                         margin-left: 4px;
                     }
                     div.compare_header {
                         min-height: 40px;
                         margin: 0;
                         padding: 0 @padding;
                         .drop-menu {
                             float:left;
                             display: block;
                             margin:0 0 @padding 0;
                         }
                         .compare-label {
                             float: left;
                             clear: both;
                             display: inline-block;
                             min-width: 5em;
                             margin: 0;
                             padding: @button-padding @button-padding @button-padding 0;
                             font-family: @text-semibold;
                         }
                         .compare-buttons {
                             float: left;
                             margin: 0;
                             padding: 0 0 @padding;
                             .btn {
                                 margin: 0 @padding 0 0;
                             }
                         }
                     }
                 }
                 .parents {
                     float: left;
                     width: 100px;
                     font-weight: 400;
                     vertical-align: middle;
                     padding: 0px 2px 0px 2px;
                     background-color: @grey6;
                     #parent_link {
                        margin: 00px 2px;
                        &.double {
                            margin: 0px 2px;
                         }
                         &.disabled{
                             margin-right: @padding;
                         }
                     }
                 }
                 .children {
                     float: right;
                     width: 100px;
                     font-weight: 400;
                     vertical-align: middle;
                     text-align: right;
                     padding: 0px 2px 0px 2px;
                     background-color: @grey6;
                     #child_link {
                        margin: 0px 2px;
                        &.double {
                            margin: 0px 2px;
                         }
                         &.disabled{
                             margin-right: @padding;
                         }
                     }
                 }
                 .changeset_header {
                     height: 16px;
                     & > div{
                         margin-right: @padding;
                    }
                 }
                 .changeset_file {
                     text-align: left;
                     float: left;
                     padding: 0;
                     a{
                         display: inline-block;
                         margin-right: 0.5em;
                     }
                    #selected_mode{
                         margin-left: 0;
                    }
                 }
                 .diff-menu-wrapper {
                     float: left;
                 }
                 .diff-menu {
                     position: absolute;
                     background: none repeat scroll 0 0 #FFFFFF;
                     border-color: #003367 @grey3 @grey3;
                     border-right: 1px solid @grey3;
                     border-style: solid solid solid;
                     border-width: @border-thickness;
                     box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
                     margin-top: 5px;
                     margin-left: 1px;
                 }
                 .diff-actions, .editor-actions {
                     float: left;
                     input{
                         margin: 0 0.5em 0 0;
                     }
                 }
                 // END CODE-HEADER STYLES
                 // BEGIN CODE-BODY STYLES
                 .code-body {
                     padding: 0;
                     background-color: #ffffff;
                     position: relative;
                     max-width: none;
                     box-sizing: border-box;
                     // TODO: johbo: Parent has overflow: auto, this forces the child here
                     // to have the intended size and to scroll. Should be simplified.
                     width: 100%;
                     overflow-x: auto;
                 }
                 pre.raw {
                     background: white;
                     color: @grey1;
                 }
                 // END CODE-BODY STYLES
             }
             table.code-difftable {
                 border-collapse: collapse;
                 width: 99%;
                 border-radius: 0px !important;
                  td {
                     padding: 0 !important;
                     background: none !important;
                     border: 0 !important;
                 }
                 .context {
                     background: none repeat scroll 0 0 #DDE7EF;
                 }
                 .add {
                     background: none repeat scroll 0 0 #DDFFDD;
                     ins {
                         background: none repeat scroll 0 0 #AAFFAA;
                         text-decoration: none;
                     }
                 }
                 .del {
                     background: none repeat scroll 0 0 #FFDDDD;
                     del {
                         background: none repeat scroll 0 0 #FFAAAA;
                         text-decoration: none;
                     }
                 }
                 /** LINE NUMBERS **/
                 .lineno {
                     padding-left: 2px !important;
                     padding-right: 2px;
                     text-align: right;
                     width: 32px;
                     -moz-user-select: none;
                     -webkit-user-select: none;
                     border-right: @border-thickness solid @grey5 !important;
                     border-left: 0px solid #CCC !important;
                     border-top: 0px solid #CCC !important;
                     border-bottom: none !important;
                     a {
                         &:extend(pre);
                         text-align: right;
                         padding-right: 2px;
                         cursor: pointer;
                         display: block;
                         width: 32px;
                     }
                 }
                 .context {
                     cursor: auto;
                     &:extend(pre);
                 }
                 .lineno-inline {
                     background: none repeat scroll 0 0 #FFF !important;
                     padding-left: 2px;
                     padding-right: 2px;
                     text-align: right;
                     width: 30px;
                     -moz-user-select: none;
                     -webkit-user-select: none;
                 }
                 /** CODE **/
                 .code {
                     display: block;
                     width: 100%;
                     td {
                         margin: 0;
                         padding: 0;
                     }
                     pre {
                         margin: 0;
                         padding: 0;
                         margin-left: .5em;
                     }
                 }
             }
             // Comments
             div.comment:target {
                 border-left: 6px solid @comment-highlight-color !important;
                 padding-left: 3px;
                 margin-left: -9px;
             }
             //TODO: anderson: can't get an absolute number out of anything, so had to put the
             //current values that might change. But to make it clear I put as a calculation
             @comment-max-width: 1065px;
             @pr-extra-margin: 34px;
             @pr-border-spacing: 4px;
             @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
             // Pull Request
             .cs_files .code-difftable {
                 border: @border-thickness solid @grey5; //borders only on PRs
                 .comment-inline-form,
                 div.comment {
                     width: @pr-comment-width;
                 }
             }
             // Changeset
             .code-difftable {
                 .comment-inline-form,
                 div.comment {
                     width: @comment-max-width;
                 }
             }
             //Style page
             @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
             #style-page .code-difftable{
                 .comment-inline-form,
                 div.comment {
                     width: @comment-max-width - @style-extra-margin;
                 }
             }
             #context-bar > h2 {
                 font-size: 20px;
             }
             #context-bar > h2> a {
                 font-size: 20px;
             }
             // end of defaults
             .file_diff_buttons {
                 padding: 0 0 @padding;
                 .drop-menu {
                     float: left;
                     margin: 0 @padding 0 0;
                 }
                 .btn {
                     margin: 0 @padding 0 0;
                 }
             }
             .code-body.textarea.editor {
                 max-width: none;
                 padding: 15px;
             }
             td.injected_diff{
                 max-width: 1178px;
                 overflow-x: auto;
                 overflow-y: hidden;
                 div.diff-container,
                 div.diffblock{
                     max-width: 100%;
                 }
                 div.code-body {
                     max-width: 1124px;
                     overflow-x: auto;
                     overflow-y: hidden;
                     padding: 0;
                 }
                 div.diffblock {
                     border: none;
                 }
                 &.inline-form {
                     width: 99%
                 }
              }
             table.code-difftable {
                 width: 100%;
             }
             /** PYGMENTS COLORING **/
             div.codeblock {
                 // TODO: johbo: Added interim to get rid of the margin around
                 // Select2 widgets. This needs further cleanup.
                 margin-top: @padding;
                 overflow: auto;
                 padding: 0px;
                 border: @border-thickness solid @grey5;
                 background: @grey6;
                 .border-radius(@border-radius);
                 #remove_gist {
                     float: right;
                 }
                 .gist_url {
                     padding: 0px 0px 10px 0px;
                 }
                 .author {
                     clear: both;
                     vertical-align: middle;
                     font-family: @text-bold;
                 }
                 .btn-mini {
                     float: left;
                     margin: 0 5px 0 0;
                 }
                 .code-header {
                     padding: @padding;
                     border-bottom: @border-thickness solid @grey5;
                     .rc-user {
                         min-width: 0;
                         margin-right: .5em;
                     }
                     .stats {
                         clear: both;
                         margin: 0 0 @padding 0;
                         padding: 0;
                         .left {
                             float: left;
                             clear: left;
                             max-width: 75%;
                             margin: 0 0 @padding 0;
                             &.item {
                                 margin-right: @padding;
                                 &.last { border-right: none; }
                             }
                         }
                         .buttons { float: right; }
                         .author {
                             height: 25px; margin-left: 15px; font-weight: bold;
                         }
                     }
                     .commit {
                         margin: 5px 0 0 26px;
                         font-weight: normal;
                         white-space: pre-wrap;
                     }
                 }
                 .message {
                     position: relative;
                     margin: @padding;
                     .codeblock-label {
                         margin: 0 0 1em 0;
                     }
                 }
                 .code-body {
                     padding: @padding;
                     background-color: #ffffff;
                     min-width: 100%;
                     box-sizing: border-box;
                     // TODO: johbo: Parent has overflow: auto, this forces the child here
                     // to have the intended size and to scroll. Should be simplified.
                     width: 100%;
                     overflow-x: auto;
                     img.rendered-binary {
                         height: auto;
                         width: 100%;
                     }
                 }
             }
             .code-highlighttable,
             div.codeblock {
                 &.readme {
                     background-color: white;
                 }
                 .markdown-block table {
                     border-collapse: collapse;
                     th,
                     td {
                         padding: .5em;
                         border: @border-thickness solid @border-default-color;
                     }
                 }
                 table {
                     border: 0px;
                     margin: 0;
                     letter-spacing: normal;
                     td {
                         border: 0px;
                         vertical-align: top;
                     }
                 }
             }
             div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
             div.search-code-body {
                 background-color: #ffffff; padding: 5px 0 5px 10px;
                 pre {
                     .match { background-color: #faffa6;}
                     .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
                 }
                 .code-highlighttable {
                     border-collapse: collapse;
                     tr:hover {
                         background: #fafafa;
                     }
                     td.code {
                       padding-left: 10px;
                     }
                     td.line {
                         border-right: 1px solid #ccc !important;
                         padding-right: 10px;
                         text-align: right;
-                        font-family: "Lucida Console",Monaco,monospace;
+                        font-family: @text-monospace;
                         span {
                             white-space: pre-wrap;
                             color: #666666;
                         }
                     }
                 }
             }
             div.annotatediv { margin-left: 2px; margin-right: 4px; }
             .code-highlight {
                 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
                 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
                 pre div:target {background-color: @comment-highlight-color !important;}
             }
             .linenos a { text-decoration: none; }
             .CodeMirror-selected { background: @rchighlightblue; }
             .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
             .CodeMirror ::selection { background: @rchighlightblue; }
             .CodeMirror ::-moz-selection { background: @rchighlightblue; }
             .code { display: block; border:0px !important; }
             .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
             .codehilite {
                 .hll { background-color: #ffffcc }
                 .c { color: #408080; font-style: italic } /* Comment */
                 .err, .codehilite .err { border: none } /* Error */
                 .k { color: #008000; font-weight: bold } /* Keyword */
                 .o { color: #666666 } /* Operator */
                 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
                 .cp { color: #BC7A00 } /* Comment.Preproc */
                 .c1 { color: #408080; font-style: italic } /* Comment.Single */
                 .cs { color: #408080; font-style: italic } /* Comment.Special */
                 .gd { color: #A00000 } /* Generic.Deleted */
                 .ge { font-style: italic } /* Generic.Emph */
                 .gr { color: #FF0000 } /* Generic.Error */
                 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
                 .gi { color: #00A000 } /* Generic.Inserted */
                 .go { color: #808080 } /* Generic.Output */
                 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
                 .gs { font-weight: bold } /* Generic.Strong */
                 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
                 .gt { color: #0040D0 } /* Generic.Traceback */
                 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
                 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
                 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
                 .kp { color: #008000 } /* Keyword.Pseudo */
                 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
                 .kt { color: #B00040 } /* Keyword.Type */
                 .m { color: #666666 } /* Literal.Number */
                 .s { color: #BA2121 } /* Literal.String */
                 .na { color: #7D9029 } /* Name.Attribute */
                 .nb { color: #008000 } /* Name.Builtin */
                 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
                 .no { color: #880000 } /* Name.Constant */
                 .nd { color: #AA22FF } /* Name.Decorator */
                 .ni { color: #999999; font-weight: bold } /* Name.Entity */
                 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
                 .nf { color: #0000FF } /* Name.Function */
                 .nl { color: #A0A000 } /* Name.Label */
                 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
                 .nt { color: #008000; font-weight: bold } /* Name.Tag */
                 .nv { color: #19177C } /* Name.Variable */
                 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
                 .w { color: #bbbbbb } /* Text.Whitespace */
                 .mf { color: #666666 } /* Literal.Number.Float */
                 .mh { color: #666666 } /* Literal.Number.Hex */
                 .mi { color: #666666 } /* Literal.Number.Integer */
                 .mo { color: #666666 } /* Literal.Number.Oct */
                 .sb { color: #BA2121 } /* Literal.String.Backtick */
                 .sc { color: #BA2121 } /* Literal.String.Char */
                 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
                 .s2 { color: #BA2121 } /* Literal.String.Double */
                 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
                 .sh { color: #BA2121 } /* Literal.String.Heredoc */
                 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
                 .sx { color: #008000 } /* Literal.String.Other */
                 .sr { color: #BB6688 } /* Literal.String.Regex */
                 .s1 { color: #BA2121 } /* Literal.String.Single */
                 .ss { color: #19177C } /* Literal.String.Symbol */
                 .bp { color: #008000 } /* Name.Builtin.Pseudo */
                 .vc { color: #19177C } /* Name.Variable.Class */
                 .vg { color: #19177C } /* Name.Variable.Global */
                 .vi { color: #19177C } /* Name.Variable.Instance */
                 .il { color: #666666 } /* Literal.Number.Integer.Long */
             }
             /* customized pre blocks for markdown/rst */
             pre.literal-block, .codehilite pre{
                 padding: @padding;
                 border: 1px solid @grey6;
                 .border-radius(@border-radius);
                 background-color: @grey7;
             }
             /* START NEW CODE BLOCK CSS */
             @cb-line-height: 18px;
             @cb-line-code-padding: 10px;
             @cb-text-padding: 5px;
             @pill-padding: 2px 7px;
             @pill-padding-small: 2px 2px 1px 2px;
             input.filediff-collapse-state {
                 display: none;
                 &:checked + .filediff { /* file diff is collapsed */
                     .cb {
                         display: none
                     }
                     .filediff-collapse-indicator {
                         width: 0;
                         height: 0;
                         border-style: solid;
                         border-width: 4.5px 0 4.5px 9.3px;
                         border-color: transparent transparent transparent  #aaa;
                         margin: 6px 0px;
                     }
                     .filediff-menu {
                         display: none;
                     }
                 }
                 &+ .filediff { /* file diff is expanded */
                     .filediff-collapse-indicator {
                         width: 0;
                         height: 0;
                         border-style: solid;
                         border-width: 9.3px 4.5px 0 4.5px;
                         border-color: #aaa transparent transparent transparent;
                         margin: 6px 0px;
                     }
                     .filediff-menu {
                         display: block;
                     }
                     margin: 10px 0;
                     &:nth-child(2) {
                         margin: 0;
                     }
                 }
             }
             .filediffs .anchor {
                 display: block;
                 height: 40px;
                 margin-top: -40px;
                 visibility: hidden;
             }
             .filediffs .anchor:nth-of-type(1) {
                 display: block;
                 height: 80px;
                 margin-top: -80px;
                 visibility: hidden;
             }
             .cs_files {
                 clear: both;
             }
             #diff-file-sticky{
                 will-change: min-height;
             }
             .sidebar__inner{
                 transform: translate(0, 0); /* For browsers don't support translate3d. */
                 transform: translate3d(0, 0, 0);
                 will-change: position, transform;
                 height: 70px;
                 z-index: 30;
                 background-color: #fff;
                 padding: 5px 0px;
             }
             .sidebar__bar {
                 padding: 5px 0px 0px 0px
             }
             .fpath-placeholder {
                 clear: both;
                 visibility: hidden
             }
             .is-affixed {
                 .sidebar_inner_shadow {
                     position: fixed;
                     top: 75px;
                     right: -100%;
                     left: -100%;
                     z-index: 28;
                     display: block;
                     height: 5px;
                     content: "";
                     background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
                     border-top: 1px solid rgba(0, 0, 0, 0.15);
                 }
                 .fpath-placeholder {
                     visibility: visible !important;
                 }
             }
             .diffset-menu {
                 margin-bottom: 20px;
             }
             .diffset {
                 margin: 20px auto;
                 .diffset-heading {
                     border: 1px solid @grey5;
                     margin-bottom: -1px;
                     // margin-top: 20px;
                     h2 {
                         margin: 0;
                         line-height: 38px;
                         padding-left: 10px;
                     }
                     .btn {
                         margin: 0;
                     }
                     background: @grey6;
                     display: block;
                     padding: 5px;
                 }
                 .diffset-heading-warning {
                     background: @alert3-inner;
                     border: 1px solid @alert3;
                 }
                 &.diffset-comments-disabled {
                     .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
                         display: none !important;
                     }
                 }
             }
             .filelist {
                 .pill {
                     display: block;
                     float: left;
                     padding: @pill-padding-small;
                 }
             }
             .pill {
                 display: block;
                 float: left;
                 padding: @pill-padding;
             }
             .pill-group {
                 .pill {
                     opacity: .8;
                     margin-right: 3px;
                     font-size: 12px;
                     font-weight: normal;
                     &:first-child {
                         border-radius: @border-radius 0 0 @border-radius;
                     }
                     &:last-child {
                         border-radius: 0 @border-radius @border-radius 0;
                     }
                     &:only-child {
                         border-radius: @border-radius;
                         margin-right: 0;
                     }
                 }
             }
             /* Main comments*/
             #comments {
                 .comment-selected {
                     border-left: 6px solid @comment-highlight-color;
                     padding-left: 3px;
                     margin-left: -9px;
                 }
             }
             .filediff {
                 border: 1px solid @grey5;
                 /* START OVERRIDES */
                 .code-highlight {
                     border: none;  // TODO: remove this border from the global
                                    // .code-highlight, it doesn't belong there
                 }
                 label {
                     margin: 0; // TODO: remove this margin definition from global label
                                // it doesn't belong there - if margin on labels
                                // are needed for a form they should be defined
                                // in the form's class
                 }
                 /* END OVERRIDES */
                 * {
                     box-sizing: border-box;
                 }
                 .filediff-anchor {
                     visibility: hidden;
                 }
                 &:hover {
                     .filediff-anchor {
                         visibility: visible;
                     }
                 }
                 .filediff-collapse-indicator {
                     border-style: solid;
                     float: left;
                     margin: 4px 0px 0 0;
                     cursor: pointer;
                 }
                 .filediff-heading {
                     background: @grey7;
                     cursor: pointer;
                     display: block;
                     padding: 5px 10px;
                 }
                 .filediff-heading:after {
                     content: "";
                     display: table;
                     clear: both;
                 }
                 .filediff-heading:hover {
                     background: #e1e9f4 !important;
                 }
                 .filediff-menu {
                     float: right;
                     text-align: right;
                     padding: 5px 5px 5px 0px;
                     &> a,
                     &> span {
                         padding: 1px;
                     }
                 }
                 .filediff-collapse-button, .filediff-expand-button {
                     cursor: pointer;
                 }
                 .filediff-collapse-button {
                     display: inline;
                 }
                 .filediff-expand-button {
                     display: none;
                 }
                 .filediff-collapsed .filediff-collapse-button {
                     display: none;
                 }
                 .filediff-collapsed .filediff-expand-button {
                     display: inline;
                 }
                 /**** COMMENTS ****/
                 .filediff-menu {
                     .show-comment-button {
                         display: none;
                     }
                 }
                 &.hide-comments {
                     .inline-comments {
                         display: none;
                     }
                     .filediff-menu {
                         .show-comment-button {
                             display: inline;
                         }
                         .hide-comment-button {
                             display: none;
                         }
                     }
                 }
                 .hide-line-comments {
                     .inline-comments {
                         display: none;
                     }
                 }
                 /**** END COMMENTS ****/
             }
             .filediff, .filelist {
                 .pill {
                     &[op="name"] {
                         background: none;
                         opacity: 1;
                         color: white;
                     }
                     &[op="limited"] {
                         background: @grey2;
                         color: white;
                     }
                     &[op="binary"] {
                         background: @color7;
                         color: white;
                     }
                     &[op="modified"] {
                         background: @alert1;
                         color: white;
                     }
                     &[op="renamed"] {
                         background: @color4;
                         color: white;
                     }
                     &[op="copied"] {
                         background: @color4;
                         color: white;
                     }
                     &[op="mode"] {
                         background: @grey3;
                         color: white;
                     }
                     &[op="symlink"] {
                         background: @color8;
                         color: white;
                     }
                     &[op="added"] { /* added lines */
                         background: @alert1;
                         color: white;
                     }
                     &[op="deleted"] { /* deleted lines */
                         background: @alert2;
                         color: white;
                     }
                     &[op="created"] { /* created file */
                         background: @alert1;
                         color: white;
                     }
                     &[op="removed"] { /* deleted file */
                         background: @color5;
                         color: white;
                     }
                 }
             }
             .filediff-outdated {
                 padding: 8px 0;
                 .filediff-heading {
                     opacity: .5;
                 }
             }
             table.cb {
                 width: 100%;
                 border-collapse: collapse;
                 .cb-text {
                     padding: @cb-text-padding;
                 }
                 .cb-hunk {
                     padding: @cb-text-padding;
                 }
                 .cb-expand {
                     display: none;
                 }
                 .cb-collapse {
                     display: inline;
                 }
                 &.cb-collapsed {
                     .cb-line {
                         display: none;
                     }
                     .cb-expand {
                         display: inline;
                     }
                     .cb-collapse {
                         display: none;
                     }
                     .cb-hunk {
                         display: none;
                     }
                 }
                 /* intentionally general selector since .cb-line-selected must override it
                    and they both use !important since the td itself may have a random color
                    generated by annotation blocks. TLDR: if you change it, make sure
                    annotated block selection and line selection in file view still work */
                 .cb-line-fresh .cb-content {
                     background: white !important;
                 }
                 .cb-warning {
                     background: #fff4dd;
                 }
                 &.cb-diff-sideside {
                     td {
                         &.cb-content {
                             width: 50%;
                         }
                     }
                 }
                 tr {
                     &.cb-annotate {
                         border-top: 1px solid #eee;
                     }
                     &.cb-comment-info {
                         border-top: 1px solid #eee;
                         color: rgba(0, 0, 0, 0.3);
                         background: #edf2f9;
                         td {
                         }
                     }
                     &.cb-hunk {
-                        font-family: @font-family-monospace;
+                        font-family: @text-monospace;
                         color: rgba(0, 0, 0, 0.3);
                         td {
                             &:first-child {
                                 background: #edf2f9;
                             }
                             &:last-child {
                                 background: #f4f7fb;
                             }
                         }
                     }
                 }
                 td {
                     vertical-align: top;
                     padding: 0;
                     &.cb-content {
                         font-size: 12.35px;
                         &.cb-line-selected .cb-code {
                             background: @comment-highlight-color !important;
                         }
                         span.cb-code {
                             line-height: @cb-line-height;
                             padding-left: @cb-line-code-padding;
                             padding-right: @cb-line-code-padding;
                             display: block;
                             white-space: pre-wrap;
-                            font-family: @font-family-monospace;
+                            font-family: @text-monospace;
                             word-break: break-all;
                             .nonl {
                                 color: @color5;
                             }
                             .cb-action {
                                 &:before {
                                     content: "  ";
                                 }
                                 &.cb-deletion:before {
                                     content: "- ";
                                 }
                                 &.cb-addition:before {
                                     content: "+ ";
                                 }
                             }
                         }
                         &> button.cb-comment-box-opener {
                             padding: 2px 2px 1px 3px;
                             margin-left: -6px;
                             margin-top: -1px;
                             border-radius: @border-radius;
                             position: absolute;
                             display: none;
                         }
                         .cb-comment {
                             margin-top: 10px;
                             white-space: normal;
                         }
                     }
                     &:hover {
                         button.cb-comment-box-opener {
                             display: block;
                         }
                         &+ td button.cb-comment-box-opener {
                             display: block
                         }
                     }
                     &.cb-data {
                         text-align: right;
                         width: 30px;
-                        font-family: @font-family-monospace;
+                        font-family: @text-monospace;
                         .icon-comment {
                             cursor: pointer;
                         }
                         &.cb-line-selected {
                             background: @comment-highlight-color !important;
                         }
                         &.cb-line-selected > div {
                             display: block;
                             background: @comment-highlight-color !important;
                             line-height: @cb-line-height;
                             color: rgba(0, 0, 0, 0.3);
                         }
                     }
                     &.cb-lineno {
                         padding: 0;
                         width: 50px;
                         color: rgba(0, 0, 0, 0.3);
                         text-align: right;
                         border-right: 1px solid #eee;
-                        font-family: @font-family-monospace;
+                        font-family: @text-monospace;
                         -webkit-user-select: none;
                         -moz-user-select: none;
                         user-select: none;
                         a::before {
                             content: attr(data-line-no);
                         }
                         &.cb-line-selected {
                             background: @comment-highlight-color !important;
                         }
                         a {
                             display: block;
                             padding-right: @cb-line-code-padding;
                             padding-left: @cb-line-code-padding;
                             line-height: @cb-line-height;
                             color: rgba(0, 0, 0, 0.3);
                         }
                     }
                     &.cb-empty {
                         background: @grey7;
                     }
                     ins {
                         color: black;
                         background: #a6f3a6;
                         text-decoration: none;
                     }
                     del {
                         color: black;
                         background: #f8cbcb;
                         text-decoration: none;
                     }
                     &.cb-addition {
                         background: #ecffec;
                         &.blob-lineno {
                             background: #ddffdd;
                         }
                     }
                     &.cb-deletion {
                         background: #ffecec;
                         &.blob-lineno {
                             background: #ffdddd;
                         }
                     }
                     &.cb-annotate-message-spacer {
                          width:8px;
                          padding: 1px 0px 0px 3px;
                     }
                     &.cb-annotate-info {
                         width: 320px;
                         min-width: 320px;
                         max-width: 320px;
                         padding: 5px 2px;
                         font-size: 13px;
                         .cb-annotate-message {
                             padding: 2px 0px 0px 0px;
                             white-space: pre-line;
                             overflow: hidden;
                         }
                         .rc-user {
                             float: none;
                             padding: 0 6px 0 17px;
                             min-width: unset;
                             min-height: unset;
                         }
                     }
                     &.cb-annotate-revision {
                         cursor: pointer;
                         text-align: right;
                         padding: 1px 3px 0px 3px;
                     }
                 }
             }

rhodecode/public/css/comments.less

0 +1 -1

             // comments.less
             // For use in RhodeCode applications;
             // see style guide documentation for guidelines.
             // Comments
             @comment-outdated-opacity: 0.6;
             .comments {
                 width: 100%;
             }
             tr.inline-comments div {
                 max-width: 100%;
                 p {
                     white-space: normal;
                 }
                 code, pre, .code, dd {
                     overflow-x: auto;
                     width: 1062px;
                 }
                 dd {
                     width: auto;
                 }
             }
             #injected_page_comments {
                 .comment-previous-link,
                 .comment-next-link,
                 .comment-links-divider {
                     display: none;
                 }
             }
             .add-comment {
                 margin-bottom: 10px;
             }
             .hide-comment-button .add-comment {
                 display: none;
             }
             .comment-bubble {
                 color: @grey4;
                 margin-top: 4px;
                 margin-right: 30px;
                 visibility: hidden;
             }
             .comment-label {
                 float: left;
                 padding: 0.4em 0.4em;
                 margin: 3px 5px 0px -10px;
                 display: inline-block;
                 min-height: 0;
                 text-align: center;
                 font-size: 10px;
                 line-height: .8em;
                 font-family: @text-italic;
                 background: #fff none;
                 color: @grey4;
                 border: 1px solid @grey4;
                 white-space: nowrap;
                 text-transform: uppercase;
                 min-width: 40px;
                 &.todo {
                     color: @color5;
                     font-family: @text-bold-italic;
                 }
                 .resolve {
                     cursor: pointer;
                     text-decoration: underline;
                 }
                 .resolved {
                     text-decoration: line-through;
                     color: @color1;
                 }
                 .resolved a {
                     text-decoration: line-through;
                     color: @color1;
                 }
                 .resolve-text {
                     color: @color1;
                     margin: 2px 8px;
                     font-family: @text-italic;
                 }
             }
             .has-spacer-after {
                 &:after {
                     content: ' | ';
                     color: @grey5;
                 }
             }
             .has-spacer-before {
                 &:before {
                     content: ' | ';
                     color: @grey5;
                 }
             }
             .comment {
                 &.comment-general {
                     border: 1px solid @grey5;
                     padding: 5px 5px 5px 5px;
                 }
                 margin: @padding 0;
                 padding: 4px 0 0 0;
                 line-height: 1em;
                 .rc-user {
                     min-width: 0;
                     margin: 0px .5em 0 0;
                     .user {
                         display: inline;
                     }
                 }
                 .meta {
                     position: relative;
                     width: 100%;
                     border-bottom: 1px solid @grey5;
                     margin: -5px 0px;
                     line-height: 24px;
                     &:hover .permalink {
                         visibility: visible;
                         color: @rcblue;
                     }
                 }
                 .author,
                 .date {
                     display: inline;
                     &:after {
                         content: ' | ';
                         color: @grey5;
                     }
                 }
                 .author-general img {
                     top: 3px;
                 }
                 .author-inline img {
                     top: 3px;
                 }
                 .status-change,
                 .permalink,
                 .changeset-status-lbl {
                     display: inline;
                 }
                 .permalink {
                     visibility: hidden;
                 }
                 .comment-links-divider {
                     display: inline;
                 }
                 .comment-links-block {
                     float:right;
                     text-align: right;
                     min-width: 85px;
                     [class^="icon-"]:before,
                     [class*=" icon-"]:before {
                         margin-left: 0;
                         margin-right: 0;
                     }
                 }
                 .comment-previous-link {
                     display: inline-block;
                     .arrow_comment_link{
                         cursor: pointer;
                         i {
                             font-size:10px;
                         }
                     }
                     .arrow_comment_link.disabled {
                         cursor: default;
                         color: @grey5;
                     }
                 }
                 .comment-next-link {
                     display: inline-block;
                     .arrow_comment_link{
                         cursor: pointer;
                         i {
                             font-size:10px;
                         }
                     }
                     .arrow_comment_link.disabled {
                         cursor: default;
                         color: @grey5;
                     }
                 }
                 .flag_status {
                     display: inline-block;
                     margin: -2px .5em 0 .25em
                 }
                 .delete-comment {
                     display: inline-block;
                     color: @rcblue;
                     &:hover {
                         cursor: pointer;
                     }
                 }
                 .text {
                     clear: both;
                     .border-radius(@border-radius);
                     .box-sizing(border-box);
                     .markdown-block p,
                     .rst-block p {
                         margin: .5em 0 !important;
                       // TODO: lisa: This is needed because of other rst !important rules :[
                     }
                 }
                 .pr-version {
                     float: left;
                     margin: 0px 4px;
                 }
                 .pr-version-inline {
                     float: left;
                     margin: 0px 4px;
                 }
                 .pr-version-num {
                     font-size: 10px;
                 }
             }
             @comment-padding: 5px;
             .general-comments {
                 .comment-outdated {
                     opacity: @comment-outdated-opacity;
                 }
             }
             .inline-comments {
                 border-radius: @border-radius;
                 .comment {
                     margin: 0;
                     border-radius: @border-radius;
                 }
                 .comment-outdated {
                     opacity: @comment-outdated-opacity;
                 }
                 .comment-inline {
                     background: white;
                     padding: @comment-padding @comment-padding;
                     border: @comment-padding solid @grey6;
                     .text {
                         border: none;
                     }
                     .meta {
                         border-bottom: 1px solid @grey6;
                         margin: -5px 0px;
                         line-height: 24px;
                     }
                 }
                 .comment-selected {
                     border-left: 6px solid @comment-highlight-color;
                 }
                 .comment-inline-form {
                     padding: @comment-padding;
                     display: none;
                 }
                 .cb-comment-add-button {
                     margin: @comment-padding;
                 }
                  /* hide add comment button when form is open */
                 .comment-inline-form-open ~ .cb-comment-add-button {
                     display: none;
                 }
                 .comment-inline-form-open {
                     display: block;
                 }
                  /* hide add comment button when form but no comments */
                 .comment-inline-form:first-child + .cb-comment-add-button {
                     display: none;
                 }
                  /* hide add comment button when no comments or form */
                 .cb-comment-add-button:first-child {
                     display: none;
                 }
                  /* hide add comment button when only comment is being deleted */
                 .comment-deleting:first-child + .cb-comment-add-button {
                     display: none;
                 }
             }
             .show-outdated-comments {
                 display: inline;
                 color: @rcblue;
             }
             // Comment Form
             div.comment-form {
                 margin-top: 20px;
             }
             .comment-form strong {
                 display: block;
                 margin-bottom: 15px;
             }
             .comment-form textarea {
                 width: 100%;
                 height: 100px;
-                font-family: 'Monaco', 'Courier', 'Courier New', monospace;
+                font-family: @text-monospace;
             }
             form.comment-form {
                 margin-top: 10px;
                 margin-left: 10px;
             }
             .comment-inline-form .comment-block-ta,
             .comment-form .comment-block-ta,
             .comment-form .preview-box {
                 .border-radius(@border-radius);
                 .box-sizing(border-box);
                 background-color: white;
             }
             .comment-form-submit {
                 margin-top: 5px;
                 margin-left: 525px;
             }
             .file-comments {
                 display: none;
             }
             .comment-form .preview-box.unloaded,
             .comment-inline-form .preview-box.unloaded {
                 height: 50px;
                 text-align: center;
                 padding: 20px;
                 background-color: white;
             }
             .comment-footer {
                 position: relative;
                 width: 100%;
                 min-height: 42px;
                 .status_box,
                 .cancel-button {
                     float: left;
                     display: inline-block;
                 }
                 .action-buttons {
                     float: right;
                     display: inline-block;
                 }
                 .action-buttons-extra {
                     display: inline-block;
                 }
             }
             .comment-form {
                 .comment {
                     margin-left: 10px;
                 }
                 .comment-help {
                     color: @grey4;
                     padding: 5px 0 5px 0;
                 }
                 .comment-title {
                     padding: 5px 0 5px 0;
                 }
                 .comment-button {
                     display: inline-block;
                 }
                 .comment-button-input {
                     margin-right: 0;
                 }
                 .comment-footer {
                     margin-bottom: 110px;
                     margin-top: 10px;
                 }
             }
             .comment-form-login {
                 .comment-help {
                     padding: 0.9em; //same as the button
                 }
                 div.clearfix {
                     clear: both;
                     width: 100%;
                     display: block;
                 }
             }
             .comment-type {
                 margin: 0px;
                 border-radius: inherit;
                 border-color: @grey6;
             }
             .preview-box {
                 min-height: 105px;
                 margin-bottom: 15px;
                 background-color: white;
                 .border-radius(@border-radius);
                 .box-sizing(border-box);
             }
             .add-another-button {
                 margin-left: 10px;
                 margin-top: 10px;
                 margin-bottom: 10px;
             }
             .comment .buttons {
                 float: right;
                 margin: -1px 0px 0px 0px;
             }
             // Inline Comment Form
             .injected_diff .comment-inline-form,
             .comment-inline-form {
                 background-color: white;
                 margin-top: 10px;
                 margin-bottom: 20px;
             }
             .inline-form {
                 padding: 10px 7px;
             }
             .inline-form div {
                 max-width: 100%;
             }
             .overlay {
                 display: none;
                 position: absolute;
                 width: 100%;
                 text-align: center;
                 vertical-align: middle;
                 font-size: 16px;
                 background: none repeat scroll 0 0 white;
                 &.submitting {
                     display: block;
                     opacity: 0.5;
                     z-index: 100;
                 }
             }
             .comment-inline-form .overlay.submitting .overlay-text {
                 margin-top: 5%;
             }
             .comment-inline-form .clearfix,
             .comment-form .clearfix {
                 .border-radius(@border-radius);
                 margin: 0px;
             }
             .comment-inline-form .comment-footer {
                 margin: 10px 0px 0px 0px;
             }
             .hide-inline-form-button {
                 margin-left: 5px;
             }
             .comment-button .hide-inline-form {
                 background: white;
             }
             .comment-area {
                 padding: 8px 12px;
                 border: 1px solid @grey5;
                 .border-radius(@border-radius);
                 .resolve-action {
                     padding: 1px 0px 0px 6px;
                 }
             }
             .comment-area-header .nav-links {
                 display: flex;
                 flex-flow: row wrap;
                 -webkit-flex-flow: row wrap;
                 width: 100%;
             }
             .comment-area-footer {
                 display: flex;
             }
             .comment-footer .toolbar {
             }
             .nav-links {
                 padding: 0;
                 margin: 0;
                 list-style: none;
                 height: auto;
                 border-bottom: 1px solid @grey5;
             }
             .nav-links li {
                 display: inline-block;
             }
             .nav-links li:before {
                 content: "";
             }
             .nav-links li a.disabled {
                 cursor: not-allowed;
             }
             .nav-links li.active a {
                 border-bottom: 2px solid @rcblue;
                 color: #000;
                 font-weight: 600;
             }
             .nav-links li a {
                 display: inline-block;
                 padding: 0px 10px 5px 10px;
                 margin-bottom: -1px;
                 font-size: 14px;
                 line-height: 28px;
                 color: #8f8f8f;
                 border-bottom: 2px solid transparent;
             }
             .toolbar-text {
                 float: left;
                 margin: -5px 0px 0px 0px;
                 font-size: 12px;
             }

rhodecode/public/css/legacy_code_styles.less

0 +2 -2

             /** MODAL **/
             .modal-open {
               overflow:hidden;
             }
             body.modal-open, .modal-open .navbar-fixed-top, .modal-open .navbar-fixed-bottom {
               margin-right:15px;
             }
             .modal {
               position:fixed;
               top:0;
               right:0;
               bottom:0;
               left:0;
               z-index:1040;
               display:none;
               overflow-y:scroll;
             	&.fade .modal-dialog {
              		-webkit-transform:translate(0,-25%);
              		-ms-transform:translate(0,-25%);
              		transform:translate(0,-25%);
              		-webkit-transition:-webkit-transform 0.3s ease-out;
              		-moz-transition:-moz-transform 0.3s ease-out;
              		-o-transition:-o-transform 0.3s ease-out;
              		transition:transform 0.3s ease-out;
             	}
             	&.in .modal-dialog {
             		-webkit-transform:translate(0,0);
             		-ms-transform:translate(0,0);
             		transform:translate(0,0);
             	}
             }
             .modal-dialog {
               z-index:1050;
               width:auto;
               padding:10px;
               margin-right:auto;
               margin-left:auto;
             }
             .modal-content {
               position:relative;
               background-color:#ffffff;
               border: @border-thickness solid rgba(0,0,0,0.2);
               .border-radius(@border-radius);
               outline:none;
               -webkit-box-shadow:0 3px 9px rgba(0,0,0,0.5);
               box-shadow:0 3px 9px rgba(0,0,0,0.5);
               background-clip:padding-box;
             }
             .modal-backdrop {
               position:fixed;
               top:0;
               right:0;
               bottom:0;
               left:0;
               z-index:1030;
               background-color:#000000;
             	&.modal-backdrop.fade {
             		opacity:0;
             		filter:alpha(opacity=0);
             	}
             	&.in {
             		opacity:0.5;
             		filter:alpha(opacity=50);
             	}
             }
             .modal-header {
               min-height:16.428571429px;
               padding:15px;
               border-bottom: @border-thickness solid @grey6;
               .close {
                 margin-top:-2px;
               }
             }
             .modal-title {
               margin:0;
               line-height:1.428571429;
             }
             .modal-body {
               position:relative;
               padding:20px;
             }
             .modal-footer {
               padding:19px 20px 20px;
               margin-top:15px;
               text-align:right;
               border-top:1px solid #e5e5e5;
               .btn + .btn {
                 margin-bottom:0;
                 margin-left:5px;
               }
               .btn-group .btn + .btn {
                 margin-left:-1px;
               }
               .btn-block + .btn-block {
                 margin-left:0;
               }
             	&:before {
             		display:table;
             		content:" ";
             	}
             	&:after {
             		display:table;
             		content:" ";
             		clear:both;
             	}
             }
             /** MARKDOWN styling **/
             div.markdown-block {
                 clear: both;
                 overflow: hidden;
                 margin: 0;
                 padding: 3px 15px 3px;
             }
             div.markdown-block h1,
             div.markdown-block h2,
             div.markdown-block h3,
             div.markdown-block h4,
             div.markdown-block h5,
             div.markdown-block h6 {
                 border-bottom: none !important;
                 padding: 0 !important;
                 overflow: visible !important;
             }
             div.markdown-block h1 {
                 font-size: 32px;
                 margin: 15px 0 15px 0 !important;
                 padding-bottom: 5px !important;
             }
             div.markdown-block h2 {
                 font-size: 24px !important;
                 margin: 34px 0 10px 0 !important;
                 border-top: 3px #e6e5e5 solid !important;
                 padding-top: 15px !important;
                 padding-bottom: 8px !important;
             }
             div.markdown-block h3 {
                 font-size: 18px !important;
                 margin: 30px 0 8px 0 !important;
                 padding-bottom: 2px !important;
             }
             div.markdown-block h4 {
                 font-size: 13px !important;
                 margin: 18px 0 3px 0 !important;
             }
             div.markdown-block h5 {
                 font-size: 12px !important;
                 margin: 15px 0 3px 0 !important;
             }
             div.markdown-block h6 {
                 font-size: 12px;
                 color: #777777;
                 margin: 15px 0 3px 0 !important;
             }
             div.markdown-block hr {
                 border: 0;
                 color: #e6e5e5;
                 background-color: #e6e5e5;
                 height: 3px;
                 margin-bottom: 13px;
             }
             div.markdown-block ol,
             div.markdown-block ul,
             div.markdown-block p,
             div.markdown-block blockquote,
             div.markdown-block dl,
             div.markdown-block li,
             div.markdown-block table {
                 margin: 3px 0px 13px 0px !important;
                 color: #424242 !important;
                 font-size: 13px !important;
-                font-family: "Helvetica" !important;
+                font-family: @text-regular;
                 font-weight: normal  !important;
                 overflow: visible !important;
                 line-height: 140% !important;
             }
             div.markdown-block pre {
               margin: 3px 0px 13px 0px !important;
               padding: .5em;
               color: #424242 !important;
               font-size: 13px !important;
               overflow: visible !important;
               line-height: 140% !important;
               background-color: @grey7;
             }
             div.markdown-block img {
               border-style: none;
               background-color: #fff;
             }
             div.markdown-block strong {
               font-weight: 600;
               margin: 0;
             }
             div.markdown-block ul,
             div.markdown-block ol {
                 padding-left: 30px !important;
                 margin-top: 0px !important;
                 margin-bottom: 18px !important;
             }
             div.markdown-block ul li,
             div.markdown-block ol li {
                 list-style: disc !important;
                 margin: 6px !important;
                 padding: 0 !important;
             }
             div.markdown-block ol li {
                 list-style: decimal !important;
             }
             /*
             div.markdown-block a,
             div.markdown-block a:visited {
                 color: #4183C4 !important;
                 background-color: inherit;
                 text-decoration: none;
             }
             */
             div.markdown-block #message {
                 .border-radius(@border-radius);
                 border: @border-thickness solid @grey5;
                 display: block;
                 width: 100%;
                 height: 60px;
                 margin: 6px 0px;
             }
             div.markdown-block button,
             div.markdown-block #ws {
                 font-size: @basefontsize;
                 padding: 4px 6px;
                 .border-radius(@border-radius);
                 border: @border-thickness solid @grey5;
                 background-color: @grey6;
             }
             div.markdown-block code,
             div.markdown-block pre,
             div.markdown-block #ws,
             div.markdown-block #message {
-                font-family: Monaco;
+                font-family: @text-monospace;
                 font-size: 11px;
                 .border-radius(@border-radius);
                 background-color: white;
                 color: @grey3;
             }
             div.markdown-block code {
                 border: @border-thickness solid @grey6;
                 margin: 0 2px;
                 padding: 0 5px;
             }
             div.markdown-block pre {
                 border: @border-thickness solid @grey5;
                 overflow: auto;
                 padding: .5em;
                 background-color: @grey7;
             }
             div.markdown-block pre > code {
                 border: 0;
                 margin: 0;
                 padding: 0;
             }
             /** RST STYLE **/
             div.rst-block {
                 clear: both;
                 overflow: hidden;
                 margin: 0;
                 padding: 3px 15px 3px;
             }
             div.rst-block h2 {
                 font-weight: normal;
             }
             div.rst-block  h1,
             div.rst-block  h2,
             div.rst-block  h3,
             div.rst-block  h4,
             div.rst-block  h5,
             div.rst-block  h6 {
                 border-bottom: 0 !important;
                 margin: 0 !important;
                 padding: 0 !important;
                 line-height: 1.5em !important;
             }
             div.rst-block  h1:first-child {
                 padding-top: .25em !important;
             }
             div.rst-block  h2,
             div.rst-block  h3 {
                 margin: 1em 0 !important;
             }
             div.rst-block  h2 {
                 margin-top: 1.5em !important;
                 border-top: 4px solid #e0e0e0 !important;
                 padding-top: .5em !important;
             }
             div.rst-block  p {
                 color: black !important;
                 margin: 1em 0 !important;
                 line-height: 1.5em !important;
             }
             div.rst-block  ul {
                 list-style: disc !important;
                 margin: 1em 0 1em 2em !important;
                 clear: both;
             }
             div.rst-block  ol {
                 list-style: decimal;
                 margin: 1em 0 1em 2em !important;
             }
             div.rst-block pre,
             div.rst-block code {
                 font: 12px "Bitstream Vera Sans Mono","Courier",monospace;
             }
             div.rst-block code {
                 font-size: 12px !important;
                 background-color: ghostWhite !important;
                 color: #444 !important;
                 padding: 0 .2em !important;
                 border: 1px solid #dedede !important;
             }
             div.rst-block pre code {
                 padding: 0 !important;
                 font-size: 12px !important;
                 background-color: #eee !important;
                 border: none !important;
             }
             div.rst-block pre {
                 margin: 1em 0;
                 padding: @padding;
                 border: 1px solid @grey6;
                 .border-radius(@border-radius);
                 overflow: auto;
                 font-size: 12px;
                 color: #444;
                 background-color: @grey7;
             }

rhodecode/public/css/main-content.less

0 +1 -1

             // Contains the style definitions used for .main-content
             // elements which are mainly around the admin settings.
             // TODO: johbo: Integrate in a better way, this is for "main content" which
             // should not have a limit on the width.
             .main-content-full {
                 clear: both;
             }
             .main-content {
                 max-width: @maincontent-maxwidth;
                 h3,
                 // TODO: johbo: Change templates to use h3 instead of h4 here
                 h4 {
                     line-height: 1em;
                 }
                 // TODO: johbo: Check if we can do that on a global level
                 table {
                     th {
                         padding: 0;
                     }
                     td.field{
                             .help-block{
                                 margin-left: 0;
                             }
                     }
                 }
                 // TODO: johbo: Tweak this into the general styling, for a full width
                 // textarea
                 .textarea-full {
                     // 2x 10px padding and 2x 1px border
                     margin-right: 22px;
                 }
             }
             // TODO: johbo: duplicated, think about a mixins.less
             .block-left{
                 float: left;
             }
             .form {
                 .checkboxes {
                     // TODO: johbo: Should be changed in .checkboxes already
                     width: auto;
                 }
                 // TODO: johbo: some settings pages are broken and don't have the .buttons
                 // inside the .fields, tweak those templates and remove this.
                 .buttons {
                     margin-top: @textmargin;
                 }
                 .help-block {
                     display: block;
                     margin-left: @label-width;
                     &.pre-formatting {
                         white-space: pre;
                     }
                 }
                 .action_button {
                     color: @grey4;
                 }
             }
             .main-content-full-width {
                 .main-content;
                 width: 100%;
                 min-width: 100%;
             }
             .main-content-auto-width {
                 .main-content;
                 width: auto;
                 min-width: 100%;
                 max-width: inherit;
             }
             .field {
                 clear: left;
                 margin-bottom: @padding;
             }
             .input-monospace {
-                font-family: @font-family-monospace;
+                font-family: @text-monospace;
             }
             .fields {
             	label {
             		color: @grey2;
             	}
                 .field {
                     clear: right;
                     margin-bottom: @textmargin;
                     width: 100%;
                     .label {
                         float: left;
                         margin-right: @form-vertical-margin;
                         margin-top: 0;
                         padding-top: @input-padding-px + @border-thickness-inputs;
                         width: @label-width - @form-vertical-margin;
                     }
                     // used in forms for fields that show just text
                     .label-text {
                         .label;
                         padding-top: 5px;
                     }
                     .label-branch-perm {
                         .label;
                         width: 115px;
                     }
                     // Used to position content on the right side of a .label
                     .content,
                     .side-by-side-selector {
                         padding-top: @input-padding-px + @input-border-thickness;
                     }
                     .checkboxes,
                     .input,
                     .select,
                     .textarea,
                     .content {
                         float: none;
                         margin-left: @label-width;
                         .help-block {
                             margin-left: 0;
                         }
                     }
                     .input-branch-perm {
                         .input;
                         margin-left: 140px;
                     }
                     .input-branch-perm-order {
                         width: 40px;
                     }
                     .checkboxes,
                     .input,
                     .select {
                         .help-block {
                             display: block;
                         }
                     }
                     .checkboxes,
                     .radios {
                         // TODO: johbo: We get a 4px margin from the from-bootstrap,
                         // compensating here to align well with labels on the left.
                         padding-top: @input-padding-px + @input-border-thickness - 3px;
                     }
                     .checkbox,
                     .radio {
                         display: block;
                         width: auto;
                     }
                     .checkbox + .checkbox {
                         display: block;
                     }
                     .input,
                     .select {
                         .help-block,
                         .info-block {
                             margin-top: @form-vertical-margin / 2;
                         }
                     }
                     .input {
                         .branch-perm {
                             width: 80px;
                         }
                         .medium {
                             width: @fields-input-m;
                         }
                         .large {
                             width: @fields-input-l;
                         }
                         .text-as-placeholder {
                             padding-top: @input-padding-px + @border-thickness-inputs;
                         }
                     }
                     // TODO: johbo: Try to find a better integration of this bit.
                     // When using a select2 inside of a field, it should not have the
                     // top margin.
                     .select .drop-menu {
                         margin-top: 0;
                     }
                     .textarea {
                         float: none;
                         textarea {
                             // TODO: johbo: From somewhere we get a clear which does
                             // more harm than good here.
                             clear: none;
                         }
                         .CodeMirror {
                            // TODO: johbo: Tweak to position the .help-block nicer,
                            // figure out how to apply for .text-block instead.
                             margin-bottom: 10px;
                         }
                         // TODO: johbo: Check if we can remove the grey background on
                         // the global level and remove this if possible.
                         .help-block {
                             background: transparent;
                             padding: 0;
                         }
                     }
                     &.tag_patterns,
                     &.branch_patterns {
                         input {
                             max-width: 430px;
                         }
                     }
                 }
                 .field-sm {
                     .label {
                         padding-top: @input-padding-px / 2 + @input-border-thickness;
                     }
                     .checkboxes,
                     .radios {
                         // TODO: johbo: We get a 4px margin from the from-bootstrap,
                         // compensating here to align well with labels on the left.
                         padding-top: @input-padding-px / 2 + @input-border-thickness - 3px;
                     }
                 }
                 .field.customhooks {
                     .label {
                         padding-top: 0;
                     }
                     .input-wrapper {
                         padding-right: 25px;
                         input {
                             width: 100%;
                         }
                     }
                     .input {
                         padding-right: 25px;
                     }
                 }
                 .buttons {
                     // TODO: johbo: define variable for this value.
                     // Note that this should be 40px but since most elements add some
                     // space in the bottom, we are with 20 closer to 40.
                     margin-top: 20px;
             		clear: both;
                     margin-bottom: @padding;
                 }
                 .desc{
                     margin-right: @textmargin;
                 }
                 input,
                 .drop-menu {
                     margin-right: @padding/3;
                 }
             }
             .form-vertical .fields .field {
                 .label {
                     float: none;
                     width: auto;
                 }
                 .checkboxes,
                 .input,
                 .select,
                 .textarea {
                     margin-left: 0;
                 }
                 // TODO: johbo: had to tweak the width here to make it big enough for
                 // the license.
                 .textarea.editor {
                     max-width: none;
                 }
                 .textarea.large textarea {
                     min-height: 200px;
                 }
                 .help-block {
                     margin-left: 0;
                 }
             }
             .main-content {
                 .block-left;
                 .section {
                     margin-bottom: @space;
                 }
                 // Table aligning same way as forms in admin section, e.g.
                 // python packages table
                 table.formalign {
                     float: left;
                     width: auto;
                     .label {
                         width: @label-width;
                     }
                 }
                 table.issuetracker {
                     color: @text-color;
                     .issue-tracker-example {
                         color: @grey4;
                     }
                 }
                 .side-by-side-selector{
                     .left-group,
                     .middle-group,
                     .right-group{
                         float: left;
                     }
                     .left-group,
                     .right-group{
                         width: 45%;
                         text-align: center;
                         label{
                             width: 100%;
                             text-align: left;
                         }
                         select{
                             width: 100%;
                             background: none;
                             border-color: @border-highlight-color;
                             color: @text-color;
                             font-family: @text-light;
                             font-size: @basefontsize;
                             color: @grey1;
                             padding: @textmargin/2;
                         }
                         select:after{
                             content: "";
                         }
                     }
                     .middle-group{
                         width: 10%;
                         text-align: center;
                         padding-top: 4em;
                         i {
                             font-size: 18px;
                             cursor: pointer;
                             line-height: 2em;
                         }
                     }
                 }
                 .permissions_boxes{
                     label, .label{
                         margin-right: @textmargin/2;
                     }
                 }
                 .radios{
                     label{
                         margin-right: @textmargin;
                     }
                 }
             }

rhodecode/public/css/main.less

0 +1 -1

             //Primary CSS
             //--- IMPORTS ------------------//
             @import 'helpers';
             @import 'mixins';
             @import 'rcicons';
             @import 'variables';
             @import 'bootstrap-variables';
             @import 'form-bootstrap';
             @import 'codemirror';
             @import 'legacy_code_styles';
             @import 'readme-box';
             @import 'progress-bar';
             @import 'type';
             @import 'alerts';
             @import 'buttons';
             @import 'tags';
             @import 'code-block';
             @import 'examples';
             @import 'login';
             @import 'main-content';
             @import 'select2';
             @import 'comments';
             @import 'panels-bootstrap';
             @import 'panels';
             @import 'deform';
             //--- BASE ------------------//
             .noscript-error {
                 top: 0;
                 left: 0;
                 width: 100%;
                 z-index: 101;
                 text-align: center;
                 font-family: @text-semibold;
                 font-size: 120%;
                 color: white;
                 background-color: @alert2;
                 padding: 5px 0 5px 0;
             }
             html {
                 display: table;
                 height: 100%;
                 width: 100%;
             }
             body {
                 display: table-cell;
                 width: 100%;
             }
             //--- LAYOUT ------------------//
             .hidden{
             	display: none !important;
             }
             .box{
             	float: left;
             	width: 100%;
             }
             .browser-header {
                 clear: both;
             }
             .main {
               clear: both;
               padding:0 0 @pagepadding;
               height: auto;
             	&:after { //clearfix
             		content:"";
             		clear:both;
             		width:100%;
             		display:block;
             	}
             }
             .action-link{
             	margin-left: @padding;
             	padding-left: @padding;
             	border-left: @border-thickness solid @border-default-color;
             }
             input + .action-link, .action-link.first{
             	border-left: none;
             }
             .action-link.last{
             	margin-right: @padding;
             	padding-right: @padding;
             }
             .action-link.active,
             .action-link.active a{
             	color: @grey4;
             }
             .action-link.disabled {
                 color: @grey4;
                 cursor: inherit;
             }
             .clipboard-action {
               cursor: pointer;
             }
             ul.simple-list{
             	list-style: none;
             	margin: 0;
             	padding: 0;
             }
             .main-content {
             	padding-bottom: @pagepadding;
             }
             .wide-mode-wrapper {
                 max-width:4000px !important;
             }
             .wrapper {
             	position: relative;
             	max-width: @wrapper-maxwidth;
             	margin: 0 auto;
             }
             #content {
                 clear: both;
                 padding: 0 @contentpadding;
             }
             .advanced-settings-fields{
             	input{
             		margin-left: @textmargin;
             		margin-right: @padding/2;
             	}
             }
             .cs_files_title {
                 margin: @pagepadding 0 0;
             }
             input.inline[type="file"] {
             	display: inline;
             }
             .error_page {
                 margin: 10% auto;
                 h1 {
                     color: @grey2;
                 }
                 .alert {
                     margin: @padding 0;
                 }
                 .error-branding {
                     font-family: @text-semibold;
                     color: @grey4;
                 }
                 .error_message {
                     font-family: @text-regular;
                 }
                 .sidebar {
                     min-height: 275px;
                     margin: 0;
                     padding: 0 0 @sidebarpadding @sidebarpadding;
                     border: none;
                 }
                 .main-content {
                     position: relative;
                     margin: 0 @sidebarpadding @sidebarpadding;
                     padding: 0 0 0 @sidebarpadding;
                     border-left: @border-thickness solid @grey5;
                     @media (max-width:767px) {
                         clear: both;
                         width: 100%;
                         margin: 0;
                         border: none;
                     }
                 }
                 .inner-column {
                     float: left;
                     width: 29.75%;
                     min-height: 150px;
                     margin: @sidebarpadding 2% 0 0;
                     padding: 0 2% 0 0;
                     border-right: @border-thickness solid @grey5;
                     @media (max-width:767px) {
                         clear: both;
                         width: 100%;
                         border: none;
                     }
                     ul {
                         padding-left: 1.25em;
                     }
                     &:last-child {
                         margin: @sidebarpadding 0 0;
                         border: none;
                     }
                     h4 {
                         margin: 0 0 @padding;
                         font-family: @text-semibold;
                     }
                 }
             }
             .error-page-logo {
                 width: 130px;
                 height: 160px;
             }
             // HEADER
             .header {
                 // TODO: johbo: Fix login pages, so that they work without a min-height
                 // for the header and then remove the min-height. I chose a smaller value
                 // intentionally here to avoid rendering issues in the main navigation.
                 min-height: 49px;
             	position: relative;
             	vertical-align: bottom;
             	padding: 0 @header-padding;
             	background-color: @grey2;
             	color: @grey5;
             	.title {
             		overflow: visible;
             	}
             	&:before,
             	&:after {
             		content: "";
             		clear: both;
             		width: 100%;
             	}
             	// TODO: johbo: Avoids breaking "Repositories" chooser
             	.select2-container .select2-choice .select2-arrow {
             	    display: none;
             	}
             }
             #header-inner {
             	&.title {
             		margin: 0;
             	}
             	&:before,
             	&:after {
             		content: "";
             		clear: both;
             	}
             }
             // Gists
             #files_data {
                 clear: both; //for firefox
             }
             #gistid {
                 margin-right: @padding;
             }
             // Global Settings Editor
             .textarea.editor {
             	float: left;
             	position: relative;
             	max-width: @texteditor-width;
             	select {
             		position: absolute;
             		top:10px;
             		right:0;
             	}
             	.CodeMirror {
             		margin: 0;
             	}
             	.help-block {
             		margin: 0 0 @padding;
             		padding:.5em;
             		background-color: @grey6;
                     &.pre-formatting {
                         white-space: pre;
                     }
             	}
             }
             ul.auth_plugins {
             	margin: @padding 0 @padding @legend-width;
             	padding: 0;
             	li {
             		margin-bottom: @padding;
                     line-height: 1em;
             		list-style-type: none;
             		.auth_buttons .btn {
             			margin-right: @padding;
             		}
                     &:before { content: none; }
             	}
             }
             // My Account PR list
             #show_closed {
                 margin: 0 1em 0 0;
             }
             .pullrequestlist {
                 .closed {
                     background-color: @grey6;
                 }
                 .td-status {
                     padding-left: .5em;
                 }
                 .log-container .truncate {
                     height: 2.75em;
                     white-space: pre-line;
                 }
                 table.rctable .user {
                     padding-left: 0;
                 }
                 table.rctable {
                     td.td-description,
                     .rc-user {
                         min-width: auto;
                     }
                 }
             }
             // Pull Requests
             .pullrequests_section_head {
             	display: block;
             	clear: both;
             	margin: @padding 0;
             	font-family: @text-bold;
             }
             .pr-origininfo, .pr-targetinfo {
                 position: relative;
                 .tag {
                     display: inline-block;
                     margin: 0 1em .5em 0;
                 }
                 .clone-url {
                     display: inline-block;
                     margin: 0 0 .5em 0;
                     padding: 0;
                     line-height: 1.2em;
                 }
             }
             .pr-mergeinfo {
                   min-width: 95% !important;
                   padding: 0 !important;
                   border: 0;
             }
             .pr-mergeinfo-copy {
                 padding: 0 0;
             }
             .pr-pullinfo {
                   min-width: 95% !important;
                   padding: 0 !important;
                   border: 0;
             }
             .pr-pullinfo-copy {
                 padding: 0 0;
             }
             #pr-title-input {
                 width: 72%;
                 font-size: 1em;
                 font-family: @text-bold;
                 margin: 0;
                 padding: 0 0 0 @padding/4;
                 line-height: 1.7em;
                 color: @text-color;
                 letter-spacing: .02em;
             }
             #pullrequest_title {
                 width: 100%;
                 box-sizing: border-box;
             }
             #pr_open_message {
                 border: @border-thickness solid #fff;
                 border-radius: @border-radius;
                 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
                 text-align: left;
                 overflow: hidden;
             }
             .pr-submit-button {
                 float: right;
                 margin: 0 0 0 5px;
             }
             .pr-spacing-container {
                 padding: 20px;
                 clear: both
             }
             #pr-description-input {
                 margin-bottom: 0;
             }
             .pr-description-label {
                 vertical-align: top;
             }
             .perms_section_head {
                 min-width: 625px;
                 h2 {
                     margin-bottom: 0;
                 }
                 .label-checkbox {
                     float: left;
                 }
                 &.field {
                     margin: @space 0 @padding;
                 }
                 &:first-child.field {
                     margin-top: 0;
                     .label {
                         margin-top: 0;
                         padding-top: 0;
                     }
                     .radios {
                         padding-top: 0;
                     }
                 }
                 .radios {
                     position: relative;
                     width: 505px;
                 }
             }
             //--- MODULES ------------------//
             // Server Announcement
             #server-announcement {
                 width: 95%;
                 margin: @padding auto;
                 padding: @padding;
                 border-width: 2px;
                 border-style: solid;
                 .border-radius(2px);
                 font-family: @text-bold;
                 &.info    { border-color: @alert4; background-color: @alert4-inner; }
                 &.warning { border-color: @alert3; background-color: @alert3-inner; }
                 &.error   { border-color: @alert2; background-color: @alert2-inner; }
                 &.success { border-color: @alert1; background-color: @alert1-inner; }
                 &.neutral { border-color: @grey3; background-color: @grey6; }
             }
             // Fixed Sidebar Column
             .sidebar-col-wrapper {
                 padding-left: @sidebar-all-width;
                 .sidebar {
                     width: @sidebar-width;
                     margin-left: -@sidebar-all-width;
                 }
             }
             .sidebar-col-wrapper.scw-small {
                 padding-left: @sidebar-small-all-width;
                 .sidebar {
                     width: @sidebar-small-width;
                     margin-left: -@sidebar-small-all-width;
                 }
             }
             // FOOTER
             #footer {
             	padding: 0;
             	text-align: center;
             	vertical-align: middle;
             	color: @grey2;
             	background-color: @grey6;
             	p {
             		margin: 0;
             		padding: 1em;
             		line-height: 1em;
             	}
             	.server-instance { //server instance
             		display: none;
             	}
             	.title {
             		float: none;
             		margin: 0 auto;
             	}
             }
             button.close {
             	padding: 0;
             	cursor: pointer;
             	background: transparent;
             	border: 0;
             	.box-shadow(none);
             	-webkit-appearance: none;
             }
             .close {
             	float: right;
             	font-size: 21px;
             	font-family: @text-bootstrap;
             	line-height: 1em;
             	font-weight: bold;
             	color: @grey2;
             	&:hover,
             	&:focus {
             		color: @grey1;
             		text-decoration: none;
             		cursor: pointer;
             	}
             }
             // GRID
             .sorting,
             .sorting_desc,
             .sorting_asc {
             	cursor: pointer;
             }
             .sorting_desc:after {
             	content: "\00A0\25B2";
             	font-size: .75em;
             }
             .sorting_asc:after {
             	content: "\00A0\25BC";
             	font-size: .68em;
             }
             .user_auth_tokens {
                 &.truncate {
                     white-space: nowrap;
                     overflow: hidden;
                     text-overflow: ellipsis;
                 }
             	.fields .field .input {
             		margin: 0;
             	}
             	input#description {
             		width: 100px;
             		margin: 0;
             	}
             	.drop-menu {
             	    // TODO: johbo: Remove this, should work out of the box when
             	    // having multiple inputs inline
             		margin: 0 0 0 5px;
             	}
             }
             #user_list_table {
               .closed {
                 background-color: @grey6;
               }
             }
             input {
             	&.disabled {
             		opacity: .5;
             	}
             }
             // remove extra padding in firefox
             input::-moz-focus-inner { border:0; padding:0 }
             .adjacent input {
             	margin-bottom: @padding;
             }
             .permissions_boxes {
             	display: block;
             }
             //TODO: lisa: this should be in tables
             .show_more_col {
                 width: 20px;
             }
             //FORMS
             .medium-inline,
             input#description.medium-inline {
             	display: inline;
             	width: @medium-inline-input-width;
             	min-width: 100px;
             }
             select {
             	//reset
             	-webkit-appearance: none;
             	-moz-appearance: none;
             	display: inline-block;
             	height: 28px;
             	width: auto;
             	margin: 0 @padding @padding 0;
             	padding: 0 18px 0 8px;
             	line-height:1em;
             	font-size: @basefontsize;
             	border: @border-thickness solid @rcblue;
             	background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
             	color: @rcblue;
             	&:after {
             		content: "\00A0\25BE";
             	}
             	&:focus {
             		outline: none;
             	}
             }
             option {
             	&:focus {
             		outline: none;
             	}
             }
             input,
             textarea {
             	padding: @input-padding;
             	border: @input-border-thickness solid @border-highlight-color;
             	.border-radius (@border-radius);
             	font-family: @text-light;
             	font-size: @basefontsize;
             	&.input-sm {
             		padding: 5px;
             	}
             	&#description {
             		min-width: @input-description-minwidth;
             		min-height: 1em;
             		padding: 10px;
             	}
             }
             .field-sm {
                 input,
                 textarea {
                     padding: 5px;
                 }
             }
             textarea {
             	display: block;
             	clear: both;
             	width: 100%;
             	min-height: 100px;
             	margin-bottom: @padding;
                 .box-sizing(border-box);
                 overflow: auto;
             }
             label {
             	font-family: @text-light;
             }
             // GRAVATARS
             // centers gravatar on username to the right
             .gravatar {
                 display: inline;
                 min-width: 16px;
                 min-height: 16px;
                 margin: -5px 0;
                 padding: 0;
                 line-height: 1em;
                 border: 1px solid @grey4;
                 box-sizing: content-box;
                 &.gravatar-large {
                     margin: -0.5em .25em -0.5em 0;
                 }
                 & + .user {
                     display: inline;
                     margin: 0;
                     padding: 0 0 0 .17em;
                     line-height: 1em;
                 }
             }
             .user-inline-data {
                 display: inline-block;
                 float: left;
                 padding-left: .5em;
                 line-height: 1.3em;
             }
             .rc-user { // gravatar + user wrapper
                 float: left;
                 position: relative;
                 min-width: 100px;
                 max-width: 200px;
                 min-height: (@gravatar-size + @border-thickness * 2); // account for border
                 display: block;
                 padding: 0 0 0 (@gravatar-size  + @basefontsize/2 + @border-thickness * 2);
                 .gravatar {
                     display: block;
                     position: absolute;
                     top: 0;
                     left: 0;
                     min-width:  @gravatar-size;
                     min-height: @gravatar-size;
                     margin: 0;
                 }
                 .user {
                     display: block;
                     max-width: 175px;
                     padding-top: 2px;
                     overflow: hidden;
                     text-overflow: ellipsis;
                 }
             }
             .gist-gravatar,
             .journal_container {
                 .gravatar-large {
                     margin: 0 .5em -10px 0;
                 }
             }
             // ADMIN SETTINGS
             // Tag Patterns
             .tag_patterns {
             	.tag_input {
             		margin-bottom: @padding;
             	}
             }
             .locked_input {
                 position: relative;
                 input {
                     display: inline;
                     margin: 3px 5px 0px 0px;
                 }
                 br {
                     display: none;
                 }
                 .error-message {
                     float: left;
                     width: 100%;
                 }
                 .lock_input_button {
                     display: inline;
                 }
                 .help-block {
                     clear: both;
                 }
             }
             // Notifications
             .notifications_buttons {
             	margin: 0 0 @space 0;
             	padding: 0;
             	.btn {
             		display: inline-block;
             	}
             }
             .notification-list {
             	div {
             		display: inline-block;
             		vertical-align: middle;
             	}
             	.container {
             		display: block;
             		margin: 0 0 @padding 0;
             	}
             	.delete-notifications {
             		margin-left: @padding;
             		text-align: right;
                     cursor: pointer;
             	}
             	.read-notifications {
             		margin-left: @padding/2;
             		text-align: right;
             		width: 35px;
                     cursor: pointer;
             	}
             	.icon-minus-sign {
             		color: @alert2;
             	}
             	.icon-ok-sign {
             		color: @alert1;
             	}
             }
             .user_settings {
             	float: left;
             	clear: both;
             	display: block;
             	width: 100%;
             	.gravatar_box {
             		margin-bottom: @padding;
             		&:after {
             			content: " ";
             			clear: both;
             			width: 100%;
             		}
             	}
             	.fields .field {
             		clear: both;
             	}
             }
             .advanced_settings {
             	margin-bottom: @space;
             	.help-block {
             		margin-left: 0;
             	}
             	button + .help-block {
             		margin-top: @padding;
             	}
             }
             // admin settings radio buttons and labels
             .label-2 {
             	float: left;
             	width: @label2-width;
             	label {
             		color: @grey1;
             	}
             }
             .checkboxes {
             	float: left;
             	width: @checkboxes-width;
             	margin-bottom: @padding;
             	.checkbox {
             		width: 100%;
             		label {
             			margin: 0;
             			padding: 0;
             		}
             	}
             	.checkbox + .checkbox {
             		display: inline-block;
             	}
             	label {
             		margin-right: 1em;
             	}
             }
             // CHANGELOG
             .container_header {
                 float: left;
             	display: block;
             	width: 100%;
             	margin: @padding 0 @padding;
                 #filter_changelog {
                     float: left;
                     margin-right: @padding;
                 }
                 .breadcrumbs_light {
                     display: inline-block;
                 }
             }
             .info_box {
             	float: right;
             }
             #graph_nodes {
                 padding-top: 43px;
             }
             #graph_content{
                 // adjust for table headers so that graph renders properly
                 //           #graph_nodes padding - table cell padding
                 padding-top: (@space - (@basefontsize * 2.4));
                 &.graph_full_width {
                     width: 100%;
                     max-width: 100%;
                 }
             }
             #graph {
                 .flag_status {
                     margin: 0;
                 }
                 .pagination-left {
                     float: left;
                     clear: both;
                 }
                 .log-container {
                     max-width: 345px;
                     .message{
                         max-width: 340px;
                     }
                 }
                 .graph-col-wrapper {
                     padding-left: 110px;
                     #graph_nodes {
                         width: 100px;
                         margin-left: -110px;
                         float: left;
                         clear: left;
                     }
                 }
                 .load-more-commits {
                     text-align: center;
                 }
                 .load-more-commits:hover {
                     background-color: @grey7;
                 }
                 .load-more-commits {
                   a {
                     display: block;
                   }
                 }
             }
             #filter_changelog {
                 float: left;
             }
             //--- THEME ------------------//
             #logo {
             	float: left;
             	margin: 9px 0 0 0;
                 .header {
                 	background-color: transparent;
                 }
                 a {
                 	display: inline-block;
                 }
                 img {
                 	height:30px;
                 }
             }
             .logo-wrapper {
             	float:left;
             }
             .branding{
             	float: left;
             	padding: 9px 2px;
             	line-height: 1em;
             	font-size: @navigation-fontsize;
             }
             img {
             	border: none;
             	outline: none;
             }
              user-profile-header
             label {
                 input[type="checkbox"] {
                     margin-right: 1em;
                 }
                 input[type="radio"] {
                     margin-right: 1em;
                 }
             }
             .flag_status {
                 margin: 2px 8px 6px 2px;
                 &.under_review {
                     .circle(5px, @alert3);
                 }
                 &.approved {
                     .circle(5px, @alert1);
                 }
                 &.rejected,
                 &.forced_closed{
                     .circle(5px, @alert2);
                 }
                 &.not_reviewed {
                     .circle(5px, @grey5);
                 }
             }
             .flag_status_comment_box {
             	margin: 5px 6px 0px 2px;
             }
             .test_pattern_preview {
             	margin: @space 0;
             	p {
                     margin-bottom: 0;
             		border-bottom: @border-thickness solid @border-default-color;
             		color: @grey3;
             	}
             	.btn {
             		margin-bottom: @padding;
             	}
             }
             #test_pattern_result {
                 display: none;
                 &:extend(pre);
                 padding: .9em;
                 color: @grey3;
                 background-color: @grey7;
                 border-right: @border-thickness solid @border-default-color;
                 border-bottom: @border-thickness solid @border-default-color;
                 border-left: @border-thickness solid @border-default-color;
             }
             #repo_vcs_settings {
                 #inherit_overlay_vcs_default {
                     display: none;
                 }
                 #inherit_overlay_vcs_custom {
                     display: custom;
                 }
                 &.inherited {
                     #inherit_overlay_vcs_default {
                         display: block;
                     }
                     #inherit_overlay_vcs_custom {
                         display: none;
                     }
                 }
             }
             .issue-tracker-link {
             	color: @rcblue;
             }
             // Issue Tracker Table Show/Hide
             #repo_issue_tracker {
                 #inherit_overlay {
                     display: none;
                 }
                 #custom_overlay {
                     display: custom;
                 }
                 &.inherited {
                     #inherit_overlay {
                         display: block;
                     }
                     #custom_overlay {
                         display: none;
                     }
                 }
             }
             table.issuetracker {
                 &.readonly {
                     tr, td {
                         color: @grey3;
                     }
                 }
                 .edit {
                     display: none;
                 }
                 .editopen {
                     .edit {
                         display: inline;
                     }
                     .entry {
                         display: none;
                     }
                 }
                 tr td.td-action {
                     min-width: 117px;
                 }
                 td input {
                     max-width: none;
                     min-width: 30px;
                     width: 80%;
                 }
                 .issuetracker_pref input {
                     width: 40%;
                 }
                 input.edit_issuetracker_update {
                     margin-right: 0;
                     width: auto;
                 }
             }
             table.integrations {
                 .td-icon {
                     width: 20px;
                     .integration-icon {
                         height: 20px;
                         width: 20px;
                     }
                 }
             }
             .integrations {
                 a.integration-box {
                     color: @text-color;
                     &:hover {
                         .panel {
                             background: #fbfbfb;
                         }
                     }
                     .integration-icon {
                       width: 30px;
                       height: 30px;
                       margin-right: 20px;
                       float: left;
                     }
                     .panel-body {
                         padding: 10px;
                     }
                     .panel {
                         margin-bottom: 10px;
                     }
                     h2 {
                         display: inline-block;
                         margin: 0;
                         min-width: 140px;
                     }
                 }
                 a.integration-box.dummy-integration {
                   color: @grey4
                 }
             }
             //Permissions Settings
             #add_perm {
                 margin: 0 0 @padding;
             	cursor: pointer;
             }
             .perm_ac {
                 input {
                     width: 95%;
                 }
             }
             .autocomplete-suggestions {
                 width: auto !important; // overrides autocomplete.js
                 margin: 0;
                 border: @border-thickness solid @rcblue;
                 border-radius: @border-radius;
                 color: @rcblue;
                 background-color: white;
             }
             .autocomplete-selected {
                 background: #F0F0F0;
             }
             .ac-container-wrap {
             	margin: 0;
             	padding: 8px;
             	border-bottom: @border-thickness solid @rclightblue;
             	list-style-type: none;
             	cursor: pointer;
             		&:hover {
             			background-color: @rclightblue;
             	}
             	img {
                     height: @gravatar-size;
                     width: @gravatar-size;
             		margin-right: 1em;
             	}
             	strong {
             		font-weight: normal;
             	}
             }
             // Settings Dropdown
             .user-menu .container {
                 padding: 0 4px;
                 margin: 0;
             }
             .user-menu .gravatar {
                 cursor: pointer;
             }
             .codeblock {
             	margin-bottom: @padding;
                 clear: both;
                 .stats{
                     overflow: hidden;
                 }
                 .message{
                     textarea{
                         margin: 0;
                     }
                 }
                 .code-header {
                 	.stats {
                         line-height: 2em;
                 		.revision_id {
                 			margin-left: 0;
                 		}
             			.buttons {
                             padding-right: 0;
             			}
                 	}
                     .item{
                         margin-right: 0.5em;
                     }
                 }
                 #editor_container{
                     position: relative;
                     margin: @padding;
                 }
             }
             #file_history_container {
                 display: none;
             }
             .file-history-inner {
                 margin-bottom: 10px;
             }
             // Pull Requests
             .summary-details {
                 width: 72%;
             }
             .pr-summary {
                 border-bottom: @border-thickness solid @grey5;
                 margin-bottom: @space;
             }
             .reviewers-title {
                 width: 25%;
                 min-width: 200px;
             }
             .reviewers {
                 width: 25%;
                 min-width: 200px;
             }
             .reviewers ul li {
                 position: relative;
                 width: 100%;
                 padding-bottom: 8px;
             }
             .reviewer_entry {
               min-height: 55px;
             }
             .reviewers_member {
                 width: 100%;
                 overflow: auto;
             }
             .reviewer_reason {
                 padding-left: 20px;
                 line-height: 1.5em;
             }
             .reviewer_status {
                 display: inline-block;
                 vertical-align: top;
                 width: 25px;
                 min-width: 25px;
                 height: 1.2em;
                 margin-top: 3px;
                 line-height: 1em;
             }
             .reviewer_name {
                 display: inline-block;
                 max-width: 83%;
                 padding-right: 20px;
                 vertical-align: middle;
                 line-height: 1;
                 .rc-user {
                     min-width: 0;
                     margin: -2px 1em 0 0;
                 }
                 .reviewer {
                     float: left;
                 }
             }
             .reviewer_member_mandatory {
                 position: absolute;
                 left: 15px;
                 top: 8px;
                 width: 16px;
                 font-size: 11px;
                 margin: 0;
                 padding: 0;
                 color: black;
             }
             .reviewer_member_mandatory_remove,
             .reviewer_member_remove {
                 position: absolute;
                 right: 0;
                 top: 0;
                 width: 16px;
                 margin-bottom: 10px;
                 padding: 0;
                 color: black;
             }
             .reviewer_member_mandatory_remove {
               color: @grey4;
             }
             .reviewer_member_status {
                 margin-top: 5px;
             }
             .pr-summary #summary{
                 width: 100%;
             }
             .pr-summary .action_button:hover {
                 border: 0;
                 cursor: pointer;
             }
             .pr-details-title {
                 padding-bottom: 8px;
                 border-bottom: @border-thickness solid @grey5;
                 .action_button.disabled {
                     color: @grey4;
                     cursor: inherit;
                 }
                 .action_button {
                     color: @rcblue;
                 }
             }
             .pr-details-content {
                 margin-top: @textmargin;
                 margin-bottom: @textmargin;
             }
             .pr-reviewer-rules {
                padding: 10px 0px 20px 0px;
             }
             .group_members {
                 margin-top: 0;
                 padding: 0;
                 list-style: outside none none;
                 img {
                     height: @gravatar-size;
                     width: @gravatar-size;
                     margin-right: .5em;
                     margin-left: 3px;
                 }
                 .to-delete {
                     .user {
                       text-decoration: line-through;
                     }
                 }
             }
             .compare_view_commits_title {
               .disabled {
                 cursor: inherit;
                 &:hover{
                   background-color: inherit;
                   color: inherit;
                 }
               }
             }
             .subtitle-compare {
               margin: -15px 0px 0px 0px;
             }
             .comments-summary-td {
               border-top: 1px dashed @grey5;
             }
             // new entry in group_members
             .td-author-new-entry {
               background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
             }
             .usergroup_member_remove {
                 width: 16px;
                 margin-bottom: 10px;
                 padding: 0;
                 color: black !important;
                 cursor: pointer;
             }
             .reviewer_ac .ac-input {
                 width: 92%;
                 margin-bottom: 1em;
             }
             .compare_view_commits tr{
                 height: 20px;
             }
             .compare_view_commits td {
                 vertical-align: top;
                 padding-top: 10px;
             }
             .compare_view_commits .author {
                 margin-left: 5px;
             }
             .compare_view_commits {
               .color-a {
                 color: @alert1;
               }
               .color-c {
                 color: @color3;
               }
               .color-r {
                 color: @color5;
               }
               .color-a-bg {
                 background-color: @alert1;
               }
               .color-c-bg {
                 background-color: @alert3;
               }
               .color-r-bg {
                 background-color: @alert2;
               }
               .color-a-border {
                 border: 1px solid @alert1;
               }
               .color-c-border {
                 border: 1px solid @alert3;
               }
               .color-r-border {
                 border: 1px solid @alert2;
               }
               .commit-change-indicator {
                 width: 15px;
                 height: 15px;
                 position: relative;
                 left: 15px;
               }
               .commit-change-content {
                 text-align: center;
                 vertical-align: middle;
                 line-height: 15px;
               }
             }
             .compare_view_filepath {
                 color: @grey1;
             }
             .show_more {
                 display: inline-block;
                 width: 0;
                 height: 0;
                 vertical-align: middle;
                 content: "";
                 border: 4px solid;
                 border-right-color: transparent;
                 border-bottom-color: transparent;
                 border-left-color: transparent;
                 font-size: 0;
             }
             .journal_more .show_more {
                 display: inline;
                 &:after {
                     content: none;
                 }
             }
             .compare_view_commits .collapse_commit:after {
                 cursor: pointer;
                 content: "\00A0\25B4";
                 margin-left: -3px;
                 font-size: 17px;
                 color: @grey4;
             }
             .diff_links {
                 margin-left: 8px;
             }
             div.ancestor {
                 margin: -30px 0px;
             }
             .cs_icon_td input[type="checkbox"] {
                 display: none;
             }
             .cs_icon_td .expand_file_icon:after {
                 cursor: pointer;
                 content: "\00A0\25B6";
                 font-size: 12px;
                 color: @grey4;
             }
             .cs_icon_td .collapse_file_icon:after {
                 cursor: pointer;
                 content: "\00A0\25BC";
                 font-size: 12px;
                 color: @grey4;
             }
             /*new binary
             NEW_FILENODE = 1
             DEL_FILENODE = 2
             MOD_FILENODE = 3
             RENAMED_FILENODE = 4
             COPIED_FILENODE = 5
             CHMOD_FILENODE = 6
             BIN_FILENODE = 7
             */
             .cs_files_expand {
                 font-size: @basefontsize + 5px;
                 line-height: 1.8em;
                 float: right;
             }
             .cs_files_expand span{
                 color: @rcblue;
                 cursor: pointer;
             }
             .cs_files {
                 clear: both;
             	padding-bottom: @padding;
                 .cur_cs {
                     margin: 10px 2px;
                     font-weight: bold;
                 }
                 .node {
                     float: left;
                 }
                 .changes {
                     float: right;
                     color: white;
                     font-size: @basefontsize - 4px;
                     margin-top: 4px;
                     opacity: 0.6;
                     filter: Alpha(opacity=60); /* IE8 and earlier */
                     .added {
                         background-color: @alert1;
                         float: left;
                         text-align: center;
                     }
                     .deleted {
                         background-color: @alert2;
                         float: left;
                         text-align: center;
                     }
                     .bin {
                         background-color: @alert1;
                         text-align: center;
                     }
                     /*new binary*/
                     .bin.bin1 {
                         background-color: @alert1;
                         text-align: center;
                     }
                     /*deleted binary*/
                     .bin.bin2 {
                         background-color: @alert2;
                         text-align: center;
                     }
                     /*mod binary*/
                     .bin.bin3 {
                         background-color: @grey2;
                         text-align: center;
                     }
                     /*rename file*/
                     .bin.bin4 {
                         background-color: @alert4;
                         text-align: center;
                     }
                     /*copied file*/
                     .bin.bin5 {
                         background-color: @alert4;
                         text-align: center;
                     }
                     /*chmod file*/
                     .bin.bin6 {
                         background-color: @grey2;
                         text-align: center;
                     }
                 }
             }
             .cs_files .cs_added, .cs_files .cs_A,
             .cs_files .cs_added, .cs_files .cs_M,
             .cs_files .cs_added, .cs_files .cs_D {
                 height: 16px;
                 padding-right: 10px;
                 margin-top: 7px;
                 text-align: left;
             }
             .cs_icon_td {
               min-width: 16px;
               width: 16px;
             }
             .pull-request-merge {
                 border: 1px solid @grey5;
                 padding: 10px 0px 20px;
                 margin-top: 10px;
                 margin-bottom: 20px;
             }
             .pull-request-merge ul {
                 padding: 0px 0px;
             }
             .pull-request-merge li:before{
                 content:none;
             }
             .pull-request-merge .pull-request-wrap {
                 height: auto;
                 padding: 0px 0px;
                 text-align: right;
             }
             .pull-request-merge span {
                 margin-right: 5px;
             }
             .pull-request-merge-actions {
                 min-height: 30px;
                 padding: 0px 0px;
             }
             .pull-request-merge-info {
               padding: 0px 5px 5px 0px;
             }
             .merge-status {
               margin-right: 5px;
             }
             .merge-message {
                 font-size: 1.2em
             }
             .merge-message.success i,
             .merge-icon.success i {
                 color:@alert1;
             }
             .merge-message.warning i,
             .merge-icon.warning i {
               color: @alert3;
             }
             .merge-message.error i,
             .merge-icon.error i  {
                 color:@alert2;
             }
             .pr-versions {
                 font-size: 1.1em;
                 table {
                   padding: 0px 5px;
                 }
                 td {
                   line-height: 15px;
                 }
                 .flag_status {
                     margin: 0;
                 }
                 .compare-radio-button {
                   position: relative;
                   top: -3px;
                 }
             }
             #close_pull_request {
                 margin-right: 0px;
             }
             .empty_data {
                 color: @grey4;
             }
             #changeset_compare_view_content {
                 margin-bottom: @space;
                 clear: both;
                 width: 100%;
                 box-sizing: border-box;
                 .border-radius(@border-radius);
                 .help-block {
                     margin: @padding 0;
                     color: @text-color;
                     &.pre-formatting {
                         white-space: pre;
                     }
                 }
                 .empty_data {
                     margin: @padding 0;
                 }
                 .alert {
                     margin-bottom: @space;
                 }
             }
             .table_disp {
             	.status {
             		width: auto;
             		.flag_status {
             			float: left;
             		}
             	}
             }
             .creation_in_progress {
               color: @grey4
             }
             .status_box_menu {
                 margin: 0;
             }
             .notification-table{
             	margin-bottom: @space;
             	display: table;
             	width: 100%;
             	.container{
             		display: table-row;
             		.notification-header{
             			border-bottom: @border-thickness solid @border-default-color;
             		}
             		.notification-subject{
             			display: table-cell;
             		}
             	}
             }
             // Notifications
             .notification-header{
             	display: table;
             	width: 100%;
             	padding: floor(@basefontsize/2) 0;
                 line-height: 1em;
             	.desc, .delete-notifications, .read-notifications{
             		display: table-cell;
             		text-align: left;
             	}
             	.desc{
             		width: 1163px;
             	}
             	.delete-notifications, .read-notifications{
             		width: 35px;
             		min-width: 35px; //fixes when only one button is displayed
             	}
             }
             .notification-body {
                 .markdown-block,
             	.rst-block {
             		padding: @padding 0;
             	}
             	.notification-subject {
             		padding: @textmargin 0;
             		border-bottom: @border-thickness solid @border-default-color;
             	}
             }
             .notifications_buttons{
             	float: right;
             }
             #notification-status{
               display: inline;
             }
             // Repositories
             #summary.fields{
             	display: table;
             	.field{
             		display: table-row;
             		.label-summary{
             			display: table-cell;
             			min-width: @label-summary-minwidth;
             			padding-top: @padding/2;
             			padding-bottom: @padding/2;
             			padding-right: @padding/2;
             		}
             		.input{
             			display: table-cell;
             			padding: @padding/2;
             			input{
             				min-width: 29em;
             				padding:  @padding/4;
             			}
             		}
             		.statistics, .downloads{
             			.disabled{
             				color: @grey4;
             			}
             		}
             	}
             }
             #summary{
             	width: 70%;
             }
             // Journal
             .journal.title {
             	h5 {
             		float: left;
             		margin: 0;
             		width: 70%;
             	}
             	ul {
             		float: right;
             		display: inline-block;
             		margin: 0;
             		width: 30%;
             		text-align: right;
             		li {
             			display: inline;
             			font-size: @journal-fontsize;
                         line-height: 1em;
                         &:before { content: none; }
             		}
             	}
             }
             .filterexample {
                 position: absolute;
                 top: 95px;
                 left: @contentpadding;
                 color: @rcblue;
                 font-size: 11px;
                 font-family: @text-regular;
                 cursor: help;
                 &:hover {
                     color: @rcdarkblue;
                 }
                 @media (max-width:768px) {
                     position: relative;
                     top: auto;
                     left: auto;
                     display: block;
                 }
             }
             #journal{
             	margin-bottom: @space;
             	.journal_day{
             		margin-bottom: @textmargin/2;
             		padding-bottom: @textmargin/2;
             		font-size: @journal-fontsize;
             		border-bottom: @border-thickness solid @border-default-color;
             	}
             	.journal_container{
             		margin-bottom: @space;
             		.journal_user{
             			display: inline-block;
             		}
             		.journal_action_container{
             			display: block;
             			margin-top: @textmargin;
             			div{
             				display: inline;
             			}
             			div.journal_action_params{
             				display: block;
             			}
             			div.journal_repo:after{
             				content: "\A";
             				white-space: pre;
             			}
             			div.date{
             				display: block;
             				margin-bottom: @textmargin;
             			}
             		}
             	}
             }
             // Files
             .edit-file-title {
                 border-bottom: @border-thickness solid @border-default-color;
                 .breadcrumbs {
                     margin-bottom: 0;
                 }
             }
             .edit-file-fieldset {
                 margin-top: @sidebarpadding;
                 .fieldset {
                     .left-label {
                         width: 13%;
                     }
                     .right-content {
                         width: 87%;
                         max-width: 100%;
                     }
                     .filename-label {
                         margin-top: 13px;
                     }
                     .commit-message-label {
                         margin-top: 4px;
                     }
                     .file-upload-input {
                         input {
                             display: none;
                         }
                       margin-top: 10px;
                     }
                     .file-upload-label {
                       margin-top: 10px;
                     }
                     p {
                         margin-top: 5px;
                     }
                 }
                 .custom-path-link {
                     margin-left: 5px;
                 }
                 #commit {
                     resize: vertical;
                 }
             }
             .delete-file-preview {
                 max-height: 250px;
             }
             .new-file,
             #filter_activate,
             #filter_deactivate {
                 float: left;
                 margin: 0 0 0 15px;
             }
             h3.files_location{
                 line-height: 2.4em;
             }
             .browser-nav {
             	display: table;
             	margin-bottom: @space;
             	.info_box {
             		display: inline-table;
             		height: 2.5em;
                     .browser-cur-rev, .info_box_elem {
             			display: table-cell;
             			vertical-align: middle;
             		}
             		.info_box_elem {
             			border-top: @border-thickness solid @rcblue;
             			border-bottom: @border-thickness solid @rcblue;
                         #at_rev, a {
                             padding: 0.6em 0.9em;
                             margin: 0;
                             .box-shadow(none);
                             border: 0;
                             height: 12px;
                         }
                         input#at_rev {
                             max-width: 50px;
                             text-align: right;
                         }
             			&.previous {
             				border: @border-thickness solid @rcblue;
                             .disabled {
                               color: @grey4;
                               cursor: not-allowed;
                             }
             			}
             			&.next {
             				border: @border-thickness solid @rcblue;
                             .disabled {
                               color: @grey4;
                               cursor: not-allowed;
                             }
             			}
             		}
             		.browser-cur-rev {
             			span{
                             margin: 0;
             				color: @rcblue;
                             height: 12px;
                             display: inline-block;
                             padding:  0.7em 1em ;
                             border: @border-thickness solid @rcblue;
                             margin-right: @padding;
             			}
             		}
             	}
             	.search_activate {
             		display: table-cell;
             		vertical-align: middle;
             		input, label{
             			margin: 0;
             			padding: 0;
             		}
             		input{
             			margin-left: @textmargin;
             		}
             	}
             }
             .browser-cur-rev{
             	margin-bottom: @textmargin;
             }
             #node_filter_box_loading{
             	.info_text;
             }
             .browser-search {
             	margin: -25px 0px 5px 0px;
             }
             .node-filter {
               font-size: @repo-title-fontsize;
               padding: 4px 0px 0px 0px;
               .node-filter-path {
                   float: left;
                   color: @grey4;
                 }
                 .node-filter-input {
                     float: left;
                     margin: -2px 0px 0px 2px;
                     input {
                         padding: 2px;
                         border: none;
                         font-size: @repo-title-fontsize;
                     }
                 }
             }
             .browser-result{
             	td a{
             		margin-left: 0.5em;
             		display: inline-block;
             		em{
             			font-family: @text-bold;
             		}
             	}
             }
             .browser-highlight{
             	background-color: @grey5-alpha;
             }
             // Search
             .search-form{
                 #q {
                     width: @search-form-width;
                 }
             	.fields{
             		margin: 0 0 @space;
             	}
             	label{
             		display: inline-block;
             		margin-right: @textmargin;
             		padding-top: 0.25em;
             	}
             	.results{
             		clear: both;
             		margin: 0 0 @padding;
             	}
             }
             div.search-feedback-items {
             	display: inline-block;
             }
             div.search-code-body {
                 background-color: #ffffff; padding: 5px 0 5px 10px;
                 pre {
                     .match { background-color: #faffa6;}
                     .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
                 }
             }
             .expand_commit.search {
                 .show_more.open {
                     height: auto;
                     max-height: none;
                 }
             }
             .search-results {
                 h2 {
                     margin-bottom: 0;
                 }
                 .codeblock {
                     border: none;
                     background: transparent;
                 }
                 .codeblock-header {
                     border: none;
                     background: transparent;
                 }
                 .code-body {
                     border: @border-thickness solid @border-default-color;
                     .border-radius(@border-radius);
                 }
                 .td-commit {
                     &:extend(pre);
                     border-bottom: @border-thickness solid @border-default-color;
                 }
                 .message {
                     height: auto;
                     max-width: 350px;
                     white-space: normal;
                     text-overflow: initial;
                     overflow: visible;
                     .match { background-color: #faffa6;}
                     .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
                 }
             }
             table.rctable td.td-search-results div {
                 max-width: 100%;
             }
             #tip-box, .tip-box{
             	padding: @menupadding/2;
             	display: block;
             	border: @border-thickness solid @border-highlight-color;
             	.border-radius(@border-radius);
             	background-color: white;
                 z-index: 99;
                 white-space: pre-wrap;
             }
             #linktt {
                 width: 79px;
             }
             #help_kb .modal-content{
             	max-width: 750px;
             	margin: 10% auto;
             	table{
             		td,th{
             			border-bottom: none;
             			line-height: 2.5em;
             		}
             		th{
             			padding-bottom: @textmargin/2;
             		}
             		td.keys{
             			text-align: center;
             		}
             	}
             	.block-left{
             		width: 45%;
             		margin-right: 5%;
             	}
             	.modal-footer{
             		clear: both;
             	}
             	.key.tag{
             		padding: 0.5em;
             		background-color: @rcblue;
             		color: white;
             		border-color: @rcblue;
             		.box-shadow(none);
             	}
             }
             //--- IMPORTS FOR REFACTORED STYLES ------------------//
             @import 'statistics-graph';
             @import 'tables';
             @import 'forms';
             @import 'diff';
             @import 'summary';
             @import 'navigation';
             //--- SHOW/HIDE SECTIONS --//
             .btn-collapse {
                 float: right;
                 text-align: right;
                 font-family: @text-light;
                 font-size: @basefontsize;
                 cursor: pointer;
                 border: none;
                 color: @rcblue;
             }
             table.rctable,
             table.dataTable {
                 .btn-collapse {
                     float: right;
                     text-align: right;
                 }
             }
             // TODO: johbo: Fix for IE10, this avoids that we see a border
             // and padding around checkboxes and radio boxes. Move to the right place,
             // or better: Remove this once we did the form refactoring.
             input[type=checkbox],
             input[type=radio] {
                 padding: 0;
                 border: none;
             }
             .toggle-ajax-spinner{
               height: 16px;
               width: 16px;
             }
             .markup-form .clearfix {
                 .border-radius(@border-radius);
                 margin: 0px;
             }
             .markup-form-area {
                 padding: 8px 12px;
                 border: 1px solid @grey4;
                 .border-radius(@border-radius);
             }
             .markup-form-area-header .nav-links {
                 display: flex;
                 flex-flow: row wrap;
                 -webkit-flex-flow: row wrap;
                 width: 100%;
             }
             .markup-form-area-footer {
                 display: flex;
             }
             .markup-form-area-footer .toolbar {
             }
             // markup Form
             div.markup-form {
                 margin-top: 20px;
             }
             .markup-form strong {
                 display: block;
                 margin-bottom: 15px;
             }
             .markup-form textarea {
                 width: 100%;
                 height: 100px;
-                font-family: 'Monaco', 'Courier', 'Courier New', monospace;
+                font-family: @text-monospace;
             }
             form.markup-form {
                 margin-top: 10px;
                 margin-left: 10px;
             }
             .markup-form .comment-block-ta,
             .markup-form .preview-box {
                 .border-radius(@border-radius);
                 .box-sizing(border-box);
                 background-color: white;
             }
             .markup-form .preview-box.unloaded {
                 height: 50px;
                 text-align: center;
                 padding: 20px;
                 background-color: white;
             }

rhodecode/public/css/readme-box.less

0 +2 -2

             /** README styling **/
             div.readme_box {
                 clear: both;
                 overflow: hidden;
                 margin: 0;
                 padding: 3px 15px 3px;
             }
             div.readme_box h1,
             div.readme_box h2,
             div.readme_box h3,
             div.readme_box h4,
             div.readme_box h5,
             div.readme_box h6 {
                 border-bottom: none !important;
                 padding: 0 !important;
                 overflow: visible !important;
             }
             div.readme_box h1 {
                 font-size: 32px;
                 margin: 15px 0 15px 0 !important;
                 padding-bottom: 5px !important;
             }
             div.readme_box h2 {
                 font-size: 24px !important;
                 margin: 34px 0 10px 0 !important;
                 border-top: 3px #e6e5e5 solid !important;
                 padding-top: 15px !important;
                 padding-bottom: 8px !important;
             }
             div.readme_box h3 {
                 font-size: 18px !important;
                 margin: 30px 0 8px 0 !important;
                 padding-bottom: 2px !important;
             }
             div.readme_box h4 {
                 font-size: 13px !important;
                 margin: 18px 0 3px 0 !important;
             }
             div.readme_box h5 {
                 font-size: 12px !important;
                 margin: 15px 0 3px 0 !important;
             }
             div.readme_box h6 {
                 font-size: 12px;
                 color: #777777;
                 margin: 15px 0 3px 0 !important;
             }
             div.readme_box hr {
                 border: 0;
                 color: #e6e5e5;
                 background-color: #e6e5e5;
                 height: 3px;
                 margin-bottom: 13px;
             }
             div.readme_box ol,
             div.readme_box ul,
             div.readme_box p,
             div.readme_box blockquote,
             div.readme_box dl,
             div.readme_box li,
             div.readme_box table {
                 margin: 3px 0px 13px 0px !important;
                 color: #424242 !important;
                 font-size: 13px !important;
-                font-family: "Helvetica" !important;
+                font-family: @text-regular;
                 font-weight: normal  !important;
                 overflow: visible !important;
                 line-height: 140% !important;
             }
             div.readme_box pre {
               margin: 3px 0px 13px 0px !important;
               padding: .5em;
               color: #424242 !important;
               font-size: 13px !important;
               overflow: visible !important;
               line-height: 140% !important;
               background-color: @grey7;
             }
             div.readme_box img {
               border-style: none;
               background-color: #fff;
             }
             div.readme_box strong {
               font-weight: 600;
               margin: 0;
             }
             div.readme_box ul,
             div.readme_box ol {
                 padding-left: 30px !important;
                 margin-top: 0px !important;
                 margin-bottom: 18px !important;
             }
             div.readme_box ul li,
             div.readme_box ol li {
                 list-style: bullet !important;
                 margin: 6px !important;
                 padding: 0 !important;
             }
             div.readme_box ol li {
                 list-style: decimal !important;
             }
             /*
             div.readme_box a,
             div.readme_box a:visited {
                 color: #4183C4 !important;
                 background-color: inherit;
                 text-decoration: none;
             }
             */
             div.readme_box button {
                 font-size: @basefontsize;
                 padding: 4px 6px;
                 .border-radius(@border-radius);
                 border: @border-thickness solid @grey5;
                 background-color: @grey6;
             }
             div.readme_box code,
             div.readme_box pre {
-                font-family: Monaco;
+                font-family: @text-monospace;
                 font-size: 11px;
                 .border-radius(@border-radius);
                 background-color: white;
                 color: @grey3;
             }
             div.readme_box code {
                 border: @border-thickness solid @grey6;
                 margin: 0 2px;
                 padding: 0 5px;
             }
             div.readme_box pre {
                 border: @border-thickness solid @grey5;
                 overflow: auto;
                 padding: .5em;
                 background-color: @grey7;
             }
             div.readme_box pre > code {
                 border: 0;
                 margin: 0;
                 padding: 0;
             }
             /** RST STYLE **/
             div.rst-block {
                 clear: both;
                 overflow: hidden;
                 margin: 0;
                 padding: 3px 15px 3px;
             }
             div.rst-block h2 {
                 font-weight: normal;
             }
             div.rst-block  h1,
             div.rst-block  h2,
             div.rst-block  h3,
             div.rst-block  h4,
             div.rst-block  h5,
             div.rst-block  h6 {
                 border-bottom: 0 !important;
                 margin: 0 !important;
                 padding: 0 !important;
                 line-height: 1.5em !important;
             }
             div.rst-block  h1:first-child {
                 padding-top: .25em !important;
             }
             div.rst-block  h2,
             div.rst-block  h3 {
                 margin: 1em 0 !important;
             }
             div.rst-block  h2 {
                 margin-top: 1.5em !important;
                 border-top: 4px solid #e0e0e0 !important;
                 padding-top: .5em !important;
             }
             div.rst-block  p {
                 color: black !important;
                 margin: 1em 0 !important;
                 line-height: 1.5em !important;
             }
             div.rst-block  ul {
                 list-style: disc !important;
                 margin: 1em 0 1em 2em !important;
                 clear: both;
             }
             div.rst-block  ol {
                 list-style: decimal;
                 margin: 1em 0 1em 2em !important;
             }
             div.rst-block pre,
             div.rst-block code {
                 font: 12px "Bitstream Vera Sans Mono","Courier",monospace;
             }
             div.rst-block code {
                 font-size: 12px !important;
                 background-color: ghostWhite !important;
                 color: #444 !important;
                 padding: 0 .2em !important;
                 border: 1px solid #dedede !important;
             }
             div.rst-block pre code {
                 padding: 0 !important;
                 font-size: 12px !important;
                 background-color: #eee !important;
                 border: none !important;
             }
             div.rst-block pre {
                 margin: 1em 0;
                 padding: @padding;
                 border: 1px solid @grey6;
                 .border-radius(@border-radius);
                 overflow: auto;
                 font-size: 12px;
                 color: #444;
                 background-color: @grey7;
             }

rhodecode/public/css/variables.less

0 +3 0

             // variables for use in all RhodeCode products
             // FONTS
             //Primary Colors (brand)
             @rcblue: #427cc9;		//RhodeCode blue
             @rcdarkblue: #305b91;	//RhodeCode dark blue
             @rclightblue: lighten(@rcblue, 30%);
             @rchighlightblue: lighten(@rcblue, 35%);
             // Secondary Colors (greyscale)
             @grey1: #202020;		//midnight
             @grey2: #323232;		//charcoal
             @grey3: #666666;		//tungsten
             @grey4: #979797;		//light grey
             @grey5: #dbd9da;		//greyish
             @grey6: #eeeeee;		//silver
             @grey7: #f9f9f9;		//light silver
             // special for navigation
             @nav-grey: #CDCCCD;
             @grey5-alpha: rgba(219, 217, 218, 0.3);
             // Tertiary Colors
             @color1: #879938;		//olive green
             @color2: #fcc93a;		//bright yellow
             @color3: #ff9e07;		//orange-yellow
             @color4: #fc663a;		//bright orange
             @color5: #d63d44;		//signal red
             @color6: #99287c;		//violet
             @color7: #682668;		//dark purple
             @color8: #194f8e;		//dark blue
             // Alert Colors (bright)
             @alert1: #0ac878;		//bright green
             @alert2: #e85e4d;		//soft red
             @alert3: #ffc854;		//corn yellow
             @alert4: #84a5d2;		//light blue
             // Alert Inner Colors
             @alert1-inner: #daf7eb;		//bright green
             @alert2-inner: #fbdfdb;		//soft red
             @alert3-inner: #fff4dd;		//corn yellow
             @alert4-inner: #e6edf6;		//light blue
             // Highlight color for lines and colors
             @comment-highlight-color: #ffd887;
             // FONTS
             @basefontsize: 13px;
             @navigation-fontsize: 14px;
             @journal-fontsize: @basefontsize+7px;
             @text-color: @grey2;
             @repo-title-fontsize: 18px;
             @text-regular: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+            @text-monospace: 'Menlo', 'Liberation Mono', 'Consolas', 'DejaVu Sans Mono', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
             @text-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
             @text-bold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
             @text-semibold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
             @text-bold-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
             @text-code: 'Menlo', 'Liberation Mono', 'Consolas', 'DejaVu Sans Mono', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
             @text-light: @text-regular;
             @text-light-italic: @text-italic;
             // Used for .close buttons
             @text-bootstrap: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
             @panel-title: @basefontsize;
             @panel-footer: @basefontsize;
             // BORDERS
             @border-thickness: 1px;
             @border-thickness-buttons: 1px;
             @border-thickness-tags: 1px;
             @border-radius: 2px;
             @border-default-color: @grey5;
             @border-highlight-color: @grey4;
             // SPACING
             @contentpadding: 15px;  //padding on left and right of pages
             @pagepadding: 40px;		//padding on top and bottom of pages
             @menupadding: 12px;		//padding for sidebar and content
             @sidebarpadding: 15px;	//spacing between sections
             @space: 40px;			//spacing between sections
             @padding: 15px;			//padding inside modules
             @textmargin: 20px;		//spacing below headers
             @header-padding: 20px;
             @panel-padding: @padding;
             @gravatar-size: 16px;   // height/width of gravatar w/o border
             // ADMIN
             @form-max-width: 750px;
             // FORMS (new)
             @border-thickness-inputs: 1px;
             @input-padding: @button-padding; //needs to match button padding
             // TODO: johbo: Needed for working computation of paddings around labels etc.
             // Expected to be replaced once we are done with the form refactoring.
             @input-padding-px: 12px;
             @legend-width: 220px;
             @form-vertical-margin: 20px;
             @form-check-width: 20px;
             @form-radio-width: 10px;
             @form-textcolor: @grey3;
             // FORMS
             @label-width: 220px;
             //TODO: lisa: Eventually we don't need both of these; remove
             //            label-width when legend-width is no longer used
             @input-border-thickness: @border-thickness;
             @medium-inline-input-width: 115px;
             @input-description-minwidth: 300px;
             @label2-width: 200px;
             @checkboxes-width: 420px;
             @label-summary-minwidth: 80px;
             @search-form-width: 400px;
             @fields-input-m: 400px;
             @fields-input-l: 800px;
             // BUTTONS
             @button-padding: .9em;
             // DEFAULT WIDTHS
             @wrapper-maxwidth: 1200px;
             @sidebar-width: 145px;
             @sidebar-all-width: @sidebar-width + 2 * @sidebarpadding;
             @sidebar-small-width: 100px;
             @sidebar-small-all-width: @sidebar-small-width + 2 * @sidebarpadding;
             @texteditor-width: 660px;
             @maincontent-maxwidth: 940px;
             @pullrequest-width: 1025px;
             @summary-menu-stats-width: 200px;
             // SCREEN WIDTHS
             @screen-sm-min: 320px;
             // For Bootstrap
             @panel-border-radius: @border-radius;

General Comments 0

Write
Preview

You need to be logged in to leave comments. Login now

No TODOs yet

	Site-wide shortcuts
/	Use quick search box
g h	Goto home page
g g	Goto my private gists page
g G	Goto my public gists page
g 0-9	Goto bookmarked items from 0-9
n r	New repository page
n g	New gist page

	Repositories
g s	Goto summary page
g c	Goto changelog page
g f	Goto files page
g F	Goto files page with file search activated
g p	Goto pull requests page
g o	Goto repository settings
g O	Goto repository access permissions settings
t s	Toggle sidebar on some pages