Update library/less/mixins.less

Update library/less/mixins.less

Fixed typo in gradient mixin.

/******************************************************************
Site Name:
Author:

Stylesheet: Mixins & Constants Stylesheet

This is where you can take advantage of LESS' great features:
Mixins & Constants. I won't go in-depth on how they work exactly,
there are a few articles below that will help do that. What I will
tell you is that this will help speed up simple changes like
changing a color or adding CSS3 techniques like box shadow and
border-radius.

A WORD OF WARNING: It's very easy to overdo it here. Be careful and
remember less is more.

******************************************************************/

/*********************
CLEARFIXIN'
*********************/

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix {
	&:before,
	&:after {
		content: "";
    	display: table;
	}
	&:after {
		clear: both;
	}
	/* for IE */
	zoom: 1;
}

/*********************
TOOLS
*********************/

/* http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/ */
.image-replacement {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

/*********************
COLORS
Need help w/ choosing your colors? Try this site out:
http://0to255.com/
*********************/

@alert-yellow:      #ebe16f;
@alert-red:         #fbe3e4;
@alert-green:       #e6efc2;
@alert-blue:        #d5edf8;

@black:             #000;
@white:             #fff;

@bones-pink:        #f01d4f;
@bones-blue:        #1990db;

/*********************
TYPOGRAPHY
*********************/

@sans-serif:         "Helvetica Neue", Helvetica, Arial, sans-serif;
@serif:              "Georgia", Cambria, Times New Roman, Times, serif;

/* 	To embed your own fonts, use this syntax
	and place your fonts inside the
	library/fonts folder. For more information
	on embedding fonts, go to:
	http://www.fontsquirrel.com/
	Be sure to remove the comment brackets.
*/

/*	@font-face {
    	font-family: 'Font Name';
    	src: url('../fonts/font-name.eot');
    	src: url('../fonts/font-name.eot?#iefix') format('embedded-opentype'),
             url('../fonts/font-name.woff') format('woff'),
             url('../fonts/font-name.ttf') format('truetype'),
             url('../fonts/font-name.svg#font-name') format('svg');
    	font-weight: normal;
    	font-style: normal;
	}
*/

/*
use the best ampersand
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif;
  font-style: italic;
}

/* text alignment */
.text-left   { text-align: left; }
.text-center { text-align: center; }
.text-right  { text-align: right; }

/* alerts & notices */
.alert {
	margin: 10px;
	padding: 5px 18px;
	border: 1px solid;
}

.help {
	border-color: darken(@alert-yellow, 5%);
	background: @alert-yellow;
}

.info {
	border-color: darken(@alert-blue, 5%);
	background: @alert-blue;
}

.error {
	border-color: darken(@alert-red, 5%);
	background: @alert-red;
}

.success {
	border-color: darken(@alert-green, 5%);
	background: @alert-green;
}

/*********************
BORDER RADIUS
*********************/

/*
NOTE: For older browser support (and some mobile),
don't use the shorthand to define *different* corners.

USAGE: .rounded(4px);

*/
.rounded(@radius: 4px) {
  -webkit-border-radius: @radius;
     -moz-border-radius: @radius;
          border-radius: @radius;
}

/*
Instead of having a seperate mixin for the different
borders, we're using the mixin from 320 & Up to make
things easier to use.

USAGE: .border-radius(4px,4px,0,0);

*/
.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
	-webkit-border-top-right-radius:    @topright;
	-webkit-border-bottom-right-radius: @bottomright;
	-webkit-border-bottom-left-radius:  @bottomleft;
	-webkit-border-top-left-radius:     @topleft;
	-moz-border-radius-topright:        @topright;
	-moz-border-radius-bottomright:     @bottomright;
	-moz-border-radius-bottomleft:      @bottomleft;
	-moz-border-radius-topleft:         @topleft;
	border-top-right-radius:            @topright;
	border-bottom-right-radius:         @bottomright;
	border-bottom-left-radius:          @bottomleft;
	border-top-left-radius:             @topleft;
	-webkit-background-clip:            padding-box;
	-moz-background-clip:               padding;
	background-clip:                    padding-box;
}

/*********************
TRANISTION
*********************/

/* .transition(all,2s); */
.transition(@what: all, @time: 0.2s, @transition: ease-in-out) {
	-webkit-transition: @what @time @transition;
	-moz-transition:    @what @time @transition;
	-ms-transition:     @what @time @transition;
	-o-transition:      @what @time @transition;
	transition:         @what @time @transition;
}

/*********************
CSS3 GRADIENTS
Be careful with these since they can
really slow down your CSS. Don't overdo it.
*********************/

/* .css-gradient(#dfdfdf,#f8f8f8); */
.css-gradient(@from: #dfdfdf, @to: #f8f8f8) {
	background-color: @to;
	background-image: -webkit-gradient(linear, left top, left bottom, from(@from), to(@to));
	background-image: -webkit-linear-gradient(top, @from, @to);
	background-image: -moz-linear-gradient(top, @from, @to);
	background-image: -o-linear-gradient(top, @from, @to);
	background-image: linear-gradient(to bottom, @from, @to);
}

/*********************
BOX SIZING
*********************/

/* .boxSizing(border-box); */
/* NOTE: value of "padding-box" is only supported in Gecko. So
probably best not to use it. I mean, were you going to anyway? */
.boxSizing(@type: border-box) {
	-webkit-box-sizing: @type;
	-moz-box-sizing:    @type;
	-ms-box-sizing:     @type;
	box-sizing:         @type;
}

/*********************
BOX SHADOW
*********************/

/* .boxShadow(0 0 4px #444); */
.boxShadow(@x: 0, @y: 0, @radius: 4px, @spread: 0, @color: rgba(0,0,0,0.5)) {
	-webkit-box-shadow: @x @y @radius @spread @color;
	   -moz-box-shadow: @x @y @radius @spread @color;
					box-shadow: @x @y @radius @spread @color;
}

/*********************
BUTTONS
*********************/

.button, .button:visited {
	border: 1px solid darken(@bones-pink, 13%);
	border-top-color: darken(@bones-pink, 7%);
	border-left-color: darken(@bones-pink, 7%);
	padding: 4px 12px;
	color: @white;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px rgba(0,0,0, .75);
	cursor: pointer;
	margin-bottom: 20px;
	line-height: 21px;
	.transition();
	.rounded(4px);
	.css-gradient(@bones-pink,darken(@bones-pink, 5%));

	&:hover, &:focus {
		color: @white;
	  	border: 1px solid darken(@bones-pink, 13%);
	  	border-top-color: darken(@bones-pink, 20%);
	 	border-left-color: darken(@bones-pink, 20%);
		.css-gradient(darken(@bones-pink, 5%),darken(@bones-pink, 10%));
	}

	&:active {
		.css-gradient(darken(@bones-pink, 5%),@bones-pink);
	}
}

.blue-button, .blue-button:visited {
	border-color: darken(@bones-blue, 10%);
	text-shadow: 0 1px 1px darken(@bones-blue, 10%);
	.css-gradient( @bones-blue, darken(@bones-blue, 5%) );
	-webkit-box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
       -moz-box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
   	        box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
	&:hover, &:focus {
		border-color: darken(@bones-blue, 15%);
		.css-gradient( darken(@bones-blue, 4%), darken(@bones-blue, 10%) );
	}
	&:active {
		.css-gradient( darken(@bones-blue, 5%), @bones-blue );
	}
}

/******************************************************************
Site Name:
Author:

Stylesheet: Mixins & Constants Stylesheet

This is where you can take advantage of LESS' great features:
Mixins & Constants. I won't go in-depth on how they work exactly,
there are a few articles below that will help do that. What I will
tell you is that this will help speed up simple changes like
changing a color or adding CSS3 techniques like box shadow and
border-radius.

A WORD OF WARNING: It's very easy to overdo it here. Be careful and
remember less is more.

******************************************************************/

/*********************
CLEARFIXIN'
*********************/

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix {
	&:before,
	&:after {
		content: "";
    	display: table;
	}
	&:after {
		clear: both;
	}
	/* for IE */
	zoom: 1;
}

/*********************
TOOLS
*********************/

/* http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/ */
.image-replacement {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

/*********************
COLORS
Need help w/ choosing your colors? Try this site out:
http://0to255.com/
*********************/

@alert-yellow:      #ebe16f;
@alert-red:         #fbe3e4;
@alert-green:       #e6efc2;
@alert-blue:        #d5edf8;

@black:             #000;
@white:             #fff;

@bones-pink:        #f01d4f;
@bones-blue:        #1990db;

/*********************
TYPOGRAPHY
*********************/

@sans-serif:         "Helvetica Neue", Helvetica, Arial, sans-serif;
@serif:              "Georgia", Cambria, Times New Roman, Times, serif;

/* 	To embed your own fonts, use this syntax
	and place your fonts inside the
	library/fonts folder. For more information
	on embedding fonts, go to:
	http://www.fontsquirrel.com/
	Be sure to remove the comment brackets.
*/

/*	@font-face {
    	font-family: 'Font Name';
    	src: url('../fonts/font-name.eot');
    	src: url('../fonts/font-name.eot?#iefix') format('embedded-opentype'),
             url('../fonts/font-name.woff') format('woff'),
             url('../fonts/font-name.ttf') format('truetype'),
             url('../fonts/font-name.svg#font-name') format('svg');
    	font-weight: normal;
    	font-style: normal;
	}
*/

/*
use the best ampersand
http://simplebits.com/notebook/2008/08/14/ampersands-2/
*/
span.amp {
  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif;
  font-style: italic;
}

/* text alignment */
.text-left   { text-align: left; }
.text-center { text-align: center; }
.text-right  { text-align: right; }

/* alerts & notices */
.alert {
	margin: 10px;
	padding: 5px 18px;
	border: 1px solid;
}

.help {
	border-color: darken(@alert-yellow, 5%);
	background: @alert-yellow;
}

.info {
	border-color: darken(@alert-blue, 5%);
	background: @alert-blue;
}

.error {
	border-color: darken(@alert-red, 5%);
	background: @alert-red;
}

.success {
	border-color: darken(@alert-green, 5%);
	background: @alert-green;
}

/*********************
BORDER RADIUS
*********************/

/*
NOTE: For older browser support (and some mobile),
don't use the shorthand to define *different* corners.

USAGE: .rounded(4px);

*/
.rounded(@radius: 4px) {
  -webkit-border-radius: @radius;
     -moz-border-radius: @radius;
          border-radius: @radius;
}

/*
Instead of having a seperate mixin for the different
borders, we're using the mixin from 320 & Up to make
things easier to use.

USAGE: .border-radius(4px,4px,0,0);

*/
.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
	-webkit-border-top-right-radius:    @topright;
	-webkit-border-bottom-right-radius: @bottomright;
	-webkit-border-bottom-left-radius:  @bottomleft;
	-webkit-border-top-left-radius:     @topleft;
	-moz-border-radius-topright:        @topright;
	-moz-border-radius-bottomright:     @bottomright;
	-moz-border-radius-bottomleft:      @bottomleft;
	-moz-border-radius-topleft:         @topleft;
	border-top-right-radius:            @topright;
	border-bottom-right-radius:         @bottomright;
	border-bottom-left-radius:          @bottomleft;
	border-top-left-radius:             @topleft;
	-webkit-background-clip:            padding-box;
	-moz-background-clip:               padding;
	background-clip:                    padding-box;
}

/*********************
TRANISTION
*********************/

/* .transition(all,2s); */
.transition(@what: all, @time: 0.2s, @transition: ease-in-out) {
	-webkit-transition: @what @time @transition;
	-moz-transition:    @what @time @transition;
	-ms-transition:     @what @time @transition;
	-o-transition:      @what @time @transition;
	transition:         @what @time @transition;
}

/*********************
CSS3 GRADIENTS
Be careful with these since they can
really slow down your CSS. Don't overdue it.
*********************/

/* .css-gradient(#dfdfdf,#f8f8f8); */
.css-gradient(@from: #dfdfdf, @to: #f8f8f8) {
	background-color: @to;
	background-image: -webkit-gradient(linear, left top, left bottom, from(@from), to(@to));
	background-image: -webkit-linear-gradient(top, @from, @to);
	background-image: -moz-linear-gradient(top, @from, @to);
	background-image: -o-linear-gradient(top, @from, @to);
	background-image: linear-gradient(to bottom, @from, @to);
}

/*********************
BOX SIZING
*********************/

/* .boxSizing(border-box); */
/* NOTE: value of "padding-box" is only supported in Gecko. So
probably best not to use it. I mean, were you going to anyway? */
.boxSizing(@type: border-box) {
	-webkit-box-sizing: @type;
	-moz-box-sizing:    @type;
	-ms-box-sizing:     @type;
	box-sizing:         @type;
}

/*********************
BOX SHADOW
*********************/

/* .boxShadow(0 0 4px #444); */
.boxShadow(@x: 0, @y: 0, @radius: 4px, @spread: 0, @color: rgba(0,0,0,0.5)) {
	-webkit-box-shadow: @x @y @radius @spread @color;
	   -moz-box-shadow: @x @y @radius @spread @color;
					box-shadow: @x @y @radius @spread @color;
}

/*********************
BUTTONS
*********************/

.button, .button:visited {
	border: 1px solid darken(@bones-pink, 13%);
	border-top-color: darken(@bones-pink, 7%);
	border-left-color: darken(@bones-pink, 7%);
	padding: 4px 12px;
	color: @white;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px rgba(0,0,0, .75);
	cursor: pointer;
	margin-bottom: 20px;
	line-height: 21px;
	.transition();
	.rounded(4px);
	.css-gradient(@bones-pink,darken(@bones-pink, 5%));

	&:hover, &:focus {
		color: @white;
	  	border: 1px solid darken(@bones-pink, 13%);
	  	border-top-color: darken(@bones-pink, 20%);
	 	border-left-color: darken(@bones-pink, 20%);
		.css-gradient(darken(@bones-pink, 5%),darken(@bones-pink, 10%));
	}

	&:active {
		.css-gradient(darken(@bones-pink, 5%),@bones-pink);
	}
}

.blue-button, .blue-button:visited {
	border-color: darken(@bones-blue, 10%);
	text-shadow: 0 1px 1px darken(@bones-blue, 10%);
	.css-gradient( @bones-blue, darken(@bones-blue, 5%) );
	-webkit-box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
       -moz-box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
   	        box-shadow: inset 0 0 3px lighten(@bones-blue, 16%);
	&:hover, &:focus {
		border-color: darken(@bones-blue, 15%);
		.css-gradient( darken(@bones-blue, 4%), darken(@bones-blue, 10%) );
	}
	&:active {
		.css-gradient( darken(@bones-blue, 5%), @bones-blue );
	}
}


Nicer handling of long route names

Nicer handling of long route names

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


Decoupled css

Decoupled css

.activity {
  margin-bottom: 10px;
  position: relative;
  .Border();

  .btn-bookmark {
    margin: 0 5px;
    width: 92%;
  }

  .item-thumbnail {
    margin: 5px;
  }

  .activity-text {
    margin: 10px 165px 10px 130px;
    min-height: 154px;

    p {
      margin: 5px 0;
    }
  }

  .activity-context {
    background: @contrastFill;
    font-size: 15px;
    padding: 10px 165px 10px 130px;
  }

  .activity-meta {
    color: @metaColor;
    margin: 10px 165px 10px 130px;
  }

  .thumbnail {
    box-shadow: none;
  }

  .thumbnail:hover {
    border: none;
    box-shadow: none;
  }
}

error: pathspec 'assets/css/activity.less' did not match any file(s) known to git


Import slick as less

Import slick as less

@import "../../bower_components/bootstrap/less/bootstrap.less";
@import "colors.less";
@import "btn.less";
@import "fonts.less";
@import "text-align.less";
@import "layout.less";
@import "home.less";
@import "pricing.less";
@import "pygments.less";
@import "shell.less";
@import "community-nav.less";
@import "carousel.less";
@import "side-nav.less";
@import "ribbon.less";
@import "school.less";
@import "blog.less";
@import (less) "../../bower_components/slick-carousel/slick/slick-theme.css";
@import (less) "../../bower_components/slick-carousel/slick/slick.css";

p {
  margin: 0 0 @line-height-computed;
}

.lead {
	font-size: 18px;
	font-weight: 400;
}

.section-heading {
  margin-bottom: 30px;
}

.intro-header-training, .intro-header-school {
	padding-top: 0; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
	padding-bottom: 0;
	text-align: center;
}

.intro-header-training {
	background: url(/images/cukeup-2014/CukeUp-7477.jpg) no-repeat center center;
	background-size: cover;
}

.intro-header-school {
  background: url(/images/cukeup-2014/CukeUp-7459.jpg) no-repeat center center;
  background-size: cover;
}

.intro-message {
	position: relative;
	padding-top: 8%;
	padding-bottom: 8%;
	color: @body-bg;

  .ribbon {
    position: absolute;
    font-size: 22px;
  }
}

.intro-message h1 {
	margin: 0;
	font-size: 90px;
}

.intro-message h2 {
	font-size: 30px;
}

@media (max-width: @screen-sm) {
  .intro-message {
    h1 {
      font-size: 40px;
    }

    h2 {
      font-size: 20px;
    }

    .ribbon {
      font-size: 16px;
      right: 3px;
      top: 10px;
    }
  }
}

.content-section-a {
	background-color: @gray-light;
	padding: 50px 0;
}

.content-section-b {
	border-top: 1px solid @gray-lighter;
	border-bottom: 1px solid @gray-lighter;
	padding: 50px 0;
}

ul.benefits {
  li {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
  }
}

a[name="buy"] {
  height: 50px;
  display: block;
}

table.table td:nth-child(4) {
  text-align: right;
}

@import "../../bower_components/bootstrap/less/bootstrap.less";
@import "colors.less";
@import "btn.less";
@import "fonts.less";
@import "text-align.less";
@import "layout.less";
@import "home.less";
@import "pricing.less";
@import "pygments.less";
@import "shell.less";
@import "community-nav.less";
@import "carousel.less";
@import "side-nav.less";
@import "ribbon.less";
@import "school.less";
@import "blog.less";
@import "../../bower_components/slick-carousel/slick/slick-theme.css";
@import "../../bower_components/slick-carousel/slick/slick.css";

p {
  margin: 0 0 @line-height-computed;
}

.lead {
	font-size: 18px;
	font-weight: 400;
}

.section-heading {
  margin-bottom: 30px;
}

.intro-header-training, .intro-header-school {
	padding-top: 0; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
	padding-bottom: 0;
	text-align: center;
}

.intro-header-training {
	background: url(/images/cukeup-2014/CukeUp-7477.jpg) no-repeat center center;
	background-size: cover;
}

.intro-header-school {
  background: url(/images/cukeup-2014/CukeUp-7459.jpg) no-repeat center center;
  background-size: cover;
}

.intro-message {
	position: relative;
	padding-top: 8%;
	padding-bottom: 8%;
	color: @body-bg;

  .ribbon {
    position: absolute;
    font-size: 22px;
  }
}

.intro-message h1 {
	margin: 0;
	font-size: 90px;
}

.intro-message h2 {
	font-size: 30px;
}

@media (max-width: @screen-sm) {
  .intro-message {
    h1 {
      font-size: 40px;
    }

    h2 {
      font-size: 20px;
    }

    .ribbon {
      font-size: 16px;
      right: 3px;
      top: 10px;
    }
  }
}

.content-section-a {
	background-color: @gray-light;
	padding: 50px 0;
}

.content-section-b {
	border-top: 1px solid @gray-lighter;
	border-bottom: 1px solid @gray-lighter;
	padding: 50px 0;
}

ul.benefits {
  li {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
  }
}

a[name="buy"] {
  height: 50px;
  display: block;
}

table.table td:nth-child(4) {
  text-align: right;
}


added font-family, font-size and font-weight styles

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


added container-small

added container-small

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


Keep icons from being pushed down on mobile

/**
* Global Sidebar
* ============================================================================
*/

.navbar {
  background-color: @header-bg-color;
  color: #fff;
  font-size: 15px;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: @sidebar-width;
  z-index: 100;
  padding: 0 14px;
  .clearfix();
  display: flex;
  flex-direction: column;

  .anchor-top {
    flex: 1;
    align-self: flex-start;
  }

  .icon-sentry-logo, .icon-sentry-logo-full {
    line-height: 40px;
  }

  .admin-action-message {
    line-height: 42px;
    display: block;
    float: right;
    font-size: 13px;
    font-weight: bold;
    padding-right: 10px;
    .animated;
    .animated.infinite;
    .animated.hinge;
    .flash-50;
  }

  .logo {
    display: block;
    float: left;
    text-align: center;
    font-size: 22px;
    color: lighten(#b9b2d0, 5) !important;
    margin: 0;

    &:hover {
      color: #fff !important;
    }
  }

  .global-nav {
    .list-unstyled();
    margin: 0;

    li {
      float: left;
      margin-right: 16px;
      margin-left: 15px;

      a {
        height: 40px;
        line-height: 42px;
      }
    }
  }

  .org-selector {
    padding: 15px 0;
    position: relative;

    .hover-bar-container {
      position: absolute;
      width: 32px;
      height: 3px;
      bottom: -2px;
      border-radius: 2px;
      overflow: hidden;

      .hover-bar {
        width: 0;
        height: 3px;
        background: rgba(255,255,255, .35);
        -webkit-transition: width 500ms ease;
      }
    }

    &:hover {
      .hover-bar-container {
        background: #625c69;
      }
      .hover-bar {
        width: 100%;
      }
    }

    &.active{
      &:before {
        position: absolute;
        display: block;
        content: "";
        right: -14px;
        top: 50%;
        margin-top: -6px;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        border-right: 7px solid #F7F8F9;
      }
      &:hover {
        .hover-bar-container {
          display: none;
        }
      }
    }

    .org-list {
      > li {
        padding: 15px 20px 10px 68px;
        border-bottom: 1px solid @trim;
        position: relative;
        background: #fff;

        a {
          color: @50;

          &:hover {
            color: @70;
          }
        }

        h5, p {
          margin: 0;
        }

        h5 {
          font-size: 16px;
          margin-bottom: 2px;

          a {
            color: @80;

            &:hover {
              color: @90;
            }
          }
        }

        p {
          font-size: 13px;
          a {
            margin-right: 10px;
          }
        }

        &.active {
          background: #F5FAFE;
          border-top: 1px solid #B5D6ED;
          border-bottom: 1px solid #B5D6ED;
          margin-top: -1px;
        }

        &.org-create {
          padding: 15px 20px;
          background: none;

          a {
            color: @70;

            &:hover {
              color: @90;
            }
          }
        }
      }

      .org-avatar {
        position: absolute;
        display: block;
        left: 20px;
        .square(36px);
        background-color: @50;
        border-radius: 3px;
        text-align: center;
        line-height: 36px;
        color: #fff;

        &:hover, &:active, &:focus {
          color: #fff;
        }
      }
    }

    .active-org {
      display: block;
      .square(32px);
      &:before {
        display: block;
        position: absolute;
        content: "";
        top: 0;
        left: -15px;
        right: -15px;
        bottom: -5px;
      }

      img {
        border-radius: 3px;
        box-shadow: 0 1px 1px rgba(0,0,0, .3);
      }
    }
  }

  .navbar-nav {
    display: flex;
    flex-direction: column;
    align-items: center;

    .list-unstyled;
    padding: 14px 0 6px;
    margin: 0;

    > li {
      position: relative;
      text-align: center;
      margin: 0 0 5px;

      > a {
        color: #b9b2d0;
        display: block;
        width: 32px;
        line-height: 32px;

        .icon {
          display: block;
          line-height: 30px;
        }

        &:hover, &:focus, &:active {
          color: #fff;
        }
      }

      &.active {
        > a {
          color: #fff;
        }

        &:before {
          position: absolute;
          display: block;
          content: "";
          right: -14px;
          top: 50%;
          margin-top: -7px;
          border-top: 7px solid transparent;
          border-bottom: 7px solid transparent;
          border-right: 7px solid #F7F8F9;
        }
      }
    }

    > li.onboarding {
      max-height: 9999em;
      margin: 12px 0;
    }

    .icon-home, .icon-user, .icon-star-solid {
      font-size: 18px;
    }

    .icon-av_timer {
      font-size: 25px;
    }

    .icon-globe, .icon-alert {
      font-size: 20px;
    }

    .activity-indicator {
      position: absolute;
      top: 2px;
      right: 3px;
      .square(8px);
      background: @red;
      border-radius: 50%;
      box-shadow: 0 0 0 3px @header-bg-color;
    }
  }

  .divider-top {
    border-top: 1px solid lighten(#342c3e, 10);
  }

  .divider-bottom {
    border-bottom: 1px solid lighten(#342c3e, 10);
  }

  .org-selector {
    .dropdown-menu {
      top: 38px;
    }
  }

  .user-settings {
    .avatar {
      .square(32px);
      box-shadow: 0 1px 1px rggba(0,0,0, .3);
    }

    .dropdown-toggle {
      display: block;
    }

    .dropdown-menu {
      left: 34px;
      top: auto;
      bottom: -4px;
      background: @90;
      border-color: transparent;
      box-shadow: 0 1px 3px rgba(0,0,0, .25);
      color: #fff;
      border-radius: 4px;

      a {
        color: @20;

        &:hover {
          color: @purple-light;
          background: transparent;
        }
      }

      &:before {
        display: none;
      }

      &:after {
        top: auto;
        left: -18px;
        bottom: 12px;
        border: 9px solid transparent;
        border-right: 9px solid @90;
      }
    }
  }

  .onboarding-progress-bar {
    margin: 0 8px;
  }

  .dropdown-toggle {
    .icon-arrow-down {
      color: #83899D;
      font-size: 12px !important;
      top: 1px;
      margin-left: 4px;
    }

    .avatar {
      border-radius: 2px;
      position: relative;
    }
  }

  .dropdown.open {
    .dropdown-toggle {
      color: #fff;
      background: rgba(0,0,0, .3);
    }
  }
}

// Status update

.navbar .icon-alert {
  color: @yellow-orange;
}

.sidebar-panel {
  position: fixed;
  width: @sidebar-panel-width;
  top: 0;
  left: @sidebar-width;
  bottom: 0;
  background: @white-darker;
  z-index: 100;
  color: @gray-darker;
  border-right: 1px solid @trim;
  box-shadow: 1px 0 2px rgba(0,0,0, .06);
  text-align: left;
  line-height: 24px;

  .sidebar-panel-header {
    border-bottom: 1px solid @trim;
    padding: 23px 20px 20px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0, .06);
    height: @sidebar-panel-header-height;

    .close {
      font-size: 22px;
      position: relative;
      top: -3px;
      right: -3px;
      color: @30;

      &:hover {
        color: @50;
      }
    }

    h2 {
      font-size: 18px;
      margin: 0;
      font-weight: normal;
    }
  }

  .sidebar-panel-body {
    position: absolute;
    top: @sidebar-panel-header-height;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
  }

  .sidebar-panel-item {
    padding: 15px 20px;
    line-height: 1.2;
    cursor: pointer;
    border-bottom: 1px solid @trim;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0, .06);
    font-size: 14px;

    h3 {
      font-size: 15px;
      margin-bottom: 5px;
      .culprit {
        font-weight: normal;
      }
    }

    p {
      margin-bottom: 5px;
    }

    a {
      color: @50;

      &:hover {
        color: @70;
      }
    }

    .message {
      color: @gray-dark;
    }

    &.active {
      background: @10;
      border-color: @30;
      border-top: 1px solid @30;
      margin-top: -1px;
    }
  }

  .sidebar-panel-empty {
    color: @50;
    text-align: center;
    width: 100%;
    position: absolute;
    top: 50%;
    padding: 0 50px;
    margin-top: (-62px + -16px) / 2; // offset for sidebar-panel-header + font-size
  }
}

.incident-list {
  padding: 20px 20px 0;
  font-size: 13px;

  h4, p, h6  {
     margin-bottom: 15px;
  }

  h4 {
    font-size: 18px;
    line-height: 1.2;
  }

  h6 {
    color: @60;
  }

  p {
    line-height: 1.5;
  }

  small {
    color: @60;
  }

  .incident-item {
    border-bottom: 1px solid @trim;
    margin-bottom: 20px;
    padding-bottom: 5px;
  }
}

.range-picker {
  .dropdown-toggle {
    font-size: 18px;
    font-weight: 600;

    .icon-arrow-down {
      top: 2px;
      margin-left: 4px;
    }
  }
}

/**
* Print
* ============================================================================
*/

@media print {
  .navbar {
      display: none;
  }
}

/**
* Responsive small screens
* ============================================================================
*/

@media(max-width:767px) {
  @sidebar-panel-offset: 54px;

  body {
    padding-left: 0;
  }

  .navbar {
    flex-direction: row;
    position: static;
    width: 100%;
    max-height: @sidebar-panel-offset;
    padding-top: 10px;
    padding-bottom: 10px;

    .navbar-nav {
      flex-direction: row;
      padding: 0 6px 0 10px;

      > li {
        margin: 0 5px 0 0;

        &.active:before {
          top: auto;
          right: auto;
          bottom: -11px;
          left: 50%;
          margin-left: -6px;
          border-bottom: 7px solid #F7F8F9;
          border-right: 7px solid transparent;
          border-left: 7px solid transparent;
          border-top: 7px solid transparent;
        }
      }
    }

    .divider-bottom {
      border: 0;
      border-right: 1px solid @gray;
    }

    .anchor-top {
      display: flex;

      > div {
        display: flex;
      }

      .org-selector {
        padding: 0;
        padding-right: 14px;
      }
    }

    .anchor-bottom {
      display: flex;

      .navbar-nav {
        padding-right: 0;

        > li:last-child {
          margin: 0;
        }
      }
    }

    .user-settings {
      display: block;
      margin-left: 5px;

      .dropdown-menu {
        left: auto;
        top: 42px;
        right: -3px;
        bottom: auto;

        &:after {
          top: -16px;
          right: 10px;
          left: auto;
          bottom: auto;
          border: 9px solid transparent;
          border-bottom: 9px solid @90;
        }
      }
    }
  }

  .sidebar-panel {
    width: auto;
    top: @sidebar-panel-offset;
    left: 0;
    right: 0;
  }
}

/**
* Global Sidebar
* ============================================================================
*/

.navbar {
  background-color: @header-bg-color;
  color: #fff;
  font-size: 15px;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: @sidebar-width;
  z-index: 100;
  padding: 0 14px;
  .clearfix();
  display: flex;
  flex-direction: column;

  .anchor-top {
    flex: 1;
    align-self: flex-start;
  }

  .anchor-bottom {

  }

  .icon-sentry-logo, .icon-sentry-logo-full {
    line-height: 40px;
  }

  .admin-action-message {
    line-height: 42px;
    display: block;
    float: right;
    font-size: 13px;
    font-weight: bold;
    padding-right: 10px;
    .animated;
    .animated.infinite;
    .animated.hinge;
    .flash-50;
  }

  .logo {
    display: block;
    float: left;
    text-align: center;
    font-size: 22px;
    color: lighten(#b9b2d0, 5) !important;
    margin: 0;

    &:hover {
      color: #fff !important;
    }
  }

  .global-nav {
    .list-unstyled();
    margin: 0;

    li {
      float: left;
      margin-right: 16px;
      margin-left: 15px;

      a {
        height: 40px;
        line-height: 42px;
      }
    }
  }

  .org-selector {
    padding: 15px 0;
    position: relative;

    .hover-bar-container {
      position: absolute;
      width: 32px;
      height: 3px;
      bottom: -2px;
      border-radius: 2px;
      overflow: hidden;

      .hover-bar {
        width: 0;
        height: 3px;
        background: rgba(255,255,255, .35);
        -webkit-transition: width 500ms ease;
      }
    }

    &:hover {
      .hover-bar-container {
        background: #625c69;
      }
      .hover-bar {
        width: 100%;
      }
    }

    &.active{
      &:before {
        position: absolute;
        display: block;
        content: "";
        right: -14px;
        top: 50%;
        margin-top: -6px;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        border-right: 7px solid #F7F8F9;
      }
      &:hover {
        .hover-bar-container {
          display: none;
        }
      }
    }

    .org-list {
      > li {
        padding: 15px 20px 10px 68px;
        border-bottom: 1px solid @trim;
        position: relative;
        background: #fff;

        a {
          color: @50;

          &:hover {
            color: @70;
          }
        }

        h5, p {
          margin: 0;
        }

        h5 {
          font-size: 16px;
          margin-bottom: 2px;

          a {
            color: @80;

            &:hover {
              color: @90;
            }
          }
        }

        p {
          font-size: 13px;
          a {
            margin-right: 10px;
          }
        }

        &.active {
          background: #F5FAFE;
          border-top: 1px solid #B5D6ED;
          border-bottom: 1px solid #B5D6ED;
          margin-top: -1px;
        }

        &.org-create {
          padding: 15px 20px;
          background: none;

          a {
            color: @70;

            &:hover {
              color: @90;
            }
          }
        }
      }

      .org-avatar {
        position: absolute;
        display: block;
        left: 20px;
        .square(36px);
        background-color: @50;
        border-radius: 3px;
        text-align: center;
        line-height: 36px;
        color: #fff;

        &:hover, &:active, &:focus {
          color: #fff;
        }
      }
    }

    .active-org {
      display: block;
      .square(32px);
      &:before {
        display: block;
        position: absolute;
        content: "";
        top: 0;
        left: -15px;
        right: -15px;
        bottom: -5px;
      }

      img {
        border-radius: 3px;
        box-shadow: 0 1px 1px rgba(0,0,0, .3);
      }
    }
  }

  .navbar-nav {
    display: flex;
    flex-direction: column;
    align-items: center;

    .list-unstyled;
    padding: 14px 0 6px;
    margin: 0;

    > li {
      position: relative;
      text-align: center;
      margin: 0 0 5px;

      > a {
        color: #b9b2d0;
        display: block;
        width: 32px;
        line-height: 32px;

        .icon {
          display: block;
          line-height: 30px;
        }

        &:hover, &:focus, &:active {
          color: #fff;
        }
      }

      &.active {
        > a {
          color: #fff;
        }

        &:before {
          position: absolute;
          display: block;
          content: "";
          right: -14px;
          top: 50%;
          margin-top: -7px;
          border-top: 7px solid transparent;
          border-bottom: 7px solid transparent;
          border-right: 7px solid #F7F8F9;
        }
      }
    }

    > li.onboarding {
      max-height: 9999em;
      margin: 12px 0;
    }

    .icon-home, .icon-user, .icon-star-solid {
      font-size: 18px;
    }

    .icon-av_timer {
      font-size: 25px;
    }

    .icon-globe, .icon-alert {
      font-size: 20px;
    }

    .activity-indicator {
      position: absolute;
      top: 2px;
      right: 3px;
      .square(8px);
      background: @red;
      border-radius: 50%;
      box-shadow: 0 0 0 3px @header-bg-color;
    }
  }

  .divider-top {
    border-top: 1px solid lighten(#342c3e, 10);
  }

  .divider-bottom {
    border-bottom: 1px solid lighten(#342c3e, 10);
  }

  .org-selector {
    .dropdown-menu {
      top: 38px;
    }
  }

  .user-settings {
    .avatar {
      .square(32px);
      box-shadow: 0 1px 1px rggba(0,0,0, .3);
    }

    .dropdown-toggle {
      display: block;
    }

    .dropdown-menu {
      left: 34px;
      top: auto;
      bottom: -4px;
      background: @90;
      border-color: transparent;
      box-shadow: 0 1px 3px rgba(0,0,0, .25);
      color: #fff;
      border-radius: 4px;

      a {
        color: @20;

        &:hover {
          color: @purple-light;
          background: transparent;
        }
      }

      &:before {
        display: none;
      }

      &:after {
        top: auto;
        left: -18px;
        bottom: 12px;
        border: 9px solid transparent;
        border-right: 9px solid @90;
      }
    }
  }

  .onboarding-progress-bar {
    margin: 0 8px;
  }

  .dropdown-toggle {
    .icon-arrow-down {
      color: #83899D;
      font-size: 12px !important;
      top: 1px;
      margin-left: 4px;
    }

    .avatar {
      border-radius: 2px;
      position: relative;
    }
  }

  .dropdown.open {
    .dropdown-toggle {
      color: #fff;
      background: rgba(0,0,0, .3);
    }
  }
}

// Status update

.navbar .icon-alert {
  color: @yellow-orange;
}

.sidebar-panel {
  position: fixed;
  width: @sidebar-panel-width;
  top: 0;
  left: @sidebar-width;
  bottom: 0;
  background: @white-darker;
  z-index: 100;
  color: @gray-darker;
  border-right: 1px solid @trim;
  box-shadow: 1px 0 2px rgba(0,0,0, .06);
  text-align: left;
  line-height: 24px;

  .sidebar-panel-header {
    border-bottom: 1px solid @trim;
    padding: 23px 20px 20px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0, .06);
    height: @sidebar-panel-header-height;

    .close {
      font-size: 22px;
      position: relative;
      top: -3px;
      right: -3px;
      color: @30;

      &:hover {
        color: @50;
      }
    }

    h2 {
      font-size: 18px;
      margin: 0;
      font-weight: normal;
    }
  }

  .sidebar-panel-body {
    position: absolute;
    top: @sidebar-panel-header-height;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
  }

  .sidebar-panel-item {
    padding: 15px 20px;
    line-height: 1.2;
    cursor: pointer;
    border-bottom: 1px solid @trim;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0,0,0, .06);
    font-size: 14px;

    h3 {
      font-size: 15px;
      margin-bottom: 5px;
      .culprit {
        font-weight: normal;
      }
    }

    p {
      margin-bottom: 5px;
    }

    a {
      color: @50;

      &:hover {
        color: @70;
      }
    }

    .message {
      color: @gray-dark;
    }

    &.active {
      background: @10;
      border-color: @30;
      border-top: 1px solid @30;
      margin-top: -1px;
    }
  }

  .sidebar-panel-empty {
    color: @50;
    text-align: center;
    width: 100%;
    position: absolute;
    top: 50%;
    padding: 0 50px;
    margin-top: (-62px + -16px) / 2; // offset for sidebar-panel-header + font-size
  }
}

.incident-list {
  padding: 20px 20px 0;
  font-size: 13px;

  h4, p, h6  {
     margin-bottom: 15px;
  }

  h4 {
    font-size: 18px;
    line-height: 1.2;
  }

  h6 {
    color: @60;
  }

  p {
    line-height: 1.5;
  }

  small {
    color: @60;
  }

  .incident-item {
    border-bottom: 1px solid @trim;
    margin-bottom: 20px;
    padding-bottom: 5px;
  }
}

.range-picker {
  .dropdown-toggle {
    font-size: 18px;
    font-weight: 600;

    .icon-arrow-down {
      top: 2px;
      margin-left: 4px;
    }
  }
}

/**
* Print
* ============================================================================
*/

@media print {
  .navbar {
      display: none;
  }
}

/**
* Responsive small screens
* ============================================================================
*/

@media(max-width:767px) {
  @sidebar-panel-offset: 54px;

  body {
    padding-left: 0;
  }

  .navbar {
    flex-direction: row;
    position: static;
    width: 100%;
    max-height: @sidebar-panel-offset;
    padding-top: 10px;
    padding-bottom: 10px;

    .navbar-nav {
      flex-direction: row;
      padding: 0 6px 0 10px;

      > li {
        margin: 0 5px 0 0;

        &.active:before {
          top: auto;
          right: auto;
          bottom: -11px;
          left: 50%;
          margin-left: -6px;
          border-bottom: 7px solid #F7F8F9;
          border-right: 7px solid transparent;
          border-left: 7px solid transparent;
          border-top: 7px solid transparent;
        }
      }
    }

    .divider-bottom {
      border: 0;
      border-right: 1px solid @gray;
    }

    .anchor-top {
      display: flex;

      .org-selector {
        padding: 0;
        padding-right: 14px;
      }
    }

    .anchor-bottom {
      display: flex;

      .navbar-nav {
        padding-right: 0;

        > li:last-child {
          margin: 0;
        }
      }
    }

    .user-settings {
      display: block;
      margin-left: 5px;

      .dropdown-menu {
        left: auto;
        top: 42px;
        right: -3px;
        bottom: auto;

        &:after {
          top: -16px;
          right: 10px;
          left: auto;
          bottom: auto;
          border: 9px solid transparent;
          border-bottom: 9px solid @90;
        }
      }
    }
  }

  .sidebar-panel {
    width: auto;
    top: @sidebar-panel-offset;
    left: 0;
    right: 0;
  }
}


Added less support

Added less support

// Default Variables
@simple-line-font-path        : "../fonts/";
@simple-line-font-family      : "Simple-Line-Icons";
@simple-line-icon-prefix      : icon-;

// Fonts
@font-face {
  font-family: 'Simple-Line-Icons';
  src:    url('@{simple-line-font-path}Simple-Line-Icons.eot');
  src:    url('@{simple-line-font-path}Simple-Line-Icons.eot?#iefix') format('embedded-opentype'),
          url('@{simple-line-font-path}Simple-Line-Icons.woff') format('woff'),
          url('@{simple-line-font-path}Simple-Line-Icons.ttf') format('truetype'),
          url('@{simple-line-font-path}Simple-Line-Icons.svg#Simple-Line-Icons') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* Use the following CSS code if you want to use data attributes for inserting your icons */
[data-icon]:before {
  font-family: '@{simple-line-font-family}';
  content: attr(data-icon);
  speak: none;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Use the following CSS code if you want to have a class per icon */
/*
Instead of a list of all class selectors,
you can use the generic selector below, but it's slower:
[class*="icon-"] {
*/

.@{simple-line-icon-prefix} {
  &user-female, &user-follow, &user-following, &user-unfollow, &trophy, &screen-smartphone, &screen-desktop, &plane, &notebook, &moustache, &mouse, &magnet, &energy, &emoticon-smile, &disc, &cursor-move, &crop, &credit-card, &chemistry, &user, &speedometer, &social-youtube, &social-twitter, &social-tumblr, &social-facebook, &social-dropbox, &social-dribbble, &shield, &screen-tablet, &magic-wand, &hourglass, &graduation, &ghost, &game-controller, &fire, &eyeglasses, &envelope-open, &envelope-letter, &bell, &badge, &anchor, &wallet, &vector, &speech, &puzzle, &printer, &present, &playlist, &pin, &picture, &map, &layers, &handbag, &globe-alt, &globe, &frame, &folder-alt, &film, &feed, &earphones-alt, &earphones, &drop, &drawer, &docs, &directions, &direction, &diamond, &cup, &compass, &call-out, &call-in, &call-end, &calculator, &bubbles, &briefcase, &book-open, &basket-loaded, &basket, &bag, &action-undo, &action-redo, &wrench, &umbrella, &trash, &tag, &support, &size-fullscreen, &size-actual, &shuffle, &share-alt, &share, &rocket, &question, &pie-chart, &pencil, &note, &music-tone-alt, &music-tone, &microphone, &loop, &logout, &login, &list, &like, &home, &grid, &graph, &equalizer, &dislike, &cursor, &control-start, &control-rewind, &control-play, &control-pause, &control-forward, &control-end, &calendar, &bulb, &bar-chart, &arrow-up, &arrow-right, &arrow-left, &arrow-down, &ban, &bubble, &camcorder, &camera, &check, &clock, &close, &cloud-download, &cloud-upload, &doc, &envelope, &eye, &flag, &folder, &heart, &info, &key, &link, &lock, &lock-open, &magnifier, &magnifier-add, &magnifier-remove, &paper-clip, &paper-plane, &plus, &pointer, &power, &refresh, &reload, &settings, &star, &symbol-female, &symbol-male, &target, &volume-1, &volume-2, &volume-off, &users {
    font-family: '@{simple-line-font-family}';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
  }
}

.@{simple-line-icon-prefix}user-female:before          {content: "\e000"; }
.@{simple-line-icon-prefix}user-follow:before          {content: "\e002"; }
.@{simple-line-icon-prefix}user-following:before       {content: "\e003"; }
.@{simple-line-icon-prefix}user-unfollow:before        {content: "\e004"; }
.@{simple-line-icon-prefix}trophy:before               {content: "\e006"; }
.@{simple-line-icon-prefix}screen-smartphone:before    {content: "\e010"; }
.@{simple-line-icon-prefix}screen-desktop:before       {content: "\e011"; }
.@{simple-line-icon-prefix}plane:before                {content: "\e012"; }
.@{simple-line-icon-prefix}notebook:before             {content: "\e013"; }
.@{simple-line-icon-prefix}moustache:before            {content: "\e014"; }
.@{simple-line-icon-prefix}mouse:before                {content: "\e015"; }
.@{simple-line-icon-prefix}magnet:before               {content: "\e016"; }
.@{simple-line-icon-prefix}energy:before               {content: "\e020"; }
.@{simple-line-icon-prefix}emoticon-smile:before       {content: "\e021"; }
.@{simple-line-icon-prefix}disc:before                 {content: "\e022"; }
.@{simple-line-icon-prefix}cursor-move:before          {content: "\e023"; }
.@{simple-line-icon-prefix}crop:before                 {content: "\e024"; }
.@{simple-line-icon-prefix}credit-card:before          {content: "\e025"; }
.@{simple-line-icon-prefix}chemistry:before            {content: "\e026"; }
.@{simple-line-icon-prefix}user:before                 {content: "\e005"; }
.@{simple-line-icon-prefix}speedometer:before          {content: "\e007"; }
.@{simple-line-icon-prefix}social-youtube:before       {content: "\e008"; }
.@{simple-line-icon-prefix}social-twitter:before       {content: "\e009"; }
.@{simple-line-icon-prefix}social-tumblr:before        {content: "\e00a"; }
.@{simple-line-icon-prefix}social-facebook:before      {content: "\e00b"; }
.@{simple-line-icon-prefix}social-dropbox:before       {content: "\e00c"; }
.@{simple-line-icon-prefix}social-dribbble:before      {content: "\e00d"; }
.@{simple-line-icon-prefix}shield:before               {content: "\e00e"; }
.@{simple-line-icon-prefix}screen-tablet:before        {content: "\e00f"; }
.@{simple-line-icon-prefix}magic-wand:before           {content: "\e017"; }
.@{simple-line-icon-prefix}hourglass:before            {content: "\e018"; }
.@{simple-line-icon-prefix}graduation:before           {content: "\e019"; }
.@{simple-line-icon-prefix}ghost:before                {content: "\e01a"; }
.@{simple-line-icon-prefix}game-controller:before      {content: "\e01b"; }
.@{simple-line-icon-prefix}fire:before                 {content: "\e01c"; }
.@{simple-line-icon-prefix}eyeglasses:before           {content: "\e01d"; }
.@{simple-line-icon-prefix}envelope-open:before        {content: "\e01e"; }
.@{simple-line-icon-prefix}envelope-letter:before      {content: "\e01f"; }
.@{simple-line-icon-prefix}bell:before                 {content: "\e027"; }
.@{simple-line-icon-prefix}badge:before                {content: "\e028"; }
.@{simple-line-icon-prefix}anchor:before               {content: "\e029"; }
.@{simple-line-icon-prefix}wallet:before               {content: "\e02a"; }
.@{simple-line-icon-prefix}vector:before               {content: "\e02b"; }
.@{simple-line-icon-prefix}speech:before               {content: "\e02c"; }
.@{simple-line-icon-prefix}puzzle:before               {content: "\e02d"; }
.@{simple-line-icon-prefix}printer:before              {content: "\e02e"; }
.@{simple-line-icon-prefix}present:before              {content: "\e02f"; }
.@{simple-line-icon-prefix}playlist:before             {content: "\e030"; }
.@{simple-line-icon-prefix}pin:before                  {content: "\e031"; }
.@{simple-line-icon-prefix}picture:before              {content: "\e032"; }
.@{simple-line-icon-prefix}map:before                  {content: "\e033"; }
.@{simple-line-icon-prefix}layers:before               {content: "\e034"; }
.@{simple-line-icon-prefix}handbag:before              {content: "\e035"; }
.@{simple-line-icon-prefix}globe-alt:before            {content: "\e036"; }
.@{simple-line-icon-prefix}globe:before                {content: "\e037"; }
.@{simple-line-icon-prefix}frame:before                {content: "\e038"; }
.@{simple-line-icon-prefix}folder-alt:before           {content: "\e039"; }
.@{simple-line-icon-prefix}film:before                 {content: "\e03a"; }
.@{simple-line-icon-prefix}feed:before                 {content: "\e03b"; }
.@{simple-line-icon-prefix}earphones-alt:before        {content: "\e03c"; }
.@{simple-line-icon-prefix}earphones:before            {content: "\e03d"; }
.@{simple-line-icon-prefix}drop:before                 {content: "\e03e"; }
.@{simple-line-icon-prefix}drawer:before               {content: "\e03f"; }
.@{simple-line-icon-prefix}docs:before                 {content: "\e040"; }
.@{simple-line-icon-prefix}directions:before           {content: "\e041"; }
.@{simple-line-icon-prefix}direction:before            {content: "\e042"; }
.@{simple-line-icon-prefix}diamond:before              {content: "\e043"; }
.@{simple-line-icon-prefix}cup:before                  {content: "\e044"; }
.@{simple-line-icon-prefix}compass:before              {content: "\e045"; }
.@{simple-line-icon-prefix}call-out:before             {content: "\e046"; }
.@{simple-line-icon-prefix}call-in:before              {content: "\e047"; }
.@{simple-line-icon-prefix}call-end:before             {content: "\e048"; }
.@{simple-line-icon-prefix}calculator:before           {content: "\e049"; }
.@{simple-line-icon-prefix}bubbles:before              {content: "\e04a"; }
.@{simple-line-icon-prefix}briefcase:before            {content: "\e04b"; }
.@{simple-line-icon-prefix}book-open:before            {content: "\e04c"; }
.@{simple-line-icon-prefix}basket-loaded:before        {content: "\e04d"; }
.@{simple-line-icon-prefix}basket:before               {content: "\e04e"; }
.@{simple-line-icon-prefix}bag:before                  {content: "\e04f"; }
.@{simple-line-icon-prefix}action-undo:before          {content: "\e050"; }
.@{simple-line-icon-prefix}action-redo:before          {content: "\e051"; }
.@{simple-line-icon-prefix}wrench:before               {content: "\e052"; }
.@{simple-line-icon-prefix}umbrella:before             {content: "\e053"; }
.@{simple-line-icon-prefix}trash:before                {content: "\e054"; }
.@{simple-line-icon-prefix}tag:before                  {content: "\e055"; }
.@{simple-line-icon-prefix}support:before              {content: "\e056"; }
.@{simple-line-icon-prefix}size-fullscreen:before      {content: "\e057"; }
.@{simple-line-icon-prefix}size-actual:before          {content: "\e058"; }
.@{simple-line-icon-prefix}shuffle:before              {content: "\e059"; }
.@{simple-line-icon-prefix}share-alt:before            {content: "\e05a"; }
.@{simple-line-icon-prefix}share:before                {content: "\e05b"; }
.@{simple-line-icon-prefix}rocket:before               {content: "\e05c"; }
.@{simple-line-icon-prefix}question:before             {content: "\e05d"; }
.@{simple-line-icon-prefix}pie-chart:before            {content: "\e05e"; }
.@{simple-line-icon-prefix}pencil:before               {content: "\e05f"; }
.@{simple-line-icon-prefix}note:before                 {content: "\e060"; }
.@{simple-line-icon-prefix}music-tone-alt:before       {content: "\e061"; }
.@{simple-line-icon-prefix}music-tone:before           {content: "\e062"; }
.@{simple-line-icon-prefix}microphone:before           {content: "\e063"; }
.@{simple-line-icon-prefix}loop:before                 {content: "\e064"; }
.@{simple-line-icon-prefix}logout:before               {content: "\e065"; }
.@{simple-line-icon-prefix}login:before                {content: "\e066"; }
.@{simple-line-icon-prefix}list:before                 {content: "\e067"; }
.@{simple-line-icon-prefix}like:before                 {content: "\e068"; }
.@{simple-line-icon-prefix}home:before                 {content: "\e069"; }
.@{simple-line-icon-prefix}grid:before                 {content: "\e06a"; }
.@{simple-line-icon-prefix}graph:before                {content: "\e06b"; }
.@{simple-line-icon-prefix}equalizer:before            {content: "\e06c"; }
.@{simple-line-icon-prefix}dislike:before              {content: "\e06d"; }
.@{simple-line-icon-prefix}cursor:before               {content: "\e06e"; }
.@{simple-line-icon-prefix}control-start:before        {content: "\e06f"; }
.@{simple-line-icon-prefix}control-rewind:before       {content: "\e070"; }
.@{simple-line-icon-prefix}control-play:before         {content: "\e071"; }
.@{simple-line-icon-prefix}control-pause:before        {content: "\e072"; }
.@{simple-line-icon-prefix}control-forward:before      {content: "\e073"; }
.@{simple-line-icon-prefix}control-end:before          {content: "\e074"; }
.@{simple-line-icon-prefix}calendar:before             {content: "\e075"; }
.@{simple-line-icon-prefix}bulb:before                 {content: "\e076"; }
.@{simple-line-icon-prefix}bar-chart:before            {content: "\e077"; }
.@{simple-line-icon-prefix}arrow-up:before             {content: "\e078"; }
.@{simple-line-icon-prefix}arrow-right:before          {content: "\e079"; }
.@{simple-line-icon-prefix}arrow-left:before           {content: "\e07a"; }
.@{simple-line-icon-prefix}arrow-down:before           {content: "\e07b"; }
.@{simple-line-icon-prefix}ban:before                  {content: "\e07c"; }
.@{simple-line-icon-prefix}bubble:before               {content: "\e07d"; }
.@{simple-line-icon-prefix}camcorder:before            {content: "\e07e"; }
.@{simple-line-icon-prefix}camera:before               {content: "\e07f"; }
.@{simple-line-icon-prefix}check:before                {content: "\e080"; }
.@{simple-line-icon-prefix}clock:before                {content: "\e081"; }
.@{simple-line-icon-prefix}close:before                {content: "\e082"; }
.@{simple-line-icon-prefix}cloud-download:before       {content: "\e083"; }
.@{simple-line-icon-prefix}cloud-upload:before         {content: "\e084"; }
.@{simple-line-icon-prefix}doc:before                  {content: "\e085"; }
.@{simple-line-icon-prefix}envelope:before             {content: "\e086"; }
.@{simple-line-icon-prefix}eye:before                  {content: "\e087"; }
.@{simple-line-icon-prefix}flag:before                 {content: "\e088"; }
.@{simple-line-icon-prefix}folder:before               {content: "\e089"; }
.@{simple-line-icon-prefix}heart:before                {content: "\e08a"; }
.@{simple-line-icon-prefix}info:before                 {content: "\e08b"; }
.@{simple-line-icon-prefix}key:before                  {content: "\e08c"; }
.@{simple-line-icon-prefix}link:before                 {content: "\e08d"; }
.@{simple-line-icon-prefix}lock:before                 {content: "\e08e"; }
.@{simple-line-icon-prefix}lock-open:before            {content: "\e08f"; }
.@{simple-line-icon-prefix}magnifier:before            {content: "\e090"; }
.@{simple-line-icon-prefix}magnifier-add:before        {content: "\e091"; }
.@{simple-line-icon-prefix}magnifier-remove:before     {content: "\e092"; }
.@{simple-line-icon-prefix}paper-clip:before           {content: "\e093"; }
.@{simple-line-icon-prefix}paper-plane:before          {content: "\e094"; }
.@{simple-line-icon-prefix}plus:before                 {content: "\e095"; }
.@{simple-line-icon-prefix}pointer:before              {content: "\e096"; }
.@{simple-line-icon-prefix}power:before                {content: "\e097"; }
.@{simple-line-icon-prefix}refresh:before              {content: "\e098"; }
.@{simple-line-icon-prefix}reload:before               {content: "\e099"; }
.@{simple-line-icon-prefix}settings:before             {content: "\e09a"; }
.@{simple-line-icon-prefix}star:before                 {content: "\e09b"; }
.@{simple-line-icon-prefix}symbol-female:before        {content: "\e09c"; }
.@{simple-line-icon-prefix}symbol-male:before          {content: "\e09d"; }
.@{simple-line-icon-prefix}target:before               {content: "\e09e"; }
.@{simple-line-icon-prefix}volume-1:before             {content: "\e09f"; }
.@{simple-line-icon-prefix}volume-2:before             {content: "\e0a0"; }
.@{simple-line-icon-prefix}volume-off:before           {content: "\e0a1"; }
.@{simple-line-icon-prefix}users:before                {content: "\e001"; }

error: pathspec 'less/simple-line-icons.less' did not match any file(s) known to git


Add sidebar top and bottom transitions

Add sidebar top and bottom transitions

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


Update form filed label default class

Update form filed label default class

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


[Backoffice] Improve mobile stacked tabs.

.tabpanel {
  margin-bottom: 20px;
  .nav-tabs {
    border-bottom: none;
  }
  .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
  }
  .nav-tabs > li > a,
  .nav-tabs > li > a:hover,
  .nav-tabs > li > a:focus {
    background-color: #f9f9f9;
    border-color: #c5d0dc;
    border-radius: 0 !important;
    color: #999;
    line-height: 18px;
    margin-right: -1px;
    position: relative;
    outline: none;
  }
  .nav-tabs > li > a:hover {
    background-color: #fff;
  }
  .nav-tabs > li.active > a,
  .nav-tabs > li.active > a:hover,
  .nav-tabs > li.active > a:focus {
    background-color: #fff;
    border-color: #4c8fbd #c5d0dc transparent;
    border-top: 2px solid #4c8fbd;
    box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.15);
    color: #576373;
    line-height: 18px;
    margin-top: -1px;
    z-index: 1;
  }
  .tab-content {
    background-color: #fff;
    border: 1px solid #c5d0dc;
    padding: 15px 10px;
  }
}

.tabpanel.tabs-left {
  @media (min-width: @screen-md-min) {
    .make-row();
    .nav-tabs {
      .make-md-column(3);
      padding-right: 0;
      li {
        width: 100%;
      }
      & > li > a,
      & > li > a:hover,
      & > li > a:focus {
        border: 1px solid #c5d0dc;
        border-right: transparent;
        box-shadow: 0 -2px 3px 0 rgba(0, 0.15, 0, 0);
        margin-top: 0px;
        margin-right: -1px;
      }

      & > li.active > a,
      & > li.active > a:hover,
      & > li.active > a:focus {
        border-left: 2px solid #4c8fbd;
      }
    }

    .tab-content {
      .make-md-column(9);
    }

    .form-actions {
      .make-md-column(9);
      .make-md-column-offset(3);
    }
  }
  .form-actions {
    background-color: #f9f9f9;
    border: 1px solid #c5d0dc;
    border-top: 0;
    padding: 15px 15px;
  }
}

.tabpanel {
  .nav-tabs {
    border-bottom: none;
  }
  .nav-tabs > li {
    float: left;
    margin-bottom: -1px;
  }
  .nav-tabs > li > a,
  .nav-tabs > li > a:hover,
  .nav-tabs > li > a:focus {
    background-color: #f9f9f9;
    border-color: #c5d0dc;
    border-radius: 0 !important;
    color: #999;
    line-height: 18px;
    margin-right: -1px;
    position: relative;
    outline: none;
  }
  .nav-tabs > li > a:hover {
    background-color: #fff;
  }
  .nav-tabs > li.active > a,
  .nav-tabs > li.active > a:hover,
  .nav-tabs > li.active > a:focus {
    background-color: #fff;
    border-color: #4c8fbd #c5d0dc transparent;
    border-top: 2px solid #4c8fbd;
    box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.15);
    color: #576373;
    line-height: 18px;
    margin-top: -1px;
    z-index: 1;
  }
  .tab-content {
    background-color: #fff;
    border: 1px solid #c5d0dc;
    padding: 15px 10px;
  }
}

.tabpanel.tabs-left {
  @media (min-width: @screen-md-min) {
    .make-row();
    .nav-tabs {
      .make-md-column(3);
      padding-right: 0;
      li {
        width: 100%;
      }
      & > li > a,
      & > li > a:hover,
      & > li > a:focus {
        border: 1px solid #c5d0dc;
        border-right: transparent;
        box-shadow: 0 -2px 3px 0 rgba(0, 0.15, 0, 0);
        margin-top: 0px;
        margin-right: -1px;
      }

      & > li.active > a,
      & > li.active > a:hover,
      & > li.active > a:focus {
        border-left: 2px solid #4c8fbd;
      }
    }

    .tab-content {
      .make-md-column(9);
    }

    .form-actions {
      .make-md-column(9);
      .make-md-column-offset(3);
    }
  }
  .form-actions {
    background-color: #f9f9f9;
    border: 1px solid #c5d0dc;
    border-top: 0;
    padding: 15px 15px;
  }
}


Restore accidentally removed rules oh my

src/BloomBrowserUI/templates/template books/Basic Book/Basic Book.less

error: pathspec 'src/BloomBrowserUI/templates/template' did not match any file(s) known to git
error: pathspec 'books/Basic' did not match any file(s) known to git
error: pathspec 'Book/Basic' did not match any file(s) known to git
error: pathspec 'Book.less' did not match any file(s) known to git


.repeater {
	border: 1px solid #ddd;
	border-radius: 4px;

	&-canvas {
		&.scrolling{
			bottom: 0;
			left: 0;
			overflow-y: auto;
			position: absolute;
			right: 0;
			top: 0;
		}
	}

	&-header,
	&-footer
	{
		background: #f9f9f9;
		min-height: 50px;
		padding: 8px;
		.clearfix;

		&-left {
			float: left;
		}

		&-right {
			float: right;
		}

		@media (max-width: 625px) {
			&-left,
			&-right {
				float: none;
				.clearfix;
			}

			&-left {
				margin-bottom: 8px;
			}
		}
	}

	&-header {
		border-bottom: 1px solid #ddd;
		.border-top-radius(4px);
	}

	&-footer {
		border-top: 1px solid #ddd;
		.border-bottom-radius(4px);
	}

	&-loader {
		display: none;
		left: 50%;
		position: absolute;
		margin: -32px 0 0 -32px;
		top: 50%;
	}

	&-viewport {
		min-height: 80px;
		position: relative;
	}

	&-pagination {

		label {
			font-weight: normal;
		}

		.repeater-primaryPaging {
			display: none;
			vertical-align: middle;
			width: 116px;

			&.active {
				display: inline-block;
			}

			ul.dropdown-menu {
				min-width: 116px;
			}
		}

		.repeater-secondaryPaging {
			display: none;
			width: 82px;

			&.active {
				display: inline-block;
			}
		}
	}

	&-search {
		float: left;
		width: 200px;
	}

	&-title {
		display: block;
		float: left;
		line-height: 34px;
		margin-right: 10px;
	}

	/*
	 * reinforce spacing around control buttons
	 */
	&-itemization .selectlist, // TODO add specfic class for page size dropdown
	&-filters,
	&-secondaryPaging,
	&-primaryPaging,
	&-next,
	&-prev
	{
		margin: auto 0.3em;
	}
}

.repeater {
	border: 1px solid #ddd;
	border-radius: 4px;

	&-canvas {
		&.scrolling{
			bottom: 0;
			left: 0;
			overflow-y: auto;
			position: absolute;
			right: 0;
			top: 0;
		}
	}

	&-header,
	&-footer
	{
		background: #f9f9f9;
		min-height: 50px;
		padding: 8px;
		.clearfix;

		&-left {
			float: left;
		}

		&-right {
			float: right;
		}

		@media (max-width: 625px) {
			&-left,
			&-right {
				float: none;
				.clearfix;
			}

			&-left {
				margin-bottom: 8px;
			}
		}
	}

	&-header {
		border-bottom: 1px solid #ddd;
		.border-top-radius(4px);
	}

	&-footer {
		border-top: 1px solid #ddd;
		.border-bottom-radius(4px);
	}

	&-loader {
		display: none;
		left: 50%;
		position: absolute;
		margin: -32px 0 0 -32px;
		top: 50%;
	}

	&-viewport {
		min-height: 80px;
		position: relative;
	}

	&-pagination {

		label {
			font-weight: normal;
		}

		.repeater-primaryPaging {
			display: none;
			vertical-align: middle;
			width: 116px;

			&.active {
				display: inline-block;
			}

			ul.dropdown-menu {
				min-width: 116px;
			}
		}

		.repeater-secondaryPaging {
			display: none;
			width: 82px;

			&.active {
				display: inline-block;
			}
		}
	}

	&-search {
		float: left;
		width: 200px;
	}

	&-title {
		display: block;
		float: left;
		line-height: 34px;
		margin-right: 10px;
	}
}


别人的个人中心可以分享

别人的个人中心可以分享

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