add transition effect to pipeline graph labels

@import "app/styles/imports/commonImports.less";

.pipelines {
  overflow-x: hidden;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;

  @media (min-width: 768px) and (max-width: 992px) {
    width: 768px;
  }

  @media (min-width: 992px) {
    width: 992px;
  }
  @media (min-width: 1200px) {
    width: 1200px;
  }
  @media (min-width: 1400px) {
    width: 1400px;
  }

  > .header {
    flex: none;
    -webkit-flex: none;
  }

  > .execution-groups {
    padding: 0 15px;
    flex: 1 0 100px;
    -webkit-flex: 1 0 100px;
    overflow-y: auto;
  }

  .stage-filters {
    label {
      font-size: 12px;
      vertical-align: -1px;
      font-weight: normal;
    }
    border-bottom: 1px solid @mid_light_grey;
    border-top: 1px solid @mid_light_grey;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 5px;
    .form-group {
      margin-right: 5px;
    }
    .legend.color {
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
    }
  }
  .faded {
    color: @mid_lighter_grey;
  }
  .execution {
    .timestamp {
      color: @mid_grey;
      font-size: .8em;
      padding-top: 22px;
    }
    .panel {
      .summary {
        background-color: @mid_light_grey;
        cursor: pointer;
        padding-bottom: 0px;
        h5 {
          font-weight: bold;
          display: inline-block;
        }
      }
      .summary.current {
        background-color: #FFF;
      }

      .details {
        .tr {
          background-color: lighten(@spinnaker-blue, 20%);
        }
      }

    }
    .label-completed {
      background-color: @healthy_green_border;
    }
    .label-failed {
      background-color: @unhealthy_red;
    }
    .label-running, .label-launched {
      background-color: @spinnaker-blue;
    }
    .label {
      text-transform: uppercase;
      border-radius: 0;
      color: #fff;
      font-weight: 600;
      .glyphicon {
        color: #ffffff;
      }
    }
  }
}

.canary-config-view {
  h4 {
    margin: 20px 0 20px 0px;
    padding-bottom: 10px;
    border-bottom: 1px solid @mid_lighter_grey;
  }
  h5 {
    margin: 20px 0 0px 30px;
    font-weight: 600;
  }
  .horizontal-rule {
    border-top:1px solid #D0D0D0;
    margin-top: 5px;
    margin-left: 30px;
    margin-bottom: 10px;
  }
  .sm-label-left, label {
    padding-right: 5px;
    b {
      font-weight: 600;
    }
  }
}

.pipeline-details {
  @media (min-width: 992px) {
    .details-panel {
      /*width: 34% !important;*/
    }
  }
  @media (max-width: 992px) {
    .details-panel {
      display: none;
    }
  }
  .glyphicon-ok {
    color: @healthy_green_icon;
  }
  .glyphicon-warning-sign {
    color: @unhealthy_red;
  }
  dt {
    float: left;
    margin-right: 5px;
  }
}

.stage-label {
  .test-results-label {
    line-height: 12px;
  }

  .tests-pass-count {
    color: @healthy_green_icon;
  }
  .tests-fail-count {
    color: @unhealthy_red;
  }
  .tests-skip-count {
    color: @mid_lighter_grey;
  }
}

.execution-details {
  .glyphicon-ok {
    color: @healthy_green_icon;
  }
  .glyphicon-remove {
    color: @unhealthy_red;
    &.informational {
      color: @unhealthy_red !important;
      cursor: default;
    }
  }
  .test-results {
    .test-result-section {
      display: inline-block;
      text-align: right;
      width: 45px;
    }
  }
}

.pipeline-grouping {
}

.build-timeline {
  .axis path,
  .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
  }

  .x.axis path {
    display: none;
  }

  .line {
    fill: none;
    stroke: steelblue;
    stroke-width: 1.5px;
  }
}

.pipelines-header {
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 1px solid @mid_light_grey;
}

.nav.delivery-nav {
  /* looks like some styles are being overridden :( */
  border: none !important;
  background: none !important;
  padding: 0px !important;
  min-height: 0px !important;
  margin-bottom: 5px;
  a.active {
    background-color: @spinnaker-blue;
    border-radius: 3px;
    color: #fff;

  }
}

.pipeline-stacked-bar {
  .axis path,
  .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
  }
  .bar {
    fill: steelblue;
  }
  .x.axis path {
    display: none;
  }
  .axis {
    font-size: .7em;
  }
  rect {
    stroke: #000;
  }
  .vis-label {
    fill: #fff;
    font-size: .8em;
  }
  .legend {
    .block {
      cursor: pointer;
      stroke: none;
    }
  }
  .legend.active {
    .block {
      stroke: @mid_grey;

    }
  }
  .stage.succeeded, .stage.completed {
    fill: @healthy_green_border !important;
  }
  .stage.failed {
    fill: @unhealthy_red !important;
  }
  .stage.started, .stage.running, .stage.executing {
    fill: @spinnaker-blue !important;
  }
  .stage.not_started {
    fill: #ffffff !important;
  }
}

path.link {
  fill: none;
  stroke: #CCC;
  stroke-width: 1px;
  &.active {
    &.target {
      stroke: @healthy_green;
    }
    &.source {
      stroke: @spinnaker-blue;
    }
    stroke-width: 4px;
  }
  &.highlighted {
    &.target {
      stroke: lighten(@healthy_green, 10);
    }
    &.source {
      stroke: lighten(@spinnaker-blue, 25);
    }
    stroke-width: 2.5px;
    transition: stroke .2s, stroke-width .2s;
  }
}

g.connected {
  circle {
    fill: @mid_lighter_grey;
  }
}

g.active, g.highlighted {
  circle {
    fill: @healthy_green_border;
    transition: fill .2s;
  }
}

g {
  circle {
    fill: @mid_light_grey;
  }
}

svg {
  g {
    div.label-body {
      background-color: transparent;
      text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
      line-height: 14px;
      word-wrap: break-word;
      a {
        color: lighten(@text-color, 60);
        &:hover {
          text-decoration: none;
        }
      }
    }
    &.active, &.highlighted {
      div.label-body {
        a {
          color: @text-color;
          transition: color .2s;
        }
        font-weight: 600;
      }
    }
    &.highlighted {
      div.label-body {
        font-weight: 400;
      }
    }
  }
}

@import "app/styles/imports/commonImports.less";

.pipelines {
  overflow-x: hidden;
  display: flex;
  display: -webkit-flex;
  flex-direction: column;
  -webkit-flex-direction: column;

  @media (min-width: 768px) and (max-width: 992px) {
    width: 768px;
  }

  @media (min-width: 992px) {
    width: 992px;
  }
  @media (min-width: 1200px) {
    width: 1200px;
  }
  @media (min-width: 1400px) {
    width: 1400px;
  }

  > .header {
    flex: none;
    -webkit-flex: none;
  }

  > .execution-groups {
    padding: 0 15px;
    flex: 1 0 100px;
    -webkit-flex: 1 0 100px;
    overflow-y: auto;
  }

  .stage-filters {
    label {
      font-size: 12px;
      vertical-align: -1px;
      font-weight: normal;
    }
    border-bottom: 1px solid @mid_light_grey;
    border-top: 1px solid @mid_light_grey;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 5px;
    .form-group {
      margin-right: 5px;
    }
    .legend.color {
      display: inline-block;
      width: 8px;
      height: 8px;
      border-radius: 50%;
    }
  }
  .faded {
    color: @mid_lighter_grey;
  }
  .execution {
    .timestamp {
      color: @mid_grey;
      font-size: .8em;
      padding-top: 22px;
    }
    .panel {
      .summary {
        background-color: @mid_light_grey;
        cursor: pointer;
        padding-bottom: 0px;
        h5 {
          font-weight: bold;
          display: inline-block;
        }
      }
      .summary.current {
        background-color: #FFF;
      }

      .details {
        .tr {
          background-color: lighten(@spinnaker-blue, 20%);
        }
      }

    }
    .label-completed {
      background-color: @healthy_green_border;
    }
    .label-failed {
      background-color: @unhealthy_red;
    }
    .label-running, .label-launched {
      background-color: @spinnaker-blue;
    }
    .label {
      text-transform: uppercase;
      border-radius: 0;
      color: #fff;
      font-weight: 600;
      .glyphicon {
        color: #ffffff;
      }
    }
  }
}

.canary-config-view {
  h4 {
    margin: 20px 0 20px 0px;
    padding-bottom: 10px;
    border-bottom: 1px solid @mid_lighter_grey;
  }
  h5 {
    margin: 20px 0 0px 30px;
    font-weight: 600;
  }
  .horizontal-rule {
    border-top:1px solid #D0D0D0;
    margin-top: 5px;
    margin-left: 30px;
    margin-bottom: 10px;
  }
  .sm-label-left, label {
    padding-right: 5px;
    b {
      font-weight: 600;
    }
  }
}

.pipeline-details {
  @media (min-width: 992px) {
    .details-panel {
      /*width: 34% !important;*/
    }
  }
  @media (max-width: 992px) {
    .details-panel {
      display: none;
    }
  }
  .glyphicon-ok {
    color: @healthy_green_icon;
  }
  .glyphicon-warning-sign {
    color: @unhealthy_red;
  }
  dt {
    float: left;
    margin-right: 5px;
  }
}

.stage-label {
  .test-results-label {
    line-height: 12px;
  }

  .tests-pass-count {
    color: @healthy_green_icon;
  }
  .tests-fail-count {
    color: @unhealthy_red;
  }
  .tests-skip-count {
    color: @mid_lighter_grey;
  }
}

.execution-details {
  .glyphicon-ok {
    color: @healthy_green_icon;
  }
  .glyphicon-remove {
    color: @unhealthy_red;
    &.informational {
      color: @unhealthy_red !important;
      cursor: default;
    }
  }
  .test-results {
    .test-result-section {
      display: inline-block;
      text-align: right;
      width: 45px;
    }
  }
}

.pipeline-grouping {
}

.build-timeline {
  .axis path,
  .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
  }

  .x.axis path {
    display: none;
  }

  .line {
    fill: none;
    stroke: steelblue;
    stroke-width: 1.5px;
  }
}

.pipelines-header {
  font-weight: bold;
  text-transform: uppercase;
  border-bottom: 1px solid @mid_light_grey;
}

.nav.delivery-nav {
  /* looks like some styles are being overridden :( */
  border: none !important;
  background: none !important;
  padding: 0px !important;
  min-height: 0px !important;
  margin-bottom: 5px;
  a.active {
    background-color: @spinnaker-blue;
    border-radius: 3px;
    color: #fff;

  }
}

.pipeline-stacked-bar {
  .axis path,
  .axis line {
    fill: none;
    stroke: #000;
    shape-rendering: crispEdges;
  }
  .bar {
    fill: steelblue;
  }
  .x.axis path {
    display: none;
  }
  .axis {
    font-size: .7em;
  }
  rect {
    stroke: #000;
  }
  .vis-label {
    fill: #fff;
    font-size: .8em;
  }
  .legend {
    .block {
      cursor: pointer;
      stroke: none;
    }
  }
  .legend.active {
    .block {
      stroke: @mid_grey;

    }
  }
  .stage.succeeded, .stage.completed {
    fill: @healthy_green_border !important;
  }
  .stage.failed {
    fill: @unhealthy_red !important;
  }
  .stage.started, .stage.running, .stage.executing {
    fill: @spinnaker-blue !important;
  }
  .stage.not_started {
    fill: #ffffff !important;
  }
}

path.link {
  fill: none;
  stroke: #CCC;
  stroke-width: 1px;
  &.active {
    &.target {
      stroke: @healthy_green;
    }
    &.source {
      stroke: @spinnaker-blue;
    }
    stroke-width: 4px;
  }
  &.highlighted {
    &.target {
      stroke: lighten(@healthy_green, 10);
    }
    &.source {
      stroke: lighten(@spinnaker-blue, 25);
    }
    stroke-width: 2.5px;
    transition: stroke .2s, stroke-width .2s;
  }
}

g.connected {
  circle {
    fill: @mid_lighter_grey;
  }
}

g.active, g.highlighted {
  circle {
    fill: @healthy_green_border;
    transition: fill .2s;
  }
}

g {
  circle {
    fill: @mid_light_grey;
  }
}

svg {
  g {
    div.label-body {
      background-color: transparent;
      text-shadow: 0 1px 0 #fff, 1px 0 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff;
      line-height: 14px;
      word-wrap: break-word;
      a {
        color: lighten(@text-color, 60);
        &:hover {
          text-decoration: none;
        }
      }
    }
    &.active, &.highlighted {
      div.label-body {
        a {
          color: @text-color;
        }
        font-weight: 600;
      }
    }
    &.highlighted {
      div.label-body {
        font-weight: 400;
      }
    }
  }
}


Ajout du fichier de variables

Ajout du fichier de variables

// Fontes
@import url(https://fonts.googleapis.com/css?family=Arvo:700|Merriweather:400,300,300italic,400italic);
@font-family-heading: Arvo, 'Arial Black', Arial, sans-serif;
@font-family: Merriweather, 'Times', 'Times New Roman', serif;

// Tailles
@font-root            : 16px;
@font-normal          : 23px;
@font-large           : unit((32px / @font-normal), em);
@font-xlarge          : unit((46px / @font-normal), em);
@font-xxlarge         : unit((53px / @font-normal), em);
@font-small           : unit((18px / @font-normal), em);
@font-xsmall          : unit((16px / @font-normal), em);
@column-width         : unit((96px / @font-root), rem); // Attention aux REM sur les médias queries sous Safari 5.1 : http://codepen.io/ziopod/pen/meKVxX
@gutter-width         : unit((36px / @font-root), rem);
// Couleurs
@color-primary        : #DC710F;
@color-primary-light  : #E18E1C;
@color-primary-lighter: #FDEDDA;
@color-secondary      : #C5E0DC;
@color-text           : #382A27;
@color-link           : #DC710F;
@color-muted          : #6E6563;
@color-muted-lighter  : #F0EFEE;
@color-white          : white;
@color-black          : black;
// Points d'arrets
// Cf.
// https://responsivedesign.is/develop/browser-feature-support/media-queries-for-common-device-breakpoints
// https://css-tricks.com/snippets/css/media-queries-for-standard-devices/
@device-medium: unit((1224px / @font-root), rem);
@device-large: unit((1824px / @font-root), rem);
// Divers
@debug: false;

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


Set min-height on tree to 100%

Set min-height on tree to 100%

@import "bootstrap/less/variables.less";
@import "octicon-mixins.less";

.tree-view-resizer {
  position: relative;
  height: 100%;
  overflow: hidden;
  cursor: default;
  -webkit-user-select: none;
  min-width: 50px;
  z-index: 2;

  .tree-view-resize-handle {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    cursor: col-resize;
    z-index: 3;
  }
}

.tree-view-scroller {
  height: 100%;
  width: 100%;
  overflow: scroll;
}

.tree-view {
  min-width: -webkit-min-content;
  min-height: 100%;
  @item-line-height: @line-height-base * 1.25;
  @disclosure-arrow-size: 12px;
  @icon-margin: @line-height-base / 4;

  position: relative;
  padding: 0 @icon-margin;
  margin-bottom: 0;
  cursor: default;

  .entry {
    text-wrap: none;
    white-space: nowrap;

    .name {
      position: relative;
      z-index: 1;
    }

    &.selected > .highlight {
      position: absolute;
      left: 0;
      right: 0;
      height: @item-line-height;
    }
  }

  .directory {
    > .header {
      line-height: @item-line-height;
      .disclosure-arrow { margin-right: @icon-margin; }
    }

    .entries {
      margin-left: 12px;
    }
  }

  .file {
    line-height: @item-line-height;

    .name {
      margin-left: @disclosure-arrow-size + @icon-margin;
    }
  }

  // icons
  .name:before {
    margin-right: @icon-margin;
    position: relative;
    top: 1px;
  }

  .directory > .header {
    .disclosure-arrow {
      .mini-icon(arr-collapsed, @disclosure-arrow-size);
      position: relative;
    }
    .directory-icon { .mini-icon(directory); }
    .repository-icon { .mini-icon(public-repo); }
    .submodule-icon { .mini-icon(submodule); }
  }

  .directory.expanded > .header {
    .disclosure-arrow { .mini-icon(arr-expanded, @disclosure-arrow-size); }
  }

  .file {
    .text-icon { .mini-icon(text-file); }
    .image-icon { .mini-icon(download-media); }
    .compressed-icon { .mini-icon(download-zip); }
    .pdf-icon { .mini-icon(download-pdf); }
    .readme-icon { .mini-icon(readme); }
    .binary-icon { .mini-icon(binary-file); }
    .symlink-icon { .mini-icon(symlink); }
  }
}

.tree-view-dialog {
  padding: 5px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;

  .prompt {
    padding-bottom: 3px;
    font-size: 12px;
    line-height: 16px;
    &:before { margin-right: @line-height-base / 4; }
    &.add-file { .mini-icon(new-file); }
    &.add-directory { .mini-icon(create-directory); }
    &.prompt.move { .mini-icon(arr-right); }
  }
}

@import "bootstrap/less/variables.less";
@import "octicon-mixins.less";

.tree-view-resizer {
  position: relative;
  height: 100%;
  overflow: hidden;
  cursor: default;
  -webkit-user-select: none;
  min-width: 50px;
  z-index: 2;

  .tree-view-resize-handle {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    cursor: col-resize;
    z-index: 3;
  }
}

.tree-view-scroller {
  height: 100%;
  width: 100%;
  overflow: scroll;
}

.tree-view {
  min-width: -webkit-min-content;
  @item-line-height: @line-height-base * 1.25;
  @disclosure-arrow-size: 12px;
  @icon-margin: @line-height-base / 4;

  position: relative;
  padding: 0 @icon-margin;
  margin-bottom: 0;
  cursor: default;

  .entry {
    text-wrap: none;
    white-space: nowrap;

    .name {
      position: relative;
      z-index: 1;
    }

    &.selected > .highlight {
      position: absolute;
      left: 0;
      right: 0;
      height: @item-line-height;
    }
  }

  .directory {
    > .header {
      line-height: @item-line-height;
      .disclosure-arrow { margin-right: @icon-margin; }
    }

    .entries {
      margin-left: 12px;
    }
  }

  .file {
    line-height: @item-line-height;

    .name {
      margin-left: @disclosure-arrow-size + @icon-margin;
    }
  }

  // icons
  .name:before {
    margin-right: @icon-margin;
    position: relative;
    top: 1px;
  }

  .directory > .header {
    .disclosure-arrow {
      .mini-icon(arr-collapsed, @disclosure-arrow-size);
      position: relative;
    }
    .directory-icon { .mini-icon(directory); }
    .repository-icon { .mini-icon(public-repo); }
    .submodule-icon { .mini-icon(submodule); }
  }

  .directory.expanded > .header {
    .disclosure-arrow { .mini-icon(arr-expanded, @disclosure-arrow-size); }
  }

  .file {
    .text-icon { .mini-icon(text-file); }
    .image-icon { .mini-icon(download-media); }
    .compressed-icon { .mini-icon(download-zip); }
    .pdf-icon { .mini-icon(download-pdf); }
    .readme-icon { .mini-icon(readme); }
    .binary-icon { .mini-icon(binary-file); }
    .symlink-icon { .mini-icon(symlink); }
  }
}

.tree-view-dialog {
  padding: 5px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;

  .prompt {
    padding-bottom: 3px;
    font-size: 12px;
    line-height: 16px;
    &:before { margin-right: @line-height-base / 4; }
    &.add-file { .mini-icon(new-file); }
    &.add-directory { .mini-icon(create-directory); }
    &.prompt.move { .mini-icon(arr-right); }
  }
}


commit

commit

@import "../common";
@import "../common/ui";

html {
	color: #000;
	background-color: #f2ebe8;
	//background-image: url(@wallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

main {
	display: block;
	position: relative;

	#contents {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		justify-content: center;
		position: relative;

		#main-contents {
			flex: 1 1 570px;
			box-sizing: border-box;
			max-width: 570px;
			margin: 0;
			padding: 16px 24px;
		}

		#left-contents {
			flex: 1 1 270px;
			max-width: 270px;
			padding: 16px 0 16px 16px;
		}

		#right-contents {
			flex: 1 1 270px;
			max-width: 270px;
			padding: 16px 16px 16px 0;
		}
	}
}

@media (max-width: 1000px) {
	main {
		#contents {
			#left-contents {
				display: none;
			}

			#right-contents {
				display: none;
			}
		}
	}
}

@media (max-width: 600px) {
	main {
		#contents {
			#main-contents {
				padding: 0;
				max-width: 100%;
			}
		}
	}
}

// ------------------------------------------------

.misskey-home-widget {
	display: block;
	position: relative;
}

#widget-timeline {
	.timeline {
		@import "../common/timeline";
	}
}

#widget-my-status {
	display: block;
	box-sizing: border-box;
	background: transparent;
	border-radius: 8px;
	overflow: hidden;

	header {
		display: inline-block;
		box-sizing: border-box;
		padding: 20px;
		width: 100%;
		background-color: #82C3C3;
		//background-image: url(@headerImageUrl);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;

		.avatar-anchor {
			display: block;

			.avatar {
				display: block;
				float: left;
				width: 48px;
				height: 48px;
				margin: 0;
				padding: 0;
				vertical-align: bottom;
				border: solid 4px transparent;
				box-shadow: 0 0 0 1px #fff;
				border-radius: 100%;
			}
		}

		h1 {
			display: block;
			margin: 0;
			padding: 0 0 0 70px;
			color: #fff;
			line-height: 56px;
			font-weight: bold;
			font-size: 1em;
			font-family: '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'Meiryo UI', 'Meiryo', 'メイリオ', sans-serif;
		}
	}

	nav {
		display: block;
		position: relative;
		padding: 6px 0;
		color: #95856e;
		background: #edede5;

		.status {
			margin: 0 auto;
			border-collapse: collapse;

			tr {
				th, td {
					min-width: 3.2em;
					padding: 0;
					margin: 0;
					line-height: 1em;
					text-align: center;
					border-right: solid 1px #ddddd5;

					&:last-child {
						border-right: none;
					}
				}

				th {
					padding: 0 12px 2px 12px;
					text-align: center;
					text-transform: uppercase;
					font-size: 0.6em;
					font-weight: normal;
					color: rgba(0, 0, 0, 0.5);
				}

				td {
					padding: 0px 0 2px 0;
					text-align: center;
					font-size: 1.1em;

					a {
						color: #95856e;
					}
				}
			}
		}
	}
}

#widget-notifications {
	display: block;
	box-sizing: border-box;
	max-height: 400px;
	overflow: auto;
	background: #fff;
	background-color: #fff;
	//background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url(@blurredWallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 8px;

	> .notification-empty {
		display: block;
		box-sizing: border-box;
		margin: 0;
		padding: 16px;
		text-align: center;
	}

	> .notifications {
		display: block;
		margin: 0;
		padding: 0;
		list-style: none;

		> .notification {
			display: block;
			position: relative;
			margin: 0;
			padding: 16px;
			font-size: 0.9em;
			border-bottom: solid 1px rgba(0,0,0,0.05);

			&:last-child {
				border-bottom: none;
			}

			&:after {
				content: "";
				display: block;
				clear: both;
			}

			> time {
				display: inline;
				position: absolute;
				top: 16px;
				right: 12px;
				vertical-align: top;
				color: rgba(0, 0, 0, 0.6);
				font-size: small;
			}

			> .main {
				word-wrap: break-word;
			}

			&.application {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.install-app {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.uninstall-app {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #FF2604;
						}
					}
				}
			}

			&.follow {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.like, &.repost {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
						}
					}

					.post-preview {
						color: rgba(0, 0, 0, 0.7);

						&:before {
							content: "\f10d";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-right: 3px;
						}

						&:after {
							content: "\f10e";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-left: 3px;
						}
					}
				}
			}

			&.like {
				.text p i {
					color: #FFAC33;
				}
			}

			&.repost {
				.text p i {
					color: #77B255;
				}
			}

			&.bbs-thread-post {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
						}
					}

					.post-preview {
						color: rgba(0, 0, 0, 0.7);

						&:before {
							content: "\f10d";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-right: 3px;
						}

						&:after {
							content: "\f10e";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-left: 3px;
						}
					}
				}
			}
		}
	}
}

#widget-recommendation-users {
	box-sizing: border-box;
	background: #fff;
	background-color: #fff;
	//background-image: url(@blurredWallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 8px;

	> .users {
		margin: 0;
		padding: 0;
		list-style: none;

		> .user {
			margin: 0;
			padding: 12px 16px;
			border-bottom: solid 1px rgba(0,0,0,0.05);

			&[data-is-following='false'] {
				.main button {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					cursor: pointer;
					display: inline-block;
					box-sizing: border-box;
					padding: 4px 8px;
					margin: 0;
					font-size: 0.8em;
					color: #fff;
					background: #bbb;
					border: none;
					border-radius: 2px;
					outline: none;
					transition: background .2s ease;

					&:disabled {
						background: #ddd !important;
					}

					&:hover {
						background: #ccc;
						transition: background .1s ease;
					}

					&:active {
						background: #999;
						transition: background 0s ease;
					}

					&:focus {
						text-shadow: 0 0 8px #fff;
					}
				}
			}

			&[data-is-following='true'] {
				.main button {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					cursor: pointer;
					display: inline-block;
					box-sizing: border-box;
					padding: 4px 8px;
					margin: 0;
					font-size: 0.8em;
					color: contrast(@themeColor, #000, #fff, 70%);
					background: @themeColor;
					border: none;
					border-radius: 2px;
					outline: none;
					transition: background .2s ease;

					&:disabled {
						background: #ddd !important;
					}

					&:hover {
						background: lighten(@themeColor, 10%);
						transition: background .1s ease;
					}

					&:active {
						background: darken(@themeColor, 10%);
						transition: background 0s ease;
					}

					&:focus {
						text-shadow: 0 0 8px #fff;
					}
				}
			}

			&:last-child {
				border-bottom: none;
			}

			&:after {
				content: "";
				display: block;
				clear: both;
			}

			.avatar-area {
				float: left;
				width: 32px;

				.avatar {
					min-width: 40px;
					min-height: 40px;
					max-width: 40px;
					max-height: 40px;
					border-radius: 6px;
				}
			}

			.main {
				float: left;
				width: ~"calc(100% - 32px)";
				text-align: center;

				.name {
					margin: 0;
				}
			}
		}
	}
}

#widget-donate {
	display: block;
	box-sizing: border-box;
	padding: 16px;
	color: #94836F;

	*:not(i) {
		font-family: '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'Meiryo UI', 'Meiryo', 'メイリオ', sans-serif;
	}

	h1 {
		margin: 0;
		font-size: 1em;

		i {
			margin-right: 0.25em;
		}
	}

	p {
		display: block;
		z-index: 1;
		margin: 5px 0;
		font-size: 0.8em;
	}

	img {
		display: block;
		max-height: 128px;
		margin: 0 auto;
	}
}

#widget-big-analog-clock {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
}

#widget-small-analog-clock {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	padding: 8px 0;

	canvas {
		display: block;
		margin: 0 auto;
		width: 254px;
	}
}

#widget-big-calendar {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	text-align: center;

	> p {
		> span {
			margin: 0 4px;
		}
	}

	.day {
		margin: 0;
		font-size: 2em;
	}
}

#widget-small-calendar {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	text-align: center;

	> p {
		> span {
			margin: 0 4px;
		}
	}
}

@import "../common";
@import "../common/ui";

html {
	color: #000;
	background-color: #f2ebe8;
	//background-image: url(@wallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

main {
	display: block;
	position: relative;

	#contents {
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		justify-content: center;
		position: relative;

		#main-contents {
			flex: 1 1 570px;
			box-sizing: border-box;
			max-width: 570px;
			margin: 0;
			padding: 16px 24px;
		}

		#left-contents {
			flex: 1 1 270px;
			max-width: 270px;
			padding: 16px 0 16px 16px;
		}

		#right-contents {
			flex: 1 1 270px;
			max-width: 270px;
			padding: 16px 16px 16px 0;
		}
	}
}

@media (max-width: 1000px) {
	main {
		#contents {
			#left-contents {
				display: none;
			}

			#right-contents {
				display: none;
			}
		}
	}
}

@media (max-width: 600px) {
	main {
		#contents {
			#main-contents {
				padding: 0;
				max-width: 100%;
			}
		}
	}
}

// ------------------------------------------------

.misskey-home-widget {
	display: block;
	position: relative;
}

#widget-timeline {
	.timeline {
		@import "../common/timeline";
	}
}

#widget-my-status {
	display: block;
	box-sizing: border-box;
	background: transparent;
	border-radius: 8px;
	overflow: hidden;

	header {
		display: inline-block;
		box-sizing: border-box;
		padding: 20px;
		width: 100%;
		background-color: #82C3C3;
		//background-image: url(@headerImageUrl);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;

		.avatar-anchor {
			display: block;

			.avatar {
				display: block;
				float: left;
				width: 48px;
				height: 48px;
				margin: 0;
				padding: 0;
				vertical-align: bottom;
				border: solid 4px transparent;
				box-shadow: 0 0 0 1px #fff;
				border-radius: 100%;
			}
		}

		h1 {
			display: block;
			margin: 0;
			padding: 0 0 0 70px;
			color: #fff;
			line-height: 56px;
			font-weight: bold;
			font-size: 1em;
			font-family: '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'Meiryo UI', 'Meiryo', 'メイリオ', sans-serif;
		}
	}

	nav {
		display: block;
		position: relative;
		padding: 6px 0;
		color: #95856e;
		background: #edede5;

		.status {
			margin: 0 auto;
			border-collapse: collapse;

			tr {
				th, td {
					min-width: 3.2em;
					padding: 0;
					margin: 0;
					line-height: 1em;
					text-align: center;
					border-right: solid 1px #ddddd5;

					&:last-child {
						border-right: none;
					}
				}

				th {
					padding: 0 12px 2px 12px;
					text-align: center;
					text-transform: uppercase;
					font-size: 0.6em;
					font-weight: normal;
					color: rgba(0, 0, 0, 0.5);
				}

				td {
					padding: 0px 0 2px 0;
					text-align: center;
					font-size: 1.1em;

					a {
						color: #95856e;
					}
				}
			}
		}
	}
}

#widget-notifications {
	display: block;
	box-sizing: border-box;
	max-height: 400px;
	overflow: auto;
	background: #fff;
	background-color: #fff;
	//background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)), url(@blurredWallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 8px;

	> .notification-empty {
		display: block;
		box-sizing: border-box;
		margin: 0;
		padding: 16px;
		text-align: center;
	}

	> .notifications {
		display: block;
		margin: 0;
		padding: 0;
		list-style: none;

		> .notification {
			display: block;
			position: relative;
			margin: 0;
			padding: 16px;
			font-size: 0.9em;
			border-bottom: solid 1px rgba(0,0,0,0.05);

			&:last-child {
				border-bottom: none;
			}

			&:after {
				content: "";
				display: block;
				clear: both;
			}

			> time {
				display: inline;
				position: absolute;
				top: 16px;
				right: 12px;
				vertical-align: top;
				color: rgba(0, 0, 0, 0.6);
				font-size: small;
			}

			> .main {
				word-wrap: break-word;
			}

			&.application {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.install-app {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.uninstall-app {
				.icon-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #FF2604;
						}
					}
				}
			}

			&.follow {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
							color: #55ACEE;
						}
					}
				}
			}

			&.status-favorite, &.status-repost {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
						}
					}

					.status-preview {
						color: rgba(0, 0, 0, 0.7);

						&:before {
							content: "\f10d";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-right: 3px;
						}

						&:after {
							content: "\f10e";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-left: 3px;
						}
					}
				}
			}

			&.status-favorite {
				.text p i {
					color: #FFAC33;
				}
			}

			&.status-repost {
				.text p i {
					color: #77B255;
				}
			}

			&.bbs-thread-post {
				.avatar-anchor {
					img {
						float: left;
						min-width: 36px;
						min-height: 36px;
						max-width: 36px;
						max-height: 36px;
						border-radius: 6px;
					}
				}

				.text {
					float: right;
					box-sizing: border-box;
					width: ~"calc(100% - 36px)";
					padding-left: 8px;

					p {
						margin: 0;

						i {
							margin-right: 4px;
						}
					}

					.post-preview {
						color: rgba(0, 0, 0, 0.7);

						&:before {
							content: "\f10d";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-right: 3px;
						}

						&:after {
							content: "\f10e";
							font-family: FontAwesome;
							font-size: 1em;
							font-weight: normal;
							font-style: normal;
							display: inline-block;
							margin-left: 3px;
						}
					}
				}
			}
		}
	}
}

#widget-recommendation-users {
	box-sizing: border-box;
	background: #fff;
	background-color: #fff;
	//background-image: url(@blurredWallpaperUrl);
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 8px;

	> .users {
		margin: 0;
		padding: 0;
		list-style: none;

		> .user {
			margin: 0;
			padding: 12px 16px;
			border-bottom: solid 1px rgba(0,0,0,0.05);

			&[data-is-following='false'] {
				.main button {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					cursor: pointer;
					display: inline-block;
					box-sizing: border-box;
					padding: 4px 8px;
					margin: 0;
					font-size: 0.8em;
					color: #fff;
					background: #bbb;
					border: none;
					border-radius: 2px;
					outline: none;
					transition: background .2s ease;

					&:disabled {
						background: #ddd !important;
					}

					&:hover {
						background: #ccc;
						transition: background .1s ease;
					}

					&:active {
						background: #999;
						transition: background 0s ease;
					}

					&:focus {
						text-shadow: 0 0 8px #fff;
					}
				}
			}

			&[data-is-following='true'] {
				.main button {
					-webkit-appearance: none;
					-moz-appearance: none;
					appearance: none;
					cursor: pointer;
					display: inline-block;
					box-sizing: border-box;
					padding: 4px 8px;
					margin: 0;
					font-size: 0.8em;
					color: contrast(@themeColor, #000, #fff, 70%);
					background: @themeColor;
					border: none;
					border-radius: 2px;
					outline: none;
					transition: background .2s ease;

					&:disabled {
						background: #ddd !important;
					}

					&:hover {
						background: lighten(@themeColor, 10%);
						transition: background .1s ease;
					}

					&:active {
						background: darken(@themeColor, 10%);
						transition: background 0s ease;
					}

					&:focus {
						text-shadow: 0 0 8px #fff;
					}
				}
			}

			&:last-child {
				border-bottom: none;
			}

			&:after {
				content: "";
				display: block;
				clear: both;
			}

			.avatar-area {
				float: left;
				width: 32px;

				.avatar {
					min-width: 40px;
					min-height: 40px;
					max-width: 40px;
					max-height: 40px;
					border-radius: 6px;
				}
			}

			.main {
				float: left;
				width: ~"calc(100% - 32px)";
				text-align: center;

				.name {
					margin: 0;
				}
			}
		}
	}
}

#widget-donate {
	display: block;
	box-sizing: border-box;
	padding: 16px;
	color: #94836F;

	*:not(i) {
		font-family: '游ゴシック', 'YuGothic', 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'Meiryo UI', 'Meiryo', 'メイリオ', sans-serif;
	}

	h1 {
		margin: 0;
		font-size: 1em;

		i {
			margin-right: 0.25em;
		}
	}

	p {
		display: block;
		z-index: 1;
		margin: 5px 0;
		font-size: 0.8em;
	}

	img {
		display: block;
		max-height: 128px;
		margin: 0 auto;
	}
}

#widget-big-analog-clock {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
}

#widget-small-analog-clock {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	padding: 8px 0;

	canvas {
		display: block;
		margin: 0 auto;
		width: 254px;
	}
}

#widget-big-calendar {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	text-align: center;

	> p {
		> span {
			margin: 0 4px;
		}
	}

	.day {
		margin: 0;
		font-size: 2em;
	}
}

#widget-small-calendar {
	display: block;
	box-sizing: border-box;
	width: ~"calc(100% - 16px)";
	overflow: auto;
	margin: 8px;
	text-align: center;

	> p {
		> span {
			margin: 0 4px;
		}
	}
}


remove border workaround, since it has been fixed upstream

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/VoiSmart/Rocket.Chat.git/'


Fix zindex of fab backdrop

Fix zindex of fab backdrop

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/'


Create progress-bars.less

Create progress-bars.less

//**** Progress Bars ****//

//Base Style

.progress {
    height: @progress-height;
    margin-bottom: @progress-margin-bottom;
    background-color: @progress;
    border-radius: @border-radius;
	box-shadow: @progress-box-shadow;
    -webkit-box-shadow: @progress-box-shadow;
}

.progress > .progress-bar:first-child {
    border-top-left-radius: @border-radius;
	border-bottom-left-radius: @border-radius;
}

.progress > .progress-bar:last-child {
    border-top-right-radius: @border-radius;
	border-bottom-right-radius: @border-radius;
}

.progress-bar {
    float: left;
    width: 0;
    height: @progress-bar-height;
    font-size: @default-font-size - 2px;
    line-height: @progress-bar-line-height;
    color: @white;
    text-align: center;
    background: linear-gradient(@progress-bar, darken(@progress-bar, 15%));
	border: 1px solid @progress-bar-border;
    box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar, 15%);
    -webkit-box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar, 15%);
    -webkit-transition: width .4s ease;
    -o-transition: width .4s ease;
    transition: width .4s ease;
}

//Success

.progress > .progress-bar-success {
    background: linear-gradient(@progress-bar-success, darken(@progress-bar-success, 15%));
	border: 1px solid @progress-bar-success-border;
    box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-success, 15%);
    -webkit-box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-success, 15%);
}

//Warning

.progress > .progress-bar-warning {
    background: linear-gradient(@progress-bar-warning, darken(@progress-bar-warning, 15%));
	border: 1px solid @progress-bar-warning-border;
    box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-warning, 15%);
    -webkit-box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-warning, 15%);
}

//Danger

.progress > .progress-bar-danger {
    background: linear-gradient(@progress-bar-danger, darken(@progress-bar-danger, 15%));
	border: 1px solid @progress-bar-danger-border;
    box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-danger, 15%);
    -webkit-box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-danger, 15%);
}

//Info

.progress > .progress-bar-info {
    background: linear-gradient(@progress-bar-info, darken(@progress-bar-info, 15%));
	border: 1px solid @progress-bar-info-border;
    box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-info, 15%);
    -webkit-box-shadow: inset 0px 1px 0px 0px lighten(@progress-bar-info, 15%);
}

//Styles

.progress.square {
    border-radius: @border-square-radius;
}

.progress.square > .progress-bar:first-child {
    border-top-left-radius: @border-square-radius;
	border-bottom-left-radius: @border-square-radius;
}

.progress.square > .progress-bar:last-child {
    border-top-right-radius: @border-square-radius;
	border-bottom-right-radius: @border-square-radius;
}

.progress.ultra-rounded {
    border-radius: @border-ultra-rounded-radius;
}

.progress.ultra-rounded > .progress-bar:first-child {
    border-top-left-radius: @border-ultra-rounded-radius;
	border-bottom-left-radius: @border-ultra-rounded-radius;
}

.progress.ultra-rounded > .progress-bar:last-child {
    border-top-right-radius: @border-ultra-rounded-radius;
	border-bottom-right-radius: @border-ultra-rounded-radius;
}

error: pathspec 'less/progress-bars.less' did not match any file(s) known to git


Added css for turkish translation

Added css for turkish translation

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/evanbrumley/spyfall.git/'


Formatting (space before `!important`)

Formatting (space before `!important`)

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/putterschool/styleguide.git/'


only show first level menu items, improved pre element formatting (MDN tutorials)

@import '../mkt/lib';

.html-rtl nav {
    text-align: left;
}

body {
    font-size: 14px;
}

.home #site-header:after {
    height: 6px;
    top: -6px;
}

#site-header {
    h1 a {
        background-image: url('../../img/ecosystem/developers_logo.png');
        height: 54px;
        width: 375px;
    }
    nav {
        padding-top: 41px;
        text-align: right;
    }
    nav a {
        margin-left: 25px;
        padding-top: 25px;
        color: #6DC7FF;
        text-transform: uppercase;
        font-size: 13pt;
        text-shadow: 0 1px 1px #444;
        &.loading-submit:after {
            margin: 0;
            top: 30px;
            right: auto;
            left: -30px;
        }
    }
    a.external {
        background-image: url('../../img/mkt/arrows/external_menu.gif');
        background-position: right 33px;
        background-repeat: no-repeat;
        padding-right: 12px;
    }
    section {
         .grain;
         background-color: @navy-gray;
         width: 100%;
         .wrapper {
             margin: 0 auto;
             width: 90%;
         }
    }
}

#page {
    clear: both;
}

#site-header .wrapper,
#top-marketing section,
#landing-page {
    max-width: 984px;
    width: 90%;
}

#top-marketing {
    .grain;
    border-bottom: darken(#404f5a, 5%) 1px solid;
    background-color: @navy-gray;
    margin: 0 auto;
    text-shadow: 0 1px 2px #000;
    .placeholder {
        margin: 0 auto;
        max-height: 250px;
        max-width: 70%;
    }
}

.call-to-action {
    padding: 20px 25px 25px;
    overflow: hidden;
    margin: 0 auto;
    width: 90%;
    img {
        float: right;
    }
    div {
        float: left;
        text-align: center;
        width: 320px;
        color: white;
        margin-top: 40px;
        p {
            margin: 10px 0 20px;
        }
    }
    h1 {
        font-size: 3em;
    }
}

#rotator {
    float: right;
}

#landing-page {
    margin: 0 auto 25px;
    img {
        max-width: 100%;
    }
}

#demo-block {
    padding-bottom: 0;
}

#demo-list {
    max-width:485px;
    float:left;
    margin: 0;
    padding: 0;
    li {
        list-style: none;
        display: inline-block;
        margin-bottom: 20px;
    }
    .placeholder {
        height: 120px;
        width: 200px;
        display: inline;
        margin-right: 20px;
    }
    span {
        display: block;
    }
    a {
        color: @medium-gray;
        img {
            opacity: .9;
        }
        &:hover {
            color: @dark-gray;
            img {
                opacity: 1;
            }
        }
    }
}

#marketing-horz {
    margin: 0;
    padding: 0;
    width: 100%;
    li {
        .border-box;
        list-style: none;
        text-align: center;
        float: left;
        max-width: 33.3%;
        padding: 0 10px;
        width: 33.33%;
    }
    li div {
        margin: 0 auto;
    }
}

.marketing-block {
    overflow: hidden;
    background-color: white;
    padding: 25px;
    margin: 25px auto 0 auto;
    border: 1px solid #BBBBBB;
    box-shadow: 0 1px 5px -3px #000000;

    p {
        margin-bottom: 20px;
    }
}

.img-right {
    .placeholder {
        float: right;
        margin-left: 50px;
        margin-top: -40px;
        max-width: 500px;
    }
}

.no-pad {
    padding: 0;
}

#tutorial {
    margin: 25px auto 25px auto;
    max-width: 984px;
    width: 90%;
    background-color: #EFF1F2;
    padding: 0;

    h3 {
        font-size: 23px;
        margin-top: 8px;
    }
    a {
        color: #667990;
        display: block;
        margin-left: 15px;
        text-indent: -15px;
    }
    pre {
        border: dashed 2px #ddd;
        overflow: auto;
        padding: 10px;
        white-space: pre;
    }

    nav ul {
        padding: 0;
        margin: 0;
    }
    nav li {
        margin: 2px 0 2px 0;
    }
    nav img {
        box-shadow: 0 0 5px #aaa;
        border: solid 1px #E3E5E6;
    }

    #sidebar {
        width: 225px;
        float: left;
        margin-left: -100%;
        padding: 25px 0 25px 25px;
        font-size: 15px;
        color: #667990;

        a.external {
            background: url(../../img/mkt/arrows/external_sidebar.gif) 7px 100% no-repeat;
            padding-right: 12px;
        }
    }
    #content {
        float: left;
        width: 100%;
    }
    #mdn-content {
        margin-left: 275px;
        background-color: #fff;
        padding: 25px;
        border-left: solid 1px #E3E5E6;
    }
    #mdn-toc {
        margin: 0;
        padding: 0 0 0 20px;
        li span {
            display: none;
        }
        ol {
            display: none;
        }
    }
}

@media (max-width: @10col) {
    h2 {
        font-size: 22px;
    }

    .home {
        #site-header {
            &:after {
                height: 8px;
                top: -28px;
            }
            a:first-child {
                margin: 0;
            }
            nav {
                clear: both;
                padding: 0;
                text-align: left;
                z-index: 1;
            }
        }
    }

    #page {
        margin-top: 0;
    }
    #landing-page #marketing-horz {
        li {
            float: left;
            font-size: 110%;
        }
    }
    #top-marketing {
        text-align: center;
        div {
            float: none;
            margin-top: 20px;
            width: 90%;
        }
        .placeholder {
            float: none;
            margin: 50px auto 0;
            max-height: 150px;
        }
    }
}

@media (max-width: @4col) {
    .home {
        #site-header {
            margin-bottom: 0;
            nav {
                clear: both;
                padding: 0;
                z-index: 1;
            }
        }
    }
    #site-header nav a {
        text-transform: none;
        + a {
            margin-left: 10px;
        }
    }
    #landing-page #marketing-horz {
        li {
            float: none;
            text-align: center;
            font-size: 120%;
            max-width: 100%;
            width: 100%;
        }
    }
    .call-to-action {
        div {
            margin: 0 auto;
            width: 100%;
        }
        .placeholder {
            margin-top: 40px;
            max-height: 130px;
        }
    }
}

@media (max-width: 800px) {
   #site-header {
        &:after {
            height: 8px;
            top: -28px;
        }
        a:first-child {
            margin: 0;
        }
        nav {
            clear: both;
            padding: 0;
            text-align: left;
            z-index: 1;
        }
    }
    #tutorial {
        nav img {
            display: none;
        }
        #content {
            width: 100%;
        }
        #mdn-content, #sidebar {
            margin-left: 0;
        }
    }
}

@import '../mkt/lib';

.html-rtl nav {
    text-align: left;
}

body {
    font-size: 14px;
}

.home #site-header:after {
    height: 6px;
    top: -6px;
}

#site-header {
    h1 a {
        background-image: url('../../img/ecosystem/developers_logo.png');
        height: 54px;
        width: 375px;
    }
    nav {
        padding-top: 41px;
        text-align: right;
    }
    nav a {
        margin-left: 25px;
        padding-top: 25px;
        color: #6DC7FF;
        text-transform: uppercase;
        font-size: 13pt;
        text-shadow: 0 1px 1px #444;
        &.loading-submit:after {
            margin: 0;
            top: 30px;
            right: auto;
            left: -30px;
        }
    }
    a.external {
        background-image: url('../../img/mkt/arrows/external_menu.gif');
        background-position: right 33px;
        background-repeat: no-repeat;
        padding-right: 12px;
    }
    section {
         .grain;
         background-color: @navy-gray;
         width: 100%;
         .wrapper {
             margin: 0 auto;
             width: 90%;
         }
    }
}

#page {
    clear: both;
}

#site-header .wrapper,
#top-marketing section,
#landing-page {
    max-width: 984px;
    width: 90%;
}

#top-marketing {
    .grain;
    border-bottom: darken(#404f5a, 5%) 1px solid;
    background-color: @navy-gray;
    margin: 0 auto;
    text-shadow: 0 1px 2px #000;
    .placeholder {
        margin: 0 auto;
        max-height: 250px;
        max-width: 70%;
    }
}

.call-to-action {
    padding: 20px 25px 25px;
    overflow: hidden;
    margin: 0 auto;
    width: 90%;
    img {
        float: right;
    }
    div {
        float: left;
        text-align: center;
        width: 320px;
        color: white;
        margin-top: 40px;
        p {
            margin: 10px 0 20px;
        }
    }
    h1 {
        font-size: 3em;
    }
}

#rotator {
    float: right;
}

#landing-page {
    margin: 0 auto 25px;
    img {
        max-width: 100%;
    }
}

#demo-block {
    padding-bottom: 0;
}

#demo-list {
    max-width:485px;
    float:left;
    margin: 0;
    padding: 0;
    li {
        list-style: none;
        display: inline-block;
        margin-bottom: 20px;
    }
    .placeholder {
        height: 120px;
        width: 200px;
        display: inline;
        margin-right: 20px;
    }
    span {
        display: block;
    }
    a {
        color: @medium-gray;
        img {
            opacity: .9;
        }
        &:hover {
            color: @dark-gray;
            img {
                opacity: 1;
            }
        }
    }
}

#marketing-horz {
    margin: 0;
    padding: 0;
    width: 100%;
    li {
        .border-box;
        list-style: none;
        text-align: center;
        float: left;
        max-width: 33.3%;
        padding: 0 10px;
        width: 33.33%;
    }
    li div {
        margin: 0 auto;
    }
}

.marketing-block {
    overflow: hidden;
    background-color: white;
    padding: 25px;
    margin: 25px auto 0 auto;
    border: 1px solid #BBBBBB;
    box-shadow: 0 1px 5px -3px #000000;

    p {
        margin-bottom: 20px;
    }
}

.img-right {

    .placeholder {
        float: right;
        margin-left: 50px;
        margin-top: -40px;
        max-width: 500px;
    }
}

.no-pad {
    padding: 0;
}

#tutorial {

    margin: 25px auto 25px auto;
    max-width: 984px;
    width: 90%;
    background-color: #EFF1F2;
    padding: 0;

    h3 {
        margin-top: 8px;
        font-size: 23px;
    }
    a {
        color: #667990;
    }

    nav ul {
        padding: 0;
        margin: 0;
    }
    nav li {
        margin: 2px 0 2px 0;
    }
    nav img {
        box-shadow: 0 0 5px #aaa;
        border: solid 1px #E3E5E6;
    }

    #sidebar {
        width: 225px;
        float: left;
        margin-left: -100%;
        padding: 25px 0 25px 25px;
        font-size: 15px;
        color: #667990;

        a.external {
            background-image: url('../../img/mkt/arrows/external_sidebar.gif');
            background-position: right 7px;
            background-repeat: no-repeat;
            padding-right: 12px;
        }
    }
    #content {
        float: left;
        width: 100%;
    }
    #mdn-content {
        margin-left: 275px;
        background-color: #fff;
        padding: 25px;
        border-left: solid 1px #E3E5E6;
    }
    #mdn-toc {
        margin: 0;
        padding: 0 0 0 20px;
        li span {
            display: none;
        }
        ol, ol ol {
            padding: 0;
            margin: 0;
        }
    }
}

@media (max-width: @10col) {
    #page {
        margin-top: 0;
    }
    .home {
        #site-header {
            &:after {
                height: 8px;
                top: -28px;
            }
            a:first-child {
                margin: 0;
            }
            nav {
                clear: both;
                padding: 0;
                text-align: left;
                z-index: 1;
            }
        }
    }
    h2 {
        font-size: 22px;
    }
    #landing-page #marketing-horz {
        li {
            float: left;
            font-size: 110%;
        }
    }
    #top-marketing {
        text-align: center;
        div {
            float: none;
            margin-top: 20px;
            width: 90%;
        }
        .placeholder {
            float: none;
            margin: 50px auto 0;
            max-height: 150px;
        }
    }
}

@media (max-width: @4col) {
    .home {
        #site-header {
            margin-bottom: 0;
            nav {
                clear: both;
                padding: 0;
                z-index: 1;
            }
        }
    }
    #site-header nav a {
        text-transform: none;
        + a {
            margin-left: 10px;
        }
    }
    #landing-page #marketing-horz {
        li {
            float: none;
            text-align: center;
            font-size: 120%;
            max-width: 100%;
            width: 100%;
        }
    }
    .call-to-action {
        div {
            margin: 0 auto;
            width: 100%;
        }
        .placeholder {
            margin-top: 40px;
            max-height: 130px;
        }
    }
}

@media (max-width: 800px) {
   #site-header {
        &:after {
            height: 8px;
            top: -28px;
        }
        a:first-child {
            margin: 0;
        }
        nav {
            clear: both;
            padding: 0;
            text-align: left;
            z-index: 1;
        }
    }
    #tutorial {
        nav img {
            display: none;
        }
        #content {
            width: 100%;
        }
        #mdn-content, #sidebar {
            margin-left: 0;
        }
    }
}


update

update

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/treejames/woku.git/'


Improve styling of card footer

Improve styling of card footer

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


Change line-height in base.less, who knows why it was set to an absolute value


refactor(styles): CSS style fix

refactor(styles): CSS style fix

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/hjiang/1byte.io.git/'


Fix spinner container position with scroller shrink

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-pjax.git/'


fix(redefine): ajustar layout

fix(redefine): ajustar layout

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/wesleifreitas/px-project-a1.git/'


学习中心头部

学习中心头部

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


更新自适应视频布局

更新自适应视频布局

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


added the user profile css

added the user profile css

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/'


.circle can now accept 0 as @size

.circle can now accept 0 as @size

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


add stylesheet

add stylesheet

@import 'elements.less';

@black: #0a0a0a;
@grayDarker:  #222;
@grayDark:    #333;
@gray:        #555;
@grayLight:   #999;
@grayLighter: #eee;
@white:       #fff;

@blueTheme: #1aa1e2;
@redTheme: #c52120;

@theme: @blueTheme;
//@colorTheme: lighten(saturate(@black, saturation(@theme)),20%);
//@colorTheme: lighter(@black,10%);
@colorTheme: @white;

@orange: #f89406;
@white: #fff;

@baseFontSize: 13px;

@footerHeight: 200px;
@stateWidth: 250px;

.user-select(@foo) {
    -webkit-touch-callout: @foo;
    -webkit-user-select: @foo;
    -khtml-user-select: @foo;
    -moz-user-select: @foo;
    -ms-user-select: @foo;
    user-select: @foo;
}

* {
    margin: 0;
    padding: 0;
    font-size: @baseFontSize;
    //.user-select(none);
}

body {
    font-family: 'Ubuntu';
    overflow: hidden;
}

button {
    cursor: pointer;
    background-color: @theme;
    border: none;
    padding: 5px;
    color: @colorTheme;
}

.no {
    text-decoration:line-through;
}

.red {
    color:red;
}

.blue {
    color:blue;
}

.green {
    color: green;
}

.disable {
    background-color: lighten(@grayLight,5%);
}

.tags {
    position: absolute;
    margin-top: -30px;
    right: 0;
    .head {
        padding: 3px 7px;
        margin: 3px;
        background-color: lighten(@theme,25%);
        color: @black;
    }
}

body>header {
    cursor: default;
    color: @white;
    background-color: @black;
    border-bottom: 2px solid @theme;
    height: 50px;
    .window-control {
        h1 {
            display: inline-block;
            font-size: @baseFontSize*1.2;
            span {
                font-size: @baseFontSize;
                font-weight: normal;
            }
        }
        .controls {
            float: right;
            ul {
                list-style: none;
                li {
                    display: inline-block;
                }
            }
        }
    }
    .repository-info {
        button.settings {
            float: right;
        }
    }
    button {
        color: @white;
        background-color: transparent;
        border: none;
        font-size: @baseFontSize*1.3;
    }
}

.point {
    width: 4px;
    height: 4px;
    background-color: red;
    margin: 10px 5px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}

.content {
    #tree {
        position: fixed;
        overflow-y: scroll;
        top: 52px;
        left: 0px;
        right: @stateWidth;
        ul {
            list-style: none;
            li.commit {
                cursor: pointer;
                clear: left;
                .node {
                    display: inline-block;
                    width: 50px;
                }
                .info {
                    display: inline-block;
                    // photo
                    >div:nth-child(1) {
                        padding: 5px;
                        display: inline-block;
                        vertical-align: top;
                        img {
                            width:40px;
                            height:40px;
                        }
                    }
                    // details
                    >div:nth-child(2) {
                        padding: 2px 0 4px 3px;
                        display: inline-block;
                        vertical-align: top;
                        max-width: 500px;
                        span {
                            &:nth-child(1) {
                                font-weight: bold;
                            }
                            &:nth-child(2) {
                                //color: lighten(@colorTheme, 10%);
                                font-size: @baseFontSize*0.9;
                                padding-left: 5px;
                            }
                        }
                    }
                }
                &:hover {
                    background-color: @grayLighter;
                }
                &.active {
                    background-color: @theme;
                    color: @colorTheme;
                }
            }
        }
    }

    #state {
        padding-bottom: 20px;
        margin-top: 7px;
        position: fixed;
        width: @stateWidth;
        top: 50px;
        right: 0px;
        overflow-y: scroll;
        h2 {
            margin-top: 10px;
            margin-left: 10px;
        }
        ul {
            margin-left: 10px;
            list-style: none;
            margin-bottom: 10px;
            li {
                width: 500px;
                margin-left: -10px;
                padding-left: 10px;
                cursor: pointer;
                &:hover {
                    background-color: @grayLighter;
                    &:after
                    {
                        color: @grayLight;
                        content: " " attr(data-hover);
                    }
                }
                &.active {
                    background-color: @theme;
                    color: @colorTheme;
                    b {
                        color: @colorTheme;
                    }
                    &:after
                    {
                        color: darken(@theme,15%);
                        content: " " attr(data-action);
                    }
                }
                b {
                    float: left;
                    width: 10px;
                    color: @theme;
                }
            }
        }
        p {
            margin: 15px;
        }
        button {
            margin-left: 10px;
        }
    }

    #details {
        .gradient();
        .drop-shadow(0, -2px, 4px, 0.2);
        position: fixed;
        bottom: 0px;
        width: 100%;
        overflow: auto;
        >ul {
            list-style: none;
            margin-left: 10px;
            li {
                display: inline-block;
                cursor: pointer;
                padding: 1px 5px;
                color: @grayLight;
                &:hover {
                    color: darken(@theme,10%);
                }
                &.active {
                    color: @black;
                    &:hover {
                        color: darken(@theme,10%);
                    }
                }
            }
        }
        @redDiff: #ffd8d8;
        @greenDiff: #d4ffab;
        @orangeDiff: #ce5c00;
        @blueDiff: #3465a4;

        /*@redDiff: #e21a1a;
        @greenDiff: #ace21a;
        @orangeDiff: #e2ba1a;
        @blueDiff: #1a6ae2;*/

        .diff-details {
            span {
                display: block;
                padding-left: 10px;
                &.green {
                    background-color: @greenDiff;
                    color: darken(@greenDiff,55%);
                }
                &.red {
                    background-color: @redDiff;
                    color: darken(@redDiff,50%);
                }
                &.orange {
                    background-color: @orangeDiff;
                    color: @grayLighter;
                }
                &.blue {
                    background-color: @blueDiff;
                    color: @grayLighter;
                }
            }
        }
    }
}

.commit-details {
    margin-left: 20px;
    list-style: none;
    div {
        display: inline-block;
    }
    li>div {
        &:nth-child(1) {
            width: 350px;
        }
        &:nth-child(2) {
            width: 200px;
        }
    }
    .deletions {
        background-color: red;
    }

    .insertions {
        background-color: green;
    }
}

.small {
    font-size: @baseFontSize*0.8;
    color: lighten(@black,5%);
    padding-left: 5px;
}

#boxes{
    .modalbox {
        position: fixed;
        display: none;
        z-index: 9999;
        padding: 20px;
        background-color: @white;
        width: 375px;
        height: 253px;
        h2 {
            font-size: 18px;
            font-weight: normal;
            margin-bottom: 10px;
            display: inline-block;
        }
        footer {
            text-align:right;
            button {
                margin: 10px;
            }
        }
        .close {
            float: right;
            margin: -10px -10px 0 0;
            text-decoration: none;
        }
    }
    #commitbox {
        b {
            display: block;
            margin: 5px 5px 10px 5px;
        }
        textarea {
            display: block;
            width: 99%;
            height: 130px;
            resize:none;
            .user-select(text);
        }
    }
    #pullbox, #pushbox {
        span {
            margin: 10px;
            display: block;
            label {
                display: inline-block;
                width: 120px;
            }
            .small {
                padding-right: 10px;
            }
        }
        .result {
            border: 1px solid @black;
            height: 100px;
            overflow: auto;
        }
    }
    #newbranchbox {
        height:113px;
        span {
            width: 110px;
        }
        input {
            width: 260px;
        }
        .result {
            padding: 5px;
            color: @gray;
        }
    }
    #profilebox {
        height:315px;
        overflow: auto;
    }
    #configbox {
        height:230px;
        section, footer {
            margin-top: 10px;
            h3 {
                padding-bottom: 10px;
            }
            p {
                padding: 2px 0;
            }
        }
    }
    #mask {
        position: absolute;
        z-index: 9000;
        background-color: rgba(0,0,0,0.8);
        display: none;
    }
}

.small {
    font-size: 12px;
}

.vmenu {
    border:1px solid #aaa;
    position:absolute;
    background:@white;
    display:none;
    font-size:0.75em;
    .first_li {
        span {
            width:150px;
            display:block;
            padding:5px 10px;
            cursor:pointer
        }
        &:hover {
            background-color:lighten(@theme,25%);
            cursor:pointer;
        }
    }
    .sep_li{
        border-top: 1px ridge #aaa;
        margin:5px 0
    }
    .fill_title {
        font-size:11px;
        font-weight:bold;
        height:15px;
        overflow:hidden;word-wrap:break-word;
    }
}

@media (max-height: 1024px) {
    #state {
        bottom: @footerHeight+130px;
    }
    #tree {
        bottom: @footerHeight+130px;
    }
    #details {
        height: @footerHeight+130px;
    }
}
@media (max-height: 768px) {
    #state {
        bottom: @footerHeight+50px;
    }
    #tree {
        bottom: @footerHeight+50px;
    }
    #details {
        height: @footerHeight+50px;
    }
}
@media (max-height: 600px) {
    #state {
        bottom: @footerHeight;
    }
    #tree {
        bottom: @footerHeight;
    }
    #details {
        height: @footerHeight;
    }
}

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


Improved organization of brackets.less. Made the picker rule specific to the project panel.

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


doc: Increase max-width

doc: Increase max-width

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


add retina mixin

add retina mixin

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


Pull new dist from gh-pages

Pull new dist from gh-pages

// config
@debug: true;

// declare breakpoints
@usn-x-small         : 200px;
@usn-small           : 400px;
@usn-small-medium    : 600px;
@usn-medium          : 800px;
@usn-large-medium    : 1000px;
@usn-large           : 1200px;
@usn-x-large         : 1400px;

// create list to pass media query data
// if a breakpoint name changes, remember to
// update it in the list below as well
@breakpoints: "usn-x-small @{usn-x-small}",
              "usn-small @{usn-small}",
              "usn-small-medium @{usn-small-medium}",
              "usn-medium @{usn-small-medium}",
              "usn-large-medium @{usn-large-medium}",
              "usn-large @{usn-large}",
              "usn-x-large @{usn-x-large}";

// you need to explicity tell LESS how many
// breakpoints you have
@number-of-breakpoints: 7;

// build each media query for js ingestion
.loopingClass(@number-of-breakpoints);
.loopingClass(@index) when (@index > 0) {
    .loopingClass(@index - 1);
    @breakpoint-info: extract(@breakpoints, @index);
    @breakpoint-size: ~`@{breakpoint-info}.split(' ')[1].replace('"','')`;
    @media screen and (min-width: @breakpoint-size) {
        head { font-family: @breakpoint-info; }
        body:after { content: @breakpoint-info; }
    }
}

// store hash of all breakpoints
head title { font-family: ~"@{breakpoints}"; }

// debug styles to see breakpoint info
body:after {
  display: none;
  .debug-styles(@debug);
}

.debug-styles(@d) when (@d) {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #000;
  background-color: rgba(0,0,0,0.8);
  text-align: center;
  color: #FFF;
  padding: 10px;
  z-index: 1000;
  font-size: 12px;
  font-family: sans-serif;
}

// hide elements for conditional loading
// only used for responsive comments plugin
*[data-usn-if] { display: none; }

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


Fixed width card to percentage width.

Fixed width card to percentage width.

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/JustinDFuller/JustinDFuller.github.io.git/'


240px looks better

240px looks better

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


Update static/vendors/bootstrap/less/mixins/clearfix.less

Signed-off-by: Bernard Ojengwa <fccb4cc00c1ba7e51bf5c2b5f77130b9fe8d917e@gmail.com>

// Clearfix
//
// For modern browsers
// 1. The space content is one way to avoid an Opera bug when the
//    contenteditable attribute is included anywhere else in the document.
//    Otherwise it causes space to appear at the top and bottom of elements
//    that are clearfixed.
// 2. The use of `table` rather than `block` is only necessary if using
//    `:before` to contain the top-margins of child elements.
//
// Source: http://nicolasgallagher.com/micro-clearfix-hack/

.clearfix() {
  &:before,
  &:after {
    content: " "; // 1
    display: table; // 2
  }
  &:after {
    clear: both;
  }
}

error: pathspec 'static/vendors/bootstrap/less/mixins/clearfix.less' did not match any file(s) known to git


:lipstick:

:lipstick:

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/vanguard-ide/app.git/'


Missed removing last occurance of outline on checkbox

.checkbox {

	&.highlight {

		// padding: 4px;

		& + .checkbox.highlight {
			margin-top: -5px;
		}

		& label.checkbox-custom {
			padding: 4px 4px 4px 24px;
			//margin-left: -8px;
		}

		&.checked label.checkbox-custom {
			background: #e9e9e9;
			border-radius: @baseBorderRadius;
		}
	}

	/* for keyboard tabbing */
	input[type="checkbox"]:focus + .checkbox-label,
	input[type="checkbox"]:hover + .checkbox-label,
	.checkbox-label:hover
	 {
		color: @grayLight;
	}

	input[type="checkbox"]:disabled:focus + .checkbox-label,
	input[type="checkbox"]:disabled:hover + .checkbox-label,
	&.disabled label:hover
	 {
		color: inherit;
	}

}

.form-horizontal .checkbox-inline {
	padding-top: 0;
}

.input-group-addon.checkbox-custom.checkbox-inline:before {
	left: 11px;
	top: 9px;
}

.checkbox-custom {
	position: relative;

	&:before {
		.iconBaseStyles("Glyphicons Halflings");
		border: 1px solid #adadad;
		border-radius: @baseBorderRadius;
		color: #fff;
		content: " ";
		font-size: 9px;
		height: 14px;
		left: 0px;
		padding: 1px 0 0 1px;
		position: absolute;
		top: 3px;
		width: 14px;
	}

	/* for keyboard tabbing */
	&:active:before, &:focus:before {
		color: @text-color;
		color: rgb(91, 157, 217);
		cursor: pointer;
		box-shadow: inset 0px 0px 2px 1px rgb(91, 157, 217), 0px 0px 5px 0px rgb(91, 157, 217);
	}

	&.highlight {
		&:before {
			left: 4px;
			top: 6px;
		}
	}

	&.checked {
		&:before {
			background: #39b3d7;
			border-color: #39b3d7;
			content: "\e013";
		}
	}

	&.disabled {
		cursor: not-allowed;

		&:before
		{
			cursor: not-allowed;
			opacity: .5;
		}
	}

	&.checkbox-inline {
		&:before {
			left: 0;
			top: 3px;
		}

		&.highlight {
			padding: 4px 4px 4px 24px;
			left: -4px;

			&:before {
				left: 4px;
				top: 7px;
			}

			&.checked {
				background: #e9e9e9;
				border-radius: @baseBorderRadius;
			}
		}
	}

	/* for keyboard tabbing */
	input[type="checkbox"]:focus + .checkbox-label {
		color: @grayLight;
	}

}

label.checkbox-custom.checkbox-inline {
	padding-left: 20px;
}

.checkbox {

	&.highlight {

		// padding: 4px;

		& + .checkbox.highlight {
			margin-top: -5px;
		}

		& label.checkbox-custom {
			padding: 4px 4px 4px 24px;
			//margin-left: -8px;
		}

		&.checked label.checkbox-custom {
			background: #e9e9e9;
			border-radius: @baseBorderRadius;
		}
	}

	/* for keyboard tabbing */
	input[type="checkbox"]:focus + .checkbox-label,
	input[type="checkbox"]:hover + .checkbox-label,
	.checkbox-label:hover
	 {
		color: @grayLight;
	}

	input[type="checkbox"]:disabled:focus + .checkbox-label,
	input[type="checkbox"]:disabled:hover + .checkbox-label,
	&.disabled label:hover
	 {
		color: inherit;
	}

}

.form-horizontal .checkbox-inline {
	padding-top: 0;
}

.input-group-addon.checkbox-custom.checkbox-inline:before {
	left: 11px;
	top: 9px;
}

.checkbox-custom {
	position: relative;

	&:before {
		.iconBaseStyles("Glyphicons Halflings");
		border: 1px solid #adadad;
		border-radius: @baseBorderRadius;
		color: #fff;
		content: " ";
		font-size: 9px;
		height: 14px;
		left: 0px;
		padding: 1px 0 0 1px;
		position: absolute;
		top: 3px;
		width: 14px;
	}

	/* for keyboard tabbing */
	&:active:before, &:focus:before {
		color: @text-color;
		color: rgb(91, 157, 217);
		cursor: pointer;
		outline-color: rgb(91, 157, 217);
		outline-offset: -2px;
		outline-style: auto;
		outline-width: 5px;
	}

	&.highlight {
		&:before {
			left: 4px;
			top: 6px;
		}
	}

	&.checked {
		&:before {
			background: #39b3d7;
			border-color: #39b3d7;
			content: "\e013";
		}
	}

	&.disabled {
		cursor: not-allowed;

		&:before
		{
			cursor: not-allowed;
			opacity: .5;
		}
	}

	&.checkbox-inline {
		&:before {
			left: 0;
			top: 3px;
		}

		&.highlight {
			padding: 4px 4px 4px 24px;
			left: -4px;

			&:before {
				left: 4px;
				top: 7px;
			}

			&.checked {
				background: #e9e9e9;
				border-radius: @baseBorderRadius;
			}
		}
	}

	/* for keyboard tabbing */
	input[type="checkbox"]:focus + .checkbox-label {
		color: @grayLight;
	}

}

label.checkbox-custom.checkbox-inline {
	padding-left: 20px;
}


fix(example): ajustar style

fix(example): ajustar style


LESS stylesheet added

LESS stylesheet added

fatal: unable to access 'https://github.com/kurai021/TMGC-JS.git/': The requested URL returned error: 403