Work around #4554 (Extension Manager font is hard to read on Windows), which is a Chromium bug, by avoiding the lightest font-weight on Win. Lighten the text slightly so it's still a little muted, like the design looks on Mac and with older CEFs on Win.

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/* Brackets patterns (and overrides and re-definitions of Bootstrap patterns)
 *
 * This file should contain all _reusable_ UI elements / LESS definitions
 * That is, things that will either a.) be used for more than one element or
 * b.) exist in multiple versions of brackets (e.g. App, In-Browser, etc.)
 *
 * Note that if you want a UI element to be themeable, you should put the
 * themeable part in "brackets_theme_default" as variables/mixins.
 *
 */

.panel {
    .vbox;
    .box-flex(1);

    padding: 0;
    margin: 0;

    background: @project-panel-base-color url("images/propertiespanel_back.png") repeat-x 0 0;
    color: #bbb;
    letter-spacing: .01em;
    text-shadow: 0px 1px 2px rgba(0,0,0,.5);
}

/* Toolbar-related styles */

/* Simple toolbar layout (project panel, find in files, etc.)
   We don't set this directly on .toolbar because it'd be a pain to override all the pieces
   if other code (e.g. #main-toolbar) wants to do a different layout */
.simple-toolbar-layout.toolbar {
    .hbox;
    .box-align(center);
    overflow: hidden;

    .title-wrapper {
        /* This is necessary because text-overflow: ellipsis doesn't work when it's set
           directly on a flexing box in Chrome currently. */
        .box-flex(1);
    }
    .buttons {
        .hbox;
        margin-left: 4px;
    }
}

/* Horizontal titlebar/menubar (in-browser only)

   CSS hack based on this code: http://jsfiddle.net/cD657/3/ (via StackOverflow)
   This center-aligns the title across the full width of the toolbar (ignoring the width of the nav floated
   left and buttons floated right), yet still have the browser automatically wrap the floats onto a 2nd row
   if they collide with the title. But the centered content must be a block element with fixed width. Since
   the editor title (filename) varies in width, we rely on JS code to update the width whenever the string
   changes.

   Another wrinkle: wrapping to/from the two-line toolbar layout requires notifying the CodeMirror editor that
   its height changed. Currently, we assume this can ONLY happen in two cases:
    - the window resizes (handled by general listener in EditorManager)
    - title content changes (the same JS code that sets .title-wrapper's fixed width is expected to handle this)
*/
#titlebar {
    // Visible only in-browser
    body.has-appshell-menus & {
        display: none;
    }

    text-align: center;
    .nav {  // menubar
        float: left;
        text-align: left;
        > li {
            float: left;
        }
    }
    .title {
        float: none;
        display: inline;  // must be an inline for JS to measure text size
    }
    .title-wrapper {
        margin: 0 auto;
        display: block;  // must be a block for the fixed width applied by JS to be respected
        // width set in px is appled/updated by JavaScript in DocumentCommandHandlers
    }
}

/* Vertical icon toolbar on right */
#main-toolbar {
    position: absolute;
    top: 0;
    right: 0;
    width: @main-toolbar-width;
    height: 100%;
    box-sizing: border-box;

    background: @main-toolbar-background-color;
    padding: 7px 0px;

    // Ensure icons are vertically stacked & horizontally centered
    .vbox;
    .box-flex(1);
    text-align: center;

    .buttons {
        text-align: center;
        margin: 0;

        > a {
            border-radius: 3px;
            background-repeat: none;
            display: block;
            height: 24px;
            margin: 7px 0px 0px 3px;
            width: 24px;
        }

        > a:hover {
            background-color: rgba(0, 0, 0, 0.24) !important;
        }

        > a:active {
            background-color: rgba(0, 0, 0, 0.66) !important;
        }
    }
}

/* Toolbar appearance - shared by all toolbars, independent of layout */

@toolbar-top-gap-px: 5px;

.toolbar {
    font-size: @label-font-size;
    padding: 4px 8px;
    background-color: @bc-white;
    color: @bc-black;

    position: relative;  // needed for abs-positioned elements in toolbar (e.g. right-aligned "X")

    .title-wrapper {
        // Title is taller than menu text, so reduce top padding to keep its baseline aligned
        padding: (@toolbar-top-gap-px - 3px) 0 3px 0;
    }
    .title {
        font-size: @title-font-size;
        line-height: normal;
        font-weight: @font-weight-light;

        // On Win, the size+weight combo used above does not look good for the bullet character
        .dirty-dot {
            font-weight: normal;
        }

        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .buttons {
        margin: @toolbar-top-gap-px 0 0 4px;

        span, a {
            cursor: default;
        }
    }
}

/* Menu-related styles */

@menubar-top-padding: 8px;
@menubar-bottom-padding: 6px;
@menubar-h-padding: 9px;
@item-highlight-color: #e0f0fa;

.toolbar .nav, .context-menu, .codehint-menu {

    // The 1px adjustments here are to account for the border around the top-level menu items.
    margin: (@toolbar-top-gap-px - @menubar-top-padding - 1) 0 (-@menubar-bottom-padding + 1) (-@menubar-h-padding + 4);

    // General item appearance
    a {
        color: @bc-black;
        text-shadow: none;
        cursor: default;
    }

    // Menubar item appearance
    .dropdown-toggle {
        padding: @menubar-top-padding @menubar-h-padding @menubar-bottom-padding;
        border: 1px solid rgba(0, 0, 0, 0); // transparent border just to hold the layout so it doesn't shift on hover
        color: fadeout(@bc-black, 25%);
        font-weight: @font-weight-light;
    }
    .dropdown-toggle:focus {
        background-color: @bc-white;
        outline: 0;
    }
    .dropdown-toggle:hover, .dropdown.open .dropdown-toggle {
        /* Note: we need several selectors for this in order to match the specificity of all the various Bootstrap
           color rules we need to override (and Bootstrap has several selectors because the colors really differ
           in their defaults). */
        color: @bc-black;
        background: @item-highlight-color;
        border-color: #dbeaf4;
    }

    // no triangle icon after menu items
    .dropdown-toggle:after {
        border: 0;
        margin: 0;
    }

    // Menu dropdown appearance
    .dropdown-menu {
        top: 34px; // Offset from top of menubar item

        margin-top: 0;
        background-color: @bc-white;
        border: 1px solid #c8c8c8;
        .border-radius(0 0 3px 3px);
        .box-shadow(0 6px 18px 0 rgba(0, 0, 0, .2));

        // Menu items
        li {
            a {
                font-size: @menu-item-font-size;
                line-height: 18px;

                // Slightly less padding on left to account for checkmark.
                // More padding on top than bottom to center font within its bg highlight better.
                padding: 2px 10px 0px 6px;

                color: @bc-black;
                text-shadow: none;
                white-space: nowrap;
                .box-shadow(none);

                &.wide-result {
                    white-space: normal;
                }

                &:hover, &.highlight {
                    color: @bc-black;
                    background: @item-highlight-color;
                }

                &.disabled {
                    color: @bc-gray;

                    &:hover {
                        background: @bc-white;
                    }
                }

                /* hidden checkmark for all list item content ensures consistent left spacing */
                &::before {
                    content: "✓\00a0"; /* non-breaking space */
                    visibility: hidden;
                }
                /* toggle checkmark visibility */
                &.checked::before {
                    visibility: visible;
                }
            }
        }

        .divider {
            background-color: #eaeaea;
            border: 0;
        }
    }

    // Ensure a minimum amount of space to the left of the shortcut
    .menu-shortcut {
        float: right;
        margin-left: 15px;
    }
}

/* Context menu styles */

.context-menu, .codehint-menu {
    position: absolute;
    z-index: @z-index-brackets-context-menu-base;
    list-style-type: none;

    .dropdown-menu {
        .border-radius(3px);
    }

    .menu-shortcut {
        float: right;
    }
}

.codehint-menu {
    .dropdown-menu {
        .box-shadow(none);
        max-height: 160px;
        overflow-y: auto;

        padding: 0;

        li {
            a {
                // Less padding than on menus. More padding on top than bottom
                // to center font within its bg highlight better.
                padding: 2px 20px 0px 0px;

                // Don't show highlighting on hover for code hints...
                &:hover {
                    color: @bc-black;
                    background-color: @bc-white;
                }

				// ...except for selected item
                &.highlight:hover {
                    color: @bc-black;
                    background-color: @item-highlight-color;
                }
            }
        }
    }
}

#context-menu-bar {
    margin: 0;
}

/* Dialog-related styles */

.modal {
    background-color: @tc-gray-panel;
    width: auto;
}

.modal .close {
    cursor: default;
    margin: 10px 5px 0 0;
}

.modal-header {
    background: @tc-gray-panel-top-bar;
    border-radius: 4px 4px 0 0;
    border-bottom: 1px solid @tc-gray-panel-separator;
}

.modal-body, .modal-header {
    /* See styles/bootstrap/patterns.less .modal class.
       Pushing this value down to .modal-header and .modal-body
       to allow the overall modal to take the width of the footer */
    width: 580px;
}

.modal-footer {
    text-align: right;
    background-color: @tc-gray-panel;
    border-top: 1px solid @tc-gray-panel-separator;
    box-shadow: none;
    white-space: nowrap;
}

.modal-footer .btn {
    float: none;
}
.modal-footer .btn.left {
    float: left;

    /* Transfer the margin to the right of each left-aligned button, so the left side lines up properly
     * with the title.
     */
    margin-left: 0;
    margin-right: 5px;
}
.modal-footer .btn:not(.left) {
    margin-left: 5px;
}

.platform-win {
    /* Reverse Save/Cancel button order on Win */
    .modal-footer {
        text-align: left;
    }
    .modal-footer .btn:not(.left) {
        float: right;
    }
}

.modal-body ul {
    /* Bootstrap's type.less defines a heavy margin-bottom on ul/ol that we don't want in dialogs
       since they have heavy padding instead. */
    margin-bottom: 0;
}

.dialog-title {
    color: @tc-light-weight-text;
    margin-bottom: 0;
    margin-top: 0;
    font-size: 26px;
    line-height: 40px;
    font-weight: @font-weight-light;
}

.dialog-message {
    color: @tc-light-weight-text;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 20px;
    font-weight: @font-weight-light;
}

.dialog-message li {
    line-height: 26px;
    color: @tc-light-weight-text;
}

.dialog-message select {
    margin-left: 10px;
}

.dialog-filename {
    font-weight: normal;
    word-wrap: break-word;
}

/* Any Dialog text in this style is automatically turned into a link that opens in the browser. Use data-href for the link's target. */
.clickable-link {
    cursor: pointer;
}

/* Update dialog */
.update-dialog .modal-body {
    position: relative;
    .update-icon {
        position: absolute;
        left: 30px; // relative to border of modal-body
        top: 20px;
        width: 80px;
        height: 80px;
    }
    .update-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        .update-info {
            max-height: 200px;
            overflow: auto;

            // Enable text selection
            cursor: auto;
            .user-select(text);
        }
    }
}

/* Project Settings and Install Extension dialogs */
.project-settings-dialog .modal-body, .install-extension-dialog .modal-body {
    text-align: center;

    .field-container {
        display: inline-block;
    }
    label {
        float: none;
    }
    input.url {
        display: inline;
    }
}

.project-settings-dialog .modal-body input.url {
    margin: 0 0 0 5px;
    width: 400px;
}

.install-extension-dialog {
    margin-top: -125px;
}
.install-extension-dialog .modal-body input.url {
    margin: 10px 0;
    width: 550px;
}

/* Extension Manager dialog */
.extension-manager-dialog {
    top: 50%;
    left: 50%;
    margin-top: -275px;
    margin-left: -350px;
    background-color: #d4d7d7;

    .modal-header {
        border-bottom: none;
        padding: 0;
        width: auto;

        .nav-tabs {
            margin: 0;
            border-color: #c3c6c5;

            /* Tab styling */
            > li > a {
                min-width: 80px;
                min-height: 60px;
                color: black;
                cursor: default;
                font-size: 12px;

                .box;
                box-sizing: border-box;
                .box-align(center);
                .box-pack(center);
                padding: 0;
                margin: 0;

                text-align: center;

                &:hover {
                    background-color: rgba(0, 0, 0, 0.04);
                    border-color: rgba(0, 0, 0, 0.04);
                }

                > img {
                    margin-top: 5px;
                    padding-bottom: 2px;
                }
            }

            /* Remove border-left from the first tab */
            > li:nth-child(1) > a {
                border-left: transparent;
            }

            /* Colors for the active tab, remove bottom border */
            > .active > a,
            > .active > a:hover {
                background-color: #dfe2e2;
                border-color: #b4b7b7 #b4b7b7 transparent #b4b7b7;
            }
        }

        /* Search box */
        > :nth-child(2) {
            position: absolute;
            top: 15px;
            right: 15px;
        }
        .search {
            background: #fff url("images/topcoat-search-20.svg") 3px 4px no-repeat;
            float: right;
            margin: 0;
            padding-left: 27px;
            padding-right: 20px;
        }
        .search-clear {
            position: relative;
            display: block;
            float: right;
            left: -5px;
            margin: 7px 0 0 -20px;
            opacity: 0.5;
            background: url("images/topcoat-cancel-15.svg") no-repeat;
            width: 15px;
            height: 16px;
            z-index: 1;
            border: 0;

            &:disabled {
                opacity: 0.3;
                cursor: default;
            }
        }
        .search-clear:active {
            opacity: 0.7;
            &:disabled {
                opacity: 0.3;
            }
        }
    }
    .modal-body {
        width: 730px;
        height: 400px;
        overflow-y: scroll;
        padding: 0;
        background-color: @tc-gray-panel;

        .empty-message {
            position: absolute;
            top: 50%;
            width: 100%;
            margin-top: -1em;
            text-align: center;
        }

        .info-message {
            background-color: @tc-gray-panel;
            padding: 1em;
        }

        .spinner {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -18px;
            margin-left: -18px;
        }

        .extension-list {
            td {
                height: 2em;
            }
            .ext-info {
                padding-left: 15px;
                width: 220px;
            }
            .ext-name {
                color: #000;
                display: block;
                font-size: 15px;
                font-weight: @font-weight-light;
                .user-select(text);
                cursor: text;
            }
            .ext-desc {
                color: #000;
                font-weight: @font-weight-light;
                width: auto;
                .user-select(text);
                cursor: text;
            }
            .platform-win & {  // work around #4554
                .ext-name, .ext-desc {
                    font-weight: normal;
                    color: #2e2e2e;
                }
            }
            .muted {
                color: #888;
            }
            .error {
                font-weight: @font-weight-semibold;
                color: #ff5656;
            }
            .ext-version,
            .ext-date,
            .ext-author {
                font-size: 11px;
            }
            .ext-action {
                font-size: 12px;
                padding-right: 15px;
                text-align: right;
                vertical-align: middle;
                width: 150px;
            }
            .load-error {
                display: inline-block;
                margin-top: 240px;
            }
        }
    }
}

/* About dialog */
.about-dialog .modal-body {
    // Simple two-column layout: image on left, text taking up remaining space on right
    position: relative;
    .about-icon {
        position: absolute;
        left: 10px;  // relative to border of modal-body (bounds outside padding)
        top:  11px;
    }
    .about-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        #about-build-number {
            color: @tc-light-weight-quiet-text;
        }
        .about-info {
            max-height: 300px;
            overflow: auto;
        }
        .about-contributors {
            min-height: 100px;
        }
        .about-contributors img {
            opacity: 0;
            -webkit-transition: opacity 1s;
            -moz-transition: opacity 1s;
            -o-transition: opacity 1s;
            transition: opacity 1s;
        }
    }

    h2 {
        font-weight: normal;
        font-size: 25px;
        margin-bottom: -4px;
        margin-top: 3px;
    }
    .dialog-message {
        font-size: 14px;
        line-height: 17px;

        // Enable text selection
        cursor: auto;
        .user-select(text);
    }
}

/* Input */
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
    background-color: @tc-input-background;
    border: 1px solid @tc-input-border;
    color: @tc-text;
    font-size: @baseFontSize + 1px;
    .border-radius(@tc-control-border-radius);
    .box-shadow(@tc-input-inner-shadow);
    .transition(~"border linear 0s, box-shadow linear 0s");

    &::-webkit-input-placeholder {
        color: @tc-input-placeholder-text;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
    }

    &:focus {
        outline: 0;
        background-color: @tc-input-background;
        color: @tc-text;
        text-shadow: none;
        border: 1px solid @tc-gray-component-focused-border;
        box-shadow: @tc-input-inner-shadow, @tc-input-glow;
    }

    &:disabled {
        opacity: @tc-disabled-opacity;
        cursor: default;
    }
}

/* Twipsy tooltips */
.tooltip-inner {
    .box-shadow(0 3px 6px 0 rgba(0, 0, 0, .36));
    max-width: none;
    white-space: nowrap;
}

/* Buttons */

// Base .btn styles

.btn:hover,
.btn:focus,
.btn.disabled,
.btn[disabled] {
    background-color: @tc-button-background;
}

.btn.primary:hover,
.btn.primary:focus,
.btn.primary.disabled,
.btn.primary[disabled] {
    background-color: @tc-call-to-action;
}

.btn {
    // Button Base
    background-image: none;

    background-color: @tc-button-background;
    text-shadow: @tc-text-shadow;
    color: @tc-text;
    cursor: default;
    font-size: @baseFontSize + 1;
    font-weight: @font-weight-semibold;
    line-height: normal;
    border: 1px solid @tc-gray-component-border;
    .border-radius(@tc-control-border-radius);
    box-shadow: @tc-button-highlight;

    &:hover {
        background-color: @tc-button-background;
        color: @tc-text;
    }

    // Focus state for keyboard and accessibility
    &:focus {
        border: 1px solid @tc-gray-component-focused-border;
        box-shadow: inset 0 1px 0 #fff, 0 0 0 2px #6fb5f1;
        color: @tc-text;
        outline: none;
    }

    // Active and Disabled states
    &.active,
    &:active {
        background-image: none;
        background-color: @tc-button-down-background;
        box-shadow: @tc-button-down-shadow;
        color: @tc-text;
    }

    &.disabled, &[disabled] {
        opacity: @tc-disabled-opacity;
    }

    // Primary Button Type
    &.primary {
        background-image: none;
        background-color: @tc-call-to-action;
        border: 1px solid  @tc-call-to-action-border;
        box-shadow: @tc-call-to-action-highlight;
        color: @tc-call-to-action-text;
        text-shadow: @tc-call-to-action-text-shadow;
        &.active,
        &:active {
            background-image: none;
            background-color: @tc-call-to-action-down;
            box-shadow: @tc-call-to-action-down-shadow;
        }

        &:focus {
            border: 1px solid @tc-gray-component-focused-border;
            box-shadow: @tc-call-to-action-highlight, @tc-input-glow;
            outline: none;
        }
    }

    // Button Sizes
    &.large {
        font-size: @baseFontSize + 1px;
        .border-radius(@tc-control-border-radius);
    }
    &.small {
        font-size: @baseFontSize - 1px;
    }
}

.btn-mini {
    padding: 2px 6px;
    font-size: 11px;
    font-weight: normal;
    line-height: 14px;
}

/* Tables */

.table, table {
    th {
        font-weight: @font-weight-semibold;
    }
    td {
        border-top: 1px solid transparent;
    }
    tbody th {
        border-top: 1px solid transparent);
    }
}

.table-striped tbody {
    tr:nth-child(odd) td,
    tr:nth-child(odd) th {
        background-color: #e6e9e9; // TopCoat palette
    }
    tr:nth-child(even) td,
    tr:nth-child(even) th {
        background-color: @tc-gray-panel; // turn off bootstrap hover highlight
    }
}
.row-highlight tbody {
    tr:hover td,
    tr:hover th {
        background-color: @tc-highlight; // TopCoat palette
    }
}

/* Emphasis */

strong {
    font-weight: @font-weight-semibold;
}

/* Type */

code {
    color: @bc-black;
    background-color: transparent;
}

label {
    font-size: @label-font-size;
}

/* Overriding Bootstrap's bold properties */

h1,
h2,
h3,
h4,
h5,
h6,
b,
strong,
dt,
.label {
    font-weight: @font-weight-semibold;
}

.alert-message a,
.form-stacked label {
    font-weight: @font-weight-semibold;
}

.alert {
    text-shadow: none;
    background-color: @tc-warning-background;
    border: none;
}
.alert,
.alert h4 {
    // Specified for the h4 to prevent conflicts of changing @headingsColor
    color: @tc-warning-text;
}

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/* Brackets patterns (and overrides and re-definitions of Bootstrap patterns)
 *
 * This file should contain all _reusable_ UI elements / LESS definitions
 * That is, things that will either a.) be used for more than one element or
 * b.) exist in multiple versions of brackets (e.g. App, In-Browser, etc.)
 *
 * Note that if you want a UI element to be themeable, you should put the
 * themeable part in "brackets_theme_default" as variables/mixins.
 *
 */

.panel {
    .vbox;
    .box-flex(1);

    padding: 0;
    margin: 0;

    background: @project-panel-base-color url("images/propertiespanel_back.png") repeat-x 0 0;
    color: #bbb;
    letter-spacing: .01em;
    text-shadow: 0px 1px 2px rgba(0,0,0,.5);
}

/* Toolbar-related styles */

/* Simple toolbar layout (project panel, find in files, etc.)
   We don't set this directly on .toolbar because it'd be a pain to override all the pieces
   if other code (e.g. #main-toolbar) wants to do a different layout */
.simple-toolbar-layout.toolbar {
    .hbox;
    .box-align(center);
    overflow: hidden;

    .title-wrapper {
        /* This is necessary because text-overflow: ellipsis doesn't work when it's set
           directly on a flexing box in Chrome currently. */
        .box-flex(1);
    }
    .buttons {
        .hbox;
        margin-left: 4px;
    }
}

/* Horizontal titlebar/menubar (in-browser only)

   CSS hack based on this code: http://jsfiddle.net/cD657/3/ (via StackOverflow)
   This center-aligns the title across the full width of the toolbar (ignoring the width of the nav floated
   left and buttons floated right), yet still have the browser automatically wrap the floats onto a 2nd row
   if they collide with the title. But the centered content must be a block element with fixed width. Since
   the editor title (filename) varies in width, we rely on JS code to update the width whenever the string
   changes.

   Another wrinkle: wrapping to/from the two-line toolbar layout requires notifying the CodeMirror editor that
   its height changed. Currently, we assume this can ONLY happen in two cases:
    - the window resizes (handled by general listener in EditorManager)
    - title content changes (the same JS code that sets .title-wrapper's fixed width is expected to handle this)
*/
#titlebar {
    // Visible only in-browser
    body.has-appshell-menus & {
        display: none;
    }

    text-align: center;
    .nav {  // menubar
        float: left;
        text-align: left;
        > li {
            float: left;
        }
    }
    .title {
        float: none;
        display: inline;  // must be an inline for JS to measure text size
    }
    .title-wrapper {
        margin: 0 auto;
        display: block;  // must be a block for the fixed width applied by JS to be respected
        // width set in px is appled/updated by JavaScript in DocumentCommandHandlers
    }
}

/* Vertical icon toolbar on right */
#main-toolbar {
    position: absolute;
    top: 0;
    right: 0;
    width: @main-toolbar-width;
    height: 100%;
    box-sizing: border-box;

    background: @main-toolbar-background-color;
    padding: 7px 0px;

    // Ensure icons are vertically stacked & horizontally centered
    .vbox;
    .box-flex(1);
    text-align: center;

    .buttons {
        text-align: center;
        margin: 0;

        > a {
            border-radius: 3px;
            background-repeat: none;
            display: block;
            height: 24px;
            margin: 7px 0px 0px 3px;
            width: 24px;
        }

        > a:hover {
            background-color: rgba(0, 0, 0, 0.24) !important;
        }

        > a:active {
            background-color: rgba(0, 0, 0, 0.66) !important;
        }
    }
}

/* Toolbar appearance - shared by all toolbars, independent of layout */

@toolbar-top-gap-px: 5px;

.toolbar {
    font-size: @label-font-size;
    padding: 4px 8px;
    background-color: @bc-white;
    color: @bc-black;

    position: relative;  // needed for abs-positioned elements in toolbar (e.g. right-aligned "X")

    .title-wrapper {
        // Title is taller than menu text, so reduce top padding to keep its baseline aligned
        padding: (@toolbar-top-gap-px - 3px) 0 3px 0;
    }
    .title {
        font-size: @title-font-size;
        line-height: normal;
        font-weight: @font-weight-light;

        // On Win, the size+weight combo used above does not look good for the bullet character
        .dirty-dot {
            font-weight: normal;
        }

        white-space: nowrap;
        overflow: hidden;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
    }

    .buttons {
        margin: @toolbar-top-gap-px 0 0 4px;

        span, a {
            cursor: default;
        }
    }
}

/* Menu-related styles */

@menubar-top-padding: 8px;
@menubar-bottom-padding: 6px;
@menubar-h-padding: 9px;
@item-highlight-color: #e0f0fa;

.toolbar .nav, .context-menu, .codehint-menu {

    // The 1px adjustments here are to account for the border around the top-level menu items.
    margin: (@toolbar-top-gap-px - @menubar-top-padding - 1) 0 (-@menubar-bottom-padding + 1) (-@menubar-h-padding + 4);

    // General item appearance
    a {
        color: @bc-black;
        text-shadow: none;
        cursor: default;
    }

    // Menubar item appearance
    .dropdown-toggle {
        padding: @menubar-top-padding @menubar-h-padding @menubar-bottom-padding;
        border: 1px solid rgba(0, 0, 0, 0); // transparent border just to hold the layout so it doesn't shift on hover
        color: fadeout(@bc-black, 25%);
        font-weight: @font-weight-light;
    }
    .dropdown-toggle:focus {
        background-color: @bc-white;
        outline: 0;
    }
    .dropdown-toggle:hover, .dropdown.open .dropdown-toggle {
        /* Note: we need several selectors for this in order to match the specificity of all the various Bootstrap
           color rules we need to override (and Bootstrap has several selectors because the colors really differ
           in their defaults). */
        color: @bc-black;
        background: @item-highlight-color;
        border-color: #dbeaf4;
    }

    // no triangle icon after menu items
    .dropdown-toggle:after {
        border: 0;
        margin: 0;
    }

    // Menu dropdown appearance
    .dropdown-menu {
        top: 34px; // Offset from top of menubar item

        margin-top: 0;
        background-color: @bc-white;
        border: 1px solid #c8c8c8;
        .border-radius(0 0 3px 3px);
        .box-shadow(0 6px 18px 0 rgba(0, 0, 0, .2));

        // Menu items
        li {
            a {
                font-size: @menu-item-font-size;
                line-height: 18px;

                // Slightly less padding on left to account for checkmark.
                // More padding on top than bottom to center font within its bg highlight better.
                padding: 2px 10px 0px 6px;

                color: @bc-black;
                text-shadow: none;
                white-space: nowrap;
                .box-shadow(none);

                &.wide-result {
                    white-space: normal;
                }

                &:hover, &.highlight {
                    color: @bc-black;
                    background: @item-highlight-color;
                }

                &.disabled {
                    color: @bc-gray;

                    &:hover {
                        background: @bc-white;
                    }
                }

                /* hidden checkmark for all list item content ensures consistent left spacing */
                &::before {
                    content: "✓\00a0"; /* non-breaking space */
                    visibility: hidden;
                }
                /* toggle checkmark visibility */
                &.checked::before {
                    visibility: visible;
                }
            }
        }

        .divider {
            background-color: #eaeaea;
            border: 0;
        }
    }

    // Ensure a minimum amount of space to the left of the shortcut
    .menu-shortcut {
        float: right;
        margin-left: 15px;
    }
}

/* Context menu styles */

.context-menu, .codehint-menu {
    position: absolute;
    z-index: @z-index-brackets-context-menu-base;
    list-style-type: none;

    .dropdown-menu {
        .border-radius(3px);
    }

    .menu-shortcut {
        float: right;
    }
}

.codehint-menu {
    .dropdown-menu {
        .box-shadow(none);
        max-height: 160px;
        overflow-y: auto;

        padding: 0;

        li {
            a {
                // Less padding than on menus. More padding on top than bottom
                // to center font within its bg highlight better.
                padding: 2px 20px 0px 0px;

                // Don't show highlighting on hover for code hints...
                &:hover {
                    color: @bc-black;
                    background-color: @bc-white;
                }

				// ...except for selected item
                &.highlight:hover {
                    color: @bc-black;
                    background-color: @item-highlight-color;
                }
            }
        }
    }
}

#context-menu-bar {
    margin: 0;
}

/* Dialog-related styles */

.modal {
    background-color: @tc-gray-panel;
    width: auto;
}

.modal .close {
    cursor: default;
    margin: 10px 5px 0 0;
}

.modal-header {
    background: @tc-gray-panel-top-bar;
    border-radius: 4px 4px 0 0;
    border-bottom: 1px solid @tc-gray-panel-separator;
}

.modal-body, .modal-header {
    /* See styles/bootstrap/patterns.less .modal class.
       Pushing this value down to .modal-header and .modal-body
       to allow the overall modal to take the width of the footer */
    width: 580px;
}

.modal-footer {
    text-align: right;
    background-color: @tc-gray-panel;
    border-top: 1px solid @tc-gray-panel-separator;
    box-shadow: none;
    white-space: nowrap;
}

.modal-footer .btn {
    float: none;
}
.modal-footer .btn.left {
    float: left;

    /* Transfer the margin to the right of each left-aligned button, so the left side lines up properly
     * with the title.
     */
    margin-left: 0;
    margin-right: 5px;
}
.modal-footer .btn:not(.left) {
    margin-left: 5px;
}

.platform-win {
    /* Reverse Save/Cancel button order on Win */
    .modal-footer {
        text-align: left;
    }
    .modal-footer .btn:not(.left) {
        float: right;
    }
}

.modal-body ul {
    /* Bootstrap's type.less defines a heavy margin-bottom on ul/ol that we don't want in dialogs
       since they have heavy padding instead. */
    margin-bottom: 0;
}

.dialog-title {
    color: @tc-light-weight-text;
    margin-bottom: 0;
    margin-top: 0;
    font-size: 26px;
    line-height: 40px;
    font-weight: @font-weight-light;
}

.dialog-message {
    color: @tc-light-weight-text;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 20px;
    font-weight: @font-weight-light;
}

.dialog-message li {
    line-height: 26px;
    color: @tc-light-weight-text;
}

.dialog-message select {
    margin-left: 10px;
}

.dialog-filename {
    font-weight: normal;
    word-wrap: break-word;
}

/* Any Dialog text in this style is automatically turned into a link that opens in the browser. Use data-href for the link's target. */
.clickable-link {
    cursor: pointer;
}

/* Update dialog */
.update-dialog .modal-body {
    position: relative;
    .update-icon {
        position: absolute;
        left: 30px; // relative to border of modal-body
        top: 20px;
        width: 80px;
        height: 80px;
    }
    .update-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        .update-info {
            max-height: 200px;
            overflow: auto;

            // Enable text selection
            cursor: auto;
            .user-select(text);
        }
    }
}

/* Project Settings and Install Extension dialogs */
.project-settings-dialog .modal-body, .install-extension-dialog .modal-body {
    text-align: center;

    .field-container {
        display: inline-block;
    }
    label {
        float: none;
    }
    input.url {
        display: inline;
    }
}

.project-settings-dialog .modal-body input.url {
    margin: 0 0 0 5px;
    width: 400px;
}

.install-extension-dialog {
    margin-top: -125px;
}
.install-extension-dialog .modal-body input.url {
    margin: 10px 0;
    width: 550px;
}

/* Extension Manager dialog */
.extension-manager-dialog {
    top: 50%;
    left: 50%;
    margin-top: -275px;
    margin-left: -350px;
    background-color: #d4d7d7;

    .modal-header {
        border-bottom: none;
        padding: 0;
        width: auto;

        .nav-tabs {
            margin: 0;
            border-color: #c3c6c5;

            /* Tab styling */
            > li > a {
                min-width: 80px;
                min-height: 60px;
                color: black;
                cursor: default;
                font-size: 12px;

                .box;
                box-sizing: border-box;
                .box-align(center);
                .box-pack(center);
                padding: 0;
                margin: 0;

                text-align: center;

                &:hover {
                    background-color: rgba(0, 0, 0, 0.04);
                    border-color: rgba(0, 0, 0, 0.04);
                }

                > img {
                    margin-top: 5px;
                    padding-bottom: 2px;
                }
            }

            /* Remove border-left from the first tab */
            > li:nth-child(1) > a {
                border-left: transparent;
            }

            /* Colors for the active tab, remove bottom border */
            > .active > a,
            > .active > a:hover {
                background-color: #dfe2e2;
                border-color: #b4b7b7 #b4b7b7 transparent #b4b7b7;
            }
        }

        /* Search box */
        > :nth-child(2) {
            position: absolute;
            top: 15px;
            right: 15px;
        }
        .search {
            background: #fff url("images/topcoat-search-20.svg") 3px 4px no-repeat;
            float: right;
            margin: 0;
            padding-left: 27px;
            padding-right: 20px;
        }
        .search-clear {
            position: relative;
            display: block;
            float: right;
            left: -5px;
            margin: 7px 0 0 -20px;
            opacity: 0.5;
            background: url("images/topcoat-cancel-15.svg") no-repeat;
            width: 15px;
            height: 16px;
            z-index: 1;
            border: 0;

            &:disabled {
                opacity: 0.3;
                cursor: default;
            }
        }
        .search-clear:active {
            opacity: 0.7;
            &:disabled {
                opacity: 0.3;
            }
        }
    }
    .modal-body {
        width: 730px;
        height: 400px;
        overflow-y: scroll;
        padding: 0;
        background-color: @tc-gray-panel;

        .empty-message {
            position: absolute;
            top: 50%;
            width: 100%;
            margin-top: -1em;
            text-align: center;
        }

        .info-message {
            background-color: @tc-gray-panel;
            padding: 1em;
        }

        .spinner {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-top: -18px;
            margin-left: -18px;
        }

        .extension-list {
            td {
                height: 2em;
            }
            .ext-info {
                padding-left: 15px;
                width: 220px;
            }
            .ext-name {
                color: #000;
                display: block;
                font-size: 15px;
                font-weight: @font-weight-light;
                .user-select(text);
                cursor: text;
            }
            .ext-desc {
                color: #000;
                font-weight: @font-weight-light;
                width: auto;
                .user-select(text);
                cursor: text;
            }
            .muted {
                color: #888;
            }
            .error {
                font-weight: @font-weight-semibold;
                color: #ff5656;
            }
            .ext-version,
            .ext-date,
            .ext-author {
                font-size: 11px;
            }
            .ext-action {
                font-size: 12px;
                padding-right: 15px;
                text-align: right;
                vertical-align: middle;
                width: 150px;
            }
            .load-error {
                display: inline-block;
                margin-top: 240px;
            }
        }
    }
}

/* About dialog */
.about-dialog .modal-body {
    // Simple two-column layout: image on left, text taking up remaining space on right
    position: relative;
    .about-icon {
        position: absolute;
        left: 10px;  // relative to border of modal-body (bounds outside padding)
        top:  11px;
    }
    .about-text {
        // Icon is 120px, so we need at least that much left padding/margin to avoid overlap
        margin: 0 10px 0 123px;

        #about-build-number {
            color: @tc-light-weight-quiet-text;
        }
        .about-info {
            max-height: 300px;
            overflow: auto;
        }
        .about-contributors {
            min-height: 100px;
        }
        .about-contributors img {
            opacity: 0;
            -webkit-transition: opacity 1s;
            -moz-transition: opacity 1s;
            -o-transition: opacity 1s;
            transition: opacity 1s;
        }
    }

    h2 {
        font-weight: normal;
        font-size: 25px;
        margin-bottom: -4px;
        margin-top: 3px;
    }
    .dialog-message {
        font-size: 14px;
        line-height: 17px;

        // Enable text selection
        cursor: auto;
        .user-select(text);
    }
}

/* Input */
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
    background-color: @tc-input-background;
    border: 1px solid @tc-input-border;
    color: @tc-text;
    font-size: @baseFontSize + 1px;
    .border-radius(@tc-control-border-radius);
    .box-shadow(@tc-input-inner-shadow);
    .transition(~"border linear 0s, box-shadow linear 0s");

    &::-webkit-input-placeholder {
        color: @tc-input-placeholder-text;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
    }

    &:focus {
        outline: 0;
        background-color: @tc-input-background;
        color: @tc-text;
        text-shadow: none;
        border: 1px solid @tc-gray-component-focused-border;
        box-shadow: @tc-input-inner-shadow, @tc-input-glow;
    }

    &:disabled {
        opacity: @tc-disabled-opacity;
        cursor: default;
    }
}

/* Twipsy tooltips */
.tooltip-inner {
    .box-shadow(0 3px 6px 0 rgba(0, 0, 0, .36));
    max-width: none;
    white-space: nowrap;
}

/* Buttons */

// Base .btn styles

.btn:hover,
.btn:focus,
.btn.disabled,
.btn[disabled] {
    background-color: @tc-button-background;
}

.btn.primary:hover,
.btn.primary:focus,
.btn.primary.disabled,
.btn.primary[disabled] {
    background-color: @tc-call-to-action;
}

.btn {
    // Button Base
    background-image: none;

    background-color: @tc-button-background;
    text-shadow: @tc-text-shadow;
    color: @tc-text;
    cursor: default;
    font-size: @baseFontSize + 1;
    font-weight: @font-weight-semibold;
    line-height: normal;
    border: 1px solid @tc-gray-component-border;
    .border-radius(@tc-control-border-radius);
    box-shadow: @tc-button-highlight;

    &:hover {
        background-color: @tc-button-background;
        color: @tc-text;
    }

    // Focus state for keyboard and accessibility
    &:focus {
        border: 1px solid @tc-gray-component-focused-border;
        box-shadow: inset 0 1px 0 #fff, 0 0 0 2px #6fb5f1;
        color: @tc-text;
        outline: none;
    }

    // Active and Disabled states
    &.active,
    &:active {
        background-image: none;
        background-color: @tc-button-down-background;
        box-shadow: @tc-button-down-shadow;
        color: @tc-text;
    }

    &.disabled, &[disabled] {
        opacity: @tc-disabled-opacity;
    }

    // Primary Button Type
    &.primary {
        background-image: none;
        background-color: @tc-call-to-action;
        border: 1px solid  @tc-call-to-action-border;
        box-shadow: @tc-call-to-action-highlight;
        color: @tc-call-to-action-text;
        text-shadow: @tc-call-to-action-text-shadow;
        &.active,
        &:active {
            background-image: none;
            background-color: @tc-call-to-action-down;
            box-shadow: @tc-call-to-action-down-shadow;
        }

        &:focus {
            border: 1px solid @tc-gray-component-focused-border;
            box-shadow: @tc-call-to-action-highlight, @tc-input-glow;
            outline: none;
        }
    }

    // Button Sizes
    &.large {
        font-size: @baseFontSize + 1px;
        .border-radius(@tc-control-border-radius);
    }
    &.small {
        font-size: @baseFontSize - 1px;
    }
}

.btn-mini {
    padding: 2px 6px;
    font-size: 11px;
    font-weight: normal;
    line-height: 14px;
}

/* Tables */

.table, table {
    th {
        font-weight: @font-weight-semibold;
    }
    td {
        border-top: 1px solid transparent;
    }
    tbody th {
        border-top: 1px solid transparent);
    }
}

.table-striped tbody {
    tr:nth-child(odd) td,
    tr:nth-child(odd) th {
        background-color: #e6e9e9; // TopCoat palette
    }
    tr:nth-child(even) td,
    tr:nth-child(even) th {
        background-color: @tc-gray-panel; // turn off bootstrap hover highlight
    }
}
.row-highlight tbody {
    tr:hover td,
    tr:hover th {
        background-color: @tc-highlight; // TopCoat palette
    }
}

/* Emphasis */

strong {
    font-weight: @font-weight-semibold;
}

/* Type */

code {
    color: @bc-black;
    background-color: transparent;
}

label {
    font-size: @label-font-size;
}

/* Overriding Bootstrap's bold properties */

h1,
h2,
h3,
h4,
h5,
h6,
b,
strong,
dt,
.label {
    font-weight: @font-weight-semibold;
}

.alert-message a,
.form-stacked label {
    font-weight: @font-weight-semibold;
}

.alert {
    text-shadow: none;
    background-color: @tc-warning-background;
    border: none;
}
.alert,
.alert h4 {
    // Specified for the h4 to prevent conflicts of changing @headingsColor
    color: @tc-warning-text;
}


added the new subclass .even

added the new subclass .even

fatal: unable to access 'https://github.com/dedalozzo/pit-bootstrap.git/': The requested URL returned error: 403


changed the .link color from cyan to pink

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/dedalozzo/pit-bootstrap.git/'


moving the legend up a bit for pie charts

fatal: unable to access 'https://github.com/cablelabs/dev-portal.git/': The requested URL returned error: 403


added rss brand color from brandcolors.net

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Livefyre/livefyre-bootstrap.git/'


Use proper selected variable

Use proper selected variable

@import "ui-variables";
@import "ui-mixins";
@import "octicon-mixins";

.list-group, .list-tree {
  li:not(.list-nested-item),
  li.list-nested-item > .list-item {
    .text(normal);
  }

  .generate-list-item-text-color(@class) {
    li:not(.list-nested-item).text-@{class},
    li.list-nested-item.text-@{class} > .list-item {
      .text(@class);
    }
  }
  .generate-list-item-text-color(subtle);
  .generate-list-item-text-color(info);
  .generate-list-item-text-color(success);
  .generate-list-item-text-color(warning);
  .generate-list-item-text-color(error);
  .generate-list-item-text-color(selected);

  li:not(.list-nested-item).selected,
  li.list-nested-item.selected > .list-item {
    .text(selected);
  }

  .generate-list-item-status-color(@textClass, @status) {
    li:not(.list-nested-item).status-@{status},
    li.list-nested-item.status-@{status} > .list-item {
      .text(@textClass);
    }
  }
  .generate-list-item-status-color(subtle, ignored);
  .generate-list-item-status-color(info, added);
  .generate-list-item-status-color(success, renamed);
  .generate-list-item-status-color(warning, modified);
  .generate-list-item-status-color(error, removed);

  li:not(.list-nested-item):hover,
  li.list-nested-item:hover > .list-item, // i.e. highlight directory when hover child file
  li.list-nested-item .list-item:hover,
  li.list-nested-item .list-item:hover .disclosure-arrow,
  .selected > .list-nested-item > .list-item .disclosure-arrow,
  .selected > .list-nested-item > .list-item:hover .disclosure-arrow  {
    .text(highlight);
  }
}

&.select-list ol.list-group, .select-list ol.list-group {
  li.two-lines {
    .secondary-line { color: @text-color-subtle; }
    &.selected .secondary-line { color: lighten(@text-color-subtle, 10%); }
  }

  // We want to highlight the background of the list items because we dont
  // know their size.
  li.selected {
    background-color: @background-color-highlight;
    &:before{ display: none; }
  }

  &.mark-active{
    @active-icon-size: 14px;

    // pad in front of the text where the icon would be We'll pad the non-
    // active items with a 'fake' icon so other classes can pad the item
    // without worrying about the icon padding.
    li:before {
      content: '';
      background-color: transparent;
      position: static;
      display: inline-block;
      left: auto; right: auto;
      height: @active-icon-size;
      width: @active-icon-size;
    }
    > li:not(.active):before {
      margin-right: @component-icon-padding;
    }
    li.active {
      .octicon(check, @active-icon-size);
      &:before {
        margin-right: @component-icon-padding;
        color: @text-color-success;
      }
    }
  }
}

.select-list.popover-list {
  background-color: @overlay-background-color;
  -webkit-box-shadow: 0 0 3px 3px @base-border-color;
  padding: @component-padding/2;
  border-radius: @component-border-radius;
  border: 1px solid @overlay-border-color;

  .editor {
    margin-bottom: @component-padding/2;
  }

  .list-group li {
    padding-left: @component-padding/2;
  }
}

@import "ui-variables";
@import "ui-mixins";
@import "octicon-mixins";

.list-group, .list-tree {
  li:not(.list-nested-item),
  li.list-nested-item > .list-item {
    .text(normal);
  }

  .generate-list-item-text-color(@class) {
    li:not(.list-nested-item).text-@{class},
    li.list-nested-item.text-@{class} > .list-item {
      .text(@class);
    }
  }
  .generate-list-item-text-color(subtle);
  .generate-list-item-text-color(info);
  .generate-list-item-text-color(success);
  .generate-list-item-text-color(warning);
  .generate-list-item-text-color(error);
  .generate-list-item-text-color(selected);

  .generate-list-item-status-color(@textClass, @status) {
    li:not(.list-nested-item).status-@{status},
    li.list-nested-item.status-@{status} > .list-item {
      .text(@textClass);
    }
  }
  .generate-list-item-status-color(subtle, ignored);
  .generate-list-item-status-color(info, added);
  .generate-list-item-status-color(success, renamed);
  .generate-list-item-status-color(warning, modified);
  .generate-list-item-status-color(error, removed);

  li:not(.list-nested-item):hover,
  li.list-nested-item:hover > .list-item, // i.e. highlight directory when hover child file
  li.list-nested-item .list-item:hover,
  li.list-nested-item .list-item:hover .disclosure-arrow,
  .selected > .list-nested-item > .list-item .disclosure-arrow,
  .selected > .list-nested-item > .list-item:hover .disclosure-arrow  {
    .text(highlight);
  }
}

&.select-list ol.list-group, .select-list ol.list-group {
  li.two-lines {
    .secondary-line { color: @text-color-subtle; }
    &.selected .secondary-line { color: lighten(@text-color-subtle, 10%); }
  }

  // We want to highlight the background of the list items because we dont
  // know their size.
  li.selected {
    background-color: @background-color-highlight;
    &:before{ display: none; }
  }

  &.mark-active{
    @active-icon-size: 14px;

    // pad in front of the text where the icon would be We'll pad the non-
    // active items with a 'fake' icon so other classes can pad the item
    // without worrying about the icon padding.
    li:before {
      content: '';
      background-color: transparent;
      position: static;
      display: inline-block;
      left: auto; right: auto;
      height: @active-icon-size;
      width: @active-icon-size;
    }
    > li:not(.active):before {
      margin-right: @component-icon-padding;
    }
    li.active {
      .octicon(check, @active-icon-size);
      &:before {
        margin-right: @component-icon-padding;
        color: @text-color-success;
      }
    }
  }
}

.select-list.popover-list {
  background-color: @overlay-background-color;
  -webkit-box-shadow: 0 0 3px 3px @base-border-color;
  padding: @component-padding/2;
  border-radius: @component-border-radius;
  border: 1px solid @overlay-border-color;

  .editor {
    margin-bottom: @component-padding/2;
  }

  .list-group li {
    padding-left: @component-padding/2;
  }
}


Increase contrast of subtle text in the settings

@import "ui-variables";

.settings-view {

  select.form-control {
    border: none;
  }

  atom-text-editor .placeholder-text, // <-- deprecated
  atom-text-editor::shadow .placeholder-text {
    color: lighten(@text-color-subtle, 15%);
  }

  .available-package-view .meta-user .author {
    color: lighten(@text-color-subtle, 10%);
  }

}

@import "ui-variables";

.settings-view {
  select.form-control {
    border: none;
  }
}


课程列表更改

课程列表更改

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/XUEJS/xue-project.git/'


[Backoffice] Fix mobile menu.

[Backoffice] Fix mobile menu.

/**
 * Bootstrap
 */
@bootstrap_path: '@{vendor_path}/bootstrap/less';

// Core variables and mixins
@import "@{bootstrap_path}/variables.less";
@import "bootstrap-variables.less";
@import "@{bootstrap_path}/mixins.less";

// Reset and dependencies
@import "@{bootstrap_path}/normalize.less";
@import "@{bootstrap_path}/print.less";
@import "@{bootstrap_path}/glyphicons.less";

// Core CSS
@import "@{bootstrap_path}/scaffolding.less";
@import "@{bootstrap_path}/type.less";
@import "@{bootstrap_path}/code.less";
@import "@{bootstrap_path}/grid.less";
@import "@{bootstrap_path}/tables.less";
@import "@{bootstrap_path}/forms.less";
@import "@{bootstrap_path}/buttons.less";

// Components
@import "@{bootstrap_path}/component-animations.less";
@import "@{bootstrap_path}/dropdowns.less";
@import "@{bootstrap_path}/button-groups.less";
@import "@{bootstrap_path}/input-groups.less";
@import "@{bootstrap_path}/navs.less";
@import "@{bootstrap_path}/navbar.less";
@import "@{bootstrap_path}/breadcrumbs.less";
@import "@{bootstrap_path}/labels.less";
@import "@{bootstrap_path}/alerts.less";
@import "@{bootstrap_path}/pagination.less";
@import "@{bootstrap_path}/responsive-embed.less";
@import "@{bootstrap_path}/close.less";

// Components w/ JavaScript
@import "@{bootstrap_path}/modals.less";

// Utility classes
@import "@{bootstrap_path}/utilities.less";
@import "@{bootstrap_path}/responsive-utilities.less";

.label {
  border-radius: 0;
}

/**
 * Bootstrap
 */
@bootstrap_path: '@{vendor_path}/bootstrap/less';

// Core variables and mixins
@import "@{bootstrap_path}/variables.less";
@import "bootstrap-variables.less";
@import "@{bootstrap_path}/mixins.less";

// Reset and dependencies
@import "@{bootstrap_path}/normalize.less";
@import "@{bootstrap_path}/print.less";
@import "@{bootstrap_path}/glyphicons.less";

// Core CSS
@import "@{bootstrap_path}/scaffolding.less";
@import "@{bootstrap_path}/type.less";
@import "@{bootstrap_path}/code.less";
@import "@{bootstrap_path}/grid.less";
@import "@{bootstrap_path}/tables.less";
@import "@{bootstrap_path}/forms.less";
@import "@{bootstrap_path}/buttons.less";

// Components
@import "@{bootstrap_path}/dropdowns.less";
@import "@{bootstrap_path}/button-groups.less";
@import "@{bootstrap_path}/input-groups.less";
@import "@{bootstrap_path}/navs.less";
@import "@{bootstrap_path}/navbar.less";
@import "@{bootstrap_path}/breadcrumbs.less";
@import "@{bootstrap_path}/labels.less";
@import "@{bootstrap_path}/alerts.less";
@import "@{bootstrap_path}/pagination.less";
@import "@{bootstrap_path}/close.less";

// Components w/ JavaScript
@import "@{bootstrap_path}/modals.less";

// Utility classes
@import "@{bootstrap_path}/utilities.less";
@import "@{bootstrap_path}/responsive-utilities.less";

.label {
  border-radius: 0;
}


set color for toolbar icons

set color for toolbar icons

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/cudim/pages-plugin.git/'


Raise z-index of AppBar to 10

Raise z-index of AppBar to 10

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Thinkful/ui.git/'


Add panel styles

Add panel styles

with bootstrap patterns

//
// Panels
// --------------------------------------------------

// Base class
.panel {
  margin-bottom: @line-height-computed;
  background-color: @panel-bg;
  border: 1px solid transparent;
  border-radius: @panel-border-radius;
  .box-shadow(0 1px 1px rgba(0,0,0,.05));
}

// Panel contents
.panel-body {
  padding: @panel-body-padding;
  &:extend(.clearfix all);
}

// List groups in panels
//
// By default, space out list group content from panel headings to account for
// any kind of custom content between the two.

.panel {
  > .list-group {
    margin-bottom: 0;

    .list-group-item {
      border-width: 1px 0;

      // Remove border radius for top one
      &:first-child {
        .border-top-radius(0);
      }
      // But keep it for the last one
      &:last-child {
        border-bottom: 0;
      }
    }
  }
}
// Collapse space between when there's no additional content.
.panel-heading + .list-group {
  .list-group-item:first-child {
    border-top-width: 0;
  }
}

// Tables in panels
//
// Place a non-bordered `.table` within a panel (not within a `.panel-body`) and
// watch it go full width.

.panel {
  > .table,
  > .table-responsive > .table {
    margin-bottom: 0;

    > tbody:last-child,
    > tfoot:last-child {
      > tr:last-child {
        td:first-child,
        th:first-child {
          border-bottom-left-radius: (@panel-border-radius - 1);
        }
        td:last-child,
        th:last-child {
          border-bottom-right-radius: (@panel-border-radius - 1);
        }
      }
    }
  }
  > .panel-body + .table,
  > .panel-body + .table-responsive {
    border-top: 1px solid @table-border-color;
  }
  > .table > tbody:first-child th,
  > .table > tbody:first-child td {
    border-top: 0;
  }
  > .table-bordered,
  > .table-responsive > .table-bordered {
    border: 0;
    > thead,
    > tbody,
    > tfoot {
      > tr {
        > th:first-child,
        > td:first-child {
          border-left: 0;
        }
        > th:last-child,
        > td:last-child {
          border-right: 0;
        }

        &:last-child > th,
        &:last-child > td {
          border-bottom: 0;
        }
      }
    }
  }
  > .table-responsive {
    border: 0;
    margin-bottom: 0;
  }
}

// Optional heading
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  .border-top-radius((@panel-border-radius - 1));

  > .dropdown .dropdown-toggle {
    color: inherit;
  }
}

// Within heading, strip any `h*` tag of its default margins for spacing.
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: ceil((@font-size-base * 1.125));
  color: inherit;

  > a {
    color: inherit;
  }
}

// Optional footer (stays gray in every modifier class)
.panel-footer {
  padding: 10px 15px;
  background-color: @panel-footer-bg;
  border-top: 1px solid @panel-inner-border;
  .border-bottom-radius((@panel-border-radius - 1));
}

// Collapsable panels (aka, accordion)
//
// Wrap a series of panels in `.panel-group` to turn them into an accordion with
// the help of our collapse JavaScript plugin.

.panel-group {
  // Tighten up margin so it's only between panels
  .panel {
    margin-bottom: 0;
    border-radius: @panel-border-radius;
    overflow: hidden; // crop contents when collapsed
    + .panel {
      margin-top: 5px;
    }
  }

  .panel-heading {
    border-bottom: 0;
    + .panel-collapse .panel-body {
      border-top: 1px solid @panel-inner-border;
    }
  }
  .panel-footer {
    border-top: 0;
    + .panel-collapse .panel-body {
      border-bottom: 1px solid @panel-inner-border;
    }
  }
}

// Contextual variations
.panel-default {
  .panel-variant(@panel-default-border; @panel-default-text; @panel-default-heading-bg; @panel-default-border);
}
.panel-primary {
  .panel-variant(@panel-primary-border; @panel-primary-text; @panel-primary-heading-bg; @panel-primary-border);
}
.panel-success {
  .panel-variant(@panel-success-border; @panel-success-text; @panel-success-heading-bg; @panel-success-border);
}
.panel-warning {
  .panel-variant(@panel-warning-border; @panel-warning-text; @panel-warning-heading-bg; @panel-warning-border);
}
.panel-danger {
  .panel-variant(@panel-danger-border; @panel-danger-text; @panel-danger-heading-bg; @panel-danger-border);
}
.panel-info {
  .panel-variant(@panel-info-border; @panel-info-text; @panel-info-heading-bg; @panel-info-border);
}

error: pathspec 'cp-strap/src/stylesheets/components/panels.less' did not match any file(s) known to git


screenshot toggle should be, you know, visible. (bug 852073)

fatal: unable to open .git/objects/pack/tmp_pack_ZWWFtd: No such file or directory
fatal: index-pack failed


Normalises submit buttons

Normalises submit buttons

Restores missing styles for submit buttons in e-commerce and brings the settings save button in line with the other submit buttons.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/hevnly/asset-bazaar.git/'


Add ::shadow pesudo to elements + refactor/group code

@import "ui-variables";
@import "icon-variables";
@import "ui-mixins";

atom-text-editor[mini], atom-text-editor[mini]::shadow {
  color: @input-text-color;
  background-color: @input-background-color-selected;
  border: 1px solid @input-border-color;
  box-shadow: none;
  border-radius: @component-border-radius;
  padding-left: @component-padding/2;

  .cursor { border-color: @input-text-color; }
  .selection .region { background-color: darken(@input-background-color, 10%); }
}

atom-text-editor[mini].is-focused, atom-text-editor[mini].is-focused::shadow {
  color: @input-text-color-selected;
  background-color: @input-background-color;
  .selection .region { background-color: desaturate(@background-color-info, 50%); }
}

atom-text-editor, atom-text-editor::shadow {
  .gutter .line-number.git-line-ignored {
    border-color: @color-status-ignored;
    opacity: 1;
  }

  .gutter .line-number.git-line-added {
    border-color: @color-status-added;
    opacity: 1;
  }

  .gutter .line-number.git-line-renamed {
    border-color: @color-status-renamed;
    opacity: 1;
  }

  .gutter .line-number.git-line-modified {
    border-color: @color-status-modified;
    opacity: 1;
  }

  .gutter .line-number.git-line-removed {
    border-color: @color-status-removed;
    opacity: 1;
  }

  // FIXME: these should go in syntax themes?
  .gutter.drop-shadow {
    -webkit-box-shadow: -2px 0 10px 2px #222;
  }

  .highlighted.selection .region {
    -webkit-animation-name: highlight;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: 1;
  }
}

.select-list.command-palette.overlay.from-top {
  .error-message {
    padding: 3px 0px 0px 6px;
  }

  atom-text-editor[mini].is-focused, atom-text-editor[mini].is-focused::shadow {
    padding: 1px;
  }
}

@-webkit-keyframes highlight {
  from { background-color: rgba(100, 255, 100, 0.7); }
  to { background-color: transparent; }
}

@import "ui-variables";
@import "icon-variables";
@import "ui-mixins";

atom-text-editor .gutter .line-number.git-line-ignored,
atom-text-editor::shadow .gutter .line-number.git-line-ignored {
  border-color: @color-status-ignored;
  opacity: 1;
}

atom-text-editor .gutter .line-number.git-line-added,
atom-text-editor::shadow .gutter .line-number.git-line-added {
  border-color: @color-status-added;
  opacity: 1;
}

atom-text-editor .gutter .line-number.git-line-renamed,
atom-text-editor::shadow .gutter .line-number.git-line-renamed {
  border-color: @color-status-renamed;
  opacity: 1;
}

atom-text-editor .gutter .line-number.git-line-modified,
atom-text-editor::shadow .gutter .line-number.git-line-modified {
  border-color: @color-status-modified;
  opacity: 1;
}

atom-text-editor .gutter .line-number.git-line-removed,
atom-text-editor::shadow .gutter .line-number.git-line-removed {
  border-color: @color-status-removed;
  opacity: 1;
}

atom-text-editor[mini] {
  color: @input-text-color;
  background-color: @input-background-color-selected;
  border: 1px solid @input-border-color;
  box-shadow: none;
  border-radius: @component-border-radius;
  padding-left: @component-padding/2;

  .cursor { border-color: @input-text-color; }
  .selection .region { background-color: darken(@input-background-color, 10%); }
}

atom-text-editor[mini].is-focused {
  color: @input-text-color-selected;
  background-color: @input-background-color;
  .selection .region { background-color: desaturate(@background-color-info, 50%); }
}

// FIXME: these should go in syntax themes?
atom-text-editor .gutter.drop-shadow,
atom-text-editor::shadow .gutter.drop-shadow {
  -webkit-box-shadow: -2px 0 10px 2px #222;
}

@-webkit-keyframes highlight {
  from { background-color: rgba(100, 255, 100, 0.7); }
  to { background-color: transparent; }
}

atom-text-editor .highlighted.selection .region,
atom-text-editor::shadow .highlighted.selection .region {
  -webkit-animation-name: highlight;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: 1;
}

.select-list.command-palette.overlay.from-top {
  .error-message {
    padding: 3px 0px 0px 6px;
  }

  atom-text-editor[mini].is-focused {
    padding: 1px;
  }
}


No calendar line breaking

No calendar line breaking

fatal: unable to access 'https://github.com/MaryBoom/fatf-test.git/': The requested URL returned error: 403


Fix input height, fixes #4619

Fix input height, fixes #4619

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/kyfr59/atom-cg35.git/'


INBOX-214 Add min height and padding for body field

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/heroandtn3/openpaas-esn.git/'


fix placeholder bug

fix placeholder bug

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/Julienedies/est.git/'


Update style.less

Update style.less

fatal: unable to access 'https://github.com/prasadkblr/direct-channel-dashboard.git/': The requested URL returned error: 403


Use ems instead of pixels for loading octicon size

.command-panel {
  position: relative;
  padding: 0;

  .is-loading {
    margin-bottom: 10px;
    text-align: center;

    span {
      padding: 5px 10px 5px 10px;
      background-color: #111111;
      text-align: center;
      border-radius: 3px;
      border: 1px solid rgba(255,255,255,0.1);
      border-top: 1px solid rgba(0,0,0,1);
      border-left: 1px solid rgba(0,0,0,1);

      &:before {
        font-family: 'Octicons Regular';
        font-size: 1.1em;
        width: 1.1em;
        height: 1.1em;
        margin-right: 5px;
        -webkit-font-smoothing: antialiased;
        content: '\f09e';
      }
    }
  }

  .preview-count {
    display: inline-block;
    margin-top: 4px;
    font-size: 11px;
    -webkit-user-select: none;
  }

  .preview-list {
    max-height: 300px;
    overflow: auto;
    margin: 0 0 10px 0;
    position: relative;
    cursor: default;

    .path {
      position: relative;
      -webkit-user-select: none;
    }

    .path-details:before {
      font-family: 'Octicons Regular';
      font-size: 12px;
      width: 12px;
      height: 12px;
      margin-right: 5px;
      margin-left: 5px;
      -webkit-font-smoothing: antialiased;
      content: "\f05b";
      position: relative;
      top: 0;
    }

    .is-collapsed .path-details:before {
      content: "\f05a";
    }

    .path-name:before {
      font-family: 'Octicons Regular';
      font-size: 16px;
      width: 16px;
      height: 16px;
      margin-right: 5px;
      -webkit-font-smoothing: antialiased;
      content: "\f011";
      position: relative;
      top: 1px;
    }

    .path.readme .path-name:before {
      content: "\f007";
    }

    .operation {
      padding-top: 2px;
      padding-bottom: 2px;
      padding-left: 10px;
    }

    .line-number {
      margin-right: 1ex;
      text-align: right;
      display: inline-block;
    }

    .path-match-number {
      padding-left: 8px;
    }

    .preview {
      word-break: break-all;

      .match {
        -webkit-border-radius: 2px;
        padding: 1px;
      }
    }

    .matches {
      list-style-type: none;
      margin: 0;
    }
  }

  .header:after {
    content: ".";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
  }

  .expand-collapse {
    float: right;
    -webkit-user-select: none;
    margin: 0;

    li {
      display: inline-block;
      cursor: pointer;
      font-size: 11px;
      margin-left: 5px;
      padding: 5px 10px;
      border-radius: 3px;
      line-height: normal;
    }
  }

  .prompt-and-editor {
    display: -webkit-flex;

    .editor {
      position: relative;
      -webkit-flex: 1;
    }
  }

  .error-messages {
    list-style-type: none;
    margin: 0;
    padding: 5px 1em;
    color: white;
  }

  .btn {
    margin-left: 5px;
  }
}

.command-panel {
  position: relative;
  padding: 0;

  .is-loading {
    margin-bottom: 10px;
    text-align: center;

    span {
      padding: 5px 10px 5px 10px;
      background-color: #111111;
      text-align: center;
      border-radius: 3px;
      border: 1px solid rgba(255,255,255,0.1);
      border-top: 1px solid rgba(0,0,0,1);
      border-left: 1px solid rgba(0,0,0,1);

      &:before {
        font-family: 'Octicons Regular';
        font-size: 14px;
        width: 14px;
        height: 14px;
        margin-right: 5px;
        -webkit-font-smoothing: antialiased;
        content: '\f09e';
      }
    }
  }

  .preview-count {
    display: inline-block;
    margin-top: 4px;
    font-size: 11px;
    -webkit-user-select: none;
  }

  .preview-list {
    max-height: 300px;
    overflow: auto;
    margin: 0 0 10px 0;
    position: relative;
    cursor: default;

    .path {
      position: relative;
      -webkit-user-select: none;
    }

    .path-details:before {
      font-family: 'Octicons Regular';
      font-size: 12px;
      width: 12px;
      height: 12px;
      margin-right: 5px;
      margin-left: 5px;
      -webkit-font-smoothing: antialiased;
      content: "\f05b";
      position: relative;
      top: 0;
    }

    .is-collapsed .path-details:before {
      content: "\f05a";
    }

    .path-name:before {
      font-family: 'Octicons Regular';
      font-size: 16px;
      width: 16px;
      height: 16px;
      margin-right: 5px;
      -webkit-font-smoothing: antialiased;
      content: "\f011";
      position: relative;
      top: 1px;
    }

    .path.readme .path-name:before {
      content: "\f007";
    }

    .operation {
      padding-top: 2px;
      padding-bottom: 2px;
      padding-left: 10px;
    }

    .line-number {
      margin-right: 1ex;
      text-align: right;
      display: inline-block;
    }

    .path-match-number {
      padding-left: 8px;
    }

    .preview {
      word-break: break-all;

      .match {
        -webkit-border-radius: 2px;
        padding: 1px;
      }
    }

    .matches {
      list-style-type: none;
      margin: 0;
    }
  }

  .header:after {
    content: ".";
    display: block;
    visibility: hidden;
    clear: both;
    height: 0;
  }

  .expand-collapse {
    float: right;
    -webkit-user-select: none;
    margin: 0;

    li {
      display: inline-block;
      cursor: pointer;
      font-size: 11px;
      margin-left: 5px;
      padding: 5px 10px;
      border-radius: 3px;
      line-height: normal;
    }
  }

  .prompt-and-editor {
    display: -webkit-flex;

    .editor {
      position: relative;
      -webkit-flex: 1;
    }
  }

  .error-messages {
    list-style-type: none;
    margin: 0;
    padding: 5px 1em;
    color: white;
  }

  .btn {
    margin-left: 5px;
  }
}


sankey css

sankey css

fatal: unable to access 'https://github.com/sociam/xray-archiver.git/': The requested URL returned error: 403


font and css corrections

font and css corrections

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/geoadmin/web-emapis.git/'


Styled all Maraschino scrollbars - Chrome/Safari only

@import "mixins.less";

::-webkit-scrollbar {
	width: 8px;
}

::-webkit-scrollbar-thumb {
    background-color: white;
    -webkit-border-radius: 3ex;
    -webkit-box-shadow: 1px 1px 3px rgb(0, 0, 0);
}

::-webkit-scrollbar-track {
    background: url(/static/images/alpha/fff_20.png);
    -webkit-border-radius: 5ex;
    -webkit-border: 1px rgb(0, 0, 0);
}

::-webkit-scrollbar-corner {
    background: #000;
}

#fanart
{
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;

  background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -webkit-background-size: cover;
}

#wrapper
{
  min-width: 900px;
  padding: 2% 2% 60px;
  position: relative;
}

.f_settings_mode #wrapper
{
  padding-bottom: 120px;
}

.dialog
{
  background: url(/static/images/alpha/000_80.png);
  border: 2px solid #ccc;
  padding: 15px;
  width: 500px;

  .border-radius(4px);
  .box-shadow(#222, 0, 0, 5px);

  .close {
    background-color: #000;
    border: 2px solid #ccc;
    cursor: pointer;
    height: 18px;
    line-height: 16px;
    position: absolute;
    right: -10px;
    text-align: center;
    top: -10px;
    width: 18px;
    .border-radius(15px);
    z-index: 1;
  }

  .formrow select {
    width: 63%;
  }
}

#confirmation_dialog h3
{
  font-size: 1.2em;
  font-weight: normal;
  margin: 10px 0 20px;
  text-align: center;
}

.choices
{
  margin-top: 20px;
  text-align: center;

  .save,
  .confirm,
  .cancel,
  .delete {
    background: url(/static/images/alpha/fff_20.png);
    display: inline-block;
    padding: 8px;
    width: 60px;

    .border-radius(4px);

    &:hover {
      background: url(/static/images/alpha/fff_40.png);
      cursor: pointer;
    }
  }

  .save,
  .confirm,
  .delete {
    margin-right: 10px;
  }

  .saved,
  .confirmed {
    width: 110px;
  }
}

.formrow
{
  margin-top: 5px;

  label {
    float: left;
    margin-top: 6px;
    width: 33%;
  }

  input[type=text],
  input[type=password],
  select {
    background-color: #fff;
    border: 1px solid #555;
    float: right;
    padding: 4px 6px;
    width: 60%;

    .border-radius(3px);
  }

  select {
    padding: 3px 6px;
    width: auto;
  }
}

.formrow.invalid,
.formrow .invalid
{
  color: #d92525;
}

/*--- video list ---*/

ul.episodes,
ul.movies
{
  li {
    background: url(/static/images/alpha/fff_10.png);
    border: 1px solid #222;
    font-size: 0.9em;
    line-height: 1.3em;
    margin-top: 5px;
    position: relative;

    .border-radius(4px);

    &:hover {
      background: url(/static/images/alpha/fff_20.png);
      cursor: pointer;
    }
  }

  li.watched .inner {
    border-left: 3px solid #ccc;
    padding-left: 12px;
  }

  .inner {
    padding: 5px 107px 5px 15px;
    .border-radius(4px);
  }

  h3 {
    font-size: 1.2em;
    margin-top: 6px;
  }

  p {
    color: #ccc;
  }

  .title {
    margin-bottom: 6px;
  }

  .thumbnail {
    height: 56px;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 100px;
    .box-shadow(#222, 0, 0, 2px);
  }

  div.thumbnail {
    overflow: hidden;
  }

  .thumbnail img {
    width: 100px;
  }

  .thumbnail_wrapper img {
  }
}

@import "mixins.less";

#fanart
{
  bottom: 0;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;

  background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  -webkit-background-size: cover;
}

#wrapper
{
  min-width: 900px;
  padding: 2% 2% 60px;
  position: relative;
}

.f_settings_mode #wrapper
{
  padding-bottom: 120px;
}

.dialog
{
  background: url(/static/images/alpha/000_80.png);
  border: 2px solid #ccc;
  padding: 15px;
  width: 500px;

  .border-radius(4px);
  .box-shadow(#222, 0, 0, 5px);

  .close {
    background-color: #000;
    border: 2px solid #ccc;
    cursor: pointer;
    height: 18px;
    line-height: 16px;
    position: absolute;
    right: -10px;
    text-align: center;
    top: -10px;
    width: 18px;
    .border-radius(15px);
    z-index: 1;
  }

  .formrow select {
    width: 63%;
  }
}

#confirmation_dialog h3
{
  font-size: 1.2em;
  font-weight: normal;
  margin: 10px 0 20px;
  text-align: center;
}

.choices
{
  margin-top: 20px;
  text-align: center;

  .save,
  .confirm,
  .cancel,
  .delete {
    background: url(/static/images/alpha/fff_20.png);
    display: inline-block;
    padding: 8px;
    width: 60px;

    .border-radius(4px);

    &:hover {
      background: url(/static/images/alpha/fff_40.png);
      cursor: pointer;
    }
  }

  .save,
  .confirm,
  .delete {
    margin-right: 10px;
  }

  .saved,
  .confirmed {
    width: 110px;
  }
}

.formrow
{
  margin-top: 5px;

  label {
    float: left;
    margin-top: 6px;
    width: 33%;
  }

  input[type=text],
  input[type=password],
  select {
    background-color: #fff;
    border: 1px solid #555;
    float: right;
    padding: 4px 6px;
    width: 60%;

    .border-radius(3px);
  }

  select {
    padding: 3px 6px;
    width: auto;
  }
}

.formrow.invalid,
.formrow .invalid
{
  color: #d92525;
}

/*--- video list ---*/

ul.episodes,
ul.movies
{
  li {
    background: url(/static/images/alpha/fff_10.png);
    border: 1px solid #222;
    font-size: 0.9em;
    line-height: 1.3em;
    margin-top: 5px;
    position: relative;

    .border-radius(4px);

    &:hover {
      background: url(/static/images/alpha/fff_20.png);
      cursor: pointer;
    }
  }

  li.watched .inner {
    border-left: 3px solid #ccc;
    padding-left: 12px;
  }

  .inner {
    padding: 5px 107px 5px 15px;
    .border-radius(4px);
  }

  h3 {
    font-size: 1.2em;
    margin-top: 6px;
  }

  p {
    color: #ccc;
  }

  .title {
    margin-bottom: 6px;
  }

  .thumbnail {
    height: 56px;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 100px;
    .box-shadow(#222, 0, 0, 2px);
  }

  div.thumbnail {
    overflow: hidden;
  }

  .thumbnail img {
    width: 100px;
  }

  .thumbnail_wrapper img {
  }
}


fix lf- prefixes

fix lf- prefixes


Prevent scrolling bug in iOS

Prevent scrolling bug in iOS


Mixins: added fonts

Mixins: added fonts

fatal: unable to access 'https://github.com/janpecha/typro.git/': The requested URL returned error: 403


Mixins: added 'utils' & #typro.hover() & #typro.visited()

#typro {
	.hover(@rules) {
		&:hover,
		&:focus,
		&:active {
			@rules();
		}
	}

	.visited(@rules) {
		&:visited {
			@rules();
		}
	}
}

error: pathspec 'mixins/utils.less' did not match any file(s) known to git


Using #949494 based on NJ's feedback.

Using #949494 based on NJ's feedback.

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/*
 * Brackets Default Theme
 *
 * Defines all the variables that one can configure in a theme. This should
 * contain all variables / mixins for UI styling that we want to be able to
 * change in a theme.
 *
 * Throughout the rest of the LESS files we should _only_ use color
 * variable names that are on the LHS of the list below. So, if we
 * need a new color for some UI element, we should add a variable
 * in this file.
 */

/* Overall Colors */

/*
 * Background colors are ordered from least "intense" to most "intense"
 * So, if the background is light, then @background-color-3 should be
 * lightest, -2 should be darker, and -1 should be darker still.
 *
 * The opposite is true for a dark background -- background-color-3 should be
 * the darkest, -2 should be lighter, and -1 should be lighter still.
 */
@background-color-1: darken(@bc-white, @bc-color-step-size*2);
@background-color-2: darken(@bc-white, @bc-color-step-size);
@background-color-3: #f8f8f8;

/*
 * @content-color-stronger should be should be further away from the
 * background color than @content-color (i.e. more contrasty).
 *
 * @content-color-weaker should be closer to the background color
 * than @content-color (i.e. less contrasty).
 */
@content-color: #535353;
@content-color-stronger: @bc-black;
@content-color-weaker: lighten(@bc-black, @bc-color-step-size*6);

/* Code Styling */

/* code accent colors */
@accent-keyword: #446fbd;
@accent-atom: #f18900;
@accent-number: #738d00;
@accent-def: #8757ad;
@accent-variable: #535353;
@accent-variable-2: #535353;
@accent-variable-3: #535353;
@accent-property: #8757ad;
@accent-operator: #535353;
@accent-comment: #949494;
@accent-string: #f18900;
@accent-string-2: #f18900;
@accent-meta: #535353;
@accent-error: #dc322f;
@accent-qualifier: #446fbd;
@accent-builtin: #446fbd;
@accent-bracket: #535353;
@accent-tag: #446fbd;
@accent-attribute: #738d00;
@accent-header: #d33682;
@accent-quote: #446fbd;
@accent-hr: #f18900;
@accent-link: #8757ad;
@accent-rangeinfo: #6c71c4;
@accent-minus: #dc322f;
@accent-plus: #859900;

/* inline editor colors */
@inline-background-color-1: #eaeaea;
@inline-background-color-2: #dfe2e2;
@inline-background-color-3: #d0d5d5;

@inline-color-1: #a1a3a4;
@inline-color-2: #8a8a8a;
@inline-color-3: @bc-black;

/* sidebar/toolbar colors */
@project-panel-base-color: #3C3F41;
@project-panel-text-1: #ffffff;
@project-panel-text-2: #94A3A7;
@main-toolbar-background-color: #5D5F60;

/* Selection colors */
@selection-color-focused: #d2dcf8;
@selection-color-unfocused: #d9d9d9;

/* background color of the line that has the cursor */
@activeline-bgcolor: #e8f2ff;

/* Code font formatting
 *
 * NOTE (JRB): In order to get the web font to load early enough, we have a div called "dummy-text" that
 * is styled with .code-font().
 *
 * The platform-specific selector gets added to the body tag *before* document ready time.
 * We rely on this behavior to load platform-specific web fonts early.
 */
.code-font() {
    color: @content-color;
    // line-height must be specified in px not em because the code font and line number font sizes are different.
    // Sizing via em will cause the code and line numbers to misalign
    line-height: 15px;
    font-size: 12px;
    font-family: 'SourceCodePro', "ＭＳ ゴシック", "MS Gothic", monospace;
}

.code-font-win() {
}

.code-font-mac() {
    /* Use the Medium weight on the Mac to counterbalance the grayscale antialiasing. */
    font-family: 'SourceCodePro-Medium', "ＭＳ ゴシック", "MS Gothic", monospace;
}

.code-cursor() {
    // to make a block cursor, use something like this:
    // background-color: fadeout(@blue, 50%);
    // border: none !important;

    // to make an I-cursor, use something like this:
    border-left: 1px solid black !important;

}

/* Variables and Mixins for non-code UI elements that can be styled */

// Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a
// copy of this software and associated documentation files (the "Software"),
// to deal in the Software without restriction, including without limitation
// the rights to use, copy, modify, merge, publish, distribute, sublicense,
// and/or sell copies of the Software, and to permit persons to whom the
// Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
// DEALINGS IN THE SOFTWARE.

/*
 * Brackets Default Theme
 *
 * Defines all the variables that one can configure in a theme. This should
 * contain all variables / mixins for UI styling that we want to be able to
 * change in a theme.
 *
 * Throughout the rest of the LESS files we should _only_ use color
 * variable names that are on the LHS of the list below. So, if we
 * need a new color for some UI element, we should add a variable
 * in this file.
 */

/* Overall Colors */

/*
 * Background colors are ordered from least "intense" to most "intense"
 * So, if the background is light, then @background-color-3 should be
 * lightest, -2 should be darker, and -1 should be darker still.
 *
 * The opposite is true for a dark background -- background-color-3 should be
 * the darkest, -2 should be lighter, and -1 should be lighter still.
 */
@background-color-1: darken(@bc-white, @bc-color-step-size*2);
@background-color-2: darken(@bc-white, @bc-color-step-size);
@background-color-3: #f8f8f8;

/*
 * @content-color-stronger should be should be further away from the
 * background color than @content-color (i.e. more contrasty).
 *
 * @content-color-weaker should be closer to the background color
 * than @content-color (i.e. less contrasty).
 */
@content-color: #535353;
@content-color-stronger: @bc-black;
@content-color-weaker: lighten(@bc-black, @bc-color-step-size*6);

/* Code Styling */

/* code accent colors */
@accent-keyword: #446fbd;
@accent-atom: #f18900;
@accent-number: #738d00;
@accent-def: #8757ad;
@accent-variable: #535353;
@accent-variable-2: #535353;
@accent-variable-3: #535353;
@accent-property: #8757ad;
@accent-operator: #535353;
@accent-comment: #9f9f9f;
@accent-string: #f18900;
@accent-string-2: #f18900;
@accent-meta: #535353;
@accent-error: #dc322f;
@accent-qualifier: #446fbd;
@accent-builtin: #446fbd;
@accent-bracket: #535353;
@accent-tag: #446fbd;
@accent-attribute: #738d00;
@accent-header: #d33682;
@accent-quote: #446fbd;
@accent-hr: #f18900;
@accent-link: #8757ad;
@accent-rangeinfo: #6c71c4;
@accent-minus: #dc322f;
@accent-plus: #859900;

/* inline editor colors */
@inline-background-color-1: #eaeaea;
@inline-background-color-2: #dfe2e2;
@inline-background-color-3: #d0d5d5;

@inline-color-1: #a1a3a4;
@inline-color-2: #8a8a8a;
@inline-color-3: @bc-black;

/* sidebar/toolbar colors */
@project-panel-base-color: #3C3F41;
@project-panel-text-1: #ffffff;
@project-panel-text-2: #94A3A7;
@main-toolbar-background-color: #5D5F60;

/* Selection colors */
@selection-color-focused: #d2dcf8;
@selection-color-unfocused: #d9d9d9;

/* background color of the line that has the cursor */
@activeline-bgcolor: #e8f2ff;

/* Code font formatting
 *
 * NOTE (JRB): In order to get the web font to load early enough, we have a div called "dummy-text" that
 * is styled with .code-font().
 *
 * The platform-specific selector gets added to the body tag *before* document ready time.
 * We rely on this behavior to load platform-specific web fonts early.
 */
.code-font() {
    color: @content-color;
    // line-height must be specified in px not em because the code font and line number font sizes are different.
    // Sizing via em will cause the code and line numbers to misalign
    line-height: 15px;
    font-size: 12px;
    font-family: 'SourceCodePro', "ＭＳ ゴシック", "MS Gothic", monospace;
}

.code-font-win() {
}

.code-font-mac() {
    /* Use the Medium weight on the Mac to counterbalance the grayscale antialiasing. */
    font-family: 'SourceCodePro-Medium', "ＭＳ ゴシック", "MS Gothic", monospace;
}

.code-cursor() {
    // to make a block cursor, use something like this:
    // background-color: fadeout(@blue, 50%);
    // border: none !important;

    // to make an I-cursor, use something like this:
    border-left: 1px solid black !important;

}

/* Variables and Mixins for non-code UI elements that can be styled */