.headings(@color, @shadow: 50%) {
  color: @color;
  text-shadow: 0px 1px 1px lighten(@color, @shadow);
}

@slider-top: -40px;
@azblue: #003366;

.custom-control-hover-label {
  background-color: white;
  font: 11px "Helvetica Neue", Arial, Helvetica, sans-serif;
  color: @azblue;
  font-weight: bold;
  padding: 3px 5px;
  border: 5px solid lighten(@azblue, 5%);
  border-radius: 5px;
}

#time-container {
  position: relative;
  top: @slider-top;
  left: 20px;
  a {
    text-align: center;
    text-decoration: none;
    outline: none;
  }
}

div.year-indicator {
  .headings(@azblue, 70%);
  position: relative;
  left: -7px;
  top: -20px;
  font-size: 16px;
  font-weight: bold;
}

#popup-content {
  h3 { border-bottom: 2px solid black; }
  #media-container {
    padding-top: 10px;
    font-weight: bold;
    text-align: center;
    #media-content {
      padding-top: 10px;
      img { height: 200px; }
    }
  }
}

Change the size of image in the popup

.headings(@color, @shadow: 50%) {
  color: @color;
  text-shadow: 0px 1px 1px lighten(@color, @shadow);
}

@slider-top: -40px;
@azblue: #003366;

.custom-control-hover-label {
  background-color: white;
  font: 11px "Helvetica Neue", Arial, Helvetica, sans-serif;
  color: @azblue;
  font-weight: bold;
  padding: 3px 5px;
  border: 5px solid lighten(@azblue, 5%);
  border-radius: 5px;
}

#time-container {
  position: relative;
  top: @slider-top;
  left: 20px;
  a {
    text-align: center;
    text-decoration: none;
    outline: none;
  }
}

div.year-indicator {
  .headings(@azblue, 70%);
  position: relative;
  left: -7px;
  top: -20px;
  font-size: 16px;
  font-weight: bold;
}

#popup-content {
  h3 { border-bottom: 2px solid black; }
  #media-container {
    padding-top: 10px;
    font-weight: bold;
    text-align: center;
    #media-content {
      padding-top: 10px;
      img {
      	width: 301px;
      	height: 200px;
      }
    }
  }
}


@import (once) './colortheme-all.less';

.tippy_main() {
    .tippy-tooltip.cryptpad-theme {
        /* Your styling here. Example: */
        background-color: white;
        box-shadow: 2px 2px 10px #000;
        font-weight: bold;
        color: #333;
        [x-circle] {
            background-color: unset;
        }
    }
}

Break long words in tooltips

@import (once) './colortheme-all.less';

.tippy_main() {
    .tippy-tooltip.cryptpad-theme {
        /* Your styling here. Example: */
        background-color: white;
        box-shadow: 2px 2px 10px #000;
        font-weight: bold;
        color: #333;
        word-wrap: break-word;
        [x-circle] {
            background-color: unset;
        }
    }
}


.segmented-control {
  border: 1px solid @blue-color;
  border-radius: 4px;
  overflow: hidden;
  width: 100%;
  font-size: 80%;
  margin-bottom: 1em;

  button {
    background: inherit;
    border: 0;
    position: relative;
    width: 50%;
    padding: 0.1em 0.25em;
    margin: 0;
    float: left;
    font-size: 100%;
    color: @blue-color;
    .box-sizing(border-box);

    &:last-child {
      border-left: 1px solid @blue-color;
    }

    &.active {
      background: @blue-color;
      color: white;
    }
  }
}

.typeahead {
  width: 100%;
  overflow: auto;
  min-width: inherit;
  min-height: 100px;
  max-height: 25em;
}

Remove large min-height on typeaheads

.segmented-control {
  border: 1px solid @blue-color;
  border-radius: 4px;
  overflow: hidden;
  width: 100%;
  font-size: 80%;
  margin-bottom: 1em;

  button {
    background: inherit;
    border: 0;
    position: relative;
    width: 50%;
    padding: 0.1em 0.25em;
    margin: 0;
    float: left;
    font-size: 100%;
    color: @blue-color;
    .box-sizing(border-box);

    &:last-child {
      border-left: 1px solid @blue-color;
    }

    &.active {
      background: @blue-color;
      color: white;
    }
  }
}

.typeahead {
  width: 100%;
  overflow: auto;
  min-width: inherit;
  min-height: 1.5em;
  max-height: 25em;
}


.misspelling {
  border-bottom: 1px dashed rgba(250, 128, 114, .5);
  position: absolute;
}

Use non-deprecated class and add region class selector

.spell-check-misspelling .region {
  border-bottom: 1px dashed rgba(250, 128, 114, .5);
  position: absolute;
}


.failureList {
  display: flex;
  height: 100%;
  transition: background-color 2s;
  border-radius: 5px;
  background: green;

  &.has-failures {
    background-color: red;
  }

  ul {
    padding-top: 10px;
    padding-left: 0;
    list-style: none;
  }

  > div {
    margin: auto;
  }

  .title {
    font-family: sans-serif;
    font-size: 32px;
    color: white;
  }
}

Hide failure list if there are no failures

.failureList {
  display: flex;
  height: 100%;
  transition: background-color 2s;
  border-radius: 5px;
  background: green;

  &.has-failures {
    background-color: red;

    ul {
      display: block;
    }
  }

  ul {
    display: none;
    padding-top: 10px;
    padding-left: 0;
    list-style: none;
  }

  > div {
    margin: auto;
  }

  .title {
    font-family: sans-serif;
    font-size: 32px;
    color: white;
  }
}


.preview-pane {
  position: relative;
  padding: 20px 20px 120px 20px;
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  flex-direction: column;

  .objects {
    display: flex;
    align-items: center;
    justify-content: space-around;

    .check,
    .assignment {
      padding: 10px;
      border: 2px solid rgba(190,0,0,1);
      background: white;
      border-radius: 10px;
      text-align: center;
      &.valid {
        border-color: rgba(0,150,0,1);
      }
    }
  }

  .combinator {
    text-align: center;
  }

  .computer {
    text-align: center;
  }
}

Fix alignment of objects in preview pane.

.preview-pane {
  position: relative;
  padding: 20px 20px 120px 20px;
  display: flex;
  align-items: stretch;
  justify-content: space-around;
  flex-direction: column;

  .objects {
    display: flex;
    align-items: center;
    justify-content: space-around;

    .object {
      margin: auto;
    }

    .check,
    .assignment {
      padding: 10px;
      border: 2px solid rgba(190,0,0,1);
      background: white;
      border-radius: 10px;
      text-align: center;
      &.valid {
        border-color: rgba(0,150,0,1);
      }
    }
  }

  .combinator {
    text-align: center;
  }

  .computer {
    text-align: center;
  }
}


@import '../common';

.oo-ui-dropdownInputWidget {
	position: relative;
	// Necessary for proper alignment when used with display: inline-block
	vertical-align: middle;
	.oo-ui-box-sizing( border-box );

	.oo-ui-dropdownWidget,
	select {
		display: block;
	}

	select {
		width: 100%;
		resize: none;
		cursor: pointer;
		.oo-ui-box-sizing( border-box );
	}

	.theme-oo-ui-dropdownInputWidget();
}

Remove unnecessary `resize` property from `select`

@import '../common';

.oo-ui-dropdownInputWidget {
	position: relative;
	// Necessary for proper alignment when used with display: inline-block
	vertical-align: middle;
	.oo-ui-box-sizing( border-box );

	.oo-ui-dropdownWidget,
	select {
		display: block;
	}

	select {
		width: 100%;
		cursor: pointer;
		.oo-ui-box-sizing( border-box );
	}

	.theme-oo-ui-dropdownInputWidget();
}


@import './custom.less';

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Whitney.woff') format('woff')
}

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/WhitneyMedium.woff') format('woff')
}

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/WhitneyBold.woff') format('woff')
}

html {
  overflow-y: scroll;
}

.white-bg {
  background: @white;
}

.content {
  margin-top: 56px;
}

.shifted {
  margin-top: 21px;
}

.text-icon {
  font-size: 18px !important;
  margin-right: 4px;
  vertical-align: -1px;
}

.ant-layout {
  overflow: hidden;
}

.ant-tooltip-content {
  font-weight: 500;
}

.ant-popover-title {
  color: #9d9d9d;
  line-height: 36px;
  height: 36px;
}

Move scrollbar from html to body

@import './custom.less';

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/Whitney.woff') format('woff')
}

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/WhitneyMedium.woff') format('woff')
}

@font-face {
  font-family: Whitney;
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/WhitneyBold.woff') format('woff')
}

body {
  overflow-y: scroll;
}

.white-bg {
  background: @white;
}

.content {
  margin-top: 56px;
}

.shifted {
  margin-top: 21px;
}

.text-icon {
  font-size: 18px !important;
  margin-right: 4px;
  vertical-align: -1px;
}

.ant-layout {
  overflow: hidden;
}

.ant-tooltip-content {
  font-weight: 500;
}

.ant-popover-title {
  color: #9d9d9d;
  line-height: 36px;
  height: 36px;
}


/**
 *    Copyright 2015-2017 ppy Pty. Ltd.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 */

.beatmapset-events {
  margin-top: -20px;
  display: flex;
  flex-direction: column;

  &__empty {
    font-size: @font-size--normal;
    display: flex;
    margin-top: 20px;
  }

  &__title {
    font-size: @font-size--title-small-2;
    color: @pink-darker;
    margin: 20px 0 5px;
  }
}

Use variable for title margin

/**
 *    Copyright 2015-2017 ppy Pty. Ltd.
 *
 *    This file is part of osu!web. osu!web is distributed with the hope of
 *    attracting more community contributions to the core ecosystem of osu!.
 *
 *    osu!web is free software: you can redistribute it and/or modify
 *    it under the terms of the Affero GNU General Public License version 3
 *    as published by the Free Software Foundation.
 *
 *    osu!web is distributed WITHOUT ANY WARRANTY; without even the implied
 *    warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
 *    See the GNU Affero General Public License for more details.
 *
 *    You should have received a copy of the GNU Affero General Public License
 *    along with osu!web.  If not, see <http://www.gnu.org/licenses/>.
 */

.beatmapset-events {
  @title-margin-top: 20px;

  margin-top: -@title-margin-top;
  display: flex;
  flex-direction: column;

  &__empty {
    font-size: @font-size--normal;
    display: flex;
    margin-top: @title-margin-top;
  }

  &__title {
    font-size: @font-size--title-small-2;
    color: @pink-darker;
    margin: @title-margin-top 0 5px;
  }
}


/* BorderPanel */

.pnl-Border {
  border-radius: 2px;
  margin-bottom: 20px;
}

.pnl-Border-hd {
  border-bottom: 1px solid #ccc;
  padding: @border-v-padding @h-padding;
}

.pnl-Border-hd--empty {
  border-bottom: none;
  padding: 0;
}

.pnl-Border-bd {
  /* Contain contact info that's floated right */
  /* Hrm, this hides dropdown menus on data table tools columns */
  /* overflow: hidden; */
}

.pnl-Border--padded .pnl-Border-bd {
  padding: @border-v-padding @h-padding;
}

.pnl-Border-ft {
  padding: @border-v-padding @h-padding;
}

.pnl-Border-left {
  float: left;
}

.pnl-Border-right {
  float: right;
}

.pnl-Border-title {
  font-size: @font-size-lg;
}

.pnl-Border--dialog {
  background-color: white;
}

Make empty border footers zero-height

/* BorderPanel */

.pnl-Border {
  border-radius: 2px;
  margin-bottom: 20px;
}

.pnl-Border-hd {
  border-bottom: 1px solid #ccc;
  padding: @border-v-padding @h-padding;
}

.pnl-Border-hd--empty {
  border-bottom: none;
  padding: 0;
}

.pnl-Border-bd {
  /* Contain contact info that's floated right */
  /* Hrm, this hides dropdown menus on data table tools columns */
  /* overflow: hidden; */
}

.pnl-Border--padded .pnl-Border-bd {
  padding: @border-v-padding @h-padding;
}

.pnl-Border-ft {
  padding: @border-v-padding @h-padding;
}

.pnl-Border-ft--empty {
  padding: 0;
}

.pnl-Border-left {
  float: left;
}

.pnl-Border-right {
  float: right;
}

.pnl-Border-title {
  font-size: @font-size-lg;
}

.pnl-Border--dialog {
  background-color: white;
}


// Copyright (c) Microsoft Corporation.  All Rights Reserved. Licensed under the MIT License. See License.txt in the project root for license information.

.Colors(@theme) {
    .colorDefinitions(@theme);

    .win-contentdialog-dialog {
        background-color: @chromeMediumMid;
    }

    .win-contentdialog-title {
        color: @baseHigh;
    }

    .win-contentdialog-content {
        color: @baseHigh;
    }

    // This is @altMid but developers probably expect this to have an opacity
    // rather than a background color with an alpha value.
    .win-contentdialog-backgroundoverlay {
        background-color: @altHigh;
        opacity: 0.6;
    }
}

Update ContentDialog for high contrast

// Copyright (c) Microsoft Corporation.  All Rights Reserved. Licensed under the MIT License. See License.txt in the project root for license information.

#win-contentdialog {
    .variableDefs(@theme) when not (@theme = highcontrast) {
        .colorDefinitions(@theme);

        @textColor: @baseHigh;
        @dialogBackgroundColor: @chromeMediumMid;

        // Overlay background color is expressed with an opacity rather than as a
        // background color with an alpha value because this is probably what
        // developers expect for the styling story.
        // Consequently, the overlay background color is altHigh with an opacity
        // rather than altMid.
        @overlayBackgroundColor: @altHigh;
        @overlayOpacity: 0.6;
    }

    .variableDefs(highcontrast) {
        .colorDefinitions(@theme);

        @textColor: WindowText;
        @dialogBackgroundColor: Window;

        @overlayBackgroundColor: Window;
        @overlayOpacity: 0.6;
    }

    .stylesForTheme(@theme) {
        #win-contentdialog > .variableDefs(@theme);

        .win-contentdialog-dialog {
            background-color: @dialogBackgroundColor;
        }

        .win-contentdialog-title {
            color: @textColor;
        }

        .win-contentdialog-content {
            color: @textColor;
        }

        .win-contentdialog-backgroundoverlay {
            background-color: @overlayBackgroundColor;
            opacity: @overlayOpacity;
        }
    }
}

.Colors(@theme) {
    #win-contentdialog > .stylesForTheme(@theme);
}

.HighContrast() {
    #win-contentdialog > .stylesForTheme(highcontrast);
}


@transition: opacity 0.2s ease;
@max-z-index  : 2147483647;

@popup-padding: 10px;

@popup-padding-top:     10px;
@popup-padding-bottom:  0px;
@popup-padding-left:    10px;
@popup-padding-right:   10px;

@drag-handler-padding: @popup-padding;
@drag-handler-padding-bottom: 0px;

Change padding to fix modal prepare and show

@transition: opacity 0.2s ease;
@max-z-index  : 2147483647;

@popup-padding: 10px;

@popup-padding-top:     0px;
@popup-padding-bottom:  0px;
@popup-padding-left:    10px;
@popup-padding-right:   10px;

@drag-handler-padding: @popup-padding;
@drag-handler-padding-bottom: 0px;


.project-list-sidebar-wrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	margin: 0 -15px;
}

.project-list-sidebar {
	flex-grow: 1;
	height: 100%;
	padding-left: @line-height-computed / 2;
	padding-right: @line-height-computed / 2;
}

.project-list-sidebar-v2-pane {
	flex-grow: 0;
	flex-shrink: 0;
	text-align: center;
	background-color: @v2-dash-pane-bg;
	color: white;
	font-size: 13px;
	padding: @line-height-computed / 2;
}

	.project-list-sidebar-v2-pane a {
		color: @v2-dash-pane-link-color;
		text-decoration: underline;
	}

	.project-list-sidebar-v2-pane a:hover {
		text-decoration: none;
	}

		.project-list-sidebar-v2-pane-toggle {
			color: white;
			padding: 0;
			line-height: 1;
			&:hover, &:active {
				color: white;
			}
		}

Make margins consistent with col margins

.project-list-sidebar-wrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	margin: 0 -15px;
}

.project-list-sidebar {
	flex-grow: 1;
	height: 100%;
	padding-left: 15px;
	padding-right: 15px;
}

.project-list-sidebar-v2-pane {
	flex-grow: 0;
	flex-shrink: 0;
	text-align: center;
	background-color: @v2-dash-pane-bg;
	color: white;
	font-size: 13px;
	padding: @line-height-computed / 2;
}

	.project-list-sidebar-v2-pane a {
		color: @v2-dash-pane-link-color;
		text-decoration: underline;
	}

	.project-list-sidebar-v2-pane a:hover {
		text-decoration: none;
	}

		.project-list-sidebar-v2-pane-toggle {
			color: white;
			padding: 0;
			line-height: 1;
			&:hover, &:active {
				color: white;
			}
		}


// Place all the styles related to the Labs controller here.

@import 'twitter/bootstrap';
@import "twitter/bootstrap/variables";
@import "twitter/bootstrap/mixins";

@alpha: 0.15;

span.pending,
span.reviewing
{
  color: @warningText;
}

span.accepted
{
  color: @successText;
}

span.rejected
{
  color: @errorText;
}

.hero-unit.pending,
.hero-unit.reviewing
{
  #translucent > .background(@warningText, @alpha);
}

.hero-unit.accepted
{
  #translucent > .background(@successText, @alpha);
}

.hero-unit.rejected
{
  #translucent > .background(@errorText, @alpha);
}

Add styles for labs in initialized state

// Place all the styles related to the Labs controller here.

@import 'twitter/bootstrap';
@import "twitter/bootstrap/variables";
@import "twitter/bootstrap/mixins";

@alpha: 0.15;

span.pending,
span.reviewing,
span.initialized
{
  color: @warningText;
}

span.accepted
{
  color: @successText;
}

span.rejected
{
  color: @errorText;
}

.hero-unit.pending,
.hero-unit.reviewing,
.hero-unit.initialized
{
  #translucent > .background(@warningText, @alpha);
}

.hero-unit.accepted
{
  #translucent > .background(@successText, @alpha);
}

.hero-unit.rejected
{
  #translucent > .background(@errorText, @alpha);
}


// Docs layout
.article {
  .topics {
    padding: 0;
    .column(3);
  }

  article {
    .column(8.0);
  }
}

Make the docs slightly wider, so that the first chevron doesn't move to the next line

// Docs layout
.article {
  .topics {
    padding: 0;
    .column(3.1);
  }

  article {
    .column(8.1);
  }
}


.Badge--following {
  background: #fc0;
  color: #c17500;
}
.Badge--ignoring {
  background: #aaa;
}
.SubscriptionMenu-button--follow {
  .Button--color(#de8e00, #fff2ae);
  // TODO: dark mode
}
.SubscriptionMenu .Dropdown-menu {
  min-width: 260px;
}
.SubscriptionMenuItem-label {
  padding-left: 25px;
  display: block;
  white-space: normal;

  & strong {
    display: block;
  }
}
.SubscriptionMenuItem-description {
  display: block;
  color: @muted-color;
  font-size: 12px;
  margin-top: 3px;
}

Make badge colors consistent with button color

.Badge--following {
  background: #ffea7b;
  color: #de8e00;
}
.Badge--ignoring {
  background: #aaa;
}
.SubscriptionMenu-button--follow {
  .Button--color(#de8e00, #fff2ae);
  // TODO: dark mode
}
.SubscriptionMenu .Dropdown-menu {
  min-width: 260px;
}
.SubscriptionMenuItem-label {
  padding-left: 25px;
  display: block;
  white-space: normal;

  & strong {
    display: block;
  }
}
.SubscriptionMenuItem-description {
  display: block;
  color: @muted-color;
  font-size: 12px;
  margin-top: 3px;
}


@import "ui-variables";

.gutter>.line-numbers>.php-debug-breakpoint,
.gutter>.line-numbers>.tile>.php-debug-breakpoint {
    color: #fff;
    background-color: #0F0 !important;
}

.debug-break-break {
  background-color: fade(@background-color-success,25%) !important;
}
.debug-break-generic {
  background-color: fade(@background-color-success,25%) !important;
}

.debug-break-error {
  background-color: fade(@background-color-error,15%) !important;
}

Fix breakpoint markers on latest atom

@import "ui-variables";

.gutter>.line-numbers>.php-debug-breakpoint,
.gutter>.line-numbers>div>.php-debug-breakpoint,
.gutter>.line-numbers>.tile>.php-debug-breakpoint {
    color: #fff;
    background-color: #0F0 !important;
}

.debug-break-break {
  background-color: fade(@background-color-success,25%) !important;
}
.debug-break-generic {
  background-color: fade(@background-color-success,25%) !important;
}

.debug-break-error {
  background-color: fade(@background-color-error,15%) !important;
}


@import "_styleguide_variables";

@test-variable: 10px;

// First section
//
// Markup:
//
Section markup

//
// Styleguide 1.0

.section {
  color: @color-red;
}
.section:hover {
  color: @color-green;
}
.section:active {
  color: @color-blue;
}

// Section with modifiers
//
// $color-red - Red test color
// $color-green - Green test color
// $color-blue - Blue test color
// .other-modifier - Other modifier
//
// Markup:
//

//
// Styleguide 2.0

// Subsection
//
// Styleguide 2.1

// Another subsection
//
// Styleguide 2.1.1

// Section without markup
//
// Styleguide 3.0

.test-css {color: purple;}

// Section with multiple variables
//
// Markup:
//
Section markup

//
// Styleguide 4.0

.section1 {
  color: @color-red;
}

.section2 {
  background-color: @color-green;
}

.section3 {
  border: 1px solid @color-blue;
}

// One more subsection
//
// Styleguide 4.1.0

Remove extra sections from LESS test project

@import "_styleguide_variables";

@test-variable: 10px;

// First section
//
// Markup:
//
Section markup

//
// Styleguide 1.0

.section {
  color: @color-red;
}
.section:hover {
  color: @color-green;
}
.section:active {
  color: @color-blue;
}

// Section with modifiers
//
// $color-red - Red test color
// $color-green - Green test color
// $color-blue - Blue test color
// .other-modifier - Other modifier
//
// Markup:
//

//
// Styleguide 2.0

// Section without markup
//
// Styleguide 3.0

.test-css {color: purple;}

// Section with multiple variables
//
// Markup:
//
Section markup

//
// Styleguide 4.0

.section1 {
  color: @color-red;
}

.section2 {
  background-color: @color-green;
}

.section3 {
  border: 1px solid @color-blue;
}


//noinspection CssUnknownTarget
@import "syntax-variables";
@import "ui-variables";

// Using the git-diff colors so they are visible on your syntax theme.
@gutter: @syntax-color-removed;
@underline: #00a188;

.highlight-blue .region {
  border-bottom: 1px dashed @underline
}
.highlight-red .region {
  border-bottom: 1px dashed @gutter;
}
:host(:host) .gutter .line-number{
  &.gutter-blue {
    color:white;
    background-color: @underline
  }
  &.gutter-red {
    color:white;
    background-color: @gutter;
  }
}
.ide-hack-error {
  background-color: @background-color-highlight;
  z-index: 3;
}

.highlight {
  &.ide-hack-error .region {
    background: linear-gradient(to right, fadeout(@background-color-error, 30%) 0%, fadeout(@background-color-error, 35%) 100%);
    z-index: 3;
  }
}

.gutter .line-number {
  &.ide-hack-error .icon-right {
    visibility: visible;
    &:before {
      content: @alert;
      color: @text-color-error;
      z-index: 3;
    }
  }
}

Fix compilation error in a stylesheet

//noinspection CssUnknownTarget
@import "syntax-variables";
@import "octicon-utf-codes";
@import "ui-variables";
@import "tooltips";

// Using the git-diff colors so they are visible on your syntax theme.
@gutter: @syntax-color-removed;
@underline: #00a188;

.highlight-blue .region {
  border-bottom: 1px dashed @underline
}
.highlight-red .region {
  border-bottom: 1px dashed @gutter;
}
:host(:host) .gutter .line-number{
  &.gutter-blue {
    color:white;
    background-color: @underline
  }
  &.gutter-red {
    color:white;
    background-color: @gutter;
  }
}
.ide-hack-error {
  background-color: @background-color-highlight;
  z-index: 3;
}

.highlight {
  &.ide-hack-error .region {
    background: linear-gradient(to right, fadeout(@background-color-error, 30%) 0%, fadeout(@background-color-error, 35%) 100%);
    z-index: 3;
  }
}

.gutter .line-number {
  &.ide-hack-error .icon-right {
    visibility: visible;
    &:before {
      content: @alert;
      color: @text-color-error;
      z-index: 3;
    }
  }
}


@import "ui-variables";

.overlay {
  color: @text-color;
  background-color: @overlay-background-color;
  padding: @component-padding;
  border: 1px solid @overlay-border-color;
  box-shadow: 0 0 10px @base-border-color;
  border-radius: @component-border-radius;

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

  .select-list ol.list-group,
  &.select-list ol.list-group {

    background-color: lighten(@overlay-background-color, 3%);

    li {
      padding: @component-padding;
      border-bottom: 1px solid @overlay-background-color;

      &.two-lines { padding: @component-padding/2 @component-padding; }

      .status.icon {
        float: right;
        margin-left: @component-icon-padding;
        &:before {
          margin-right: 0;
        }
      }
    }

  }
}

Use text-color-selected when status icon is selected

@import "ui-variables";

.overlay {
  color: @text-color;
  background-color: @overlay-background-color;
  padding: @component-padding;
  border: 1px solid @overlay-border-color;
  box-shadow: 0 0 10px @base-border-color;
  border-radius: @component-border-radius;

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

  .select-list ol.list-group,
  &.select-list ol.list-group {

    background-color: lighten(@overlay-background-color, 3%);

    li {
      padding: @component-padding;
      border-bottom: 1px solid @overlay-background-color;

      &.two-lines { padding: @component-padding/2 @component-padding; }

      .status.icon {
        float: right;
        margin-left: @component-icon-padding;
        &:before {
          margin-right: 0;
        }
      }

      &.selected {
        .status.icon {
          color: @text-color-selected;
        }
      }
    }
  }
}


//
// Code (inline and blocK)
// --------------------------------------------------

// Inline and block code styles
code,
kbd,
pre,
samp {
  font-family: @font-family-monospace;
}

// Inline code
code {
  padding: 2px 4px;
  font-size: 90%;
  color: @code-color;
  background-color: @code-bg;
  white-space: nowrap;
  border-radius: @border-radius-base;
}

// Blocks of code
pre {
  display: block;
  padding: ((@line-height-computed - 1) / 2);
  margin: 0 0 (@line-height-computed / 2);
  font-size: (@font-size-base - 1); // 14px to 13px
  line-height: @line-height-base;
  word-break: break-all;
  word-wrap: break-word;
  color: @pre-color;
  background-color: @pre-bg;
  border: 1px solid @pre-border-color;
  border-radius: @border-radius-base;

  // Account for some code outputs that place code tags in pre tags
  code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0;
  }
}

// Enable scrollable blocks of code
.pre-scrollable {
  max-height: @pre-scrollable-max-height;
  overflow-y: scroll;
}

Change upper case to lower case

//
// Code (inline and block)
// --------------------------------------------------

// Inline and block code styles
code,
kbd,
pre,
samp {
  font-family: @font-family-monospace;
}

// Inline code
code {
  padding: 2px 4px;
  font-size: 90%;
  color: @code-color;
  background-color: @code-bg;
  white-space: nowrap;
  border-radius: @border-radius-base;
}

// Blocks of code
pre {
  display: block;
  padding: ((@line-height-computed - 1) / 2);
  margin: 0 0 (@line-height-computed / 2);
  font-size: (@font-size-base - 1); // 14px to 13px
  line-height: @line-height-base;
  word-break: break-all;
  word-wrap: break-word;
  color: @pre-color;
  background-color: @pre-bg;
  border: 1px solid @pre-border-color;
  border-radius: @border-radius-base;

  // Account for some code outputs that place code tags in pre tags
  code {
    padding: 0;
    font-size: inherit;
    color: inherit;
    white-space: pre-wrap;
    background-color: transparent;
    border-radius: 0;
  }
}

// Enable scrollable blocks of code
.pre-scrollable {
  max-height: @pre-scrollable-max-height;
  overflow-y: scroll;
}


@import "widgets/variables";

/*
 * Mixins
 * http://lesscss.org/features/#mixins-feature
 */
@import "widgets/layout-mixins";
@import "widgets/form/form-mixins";

/*
 * Widget styles
 */
@import "widgets/config/tabbar";

/*
 * ----------------------------------------------------------------------------------------
 * Scrollspy specific styles.
 * ----------------------------------------------------------------------------------------
 */

.jenkins-config {
  // The Section header for the General section was manufactured,
  // so the default is to not display it.
  .section-header-row.config_general .section-header {
    display: none;
  }
}

Hide the finder widget for scrollspy

@import "widgets/variables";

/*
 * Mixins
 * http://lesscss.org/features/#mixins-feature
 */
@import "widgets/layout-mixins";
@import "widgets/form/form-mixins";

/*
 * Widget styles
 */
@import "widgets/config/tabbar";

/*
 * ----------------------------------------------------------------------------------------
 * Scrollspy specific styles.
 * ----------------------------------------------------------------------------------------
 */

.jenkins-config {
  // The Section header for the General section was manufactured,
  // so the default is to not display it.
  .section-header-row.config_general .section-header {
    display: none;
  }
}

.jenkins-config-widgets {
  .find-container {
    .find {
      display: none;
    }
  }
}


* {
  /* prevent callout to copy image, etc when tap to hold */
  -webkit-touch-callout: none;
  -moz-touch-callout: none;
  touch-callout: none;

  /* prevent webkit from resizing text to fit */
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;

  /* make transparent link selection, adjust last value opacity 0 to 1.0 */
  -webkit-tap-highlight-color: none;
  -mozt-text-size-adjust: none;
  tap-highlight-color: none;

  /* prevent copy paste, to allow, change 'none' to 'text' */
  .user-select(none);

  .box-sizing(border-box);

  cursor: default;

  padding: 0px;
  margin: 0px;

  .transform-origin(0 0);
}
::selection { background: transparent; }

.vs_ui_view
{
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: relative;
}

.disabled {
  opacity: 0.5;
}

Add selection color to textarea and inputs

* {
  /* prevent callout to copy image, etc when tap to hold */
  -webkit-touch-callout: none;
  -moz-touch-callout: none;
  touch-callout: none;

  /* prevent webkit from resizing text to fit */
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  text-size-adjust: none;

  /* make transparent link selection, adjust last value opacity 0 to 1.0 */
  -webkit-tap-highlight-color: none;
  -mozt-text-size-adjust: none;
  tap-highlight-color: none;

  /* prevent copy paste, to allow, change 'none' to 'text' */
  .user-select(none);

  .box-sizing(border-box);

  cursor: default;

  padding: 0px;
  margin: 0px;

  .transform-origin(0 0);
}

::selection {
  background: transparent;
}

.vs_ui_view
{
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: relative;
}

.disabled {
  opacity: 0.5;
}

textarea::selection,
input[type=text]::selection,
input[type=password]::selection {
  background: rgba(0, 100, 200, 0.5);
}


// Forms

textarea,
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"] {
  -webkit-appearance: none;
}

.form-control:focus {
  outline: 0;
  .box-shadow(none);
}

.form-control {
  .box-shadow(none);
  border: 1px solid @input-border;
}

.form-group {
  margin-bottom: 0;
  padding: @line-height-computed/2 0;
}

.input-group-addon {
  background: @input-bg;
}

.control-label {
  line-height: @input-height-base;
  margin: 0;
}

.app-search {
  border-radius: @app-search-border-radius;
}

.form-actions {
  margin-top: @form-actions-margin-top;
}

Fix missing styling of input type "password"

// Forms

textarea,
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="password"],
input[type="url"] {
  -webkit-appearance: none;
}

.form-control:focus {
  outline: 0;
  .box-shadow(none);
}

.form-control {
  .box-shadow(none);
  border: 1px solid @input-border;
}

.form-group {
  margin-bottom: 0;
  padding: @line-height-computed/2 0;
}

.input-group-addon {
  background: @input-bg;
}

.control-label {
  line-height: @input-height-base;
  margin: 0;
}

.app-search {
  border-radius: @app-search-border-radius;
}

.form-actions {
  margin-top: @form-actions-margin-top;
}


@mobile: ~"only screen and (max-width: 600px)";

header {
   height: 100px;
   margin-bottom: 30px;
}

.competition {
   .competition-title {
      h3 {
         margin-bottom: 0px !important;
         font-size: 26px;
      }

      p {
         font-size: 16px;
      }

      margin-bottom: 30px;
   }

   .round {
      margin-bottom: 15px;
   }

   width: 500px;
   padding: 10px 20px;
   margin-bottom: 30px;
   box-shadow: 1px 1px 3px black;

   @media @mobile {
      width: auto;
   }
}

Add bottom borders to performance score rows

@mobile: ~"only screen and (max-width: 600px)";

header {
   height: 100px;
   margin-bottom: 30px;
}

.competition {
   .competition-title {
      h3 {
         margin-bottom: 0px !important;
         font-size: 26px;
      }

      p {
         font-size: 16px;
      }

      margin-bottom: 30px;
   }

   .round {
      margin-bottom: 15px;

      .performance {
         border-bottom: 1px solid #EEE;
         margin-bottom: 5px;

         &:last-of-type {
            border-bottom: none;
         }
      }
   }

   width: 500px;
   padding: 10px 20px;
   margin-bottom: 30px;
   box-shadow: 1px 1px 3px black;

   @media @mobile {
      width: auto;
   }
}


/*
**  ComponentJS -- Component System for JavaScript <http://componentjs.com>
**  Copyright (c) 2009-2013 Ralf S. Engelschall <http://engelschall.com>
**
**  This Source Code Form is subject to the terms of the Mozilla Public
**  License, v. 2.0. If a copy of the MPL was not distributed with this
**  file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/

@color-canvas-bg: #e0e0e0;
@color-tab-bg:    #f8f8f8;
@color-tab-fg:    #000000;
@font-size:       12px;

Set body height to 100%

/*
**  ComponentJS -- Component System for JavaScript <http://componentjs.com>
**  Copyright (c) 2009-2013 Ralf S. Engelschall <http://engelschall.com>
**
**  This Source Code Form is subject to the terms of the Mozilla Public
**  License, v. 2.0. If a copy of the MPL was not distributed with this
**  file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/

@color-canvas-bg: #e0e0e0;
@color-tab-bg:    #f8f8f8;
@color-tab-fg:    #000000;
@font-size:       12px;

html, body {
	height: 100%;
}


@import "bootstrap/mixins";

.navbar {
  ul.steps {
    float: right;
    margin-top: 9px;

    li {
      float: left;
      margin-left: 20px;
      font-weight: normal;
      font-size: 14px;
      line-height: 22px;
      color: #777;
      padding-left: 25px;
      background: image-url('base/topbar/steps-arrow.png') no-repeat left center;
      list-style: none;

      span {
        float: left;
        width: 22px;
        height: 22px;
        text-align: center;
        margin-right: 10px;
        color: #fff;
        background: image-url('base/topbar/steps.png') no-repeat top;
      }

      &.active {
        color: @linkColor;

        span {
          background-position: bottom;
        }
      }

      &:first-child {
        padding: 0;
        background: none;
      }
    }
  }
}

Reduce nesting, fix bootstrap dependency

@import "bootstrap/mixins";

.steps {
  margin-right: 45px;
  float: right;
  margin-top: 9px;

  li {
    float: left;
    margin-left: 20px;
    font-weight: normal;
    font-size: 14px;
    line-height: 22px;
    color: #777;
    padding-left: 25px;
    background: image-url('base/topbar/steps-arrow.png') no-repeat left center;
    list-style: none;

    span {
      float: left;
      width: 22px;
      height: 22px;
      text-align: center;
      margin-right: 10px;
      color: #fff;
      background: image-url('base/topbar/steps.png') no-repeat top;
    }

    &.active {
      color: @linkColor;

      span {
        background-position: bottom;
      }
    }

    &:first-child {
      padding: 0;
      background: none;
    }
  }
}


table {
  width:100%;
}
tbody {
  tr {
    background-color:rgba(0, 0, 0, 0.4);
  }
  tr:nth-child(even) {
    background-color:rgba(0, 0, 0, 0.2);
  }
  tr.selected {
    background-color:rgba(0, 30, 0, 0.8);
  }
}

Change color of selected game in JoinGame for better visability

table {
  width:100%;
}
tbody {
  tr {
    background-color:rgba(0, 0, 0, 0.4);
  }
  tr:nth-child(even) {
    background-color:rgba(0, 0, 0, 0.2);
  }
  tr.selected {
    background-color:rgba(129, 212, 250, 0.8);
  }
}


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

@font-face { .octicon-font(); }

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: @font-family;
  font-size: @font-size;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: @font-family;
}

atom-workspace {
  height: 100%;
  overflow: hidden;
  position: relative;
  background-color: @app-background-color;
  font-family: @font-family;

  atom-workspace-axis.horizontal {
    display: -webkit-flex;
    height: 100%;
  }

  atom-workspace-axis.vertical {
    display: -webkit-flex;
    -webkit-flex: 1;
    -webkit-flex-flow: column;
  }
}

Make atom-workspace tag have ‘display: block’ style

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

@font-face { .octicon-font(); }

html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: @font-family;
  font-size: @font-size;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: @font-family;
}

atom-workspace {
  display: block;
  height: 100%;
  overflow: hidden;
  position: relative;
  background-color: @app-background-color;
  font-family: @font-family;

  atom-workspace-axis.horizontal {
    display: -webkit-flex;
    height: 100%;
  }

  atom-workspace-axis.vertical {
    display: -webkit-flex;
    -webkit-flex: 1;
    -webkit-flex-flow: column;
  }
}


@import "syntax-variables";

atom-text-editor,
::shadow {
    .meta.attribute.rust {
        color: mix(#ff0, @syntax-text-color, 20%);
    }

    .storage.modifier.lifetime.rust,
    .entity.name.lifetime.rust {
        color: mix(#0ff, @syntax-text-color, 70%);
    }

    .keyword.unsafe.rust {
        color: mix(#f00, @syntax-text-color, 40%);
    }
}

Remove shadow DOM usage from styles

@import "syntax-variables";

atom-text-editor {
    .syntax--rust.syntax--meta.syntax--attribute {
        color: mix(#ff0, @syntax-text-color, 20%);
    }

    .syntax--rust.syntax--storage.syntax--modifier.syntax--lifetime,
    .syntax--rust.syntax--entity.syntax--name.syntax--lifetime {
        color: mix(#0ff, @syntax-text-color, 70%);
    }

    .syntax--rust.syntax--keyword.syntax--unsafe {
        color: mix(#f00, @syntax-text-color, 40%);
    }
}


.hentry {
  .single & {
    margin-bottom: 30px;
  }
}

.hentry header {
  .entry-title {
    margin-top: 0;

    .single & {
      margin-top: 20px;
    }
  }
}

.hentry .entry-meta {
  margin-bottom: 20px;
  background-color: @gray-lighter;

  .updated {
    margin-left: 4px;
    line-height: 24px;
  }

  .addthis_sharing_toolbox {
    margin: 4px 2px 0 0;
  }
}

.hentry .entry-summary {
  margin-bottom: 20px;
}

Add a margin to the bottom of posts

.hentry {
  margin-bottom: 10px;

  .single & {
    margin-bottom: 30px;
  }
}

.hentry header {
  .entry-title {
    margin-top: 0;

    .single & {
      margin-top: 20px;
    }
  }
}

.hentry .entry-meta {
  margin-bottom: 20px;
  background-color: @gray-lighter;

  .updated {
    margin-left: 4px;
    line-height: 24px;
  }

  .addthis_sharing_toolbox {
    margin: 4px 2px 0 0;
  }
}

.hentry .entry-summary {
  margin-bottom: 20px;
}


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

.ui-demo {
  overflow: auto;
  color: @text-color;
  background-color: lighten(@tool-panel-background-color, 5%);

  section.collapsed {
    opacity: .6;
    padding-top: @component-padding;
    padding-bottom: @component-padding;
    &:hover { opacity: 1; }

    > .section-heading {
      display: block;
      margin: 0;
    }

    > * {
      display: none
    }
  }

  section .section-heading {
    cursor: pointer;
    &:hover {
      .text(highlighted);
      cursor: pointer;
    }
  }

  .overlay {
    position: relative;
  }

  .select-list {
    .editor.mini { height: 27px; }
  }
}

.example-code {
  position: relative;
  border: 1px solid @tool-panel-border-color;
  border-radius: @component-border-radius;
  margin: @component-padding 0;

  .example {
    padding: @component-padding;
    background: lighten(@tool-panel-background-color, 2%);
    border-radius: @component-border-radius @component-border-radius 0 0;
  }
}

Make examples go side by side

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

.ui-demo {
  overflow: auto;
  color: @text-color;
  background-color: lighten(@tool-panel-background-color, 5%);

  section.collapsed {
    opacity: .6;
    padding-top: @component-padding;
    padding-bottom: @component-padding;
    &:hover { opacity: 1; }

    > .section-heading {
      display: block;
      margin: 0;
    }

    > * {
      display: none
    }
  }

  section .section-heading {
    cursor: pointer;
    &:hover {
      .text(highlighted);
      cursor: pointer;
    }
  }

  .overlay {
    position: relative;
  }

  .select-list {
    .editor.mini { height: 27px; }
  }
}

.example-code {
  display: -webkit-flex;
  border: 1px solid @tool-panel-border-color;
  border-radius: @component-border-radius;
  margin: @component-padding 0;

  > * { width: 50%; }

  .example {
    position: relative;
    padding: @component-padding;
    background: lighten(@tool-panel-background-color, 2%);
    border-radius: @component-border-radius 0 0 @component-border-radius;
  }

  pre {
    border-radius: 0 @component-border-radius @component-border-radius 0;
  }
}


@import "syntax-variables";

@red-color: @syntax-color-removed;

atom-text-editor::shadow
{
  .gutter .line-number
  {
    &.highlight-idris-error
    {
      background-color: @red-color;
    }
  }
  .line
  {
    &.highlight-idris-error
    {
      background-color: lighten(@red-color, 20%);
    }
  }
}

Remove that error line is highlighted

@import "syntax-variables";

@red-color: @syntax-color-removed;

atom-text-editor::shadow
{
  .gutter .line-number
  {
    &.highlight-idris-error
    {
      background-color: @red-color;
    }
  }
  .line
  {
    &.highlight-idris-error
    {
    }
  }
}


.post-block {
  border-bottom: 2px solid #F9FAFB;
  font-size: 1.5rem;
  padding: 2rem;
  background-color: white;
  // incredibly subtle faded highlight
  -webkit-box-shadow: inset 0 0 3rem 0 #fefefe;
  -moz-box-shadow:    inset 0 0 3rem 0 #fefefe;
  box-shadow:         inset 0 0 3rem 0 #fefefe;
}

.post-link {
  display: block;
  color: hsl(205, 15%, 30%);
  &:visited {
    color: #DAE0E5;
  }
  &:hover {
    color: hsl(205, 15%, 30%);
  }
}

.post-info {
  color: #aaa;
  font-size: 1.1rem;
  margin-top: .5rem;
  a {
    color: #A1C5E5;
  }
  .upvoted {
    color: #007FFF;
  }
  .downvoted {
    color: #FF5100;
  }
}

.post-stars {
  font-size: 1.2rem;
  margin-right: 0.25rem;

}

@media only screen and (max-width: 767px) {
  .post-info {
    margin-top: 1rem;
  }
  .stars {
    font-size: 1.2rem;
  }
}

Fix visited post title highlight

.post-block {
  border-bottom: 2px solid #F9FAFB;
  font-size: 1.5rem;
  padding: 2rem;
  background-color: white;
  // incredibly subtle faded highlight
  -webkit-box-shadow: inset 0 0 3rem 0 #fefefe;
  -moz-box-shadow:    inset 0 0 3rem 0 #fefefe;
  box-shadow:         inset 0 0 3rem 0 #fefefe;
}

.post-link {
  display: block;
  color: hsl(205, 15%, 30%);
  &:visited, &:visited:hover {
    color: #DAE0E5;
  }
  &:hover {
    color: hsl(205, 15%, 30%);
  }
}

.post-info {
  color: #aaa;
  font-size: 1.1rem;
  margin-top: .5rem;
  a {
    color: #A1C5E5;
  }
  .upvoted {
    color: #007FFF;
  }
  .downvoted {
    color: #FF5100;
  }
}

.post-stars {
  font-size: 1.2rem;
  margin-right: 0.25rem;

}

@media only screen and (max-width: 767px) {
  .post-info {
    margin-top: 1rem;
  }
  .stars {
    font-size: 1.2rem;
  }
}


@import "../bower_components/bootstrap/less/bootstrap.less";
@import "pulldasher.less";

Set colors per Tony's design

@import "../bower_components/bootstrap/less/bootstrap.less";

@brand-primary: #3683C5;
@brand-success: #6CB644;
@brand-info:    #57A8EB;
@brand-warning: #E7B049;
@brand-danger:  #DB524B;

@import "pulldasher.less";


@import "bootstrap/mixins";
@import "bootstrap/variables";

.full-width() {
    margin: 0 -15px 0;
}

#container #main-wrapper .content {

  .conversations,
  .messages ul {
    li {
      .full-width();
      padding: 15px;
      border-bottom: 1px solid @baseBorderColor;

      .avatar {
        float: left;
        img { .border-radius(3px); }
      }

      .message {
        padding: 0 0 0 58px;
        margin: -4px 0 0 0;

        .user-profile-link {
          font-weight: bold;
        }

        .user-profile-link-dummy {
          font-weight: bold;
          color: @linkColor;
        }

        .meta {
          float: right;
          color: #ccc;
        }

        .text {
          width: 475px;
          word-wrap: break-word;
          i {
            opacity: 0.65;
          }
        }
      }
    }
  }

  .conversation {
    .reply {
      padding-top: 15px;

      textarea {
        width: 654px;
      }

      .submit {
        float: right;
      }
    }
  }
}

Correct rendering of the conversation inbox

@import "bootstrap/mixins";
@import "bootstrap/variables";

.full-width() {
    margin: 0 -15px 0;
}

#container #main-wrapper .content {

  .conversations,
  .messages ul {
    li {
      .full-width();
      padding: 15px;
      border-bottom: 1px solid @baseBorderColor;

      .avatar {
        float: left;
        img { .border-radius(3px); }
      }

      .message {
        padding: 0 0 0 58px;
        margin: -4px 0 0 0;

        .user-profile-link {
          font-weight: bold;
        }

        .user-profile-link-dummy {
          font-weight: bold;
          color: @linkColor;
        }

        .meta {
          float: right;
          color: #ccc;
        }

        .text {
          width: 475px;
          word-wrap: break-word;
          i {
            opacity: 0.65;
          }
        }
      }
    }
  }

  .conversation {
    .reply {
      padding-top: 15px;

      textarea {
        width: 654px;
      }

      .submit {
        float: right;
      }
    }
  }

  .conversations {
    margin-bottom: -15px;
    li:last-child { border-bottom: 1px solid transparent; }
  }
}


// Copyright (c) Microsoft Open Technologies, Inc.  All Rights Reserved. Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
.win-rating {
    display: -webkit-inline-flex;
    display: inline-flex;
    height: auto;
    width: auto;
    white-space: normal;
    align-items: stretch;
    justify-content: center;
}

.win-rating .win-star {
    flex: auto;
    height:28px;
    width: 28px;
    padding: 0 6px;
    font-family: "Segoe UI Symbol", "Symbols";
    font-size: 28px;
    overflow: hidden;
    text-indent: 0;
    line-height: 1;
    cursor: default;
    position: relative;
    letter-spacing: 0; // Use letter-spacing: 0 to make average star look like one glyph.
    touch-action: none;
}
.win-rating.win-small .win-star {
    width: 14px;
    height: 14px;
    font-size: 14px;
    padding: 0 3px;
}
.win-rating .win-star:before {
    content: "\E082";
}
.win-rating .win-star.win-disabled {
    cursor: default;
    touch-action: auto;
}

Add IE10 specific flex display to win-rating

// Copyright (c) Microsoft Open Technologies, Inc.  All Rights Reserved. Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
.win-rating {
    display: -ms-inline-flexbox;
    display: -webkit-inline-flex;
    display: inline-flex;
    height: auto;
    width: auto;
    white-space: normal;
    align-items: stretch;
    justify-content: center;
}

.win-rating .win-star {
    flex: auto;
    height:28px;
    width: 28px;
    padding: 0 6px;
    font-family: "Segoe UI Symbol", "Symbols";
    font-size: 28px;
    overflow: hidden;
    text-indent: 0;
    line-height: 1;
    cursor: default;
    position: relative;
    letter-spacing: 0; // Use letter-spacing: 0 to make average star look like one glyph.
    touch-action: none;
}
.win-rating.win-small .win-star {
    width: 14px;
    height: 14px;
    font-size: 14px;
    padding: 0 3px;
}
.win-rating .win-star:before {
    content: "\E082";
}
.win-rating .win-star.win-disabled {
    cursor: default;
    touch-action: auto;
}


.Body {
  color: @color-Text;
  font-family: 'Merriweather', serif;
  font-size: percentage(16/16);
  line-height: @ratio-Scale--15;
  margin: 0;
  padding: 0;

  &-part {
    padding: 0 1em;
    margin: 0 auto;
    max-width: 40em;

    @media @md {
      font-size: @ratio-Scale--05;
      line-height: @ratio-Scale--15;
    }
  }
}

Add text-size-adjust property to prevent unwarrented adjustments on orientation change.

.Body {
  color: @color-Text;
  font-family: 'Merriweather', serif;
  font-size: percentage(16/16);
  line-height: @ratio-Scale--15;
  margin: 0;
  padding: 0;
  text-size-adjust: 100%;

  &-part {
    padding: 0 1em;
    margin: 0 auto;
    max-width: 40em;

    @media @md {
      font-size: @ratio-Scale--05;
      line-height: @ratio-Scale--15;
    }
  }
}


/* An example of an advanced configuration
 * (instead of using `.gridiron;`, like below).
 * It creates two grids; 10 columns (under .row-10)
 * 	and 12 columns (under .row-12).
.container {
	.make_container;
	&:extend(.clearfix all);
}

.row-10, .row-12 {
	.make_row;
	&:extend(.clearfix all);
}

.breakpoints(10, ~".row-10");
.breakpoints(12, ~".row-12");
.offset_mixins(10, ~".row-10");
.offset_mixins(12, ~".row-12");
*/
.gridiron;

Add visibility mixins to comment

/* An example of an advanced configuration
 * (instead of using `.gridiron;`, like below).
 * It creates two grids; 10 columns (under .row-10)
 * 	and 12 columns (under .row-12).
.container {
	.make_container;
	&:extend(.clearfix all);
}

.row-10, .row-12 {
	.make_row;
	&:extend(.clearfix all);
}

.breakpoints(10, ~".row-10");
.breakpoints(12, ~".row-12");
.offset_mixins(10, ~".row-10");
.offset_mixins(12, ~".row-12");
.visibility_mixins();

*/
.gridiron;


/*
 * Your Stylesheet
 */

@import 'ui-variables';

// Ensure that workspace is distinguishable from tab bar and status bar
// (when no tabs are open)
atom-workspace {
  background-color: @base-background-color;
}

atom-text-editor:not([mini]) {
  &::shadow {
    // De-italicize all syntax components which Monokai italicizes
    .storage.type,
    .entity.other.inherited-class,
    .variable.parameter,
    .support.type,
    .support.class {
      font-style: normal;
    }
    // Make selected line more prominent
    .line.cursor-line {
      background-color: rgba(255, 255, 255, 0.05);
    }
  }
}

// Move Linter Status to the left of Encoding and Language in status bar
// Also reduce margin to converve space
.status-bar linter-bottom-status.inline-block {
  float: right;
  margin-right: 0;
}

linter-bottom-tab {
  // Hide Linter file tabs to conserve space in status bar
  display: none;
  // Decrease font size of file tabs to vertically center them
  // (in case I ever decide to show them again)
  font-size: 10px;
}

Add dashed border around SVG preview

/*
 * Your Stylesheet
 */

@import 'ui-variables';

// Ensure that workspace is distinguishable from tab bar and status bar
// (when no tabs are open)
atom-workspace {
  background-color: @base-background-color;
}

atom-text-editor:not([mini]) {
  &::shadow {
    // De-italicize all syntax components which Monokai italicizes
    .storage.type,
    .entity.other.inherited-class,
    .variable.parameter,
    .support.type,
    .support.class {
      font-style: normal;
    }
    // Make selected line more prominent
    .line.cursor-line {
      background-color: rgba(255, 255, 255, 0.05);
    }
  }
}

// Move Linter Status to the left of Encoding and Language in status bar
// Also reduce margin to converve space
.status-bar linter-bottom-status.inline-block {
  float: right;
  margin-right: 0;
}

linter-bottom-tab {
  // Hide Linter file tabs to conserve space in status bar
  display: none;
  // Decrease font size of file tabs to vertically center them
  // (in case I ever decide to show them again)
  font-size: 10px;
}

// Add thin dashed border around SVG preview to indicate view box boundaries
.svg-preview > :nth-child(1) {
  border: dashed 1px #999;
}


@import "variables.less";
@import "normalize.less";

.nju-app
{
    width: 100%;
    height: 100%;

    &, *
    {
        box-sizing: border-box;
        outline: none;
    }

    html
    {
        font-family: @font-family;
        font-size: @font-size-base;
    }

    .base
    {
        font-size: @font-size-base;
    }

    h1, .h1
    {
        font-size: @font-size-h1;
        font-weight: bold;
    }

    h2, .h2
    {
        font-size: @font-size-h2;
        font-weight: bold;
    }

    h3, .h3
    {
        font-size: @font-size-h3;
        font-weight: bold;
    }

    small, .small
    {
        font-size: @font-size-base;
        font-weight: bold;
    }

}
@import "theme.less";

Modify h1 h2 h3 margin.

@import "variables.less";
@import "normalize.less";

.nju-app
{
    width: 100%;
    height: 100%;

    &, *
    {
        box-sizing: border-box;
        outline: none;
    }

    html
    {
        font-family: @font-family;
        font-size: @font-size-base;
    }

    .base
    {
        font-size: @font-size-base;
    }

    h1,h2,h3
    {
        margin: 0;
    }

    h1, .h1
    {
        font-size: @font-size-h1;
        font-weight: bold;
    }

    h2, .h2
    {
        font-size: @font-size-h2;
        font-weight: bold;
    }

    h3, .h3
    {
        font-size: @font-size-h3;
        font-weight: bold;
    }

    small, .small
    {
        font-size: @font-size-base;
        font-weight: bold;
    }

}
@import "theme.less";


@ui-font-size: 14px;

.atom-panel.modal .select-list ol.list-group li,
.atom-panel.modal.select-list ol.list-group li {
  font-size: @ui-font-size;
}

.elmjutsu-usages {
  font-size: @ui-font-size;
}

.pane-item {
  font-size: @ui-font-size;
}

.status-bar {
  font-size: @ui-font-size;
  height: @ui-font-size * 2;
  line-height: @ui-font-size * 2 - 4;
}

.tab-bar .tab, .tab-bar .tab.active {
  font-size: @ui-font-size * 0.8;
  height: @ui-font-size * 2;
}

.tool-panel pre {
  font-size: @ui-font-size;
}

.tree-view {
  font-size: @ui-font-size;
}

Add padding between Elmjutsu usages

@ui-font-size: 14px;

.atom-panel.modal .select-list ol.list-group li,
.atom-panel.modal.select-list ol.list-group li {
  font-size: @ui-font-size;
}

.elmjutsu-usages {
  font-size: @ui-font-size;
}

.elmjutsu-usages ul li {
  padding: 12px;
}

.pane-item {
  font-size: @ui-font-size;
}

.status-bar {
  font-size: @ui-font-size;
  height: @ui-font-size * 2;
  line-height: @ui-font-size * 2 - 4;
}

.tab-bar .tab, .tab-bar .tab.active {
  font-size: @ui-font-size * 0.8;
  height: @ui-font-size * 2;
}

.tool-panel pre {
  font-size: @ui-font-size;
}

.tree-view {
  font-size: @ui-font-size;
}


.notification-list {
  position: absolute;
  left:0;
  padding: 15px;
  z-index: 100;
  width: 100%;

  // hide close button on non-dismissable alerts
  button.close {
    display: none;
  }
  .alert-dismissable{
    button.close {
      display: block;
    }
  }

  .alert {
    opacity: .95;
    transition: opacity .2s ease-in-out;
    &:hover {
      opacity: 1;
    }
  }
}

Fix notification list styling to prevent empty list block buttons

.notification-list {
  position: absolute;
  left:0;
  z-index: 100;
  width: 100%;

  .alert {
    opacity: .95;
    transition: opacity .2s ease-in-out;
    margin: 15px;
    &:hover {
      opacity: 1;
    }

    // hide close button on non-dismissable alerts
    button.close {
      display: none;
    }
    &.alert-dismissable{
      button.close {
        display: block;
      }
    }
  }
}


.confirm-reservation-modal {
  .reservation-form {
    .well {
      margin-left: -20px;
      margin-right: -20px;
      padding: 20px;
    }

    .form-controls {
      .modal-footer();
      padding-right: 0;
      padding-bottom: 0;
    }

    .terms-and-conditions-input-wrapper {
      .col-sm-offset-3 {
        margin-left: 0;
      }
      label {
        font-weight: bold;
      }
    }
  }
}

Make terms and conditions scrollable

.confirm-reservation-modal {
  .reservation-form {
    .well {
      margin-left: -20px;
      margin-right: -20px;
      padding: 20px;
    }

    .form-controls {
      .modal-footer();
      padding-right: 0;
      padding-bottom: 0;
    }

    .terms-and-conditions {
      .wrapped-text {
        max-height: 300px;
        overflow-y: scroll;
        margin-bottom: 10px;
        border: 1px solid @gray-light;
        padding: 10px;
      }
    }

    .terms-and-conditions-input-wrapper {
      .col-sm-offset-3 {
        margin-left: 0;
      }
      label {
        font-weight: bold;
      }
    }
  }
}


@import "~normalize.css/normalize.css";
@import "~primer/css/primer.css";
// @import "~octicons/octicons/octicons.css";

@import "docs.css";

@main-background-color: #F7F8F9;

// body {
//   background: @main-background-color;
// }

Remove normalize.css (already in docs-imported.css)

// @import "~normalize.css/normalize.css";
@import "~primer/css/primer.css";
// @import "~octicons/octicons/octicons.css";

@import "docs-imported.css";

@main-background-color: #F7F8F9;

// body {
//   background: @main-background-color;
// }


/**
* Source View Styles
* Includes only the styles that need to decorate an editor
**/

@import "ui-variables";

// Breakpoint marker
.breakpoint {
  @breakpoint-size: .5em;
  background: fade(darken(@background-color-info, 10%), 90%);

  height: @breakpoint-size !important;
  width: @breakpoint-size - .01; // w/o the offset the shape is oblong
  border-radius: 50%;
  margin: .45em .25em 0;

  &.is-pending {
    background: darken(@background-color-warning, 25%);
  }
}

.gutter-container > .gutter[gutter-name^="delve-breakpoints"] {
  .delve-breakpoint {
    .breakpoint();
  }
}

.line.delve-cur-scope {
  background: fade(@background-color-info, 15%) !important;
}

Set breakpoint size to a hard 8px

/**
* Source View Styles
* Includes only the styles that need to decorate an editor
**/

@import "ui-variables";

// Breakpoint marker
.breakpoint {
  @breakpoint-size: 8px;
  background: fade(darken(@background-color-info, 10%), 90%);

  height: @breakpoint-size !important;
  width: @breakpoint-size;
  border-radius: 50%;
  margin: .45em .25em 0;

  &.is-pending {
    background: darken(@background-color-warning, 25%);
  }
}

.gutter-container > .gutter[gutter-name^="delve-breakpoints"] {
  .delve-breakpoint {
    .breakpoint();
  }
}

.line.delve-cur-scope {
  background: fade(@background-color-info, 15%) !important;
}


// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.flag-country {
  --height: 1em;
  --width-height-ratio: calc(70 / 47);

  .default-box-shadow();
  height: var(--height);
  width: calc(var(--height) * var(--width-height-ratio));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 3px;
  position: relative;
  filter: saturate(1.1);

  &::after {
    .full-size();
    background-color: fade(#fff, 25%);
    content: '';
    border-radius: inherit;
  }

  &--flat {
    box-shadow: none;
  }

  &--medium {
    --height: 20px;
  }

  &--small {
    --height: 13px;
  }
}

Adjust flag size and fix overlay and shadow for non-rectangular flags

// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.flag-country {
  --height: 1em;
  --width-height-ratio: calc(100 / 75);

  .default-box-shadow();
  height: var(--height);
  width: calc(var(--height) * var(--width-height-ratio));
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 3px;
  position: relative;
  filter: saturate(1.1) drop-shadow(0 1px @box-shadow-radius @box-shadow-color);

  &::after {
    .full-size();
    background: inherit;
    border-radius: inherit;
    filter: contrast(0) brightness(2);
    opacity: 0.25;
    content: '';
  }

  &--flat {
    box-shadow: none;
  }

  &--medium {
    --height: 20px;
  }

  &--small {
    --height: 13px;
  }
}


.login-page {
  h1 {
    .klm-heading-medium;
  }

  button {
    text-transform: uppercase;
  }

  form input {
    border: 1px solid @gray-dark;
    height: 40px;
    font-size: @font-size-base;
  }

  .form-actions {
    .make-column(10, 10, 10);
    .make-column-offset(2, 2, 2);
  }

  .register-info {
    margin-top: @layout-margin-small;
    font-size: 14px;
  }
}

Add mobile styles to login page

.login-page {
  h1 {
    .klm-heading-medium;
    margin-bottom: @layout-margin-small;

    @media (min-width: @screen-sm-min) {
      margin-bottom: @layout-margin-medium;
    }
  }

  button {
    text-transform: uppercase;
  }

  form input {
    border: 1px solid @gray-dark;
    height: 40px;
    font-size: @font-size-base;
  }

  .form-actions {
    .make-column(10, 10, 10);
    .make-column-offset(2, 2, 2);
  }

  .register-info {
    margin-top: @layout-margin-small;
    font-size: 14px;
  }
}


@import "../../../../src/reset";
@import "../../../../src/utilities";
@import "prism";
@import "markdown";

*,
*::before,
*::after {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;

  &:hover {
    .text-underline;
  }
}

.define-text-color('primary';
  default #3498DB,
  'light' lighten(#3498DB, 25%),
  'dark' #2980B9
;);

.define-bg-color('primary';
  default #3498db,
  'light' #a0cfee,
  'dark' #2980b9
;);

Update custom bg color definition in docs

@import "../../../../src/reset";
@import "../../../../src/utilities";
@import "prism";
@import "markdown";

*,
*::before,
*::after {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;

  &:hover {
    .text-underline;
  }
}

.define-text-color('primary';
  default #3498DB,
  'light' lighten(#3498DB, 25%),
  'dark' #2980B9
;);

@bg-colors:
  'light' hsl(0, 0%, 100%),
  'light-soft' hsl(0, 0%, 98%),
  'light-softer' hsl(0, 0%, 96%),

  'dark' hsl(0, 0%, 33%),
  'dark-soft' hsl(0, 0%, 42%),
  'dark-softer' hsl(0, 0%, 52%),

  'primary' #3498db,
  'primary-light' #a0cfee,
  'primary-dark' #2980b9
;


/* ==========================================================================
   Capital Framework
   Master LESS File
   ========================================================================== */

// import Normalize before all other LESS/CSS
@import (less) "../../vendor/normalize-css/normalize.css";

// import combined CF component LESS
@import "../../vendor/cf-concat/cf.less";

// import other modules
@import "module/mixins.less";
@import "module/typography.less";
@import "module/layout.less";
@import "module/table.less";
@import "module/mega-expand.less";
@import "module/loan-type.less";
@import "module/loan-comparison.less";
@import "module/rate-checker.less";
@import "module/hero.less";
@import "module/nav.less";
@import "module/forms.less";
@import "module/tab.less";
@import "module/helpers.less";

// import CFPB nemo theme header and footer styles
.nemo {
  @import "module/nemo.less";
  // and a shim to override some things
  @import "module/nemo-shim.less";
}

Add some silly CSS to test our build server

/* ==========================================================================
   Capital Framework
   Master LESS File
   ========================================================================== */

// import Normalize before all other LESS/CSS
@import (less) "../../vendor/normalize-css/normalize.css";

// import combined CF component LESS
@import "../../vendor/cf-concat/cf.less";

// import other modules
@import "module/mixins.less";
@import "module/typography.less";
@import "module/layout.less";
@import "module/table.less";
@import "module/mega-expand.less";
@import "module/loan-type.less";
@import "module/loan-comparison.less";
@import "module/rate-checker.less";
@import "module/hero.less";
@import "module/nav.less";
@import "module/forms.less";
@import "module/tab.less";
@import "module/helpers.less";

// import CFPB nemo theme header and footer styles
.nemo {
  @import "module/nemo.less";
  // and a shim to override some things
  @import "module/nemo-shim.less";
}

header {
  background: red !important;
}


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

.pane-item {
  .panel {
    border-color: fadeout(@inset-panel-border-color, 30%);
  }
}

Add a separator between panels

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

.pane-item {
  .panel {
    border-color: fadeout(@inset-panel-border-color, 30%);
  }
}

#panes {
  .row .pane {
    border-right: 1px solid @pane-item-border-color;
    &:last-child { border-right: none; }
  }
}


html, body {
  overflow-x: hidden;
  overflow-y: hidden;
  background: @background-colour;
  fill: @primary-white;
  font-family: @font-family;
  font-weight: @font-weight-base;
  line-height: @line-height-base;
}

text {
  font-family: @font-family;
  font-weight: @font-weight-base;
  line-height: @line-height-base;
}

.container {
  height: 100%;
  background: @background-colour;
}

.row {
  width: 100%;
}

[class*="col-"] {
  height: 100%;
}

.secondary-container {
  height: 100%;
  width: 100%;
  rect.foreground {
    opacity: 0 !important;
  }
}

.cartesian-chart {
  .axes-container {
    overflow: visible;
  }
  .background {
    fill: @background-colour;
  }
}

Set html and body height to 100% to prevent dropdown being cropped while loading screen is displayed

html, body {
  overflow-x: hidden;
  overflow-y: hidden;
  background: @background-colour;
  fill: @primary-white;
  font-family: @font-family;
  font-weight: @font-weight-base;
  line-height: @line-height-base;
  height: 100%;
}

text {
  font-family: @font-family;
  font-weight: @font-weight-base;
  line-height: @line-height-base;
}

.container {
  height: 100%;
  background: @background-colour;
}

.row {
  width: 100%;
}

[class*="col-"] {
  height: 100%;
}

.secondary-container {
  height: 100%;
  width: 100%;
  rect.foreground {
    opacity: 0 !important;
  }
}

.cartesian-chart {
  .axes-container {
    overflow: visible;
  }
  .background {
    fill: @background-colour;
  }
}


.css-live {
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	height: auto;
	width: 250px;
	padding: 15px;
	box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.75);
	background-color: lightgray;
	font-family: Arial, 'sans-serif';
	&__row {
		display: table-row;
		padding: 0 0 10px 0;
		&__label {
			display: table-cell;
			padding: 5px;
			text-align: right;
		}
		&__input {
			display: table-cell;
			padding: 4px;
		}
	}
}

Add open and close buttons

@width: 250px;
@shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.75);
@bg-color: rgba(240, 240, 240, 0.9);
@txt-color: #333;
.live-css {
	box-sizing: border-box;
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	height: auto;
	width: @width;
	padding: 15px;
	box-shadow: @shadow;
	background-color: @bg-color;
	color: @txt-color;
	font-family: Arial, 'sans-serif';
	font-size: 14px;
	&__title {
		margin: 0 0 15px 0;
		font-size: 1.2em;
		text-align: center;
	}
	&__open {
		display: none;
		position: absolute;
		top: 0;
		right: -17px;
		padding: 5px;
		box-shadow: @shadow;
		background-color: @bg-color;
		cursor: pointer;
	}
	&__close {
		position: absolute;
		top: 5px;
		right: 5px;
		padding: 5px;
		cursor: pointer;
	}
	&__row {
		display: table-row;
		padding: 0 0 10px 10px;
		&__label {
			display: table-cell;
			padding: 5px;
			text-align: right;
		}
		&__input {
			display: table-cell;
			padding: 4px;
		}
	}
	&--closed {
		left: -1*@width;
		.live-css {
			&__open {
				display: block;
			}
			&__close {
				display: none;
			}
		}
	}
}


.pie {
  .chart {
    margin-left: auto;
    margin-right: auto;

    width: 65%;
    max-width: 400px;
  }

  .chart, .legend {
    margin-top: 15px;
  }
}

Add a stroke to the pie slices

.pie {
  .chart {
    margin-left: auto;
    margin-right: auto;

    width: 65%;
    max-width: 400px;
  }

  .chart, .legend {
    margin-top: 15px;
  }

  .arc {
    stroke: #eee;
    stroke-width: 2px;
  }
}


html .umb-search-filter {
    position: relative;
    height: 30px;
    width: 190px;

    &.w-100 {
        width: 100%;
    }

    &.mb-15 {
        margin-bottom: 15px;
    }

    &__input {
        padding-left: 30px;
        padding-right: 6px;
        width: inherit;
        margin: 0;
    }

    .icon-search {
        color: #d8d7d9;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 10px;
        margin: auto 0;
    }
}

Fix styling of search icon in search filter

html .umb-search-filter {
    position: relative;
    height: 30px;
    width: 190px;

    &.w-100 {
        width: 100%;
    }

    &.mb-15 {
        margin-bottom: 15px;
    }

    &__input {
        padding-left: 30px;
        padding-right: 6px;
        width: inherit;
        margin: 0;
    }

    // "icon-search" class it kept for backward compatibility
    .umb-icon,
    .icon-search {
        color: #d8d7d9;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 10px;
        margin: auto 0;
    }
}


@import "ui-variables";
@import "levels-ui-variables";

.levels-view.annotation-overlay {
  background-color: fade(#aaa,90%);
  border-top-right-radius: @component-border-radius;
  border-bottom-right-radius: @component-border-radius;
  border-bottom-left-radius: @component-border-radius;
  box-shadow: 0 1px 3px rgba(0,0,0,0.4);
  color: #000;
  display: none;
  font-size: 85%;

  margin-top: 3px;
  padding: @component-padding / 2;

  width: 50%;

  hr {
    border-top: 1px solid #888;
    margin: 5px 0;
  }

  &::before {
    border-color: transparent transparent transparent fade(#aaa,90%);
    border-style: solid;
    border-width: 6px 0 0 6px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: -3px;
    width: 0;
  }

  .type {
    font-size: 9px;
    margin-right: 5px;
  }

  .position {
    color: #666;
    display: inline-block;
  }

  .source {
    color: #666;
    display: inline-block;
  }

}

Fix a bug that caused annotation overlays to be too small for short messages

@import "ui-variables";
@import "levels-ui-variables";

.levels-view.annotation-overlay {
  background-color: fade(#aaa,90%);
  border-top-right-radius: @component-border-radius;
  border-bottom-right-radius: @component-border-radius;
  border-bottom-left-radius: @component-border-radius;
  box-shadow: 0 1px 3px rgba(0,0,0,0.4);
  color: #000;
  display: none;
  font-size: 85%;

  margin-top: 3px;
  padding: @component-padding / 2;

  min-width: 300px;
  width: 50%;

  hr {
    border-top: 1px solid #888;
    margin: 5px 0;
  }

  &::before {
    border-color: transparent transparent transparent fade(#aaa,90%);
    border-style: solid;
    border-width: 6px 0 0 6px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: -3px;
    width: 0;
  }

  .type {
    font-size: 9px;
    margin-right: 5px;
  }

  .position {
    color: #666;
    display: inline-block;
  }

  .source {
    color: #666;
    display: inline-block;
  }

}


/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 *
 * Add your own CSS or Less to fully customize Atom.
 * If you are unfamiliar with Less, you can read more about it here:
 * http://lesscss.org
 */

/*
 * Examples
 * (To see them, uncomment and save)
 */

// style the background color of the tree view
.tree-view {
  // background-color: whitesmoke;
}

// style the background and foreground colors on the atom-text-editor-element itself
atom-text-editor {
  // color: white;
  // background-color: hsl(180, 24%, 12%);
}

// style UI elements inside atom-text-editor
atom-text-editor .cursor {
  // border-color: red;
}

.editor.is-focused {
  .line.cursor-line {
    background: transparent;
  }
}

Make UI font also M+ 1mn

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 *
 * Add your own CSS or Less to fully customize Atom.
 * If you are unfamiliar with Less, you can read more about it here:
 * http://lesscss.org
 */

/*
 * Examples
 * (To see them, uncomment and save)
 */

// style the background color of the tree view
.tree-view {
  // background-color: whitesmoke;
}

// style the background and foreground colors on the atom-text-editor-element itself
atom-text-editor {
  // color: white;
  // background-color: hsl(180, 24%, 12%);
}

atom-workspace {
  font-family: 'M+ 1mn';
}

// style UI elements inside atom-text-editor
atom-text-editor .cursor {
  // border-color: red;
}

.editor.is-focused {
  .line.cursor-line {
    background: transparent;
  }
}


.analytics .widget-item {
  .title-wrapper {
    width: 100%;
    padding: 0px 10px 10px 10px;
    border-bottom: @impac-widget-title-border;
    white-space: nowrap;
    .title {
      display: inline;
      text-transform: @impac-widget-title-text-transform;
      .font(@impac-widget-title-text-size,600,@impac-widget-title-text-color);
      text-align: left;
      cursor: text;

      &.editable-hide {
        display: none;
      }
    }
    .editable-wrap {
      height: 20px;
      width: 75%;
      // otherwise, white-space is overriden in mno-enterprise
      white-space: nowrap;
      .editable-controls {
        width: 100%;
        .editable-input {
          height: 20px;
          font-size: 12px;
          text-transform: @impac-widget-title-text-transform;
          width: 100%;
        }
      }
    }
  }
}

Remove padding to see whole text and diminish editor size

.analytics .widget-item {
  .title-wrapper {
    width: 100%;
    padding: 0px 10px 10px 10px;
    border-bottom: @impac-widget-title-border;
    white-space: nowrap;
    .title {
      display: inline;
      text-transform: @impac-widget-title-text-transform;
      .font(@impac-widget-title-text-size,600,@impac-widget-title-text-color);
      text-align: left;
      cursor: text;

      &.editable-hide {
        display: none;
      }
    }
    .editable-wrap {
      height: 20px;
      width: 75%;
      // otherwise, white-space is overriden in mno-enterprise
      white-space: nowrap;
      .editable-controls {
        width: 100%;
        .editable-input {
          height: 20px;
          font-size: 12px;
          text-transform: @impac-widget-title-text-transform;
          width: 95%;
          padding: 0px 3px;
        }
      }
    }
  }
}


.book {
    .book-header {
        position: fixed;
        top: 0px;
        right: 0px;
        left: 0px;
        z-index: 2;

        height: 40px;

        font-size: 0.85em;

        background: #242628;
        color: #e2edf2;

        .btn {
            display: block;
            height: 40px;
            padding: 0px 15px;
            border-bottom: none;
            color: #7d878a;
            text-transform: uppercase;
            line-height: 40px;

            &:hover {
                color: #e2edf2;
                text-decoration: none;
                position: relative;
                background: #303436;
                box-shadow: 0 -2px 2px rgba(0,0,0,0.2) inset;
            }
        }

        h1 {
            margin: 0px;
            font-size: 20px;
            text-align: center;
            line-height: 40px;

            padding-left: 400px;
            padding-right: 400px;
            .transition(margin-left 0.5s ease);

            a, a:hover {
                color: inherit;
                text-decoration: none;
            }

            @media (max-width: 600px) {
                display: none;
            }
        }
    }

    &.with-summary {
        .book-header h1 {
            margin-left: 250px;
        }
    }
}

Fix title position for small screen

.book {
    .book-header {
        position: fixed;
        top: 0px;
        right: 0px;
        left: 0px;
        z-index: 2;

        height: 40px;

        font-size: 0.85em;

        background: #242628;
        color: #e2edf2;

        .btn {
            display: block;
            height: 40px;
            padding: 0px 15px;
            border-bottom: none;
            color: #7d878a;
            text-transform: uppercase;
            line-height: 40px;

            &:hover {
                color: #e2edf2;
                text-decoration: none;
                position: relative;
                background: #303436;
                box-shadow: 0 -2px 2px rgba(0,0,0,0.2) inset;
            }
        }

        h1 {
            margin: 0px;
            font-size: 20px;
            text-align: center;
            line-height: 40px;

            padding-left: 200px;
            padding-right: 200px;
            .transition(margin-left 0.5s ease);

            a, a:hover {
                color: inherit;
                text-decoration: none;
            }

            @media (max-width: 600px) {
                display: none;
            }
        }
    }

    &.with-summary {
        .book-header h1 {
            margin-left: 250px;
        }
    }
}


.zebra-stripe > *:nth-child(2n-1) {
  background-color: @zebra-white;
  > span:hover {
    background-color: @hover-white;
  }
}

.listings li.c-listing--selected {
  background-color: @selected-light;
}

.listings span:hover {
  background-color: @hover-white;
}

.c-listing {
  display: flex;
  flex-flow: row;

  .c-listing-boss,
  .c-listing-minion,
  .c-listing-delete,
  .c-listing-edit,
  .c-listing-move,
  .c-listing__counter {
    display: none;
  }

  &:hover {
    .c-listing-boss,
    .c-listing-minion,
    .c-listing-delete,
    .c-listing-edit,
    .c-listing-move {
      display: flex;
    }
  }
}

.c-folder {
  .c-listing {
    &:not(:first-child) {
      margin-left: @medium-spacer;
    }
  }
}

.c-folder--open {
  box-shadow: inset 10px -10px 5px -5px rgba(0, 0, 0, 0.25);
  padding-bottom: @medium-spacer;
  .c-folder--open {
    margin-left: @medium-spacer;
  }
}

Swap side box shadow for solid border

.zebra-stripe > *:nth-child(2n-1) {
  background-color: @zebra-white;
  > span:hover {
    background-color: @hover-white;
  }
}

.listings li.c-listing--selected {
  background-color: @selected-light;
}

.listings span:hover {
  background-color: @hover-white;
}

.c-listing {
  display: flex;
  flex-flow: row;

  .c-listing-boss,
  .c-listing-minion,
  .c-listing-delete,
  .c-listing-edit,
  .c-listing-move,
  .c-listing__counter {
    display: none;
  }

  &:hover {
    .c-listing-boss,
    .c-listing-minion,
    .c-listing-delete,
    .c-listing-edit,
    .c-listing-move {
      display: flex;
    }
  }
}

.c-folder {
  .c-listing {
    &:not(:first-child) {
      margin-left: @medium-spacer;
    }
  }
}

.c-folder--open {
  box-shadow: inset 0px -10px 5px -5px rgba(0, 0, 0, 0.25);
  border-left: 1px solid @primary-black;
  padding-bottom: @medium-spacer;
  .c-folder--open {
    margin-left: @medium-spacer;
  }
}


@import "ui-variables";

.markdown-preview.markdown-preview {
    background-color: @markdown-preview-background-color;
    color: @markdown-preview-text-color;
    border: @markdown-preview-background-color solid @markdown-preview-border-color;
    .markdown-body {
        color: @markdown-preview-text-color;
        word-wrap: normal;
    }
}

Fix heading colors for preview styles

@import "ui-variables";

.markdown-preview.markdown-preview {
    background-color: @markdown-preview-background-color;
    color: @markdown-preview-text-color;
    border: @markdown-preview-background-color solid @markdown-preview-border-color;
    .markdown-body {
        color: @markdown-preview-text-color;
        word-wrap: normal;
    }
}

.markdown-preview:not([data-use-github-style]) {
    strong {
        color: @markdown-preview-text-color;
    }
    a {
        color: darken(@theme-blue, 40%);
        font-weight: 600;
    }
    h1, h2, h3, h4, h5, h6 {
        color: @markdown-preview-text-color;
    }
}


@import "../lib/TagLabel.less";
@import "../lib/TagIcon.less";

@import "TagCloud.less";
@import "TagDiscussionModal.less";
@import "TagTiles.less";

.DiscussionHero {
  .item-title {
    display: block;
    margin-top: 15px;
  }
}
.TagLinkButton.child {
  @media @tablet-up {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  margin-left: 10px;

  .TagIcon {
    display: none;
  }
}
.DiscussionComposer-changeTags {
  margin-right: 15px;
  vertical-align: 2px;
}
.DiscussionListItem-info > .item-tags {
  margin-right: 4px;
  opacity: 1;
}
@media @tablet-up {
  .IndexPage, .UserPage {
    .DiscussionListItem-info > .item-tags {
      float: right;
      margin-top: -14px;
      margin-right: 0;
    }
  }
}
@media @desktop-up {
  .TagsPage {
    .sideNav {
      .sideNav--horizontal();
      float: none;
      width: auto;
      padding-top: 0;

      &:after {
        display: none;
      }
    }
    .sideNavOffset {
      margin: 15px 0 0;
    }
  }
}

Update for discussion list padding change

@import "../lib/TagLabel.less";
@import "../lib/TagIcon.less";

@import "TagCloud.less";
@import "TagDiscussionModal.less";
@import "TagTiles.less";

.DiscussionHero {
  .item-title {
    display: block;
    margin-top: 15px;
  }
}
.TagLinkButton.child {
  @media @tablet-up {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  margin-left: 10px;

  .TagIcon {
    display: none;
  }
}
.DiscussionComposer-changeTags {
  margin-right: 15px;
  vertical-align: 2px;
}
.DiscussionListItem-info > .item-tags {
  margin-right: 4px;
  opacity: 1;
}
@media @tablet-up {
  .IndexPage, .UserPage {
    .DiscussionListItem-info > .item-tags {
      float: right;
      margin-top: -12px;
      margin-right: 0;
    }
  }
}
@media @desktop-up {
  .TagsPage {
    .sideNav {
      .sideNav--horizontal();
      float: none;
      width: auto;
      padding-top: 0;

      &:after {
        display: none;
      }
    }
    .sideNavOffset {
      margin: 15px 0 0;
    }
  }
}


// font-face inclusion as with http://www.fontsquirrel.com/tools/webfont-generator
// dummy parameter for every source because of an occasional firefox bug
@font-face {
	font-family: 'Open Sans Light';
	src: url('@{path-fonts}/OpenSans-Light-webfont.eot?wow');                                   /* IE9 Compat Modes */
	src: url('@{path-fonts}/OpenSans-Light-webfont.eot?wow#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('@{path-fonts}/OpenSans-Light-webfont.woff?wow') format('woff'),                   /* Modern Browsers */
	     url('@{path-fonts}/OpenSans-Light-webfont.ttf?wow') format('truetype'),                /* Safari, Android, iOS */
	     url('@{path-fonts}/OpenSans-Light-webfont.svg?wow#open_sanslight') format('svg');      /* Legacy iOS */
	font-weight: normal;
	font-style: normal;
}

Add a link to information about font definitions in @font-face and about style linking

// font-face inclusion as with http://www.fontsquirrel.com/tools/webfont-generator
// dummy parameter for every source because of an occasional firefox bug
@font-face {
	font-family: 'Open Sans Light';
	src: url('@{path-fonts}/OpenSans-Light-webfont.eot?wow');                                   /* IE9 Compat Modes */
	src: url('@{path-fonts}/OpenSans-Light-webfont.eot?wow#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('@{path-fonts}/OpenSans-Light-webfont.woff?wow') format('woff'),                   /* Modern Browsers */
	     url('@{path-fonts}/OpenSans-Light-webfont.ttf?wow') format('truetype'),                /* Safari, Android, iOS */
	     url('@{path-fonts}/OpenSans-Light-webfont.svg?wow#open_sanslight') format('svg');      /* Legacy iOS */
	// In-depth information how to set the following font definitions:
	// http://www.smashingmagazine.com/2013/02/14/setting-weights-and-styles-at-font-face-declaration/
	font-weight: normal;
	font-style: normal;
}


p {
  margin-top: 0.75em;
}

figure {
  margin-top: 1em;
  margin-left: 1em;
  margin-right: 1em;
}

code {
  font-family: @font-family-monospace;
  background-color: @grey-light;
  color: @black;
  text-decoration: none;
}

strong {
  font-weight: bold;
}

em {
  font-style: italic;
}

sup {
  font-size: small;
  vertical-align: super;
}

@supports (font-variant-position: super) {
  sup {
    font-size: inherit;
    vertical-align: initial;
    font-variant-position: super;
  }
}

ol, ul {
  margin-left: 2em;
  margin-top: 0.5em;
}

ul {
  list-decoration-style: circle;
}

ol {
  list-style-type: decimal;
}

Use font weight number instead of name

p {
  margin-top: 0.75em;
}

figure {
  margin-top: 1em;
  margin-left: 1em;
  margin-right: 1em;
}

code {
  font-family: @font-family-monospace;
  background-color: @grey-light;
  color: @black;
  text-decoration: none;
}

strong {
  font-weight: 700;
}

em {
  font-style: italic;
}

sup {
  font-size: small;
  vertical-align: super;
}

@supports (font-variant-position: super) {
  sup {
    font-size: inherit;
    vertical-align: initial;
    font-variant-position: super;
  }
}

ol, ul {
  margin-left: 2em;
  margin-top: 0.5em;
}

ul {
  list-decoration-style: circle;
}

ol {
  list-style-type: decimal;
}


// Makes .main extend to the bottom of the screen
html, body, .container, .main {
  min-height: 100%;
}
html {
  font-size: 15px;

  body {
    font-size: 1rem;
    line-height: 1.3rem;
    font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 400;
  }
}

a {
  color: #399EE3;
  &:visited {
    color: #399EE3;
  }

  &:hover, &:active {
    color: #4E86FE;
    text-decoration: none;
  }
}

.push-both {
  margin-left: auto;
  margin-right: auto;
}

Change base font-size to 16px

// Makes .main extend to the bottom of the screen
html, body, .container, .main {
  min-height: 100%;
}
html {
  font-size: 16px;

  body {
    font-size: 1rem;
    line-height: 1.3rem;
    font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 400;
  }
}

a {
  color: #399EE3;
  &:visited {
    color: #399EE3;
  }

  &:hover, &:active {
    color: #4E86FE;
    text-decoration: none;
  }
}

.push-both {
  margin-left: auto;
  margin-right: auto;
}


.login {
  background-color: #ffffff;
  background: #ffffff;

  .cancel-btn, .menu-btn {
    color: #e77c24;

    &.active {
      color: fade(#e77c24, 60%);
    }
  }

  .login-form {

    .button {
      color: #e77c24;

      &.active {
        color: fade(#e77c24, 60%);
      }
    }

    .stayloggedin {
      color: #e77c24;

      .circle {
        background-color: #e77c24;
        color: fade(#ffffff, 40%);

        &.on {
          color: #ffffff;
        }
      }
    }
  }

  .advanced-login-settings,
  .learn-more {
    color: fade(#e77c24, 60%);

    &:active {
      color: #e77c24;
    }
  }
}

Fix the login screen for Blue/Groups

.login {
  background-color: #ffffff;
  background: #ffffff;

  #unme,
  #pwrd {
    color: #e77c24;

    &::-webkit-input-placeholder {
      color: fade(#e77c24, 60%);
      text-shadow: none;
    }
  }

  .cancel-btn, .menu-btn {
    color: #e77c24;

    &.active {
      color: fade(#e77c24, 60%);
    }
  }

  .login-form {

    .login-input {
      border-color: fade(#e77c24, 20%);

      &.focused {
        border-color: fade(#e77c24, 60%);
      }
    }

    .button {
      color: #e77c24;
      border-color: fade(#e77c24, 20%);
      border-bottom-color: fade(#e77c24, 40%);

      &.active {
        color: fade(#e77c24, 60%);
        background: fade(#e77c24, 20%);
      }
    }

    .stayloggedin {
      color: #e77c24;

      .circle {
        background-color: #e77c24;
        color: fade(#ffffff, 40%);

        &.on {
          color: #ffffff;
        }
      }
    }
  }

  .advanced-login-settings,
  .learn-more {
    color: fade(#e77c24, 80%);

    &:active {
      color: #e77c24;
    }
  }
}


// bower:less
@import "../../bower_components/bootstrap/less/bootstrap.less";
// endbower

@import "common/_variables";
@import "common/_global";
@import "components/_buttons";
@import "components/_comments";
@import "components/_forms";
@import "components/_grid";
@import "components/_wp-classes";
@import "layouts/_header";
@import "layouts/_sidebar";
@import "layouts/_footer";
@import "layouts/_pages";
@import "layouts/_posts";

Add note about not manually editing wiredep injected deps

// Automatically injected Bower dependencies via wiredep (never manually edit this block)
// bower:less
@import "../../bower_components/bootstrap/less/bootstrap.less";
// endbower

@import "common/_variables";
@import "common/_global";
@import "components/_buttons";
@import "components/_comments";
@import "components/_forms";
@import "components/_grid";
@import "components/_wp-classes";
@import "layouts/_header";
@import "layouts/_sidebar";
@import "layouts/_footer";
@import "layouts/_pages";
@import "layouts/_posts";


/* Additional CSS for infrastructure. */
@import "../../bootstrap/less/variables.less";
@import "numberpicker.less";
@import "bootstrap.less";
@import "breadcrumbs.less";
@import "buttons.less";
@import "capacities.less";
@import "flavor_usages.less";
@import "formsets.less";
@import "index_pages.less";
@import "individual_pages.less";
@import "tables.less";

// disable text select on element
.unselectable {
  user-select: none;
  -o-user-select:none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
}

.actions {
    margin: 0 0  @baseLineHeight / 3 0;
}
.fullscreen-workflow-body {
    overflow: auto;
}

Remove project picker from the top bar

/* Additional CSS for infrastructure. */
@import "../../bootstrap/less/variables.less";
@import "numberpicker.less";
@import "bootstrap.less";
@import "breadcrumbs.less";
@import "buttons.less";
@import "capacities.less";
@import "flavor_usages.less";
@import "formsets.less";
@import "index_pages.less";
@import "individual_pages.less";
@import "tables.less";

// disable text select on element
.unselectable {
  user-select: none;
  -o-user-select:none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
}

.actions {
    margin: 0 0  @baseLineHeight / 3 0;
}
.fullscreen-workflow-body {
    overflow: auto;
}

// hide the project switcher from the top bar
#tenant_switcher {
    visibility: hidden;
}


.tabs-layout-overlay {
  background: grey;
  position: absolute;
  opacity: 0;
  pointer-events: none;
  transition: all 0.2s;
  &.visible {
    opacity: 0.1;
  }
}

Set z-index on overlay so that it covers the docks

.tabs-layout-overlay {
  background: grey;
  position: absolute;
  z-index: 11; // Make sure this covers absolutely-positioned docks
  opacity: 0;
  pointer-events: none;
  transition: all 0.2s;
  &.visible {
    opacity: 0.1;
  }
}


// Main App UI
@border-width: 0.4em;
@border-width-large: 0.4em;
@title-bar-height: 1.6em;
@title-bar-text-size: 13px;
@title-bar-height: 23px;

// Loader
@loader-width: 8em;

Fix title bar height on windows

// Main App UI
@border-width: 0.4em;
@border-width-large: 0.4em;
@title-bar-height: 1.6em;
@title-bar-text-size: 13px;
@title-bar-height-darwin: 23px;

// Loader
@loader-width: 8em;


// The ui-variables file is provided by base themes provided by Atom.
//
// See https://github.com/atom/atom-dark-ui/blob/master/stylesheets/ui-variables.less
// for a full listing of what's available.

@import "line-colors";

@borderWidth: 1px;
@marginWidth: -1px;

.highlight-view.hidden {
  display: none;
}

.highlight-multi-line(@style: '') {
  .line[class*="highlight-line-multi-line-@{style}-top"] {
    border-top-style: @style;
    border-top-width: @borderWidth;
    border-top-color: @lineColour;
    margin-top: @marginWidth;
  }
  .line[class*="highlight-line-multi-line-@{style}-bottom"] {
    border-bottom-style: @style;
    border-bottom-width: @borderWidth;
    border-bottom-color: @lineColour;
    margin-bottom: @marginWidth;
  }
}

.editor {
  .line.highlight-line {
    background: @cursorBackground !important;
  }
  .highlight-multi-line(solid);
  .highlight-multi-line(dashed);
  .highlight-multi-line(dotted);
}

Add support for Shadow Dom

// The ui-variables file is provided by base themes provided by Atom.
//
// See https://github.com/atom/atom-dark-ui/blob/master/stylesheets/ui-variables.less
// for a full listing of what's available.

@import "line-colors";

@borderWidth: 1px;
@marginWidth: -1px;

.highlight-view.hidden {
  display: none;
}

.highlight-multi-line(@style: '') {
  .line[class*="highlight-line-multi-line-@{style}-top"] {
    border-top-style: @style;
    border-top-width: @borderWidth;
    border-top-color: @lineColour;
    margin-top: @marginWidth;
  }
  .line[class*="highlight-line-multi-line-@{style}-bottom"] {
    border-bottom-style: @style;
    border-bottom-width: @borderWidth;
    border-bottom-color: @lineColour;
    margin-bottom: @marginWidth;
  }
}

.editor, :host, atom-text-editor, atom-text-editor::shadow {
  .line.highlight-line {
    background: @cursorBackground !important;
  }
  .highlight-multi-line(solid);
  .highlight-multi-line(dashed);
  .highlight-multi-line(dotted);
}


#timelinemenu {
  position: relative;

  .menu {
    position: absolute;
    top: 0px;
    right: 0;
    overflow-x: hidden;
    overflow-y: visible;
    z-index: 1;

    ul {
      position: relative;
      top: 0px;
      right: -4.9rem;

      padding: 0px 0px 0.6rem 1rem;
      list-style: none;
      transition: right 500ms, background-color 500ms;
      background-color: rgba(255,255,255,0.8);
      border-radius: 0px 0px 0px 3px;
      box-shadow: 0px 0px 5px rgb(153, 153, 153);
      &:hover {
        right: 0;
        background-color: rgba(255,255,255,1);
      }
      a {
        display: block;
        padding: 0 0.5rem 0 0;
        &.disabled {
          opacity: 0.5;
          &:hover {
            opacity: 1;
          }
        }
        i {
          margin: 0px 0.2rem 0px 0px;
        }
      }
    }
  }
}

Clarify autoscroll disabled hover state

#timelinemenu {
  position: relative;

  .menu {
    position: absolute;
    top: 0px;
    right: 0;
    overflow-x: hidden;
    overflow-y: visible;
    z-index: 1;

    ul {
      position: relative;
      top: 0px;
      right: -4.9rem;

      padding: 0px 0px 0.6rem 1rem;
      list-style: none;
      transition: right 500ms, background-color 500ms;
      background-color: rgba(255,255,255,0.8);
      border-radius: 0px 0px 0px 3px;
      box-shadow: 0px 0px 5px rgb(153, 153, 153);
      &:hover {
        right: 0;
        background-color: rgba(255,255,255,1);
      }
      a {
        display: block;
        padding: 0 0.5rem 0 0;
        &.disabled {
          opacity: 0.5;
        }
        i {
          margin: 0px 0.2rem 0px 0px;
        }
      }
    }
  }
}


@import "../bower_components/normalize-less/normalize.less";
@import "../../bower_components/font-awesome/css/font-awesome.css";
@import "../bower_components/bootstrap/less/bootstrap.less";
.my-uw {
  @import "buckyless/buttons.less";
  @import "buckyless/features.less";
  @import "buckyless/footer.less";
  @import "buckyless/frame.less";
  @import "buckyless/general.less";
  @import "buckyless/header.less";
  @import "buckyless/helpers.less";
  @import "buckyless/inner-nav.less";
  @import "buckyless/links.less";
  @import "buckyless/notifications.less";
  @import "buckyless/responsive.less";
  @import "buckyless/search.less";
  @import "buckyless/settings.less";
  @import "buckyless/widget.less";
  @import "buckyless/directives/app-header.less";
  @import "buckyless/directives/circle-button.less";
}

Move responsive.less to end of import list

@import "../bower_components/normalize-less/normalize.less";
@import "../../bower_components/font-awesome/css/font-awesome.css";
@import "../bower_components/bootstrap/less/bootstrap.less";
.my-uw {
  @import "buckyless/buttons.less";
  @import "buckyless/features.less";
  @import "buckyless/footer.less";
  @import "buckyless/frame.less";
  @import "buckyless/general.less";
  @import "buckyless/header.less";
  @import "buckyless/helpers.less";
  @import "buckyless/inner-nav.less";
  @import "buckyless/links.less";
  @import "buckyless/notifications.less";
  @import "buckyless/search.less";
  @import "buckyless/settings.less";
  @import "buckyless/widget.less";
  @import "buckyless/directives/app-header.less";
  @import "buckyless/directives/circle-button.less";
  @import "buckyless/responsive.less";
}


.list-group-unstyled {
  .list-group-item {
    border: none;
  }
}

.list-group-selectable {

  .list-group-item {
    cursor: pointer;

    &:hover {
      text-decoration: none;
      color: @list-group-link-hover-color;
      background-color: @list-group-hover-bg;
    }

    &.active {
      background: @gray-lighter;
      color: @gray;
      &:hover {
        border-color: darken(@list-group-border, 5%);
      }
      .list-group-item-text {
        color: @gray;
      }
    }
  }
}

.list-group-cards {

  .list-group-item {

    margin-bottom: 10px;
    border: 1px solid @disabled-text-color;
    border-left: 10px solid @disabled-text-color;

    border-radius: 4px;

    &.pending, &.active.pending {
      border-left-color: @brand-info;
    }

    &.success, &.active.success {
      border-left-color: @brand-success;
    }

    &.error, &.active.error {
      border-left-color: @brand-danger;
    }

    &.canceled, &.active.canceled {
      border-left-color: @brand-warning;
    }

  }
}

Add border hover styles to base hover for list items

.list-group-unstyled {
  .list-group-item {
    border: none;
  }
}

.list-group-selectable {

  .list-group-item {
    cursor: pointer;

    &:hover,
    &:focus {
      text-decoration: none;
      color: @list-group-link-hover-color;
      background-color: @list-group-hover-bg;
      border-color: darken(@list-group-border, 5%);
    }

    &.active {
      background: @gray-lighter;
      color: @gray;

      .list-group-item-text {
        color: @gray;
      }
    }
  }
}

.list-group-cards {

  .list-group-item {

    margin-bottom: 10px;
    border: 1px solid @disabled-text-color;
    border-left: 10px solid @disabled-text-color;

    border-radius: 4px;

    &.pending, &.active.pending {
      border-left-color: @brand-info;
    }

    &.success, &.active.success {
      border-left-color: @brand-success;
    }

    &.error, &.active.error {
      border-left-color: @brand-danger;
    }

    &.canceled, &.active.canceled {
      border-left-color: @brand-warning;
    }

  }
}