Updating animation css

Updating animation css

/*
 * # Semantic - Sidebar
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Copyright 2014 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
            Theme
*******************************/

@type    : 'module';
@element : 'sidebar';

@import '../../theme.config';

/*******************************
            Sidebar
*******************************/

/* Sidebar Menu */
.ui.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  visibility: hidden;
  backface-visibility: hidden;
  height: 100% !important;
  border-radius: 0em !important;
  margin: 0 !important;
  transition: none;
  will-change: transform;
  overflow-y: auto !important;
  backface-visibility: hidden;

  background: @sidebarBackground;
  width: @sidebarWidth !important;
}

/*--------------
   Direction
---------------*/

.ui.top.sidebar,
.ui.bottom.sidebar {
  width: 100% !important;
  height: auto !important;
  overflow-y: visible !important;
}

.ui.top.sidebar {
  top: 0px !important;
  bottom: auto !important;
}
.ui.right.sidebar {
  right: 0px !important;
  left: auto !important;
}
.ui.bottom.sidebar {
  top: auto !important;
  bottom: 0px !important;
}

/*--------------
     Body
---------------*/

/* Sets 3D Perspective */
.pushable {
  background: @canvasBackground !important;
  position: relative;
  height: 100%;
  overflow-x: hidden;
}

/*--------------
     Fixed
---------------*/

.pushable > .fixed {
  position: fixed;
  transition: transform @duration @easing;
  z-index: @fixedLayer;
}

/*--------------
     Pusher
---------------*/

.pushable > .pusher {
  background: @canvasBackground;
  height: 100%;
  z-index: @middleLayer;
  transition: transform @duration @easing;
}

/*--------------
     Page
---------------*/

.pushable > .pusher > .page {
  position: relative;
  min-height: 100%;
  background: @pageBackground;
}

/*--------------
     Dimmer
---------------*/

.pushable > .pusher > .page:after {
  position: absolute;
  top: 0px;
  right: 0px;
  content: '';
  background-color: @dimmerColor;
  width: 0px;
  height: 0px;
  overflow: hidden;
  opacity: 0;
  z-index: @dimmerLayer;
  transition: opacity @duration;
  will-change: opacity;
}

/*--------------
    Coupling
---------------*/

.ui.sidebar.menu .item {
  border-radius: 0em !important;
}

/*******************************
            States
*******************************/

/*--------------
     Pushed
---------------*/

.pushable.pushed {
  overflow-x: hidden;
}

.pushable.pushed > .fixed,
.pushable.pushed > .pusher {
  backface-visibility: hidden;
  -webkit-overflow-scrolling: touch;
}

.pushable.active > .visible.sidebar {
  -webkit-overflow-scrolling: touch;
  backface-visibility: hidden;
  z-index: @topLayer;
}

/*--------------
     Dimmed
---------------*/

.pushable > .pusher > .page.dimmed:after {
  width: 100% !important;
  height: 100% !important;
  opacity: 1 !important;
}

/*--------------
    Animation
---------------*/

.pushable.inward > .pusher,
.pushable.outward > .pusher {
  backface-visibility: hidden;
}
.pushable.inward > .visible.sidebar,
.pushable.outward > .visible.sidebar {
  backface-visibility: hidden;
}

/*--------------
     Visible
---------------*/

.pushable > .visible.ui.sidebar {
  visibility: visible;
}

/*******************************
          Variations
*******************************/

/*--------------
    Styled
---------------*/

.ui.styled.sidebar {
  background-color: #FFFFFF;
  padding: 1em 1.25em;
  border-right: 1px solid #DDDDDD;
}

/*******************************
          Animations
*******************************/

/*--------------
    Overlay
---------------*/

/* Set-up */
.pushable > .visible.ui.overlay.sidebar {
  z-index: @topLayer;
}
/* Animation */
.pushable.inward > .visible.ui.overlay.sidebar,
.pushable.outward > .visible.ui.overlay.sidebar {
  transition: transform @duration @easing;
}

/*--- Left ---*/

/* Set-up */
.pushable > .ui.left.overlay.sidebar {
  transform: translate3d(-100%, 0, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.left.overlay.sidebar {
  transform: translate3d(0%, 0, 0);
}

/*--- Right ---*/

/* Set-up */
.pushable > .ui.right.overlay.sidebar {
  transform: translate3d(100%, 0, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.right.overlay.sidebar {
  transform: translate3d(0%, 0, 0);
}

/*--- Top ---*/

/* Set-up */
.pushable > .ui.top.overlay.sidebar {
  transform: translate3d(0%, -100%, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.top.overlay.sidebar {
  transform: translate3d(0%, 0%, 0);
}

/*--- Bottom ---*/

/* Set-up */
.pushable > .ui.bottom.overlay.sidebar {
  transform: translate3d(0%, 100%, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.bottom.overlay.sidebar {
  transform: translate3d(0%, 0%, 0);
}

/*--------------
      Push
---------------*/

/* Set-Up */
.pushable > .ui.push.sidebar.inward ~ .pusher,
.pushable > .ui.push.sidebar.outward ~ .pusher {
  transform: translate3d(0px, 0, 0);
}

/*--- Left ---*/

/* Set-Up */
.pushable > .ui.left.push.sidebar {
  transform: translate3d(-100%, 0, 0);
  transition: transform @duration @easing;
}

/* Pushed */
.pushable.pushed > .visible.ui.left.push.sidebar {
  transform: translate3d(0%, 0, 0);
}
.pushable.pushed > .visible.ui.left.push.sidebar ~ .fixed,
.pushable.pushed > .visible.ui.left.push.sidebar ~ .pusher {
  transform: translate3d(@sidebarWidth, 0, 0);
}

/*--- Right ---*/

/* Set-Up */
.pushable > .ui.right.push.sidebar {
  transform: translate3d(100%, 0, 0);
  transition: transform @duration @easing;
}

/* Pushed */
.pushable.pushed > .visible.ui.right.push.sidebar {
  transform: translate3d(0%, 0, 0);
}
.pushable.pushed > .visible.ui.right.push.sidebar ~ .fixed,
.pushable.pushed > .visible.ui.right.push.sidebar ~ .pusher {
  transform: translate3d(-@sidebarWidth, 0, 0);
}

/*--- Top ---*/

/*
 * # Semantic - Sidebar
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Copyright 2014 Contributors
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */

/*******************************
            Theme
*******************************/

@type    : 'module';
@element : 'sidebar';

@import '../../theme.config';

/*******************************
            Sidebar
*******************************/

/* Sidebar Menu */
.ui.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  visibility: hidden;
  backface-visibility: hidden;
  height: 100% !important;
  border-radius: 0em !important;
  margin: 0 !important;
  transition: none;
  will-change: transform;
  overflow-y: auto !important;
  backface-visibility: hidden;

  background: @sidebarBackground;
  width: @sidebarWidth !important;
}

/*--------------
   Direction
---------------*/

.ui.top.sidebar,
.ui.bottom.sidebar {
  width: 100% !important;
  height: auto !important;
  overflow-y: visible !important;
}

.ui.top.sidebar {
  top: 0px !important;
  bottom: auto !important;
}
.ui.right.sidebar {
  right: 0px !important;
  left: auto !important;
}
.ui.bottom.sidebar {
  top: auto !important;
  bottom: 0px !important;
}

/*--------------
     Body
---------------*/

/* Sets 3D Perspective */
.pushable {
  background: @canvasBackground !important;
  position: relative;
  height: 100%;
  overflow-x: hidden;
}

/*--------------
     Fixed
---------------*/

.pushable > .fixed {
  position: fixed;
  transition: transform @duration @easing;
  z-index: @fixedLayer;
}

/*--------------
     Pusher
---------------*/

.pushable > .pusher {
  background: @canvasBackground;
  height: 100%;
  z-index: @middleLayer;
  transition: transform @duration @easing;
}

/*--------------
     Page
---------------*/

.pushable > .pusher > .page {
  position: relative;
  min-height: 100%;
  background: @pageBackground;
}

/*--------------
     Dimmer
---------------*/

.pushable > .pusher > .page:after {
  position: absolute;
  top: 0px;
  right: 0px;
  content: '';
  background-color: @dimmerColor;
  width: 0px;
  height: 0px;
  overflow: hidden;
  opacity: 0;
  z-index: @dimmerLayer;
  transition: opacity @duration;
  will-change: opacity;
}

/*--------------
    Coupling
---------------*/

.ui.sidebar.menu .item {
  border-radius: 0em !important;
}

/*******************************
            States
*******************************/

/*--------------
     Pushed
---------------*/

.pushable.pushed {
  overflow-x: hidden;
}

.pushable.pushed > .fixed,
.pushable.pushed > .pusher {
  backface-visibility: hidden;
  -webkit-overflow-scrolling: touch;
}

.pushable.active > .visible.sidebar {
  -webkit-overflow-scrolling: touch;
  backface-visibility: hidden;
  z-index: @topLayer;
}

/*--------------
     Dimmed
---------------*/

.pushable > .pusher > .page.dimmed:after {
  width: 100% !important;
  height: 100% !important;
  opacity: 1 !important;
}

/*--------------
    Animation
---------------*/

.pushable.inward > .pusher,
.pushable.outward > .pusher {
  backface-visibility: hidden;
}
.pushable.inward > .visible.sidebar,
.pushable.outward > .visible.sidebar {
  backface-visibility: hidden;
}

/*--------------
     Visible
---------------*/

.pushable > .visible.ui.sidebar {
  visibility: visible;
}

/*******************************
          Variations
*******************************/

/*--------------
    Styled
---------------*/

.ui.styled.sidebar {
  background-color: #FFFFFF;
  padding: 1em 1.25em;
  border-right: 1px solid #DDDDDD;
}

/*******************************
          Animations
*******************************/

/*--------------
    Overlay
---------------*/

/* Set-up */
.pushable > .visible.ui.overlay.sidebar {
  z-index: @topLayer;
}
/* Animation */
.pushable.inward > .visible.ui.overlay.sidebar,
.pushable.outward > .visible.ui.overlay.sidebar {
  transition: transform @duration @easing;
}

/*--- Left ---*/

/* Set-up */
.pushable > .ui.left.overlay.sidebar {
  transform: translate3d(-100%, 0, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.left.overlay.sidebar {
  transform: translate3d(0%, 0, 0);
}

/*--- Right ---*/

/* Set-up */
.pushable > .ui.right.overlay.sidebar {
  transform: translate3d(100%, 0, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.right.overlay.sidebar {
  transform: translate3d(0%, 0, 0);
}

/*--- Top ---*/

/* Set-up */
.pushable > .ui.top.overlay.sidebar {
  transform: translate3d(0%, -100%, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.top.overlay.sidebar {
  transform: translate3d(0%, 0%, 0);
}

/*--- Bottom ---*/

/* Set-up */
.pushable > .ui.bottom.overlay.sidebar {
  transform: translate3d(0%, 100%, 0);
}
/* Pushed */
.pushable.pushed .ui.visible.bottom.overlay.sidebar {
  transform: translate3d(0%, 0%, 0);
}

/*--------------
      Push
---------------*/

/* Set-Up */
.pushable > .ui.push.sidebar.inward ~ .pusher,
.pushable > .ui.push.sidebar.outward ~ .pusher {
  transform: translate3d(0px, 0, 0);
}
.pushable > .push.ui.sidebar {
  transform: translate3d(-100%, 0, 0);
  transition: transform @duration @easing;
}

/* Pushed */
.pushable.pushed > .visible.ui.push.sidebar {
  transform: translate3d(0%, 0, 0);
}
.pushable.pushed > .visible.ui.left.push.sidebar ~ .fixed,
.pushable.pushed > .visible.ui.left.push.sidebar ~ .pusher {
  transform: translate3d(@sidebarWidth, 0, 0);
}
.pushable.pushed > .visible.ui.right.push.sidebar ~ .fixed,
.pushable.pushed > .visible.ui.right.push.sidebar ~ .pusher {
  transform: translate3d(-@sidebarWidth, 0, 0);
}

/*--------------
    Uncover
---------------*/

/* Set-up */
.pushable.uncover > .fixed,
.pushable.uncover > .pusher {
  transform: translate3d(0px, 0px, 0px);
}
.pushable.uncover > .pusher {
  z-index: @bottomLayer;
}
.pushable.uncover > .visible.ui.sidebar {
  transition: none;
}

/* Pushed */

/*--- Left ---*/
.pushable.left.uncover.pushed > .fixed,
.pushable.left.uncover.pushed > .pusher {
  transform: translate3d(@sidebarWidth, 0, 0);
}

/*--- Right ---*/
.pushable.right.uncover.pushed > .fixed,
.pushable.right.uncover.pushed > .pusher {
  transform: translate3d(-@sidebarWidth, 0, 0);
}

/*--------------
   Slide Along
---------------*/

/* Set-up */
.pushable.slide.along > .fixed,
.pushable.slide.along > .pusher {
  transform: translate3d(0px, 0, 0);
}
.pushable.slide.along > .pusher {
  z-index: @bottomLayer;
}
.pushable.slide.along > .visible.ui.sidebar {
  transform: translate3d(-50%, 0, 0);
}

/* Pushed */
.pushable.slide.along.pushed > .fixed,
.pushable.slide.along.pushed > .pusher {
  transform: translate3d(@sidebarWidth, 0, 0);
}
.pushable.slide.along.pushed > .visible.ui.sidebar {
  transform: translate3d(0%, 0, 0);
}

.pushable.slide.along.inward > .visible.ui.sidebar,
.pushable.slide.along.outward > .visible.ui.sidebar {
  transition: transform @duration @easing;
}

/*--------------
   Slide Out
---------------*/

/* Set-up */
.pushable.slide.out > .fixed,
.pushable.slide.out > .pusher {
  transform: translate3d(0px, 0, 0);
}
.pushable.slide.out > .visible.ui.sidebar {
  transform: translate3d(50%, 0, 0);
}

/* Pushed */
.pushable.slide.out.pushed > .fixed,
.pushable.slide.out.pushed > .pusher {
  transform: translate3d(@sidebarWidth, 0, 0);
}
.pushable.slide.out.pushed .visible.ui.sidebar {
  transform: translate3d(0%, 0, 0);
}

.pushable.slide.out.inward > .visible.ui.sidebar,
.pushable.slide.out.outward > .visible.ui.sidebar {
  transition: transform @duration @easing;
}

/*--------------
   Scale Down
---------------*/

/* Set-up */
.pushable.scale.down > .fixed {
  transform: translate3d(0px, 0, 0);
}
.pushable.scale.down > .pusher {
  z-index: @bottomLayer;
  transform-origin: 75% 50%;
  overflow: hidden;
}
.pushable.scale.down > .visible.ui.sidebar {
  transform: translate3d(-100%, 0, 0);
  z-index: @topLayer;
}

/* Pushed */
.pushable.scale.down.pushed > .pusher {
  transform: scale(0.75);
}
.pushable.scale.down.pushed > .visible.ui.sidebar {
  transform: translate3d(0, 0, 0);
}
.pushable.scale.down.pushed > .fixed {
  transform: translate3d(@sidebarWidth, 0, 0);
}

/* 3D transition cant have duration set until animation */
.pushable.scale.down.inward > .visible.ui.sidebar,
.pushable.scale.down.outward > .visible.ui.sidebar {
  transition: transform @duration @easing;
}

/*--------------
    Safe Mode
---------------*/

/* Set-Up */
.pushable.safe > .pusher {
  position: relative;
  transform: none !important;
  transition: none !important;
}
.pushable.safe > .pusher {
  transform: none !important;
  transition: none !important;
}

/* Pushed */
.pushable.safe.pushed  {
  margin-left: @sidebarWidth !important;
}
.pushable.safe.pushed > .visible.ui.sidebar {
  margin-left: -@sidebarWidth;
}
.pushable.safe.pushed > .fixed {
  margin-left: @sidebarWidth !important;
}
.pushable.safe.inward,
.pushable.safe.outward,
.pushable.safe.inward > .fixed,
.pushable.safe.outward > .fixed {
  transition: margin @duration @easing !important;
}


Components: added 'button'

Components: added 'button'

.button {
	display: inline-block;
	padding: 0.375em 1em;
	box-sizing: border-box;
	font: inherit;
	font-weight: normal;
	background-color: #1779ba;
	font-size: 100%;
	border-radius: 3px;
	border: none;
	cursor: pointer;
	text-decoration: none;
	box-shadow: 0 -2px 0 rgba(0,0,0,0.2) inset;

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

	&:hover,
	&:focus,
	&:active {
		background-color: lighten(#1779ba, 5%);
	}

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

.button--danger {
	background: #B93528;

	&:hover,
	&:focus,
	&:active {
		background-color: #CC3A2C;
	}
}

.button--success {
	background: #008036;

	&:hover,
	&:focus,
	&:active {
		background-color: #009a41;
	}
}

.button--small {
	font-size: 87.5%;
	padding-left: 1em;
	padding-right: 1em;
}

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


Improving overwrites

Improving overwrites

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


fix(accessibility): sk-pink-on-gray-light (#232)

sk-pink-on-gray-light is currently #d4006b which is not accessible on #E1E1E1. It's also not in the brand guidelines.
Updating to #BD0B67 which is accessible across both greys

fatal: unable to access 'https://github.com/seekinternational/seek-asia-style-guide.git/': The requested URL returned error: 403


Fix kpis-bar min-height

Fix kpis-bar min-height

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/xaun/impac-angular.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/VaskoDeGama/CRM_njs_mdb.git/'


Remove CSS hacks for fixing gradient drawing on retina screens.

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


Added widgets.less

Added widgets.less

/*
Copyright (C) 2012 Adriano Monteiro Marques

Author: Piotrek Wasilewski <wasilewski.piotrek@gmail.com>

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as
published by the Free Software Foundation, either version 3 of the
License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU Affero General Public License for more details.

You should have received a copy of the GNU Affero General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/

div.dashboard {
    ul.area-column {
        float: left;
        display: block;
        width: 31%;
        margin: 0 0 0 3%;
        padding: 0 0 100px 0;

        list-style-type: none;

        &#area-1-column-1 {
            margin: 0;
        }

        li.widget {
            margin: 0 0 20px 0;
            padding: 0;

            border: 1px solid #efefef;

            h3 {
                padding: 5px 10px;
                margin: 0;

                font-size: 14px;
            }

            div.widget-meta {
                float: right;
                margin-top: -25px;
                margin-right: 5px;

                a {
                    color: #999;
                }
            }

            div.widget-content {
                padding: 0 10px;
            }

            div.widget-head {
                background: #f6f6f6;

                &:hover {
                    background: #ac4747;
                    color: #fff;

                    div.widget-meta a {
                        color: #fff;
                    }
                }
            }
        }
    }
}

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


Center text in navbar with change to @baseLineHeight (18 -> 20px)

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


Delete font-awesome.less

Delete font-awesome.less

error: pathspec 'lesson' did not match any file(s) known to git
error: pathspec '4/font-awesome/less/font-awesome.less' did not match any file(s) known to git


fix @accent-color css

fix @accent-color css

fixes #35

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


Add CSS.

Add 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/Thinkful/ui.git/'


Style broadcast items

Style broadcast items

.broadcasts {
  &.unseen {
    position: relative;

    &:after {
      position: absolute;
      display: block;
      content: "";
      top: 8px;
      right: 26px;
      .square(8px);
      border-radius: 50%;
      background: @red;
      box-shadow: 0 0 0 3px #515C6F;
    }
  }

  .icon-globe {
    font-size: 18px;
    position: relative;
    top: 2px;
  }

  .dropdown-menu {
    // ideally we could use 90% but due to parent element
    // this doesnt work
    max-height: 500px;
    min-width: 240px;
    padding-top: 0;
    padding-bottom: 0;
    overflow: auto;

    > li {
      color: @gray-dark;
      padding: 5px 8px;
      border-bottom: 1px solid #e5e5e5;
      margin-bottom: 0;
      line-height: 1.3;

      a {
        color: @linkColor;

        &:hover {
          color: @linkColorHover;
          background: none;
        }
      }

      &.empty {
        text-align: center;
        color: #7a8188;
      }

      &.unseen {
        font-weight: bold;
      }

      &:last-child {
        border-bottom: 0;
        margin-bottom: 0;
      }

      .loading {
        margin: 0 auto;

        .loading-message {
          display: none;
        }
      }

      > a {
        display: inline;
        padding: 0;
        color: @linkColor;
      }
    }
  }
}

.broadcasts {
  &.unseen {
    position: relative;

    &:after {
      position: absolute;
      display: block;
      content: "";
      top: 8px;
      right: 26px;
      .square(8px);
      border-radius: 50%;
      background: @red;
      box-shadow: 0 0 0 3px #515C6F;
    }
  }

  .icon-globe {
    font-size: 18px;
    position: relative;
    top: 2px;
  }

  .dropdown-menu {
    // ideally we could use 90% but due to parent element
    // this doesnt work
    max-height: 300px;
    min-width: 200px;
    padding-top: 0;
    padding-bottom: 0;
    overflow: auto;

    > li {
      color: #7a8188;
      padding: 5px 8px;
      border-bottom: 1px solid #e5e5e5;
      margin-bottom: 5px;
      line-height: 1.4;

      &.empty {
        text-align: center;
      }

      &.unseen {
        font-weight: bold;
      }

      &:last-child {
        border-bottom: 0;
        margin-bottom: 0;
      }

      .loading {
        margin: 0 auto;

        .loading-message {
          display: none;
        }
      }

      > a {
        display: inline;
        padding: 0;
        color: @linkColor;
      }
    }
  }
}


category view fix

category view 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/cablelabs/dev-portal.git/'


be gone, border radius

be gone, border radius

/*
 * Copyright 2014 Netflix, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import "../presentation/less/imports/commonImports.less";

.rollup {
  h4 {
    text-transform: uppercase;
    font-weight: 600;
    background-color: @lightest_grey;
    margin: 0;
    padding: 10px 0;
    &.heading-sticky {
      box-shadow: 0 8px 6px -6px #999999;
    }
  }
}

.rollup-summary {
  background-color: @dark_blue_background;
}

.rollup-entry {
  border: 1px solid #c4c4c4;
  padding: 0;
  margin: 15px 0;
  &:last-child {
    background-color: #ffffff;
    padding-bottom: 5px;
  }

  &.disabled {
    opacity: 0.4;
    border: 1px dashed #aaaaaa;
    &:hover, &.active {
      opacity: .75;
    }
  }

  .glyphicon-th, .glyphicon-th-large, .icon-server-group {
    color: @healthy_green_icon;
  }

  &.unhealthy {
    border-style: dashed;
  }
}

.instance-list {
  clear: both;
  padding: 0 10px 0 31px;
}

@instance-width: 12px;
@instance-height: 18px;

.instances {
  border: none;
  line-height: 10px;
  border-radius: 2px;
  padding-bottom: 5px;
  a.instance {
    margin: 0;
    display: inline-block;
    width: @instance-width;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    height: @instance-height;
    background-color: @healthy_green;

    &.health-status-Up {
      background-color: @healthy_green;
    }
    &.health-status-Down {
      background-color: @unhealthy_red;
    }
    &.health-status-OutOfService {
      background-color: @mid_lighter_grey;
    }

    &.health-status-Unknown {
      background-color: @missing_health;
    }

    &.health-status-Starting {
      background-color: @missing_health;
      .pulsing(1.0);
    }

    &:hover, &.active, &.highlighted {
      height: @instance-height - 1;
      margin-top: 0;
      margin-bottom: 1px;
      border: 1px solid @dark_grey;
      box-shadow: 0 0 3px 1px #999999;
      z-index: 2;
    }

    &.active {
      &.health-status-Up {
        background-color: @healthy_green_border;
      }
      &.health-status-Down {
        background-color: @unhealthy_red_border;
      }
      &.health-status-OutOfService {
        background-color: @mid_grey;
        border-color: @dark_grey;
      }

      &.health-status-Unknown, &.health-status-Starting {
        background-color: @missing_health_border;
      }
    }
  }
}

.rollup-summary {
  font-size: 110%;
  margin: 0;
  display: table;
  width: 100%;

  .tooltip {
    text-transform: none;
  }
  button {
    padding: 0;
    display: inline-block;
    margin-right: 5px;
    line-height: 1;
    &.active, &:focus {
      outline: 0;
      box-shadow: none;
    }
    .icon {
      position: relative;
      font-size: 120%;
    }
    .icon-spinner {
      font-size: 20px;
    }

  }
}

.rollup-title-cell {
  color: @lightest_grey;
  &:active, &:hover, &:focus {
    text-decoration: none;
  }
  @media (min-width: 768px) and (max-width: 992px) {
    font-size: 85%;
  }
  h5 {
    line-height: 39px;
    height: 39px;
    margin: 0;
    font-size: 110%;
  }
  .account-tag {
    .small {
      color: #ffffff;
    }
    background-color: #777;
    padding: 0 15px;
    display: inline-block;
    margin-right: 10px;
    text-transform: uppercase;
    height: 39px;
    &.account-tag-prod {
      background-color: @unhealthy_red;
    }
  }
  .instance-health-counts {
    padding-right: 10px;
  }
}

running-tasks-tag {
  position: relative;
  top: 2px;
  right: 5px;
  .icon-spinner {
    color: @spinnaker-link-color;
  }
}

.menu-running-tasks {
  text-align: left;
  position: absolute;
  z-index: 3;
  top: 20px;
  right: -12px;
  background-color: #ffffff;
  margin-top: 12px;
  border: 1px solid #777777;
  padding: 5px 10px;
  border-radius: 3px;
  box-shadow: 0 0 2px 1px #eeeeee;
  text-transform: none;
  color: @text-color;
  font-weight: 400;
  font-size: 80%;
  width: 350px;

  &::before, &::after {
    width: 0;
    height: 0;
    content: ' ';
    right: 12px;
    position: absolute;
    border: 10px solid transparent;
    border-top-width: 0;
  }
  &::after {
    top: -10px;
    border-bottom-color: #ffffff;
  }
  &::before {
    top: -11px;
    border-bottom-color: @mid_grey;
  }
}

.menu-load-balancers {
  opacity: 1;
  text-align: left;
  position: absolute;
  z-index: 3;
  right: 0;
  background-color: #ffffff;
  margin-top: 8px;
  border: 1px solid #777777;
  padding: 0;
  border-radius: 3px;
  box-shadow: 0px 0px 5px 2px #dddddd;
  min-width: 150px;
  div {
    font-weight: 600;
    color: #eeeeee;
    background-color: @mid_grey;
  }
  div, a {
    text-transform: none;
    font-size: 82.5%;
    padding: 5px 10px;
    display: block;
  }
  a {
    border-bottom: 1px solid #d1d1d1;
    white-space: nowrap;
    &:last-child {
      border-bottom-width: 0;
    }
    &:hover, &:focus {
      background-color: #eeeeee;
      text-decoration: none;
    }
    &:focus {
      padding-left: 15px;
      padding-right: 5px;
    }
  }
  &::before, &::after {
    width: 0;
    height: 0;
    content: ' ';
    right: 15px;
    position: absolute;
    border: 8px solid transparent;
    border-top-width: 0;
    margin-left: -11px;
  }
  &::after {
    margin-left: -10px;
    border-width: 8px;
    top: -14px;
    border-bottom-color: @mid_grey;
  }
  &::before {
    top: -8px;
    border-bottom-color: @mid_grey;
  }
}

load-balancers-tag {
  .overflowing {
    position: relative;
  }
  .btn-load-balancer {
    margin-right: 10px;
  }

  .btn-multiple-load-balancers {
    text-align: right;
    margin-right: 15px;
    &:hover {
      text-decoration: none;
    }
    .icon {
      width: 30px;
    }
    .icon-elb {
      height: 0;
      width: 0;
      &::before {
        text-shadow: #2A6496 0 0 1px;
      }
    }
    .counter {
      color: #2A6496;
      background-color: #fff;
      box-shadow: 0 0 2px #2A6496;
      right: -28px;
      font-size: 90%;
      padding: 1px 4px;
      border-radius: 6px;
    }
    span {
      position: relative;
    }
  }
}

.rollup-details {
  background-color: #ffffff;
  padding: 0;
  border-top: 1px solid #c4c4c4;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;

  .clickable-row {
    background-color: #ffffff;
    border: 2px solid transparent;
    &.active {
      background-color: @active_pod_blue;
    }
    &:hover {
      border: 2px solid @glow-init;
    }
  }
  .permalinks {
    border-top: 1px solid @mid_light_grey;
    padding: 5px 10px 0;
    font-size: 80%;
  }
  .pod-subgroup {
    h6 {
      text-transform: uppercase;
      margin: 0;
      padding: 10px 10px 5px 10px;
      &.heading-sticky {
        background-color: #ffffff;
      }
    }
    border: 2px solid transparent;
    .rollup-pod-server-group {
      .server-group-title {
        background-color: #ffffff;
      }
      &.active {
        background-color: @active_pod_blue;
        .server-group-title {
          background-color: @active_pod_blue;
        }
      }
    }
    .table {
      margin-top: -5px;
      margin-bottom: 10px;
      font-size: 90%;
    }
  }
  h5, h6 {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 110%;
  }

  .badge-disabled {
    .pull-right();
    font-weight: 700;
    text-transform: uppercase;
    padding-left: 10px;
  }

  .rollup-details-section {
    border-right: 1px solid #c4c4c4;
    padding: 10px;
    &:last-child {
      border-right-width: 0;
    }
    .rollup-row {
      padding: 0;
    }
  }

  .rollup-row {
    padding: 10px;
    &:first-child {
      border-top-width: 0;
    }
  }

  .disabled {
    opacity: 1;
    .section-title, health-counts, load-balancers-tag, instances {
      opacity: 0.4;
    }
    .icon-server-group {
      color: @mid_grey;
    }
    &:hover {
      .section-title, health-counts, load-balancers-tag, instances {
        opacity: 0.7;
      }
    }
  }

  .load-balancer-server-group {
    .instances {
      padding: 0;
    }
  }

  &.instances-only {
    padding: 10px;
  }

  .build-title {
    font-size: 110%;
    padding: 10px 10px 8px 10px;
  }
}

instances {
  display: block;
}

.row {
  .rollup-summary {
    &:hover {
      box-shadow: none;
    }
  }
  .server-group-sequence {
    text-transform: uppercase;
    font-weight: 600;
  }
  .subgroup-title {
    background-color: #ffffff;
  }
  .server-group-title, .subgroup-title {
    padding: 5px 10px 2px;
    border-bottom-width: 0;
    &.clickable {
      &:hover, &.active {
        background-color: @lighter_grey;
      }
    }
  }
  .heading-sticky {
    box-shadow: 0 8px 6px -6px #999999;
  }
}

/*
 * Copyright 2014 Netflix, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import "../presentation/less/imports/commonImports.less";

.rollup {
  h4 {
    text-transform: uppercase;
    font-weight: 600;
    background-color: @lightest_grey;
    margin: 0;
    padding: 10px 0;
    &.heading-sticky {
      box-shadow: 0 8px 6px -6px #999999;
    }
  }
}

.rollup-summary {
  background-color: @dark_blue_background;
}

.rollup-entry {
  border: 1px solid #c4c4c4;
  border-radius: 3px;
  padding: 0;
  margin: 15px 0;
  &:last-child {
    background-color: #ffffff;
    padding-bottom: 5px;
  }

  &.disabled {
    opacity: 0.4;
    border: 1px dashed #aaaaaa;
    &:hover, &.active {
      opacity: .75;
    }
  }

  .glyphicon-th, .glyphicon-th-large, .icon-server-group {
    color: @healthy_green_icon;
  }

  &.unhealthy {
    border-style: dashed;
  }
}

.instance-list {
  clear: both;
  padding: 0 10px 0 31px;
}

@instance-width: 12px;
@instance-height: 18px;

.instances {
  border: none;
  line-height: 10px;
  border-radius: 2px;
  padding-bottom: 5px;
  a.instance {
    margin: 0;
    display: inline-block;
    width: @instance-width;
    border-right: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    height: @instance-height;
    background-color: @healthy_green;

    &.health-status-Up {
      background-color: @healthy_green;
    }
    &.health-status-Down {
      background-color: @unhealthy_red;
    }
    &.health-status-OutOfService {
      background-color: @mid_lighter_grey;
    }

    &.health-status-Unknown {
      background-color: @missing_health;
    }

    &.health-status-Starting {
      background-color: @missing_health;
      .pulsing(1.0);
    }

    &:hover, &.active, &.highlighted {
      height: @instance-height - 1;
      margin-top: 0;
      margin-bottom: 1px;
      border: 1px solid @dark_grey;
      box-shadow: 0 0 3px 1px #999999;
      z-index: 2;
    }

    &.active {
      &.health-status-Up {
        background-color: @healthy_green_border;
      }
      &.health-status-Down {
        background-color: @unhealthy_red_border;
      }
      &.health-status-OutOfService {
        background-color: @mid_grey;
        border-color: @dark_grey;
      }

      &.health-status-Unknown, &.health-status-Starting {
        background-color: @missing_health_border;
      }
    }
  }
}

.rollup-summary {
  font-size: 110%;
  margin: 0;
  display: table;
  width: 100%;

  .tooltip {
    text-transform: none;
  }
  button {
    padding: 0;
    display: inline-block;
    margin-right: 5px;
    line-height: 1;
    &.active, &:focus {
      outline: 0;
      box-shadow: none;
    }
    .icon {
      position: relative;
      font-size: 120%;
    }
    .icon-spinner {
      font-size: 20px;
    }

  }
}

.rollup-title-cell {
  color: @lightest_grey;
  &:active, &:hover, &:focus {
    text-decoration: none;
  }
  @media (min-width: 768px) and (max-width: 992px) {
    font-size: 85%;
  }
  h5 {
    line-height: 39px;
    height: 39px;
    margin: 0;
    font-size: 110%;
  }
  .account-tag {
    .small {
      color: #ffffff;
    }
    background-color: #777;
    padding: 0 15px;
    display: inline-block;
    margin-right: 10px;
    text-transform: uppercase;
    height: 39px;
    &.account-tag-prod {
      background-color: @unhealthy_red;
    }
  }
  .instance-health-counts {
    padding-right: 10px;
  }
}

running-tasks-tag {
  position: relative;
  top: 2px;
  right: 5px;
  .icon-spinner {
    color: @spinnaker-link-color;
  }
}

.menu-running-tasks {
  text-align: left;
  position: absolute;
  z-index: 3;
  top: 20px;
  right: -12px;
  background-color: #ffffff;
  margin-top: 12px;
  border: 1px solid #777777;
  padding: 5px 10px;
  border-radius: 3px;
  box-shadow: 0 0 2px 1px #eeeeee;
  text-transform: none;
  color: @text-color;
  font-weight: 400;
  font-size: 80%;
  width: 350px;

  &::before, &::after {
    width: 0;
    height: 0;
    content: ' ';
    right: 12px;
    position: absolute;
    border: 10px solid transparent;
    border-top-width: 0;
  }
  &::after {
    top: -10px;
    border-bottom-color: #ffffff;
  }
  &::before {
    top: -11px;
    border-bottom-color: @mid_grey;
  }
}

.menu-load-balancers {
  opacity: 1;
  text-align: left;
  position: absolute;
  z-index: 3;
  right: 0;
  background-color: #ffffff;
  margin-top: 8px;
  border: 1px solid #777777;
  padding: 0;
  border-radius: 3px;
  box-shadow: 0px 0px 5px 2px #dddddd;
  min-width: 150px;
  div {
    font-weight: 600;
    color: #eeeeee;
    background-color: @mid_grey;
  }
  div, a {
    text-transform: none;
    font-size: 82.5%;
    padding: 5px 10px;
    display: block;
  }
  a {
    border-bottom: 1px solid #d1d1d1;
    white-space: nowrap;
    &:last-child {
      border-bottom-width: 0;
    }
    &:hover, &:focus {
      background-color: #eeeeee;
      text-decoration: none;
    }
    &:focus {
      padding-left: 15px;
      padding-right: 5px;
    }
  }
  &::before, &::after {
    width: 0;
    height: 0;
    content: ' ';
    right: 15px;
    position: absolute;
    border: 8px solid transparent;
    border-top-width: 0;
    margin-left: -11px;
  }
  &::after {
    margin-left: -10px;
    border-width: 8px;
    top: -14px;
    border-bottom-color: @mid_grey;
  }
  &::before {
    top: -8px;
    border-bottom-color: @mid_grey;
  }
}

load-balancers-tag {
  .overflowing {
    position: relative;
  }
  .btn-load-balancer {
    margin-right: 10px;
  }

  .btn-multiple-load-balancers {
    text-align: right;
    margin-right: 15px;
    &:hover {
      text-decoration: none;
    }
    .icon {
      width: 30px;
    }
    .icon-elb {
      height: 0;
      width: 0;
      &::before {
        text-shadow: #2A6496 0 0 1px;
      }
    }
    .counter {
      color: #2A6496;
      background-color: #fff;
      box-shadow: 0 0 2px #2A6496;
      right: -28px;
      font-size: 90%;
      padding: 1px 4px;
      border-radius: 6px;
    }
    span {
      position: relative;
    }
  }
}

.rollup-details {
  background-color: #ffffff;
  padding: 0;
  border-top: 1px solid #c4c4c4;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;

  .clickable-row {
    background-color: #ffffff;
    border: 2px solid transparent;
    &.active {
      background-color: @active_pod_blue;
    }
    &:hover {
      border: 2px solid @glow-init;
    }
  }
  .permalinks {
    border-top: 1px solid @mid_light_grey;
    padding: 5px 10px 0;
    font-size: 80%;
  }
  .pod-subgroup {
    h6 {
      text-transform: uppercase;
      margin: 0;
      padding: 10px 10px 5px 10px;
      &.heading-sticky {
        background-color: #ffffff;
      }
    }
    border: 2px solid transparent;
    .rollup-pod-server-group {
      .server-group-title {
        background-color: #ffffff;
      }
      &.active {
        background-color: @active_pod_blue;
        .server-group-title {
          background-color: @active_pod_blue;
        }
      }
    }
    .table {
      margin-top: -5px;
      margin-bottom: 10px;
      font-size: 90%;
    }
  }
  h5, h6 {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 110%;
  }

  .badge-disabled {
    .pull-right();
    font-weight: 700;
    text-transform: uppercase;
    padding-left: 10px;
  }

  .rollup-details-section {
    border-right: 1px solid #c4c4c4;
    padding: 10px;
    &:last-child {
      border-right-width: 0;
    }
    .rollup-row {
      padding: 0;
    }
  }

  .rollup-row {
    padding: 10px;
    &:first-child {
      border-top-width: 0;
    }
  }

  .disabled {
    opacity: 1;
    .section-title, health-counts, load-balancers-tag, instances {
      opacity: 0.4;
    }
    .icon-server-group {
      color: @mid_grey;
    }
    &:hover {
      .section-title, health-counts, load-balancers-tag, instances {
        opacity: 0.7;
      }
    }
  }

  .load-balancer-server-group {
    .instances {
      padding: 0;
    }
  }

  &.instances-only {
    padding: 10px;
  }

  .build-title {
    font-size: 110%;
    padding: 10px 10px 8px 10px;
  }
}

instances {
  display: block;
}

.row {
  .rollup-summary {
    &:hover {
      box-shadow: none;
    }
  }
  .server-group-sequence {
    text-transform: uppercase;
    font-weight: 600;
  }
  .subgroup-title {
    background-color: #ffffff;
  }
  .server-group-title, .subgroup-title {
    padding: 5px 10px 2px;
    border-bottom-width: 0;
    &.clickable {
      &:hover, &.active {
        background-color: @lighter_grey;
      }
    }
  }
  .heading-sticky {
    box-shadow: 0 8px 6px -6px #999999;
  }
}


Infinite fill animation

Infinite fill animation

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


grunt

grunt

grunt

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/vimalmenon/code-easy.net.git/'


create toast.less

create toast.less

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/zilong-thu/toastjs.git/'


pixel resizing

pixel resizing

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


Tighten up animation of loading header state

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


Add left-right paddings on mobile post-layout

@mobile-padding: 20px;

.post-layout {
  position: relative;

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

  .right {
    width: @right-width;

    padding-right: @mobile-padding;

    @media @medium {
      padding-right: 0;
    }
  }

  .rightContainer {
    float: right;
    display: none;
    width: @right-width;

    @media @small {
      display: block;
    }
  }

  .center {
    float: left;
    width: 100%;
    padding-right: @mobile-padding;
    padding-left: @mobile-padding;

    @media @small {
      width: calc(100% ~"-" (@right-width + @margin));
      padding-right: 0;
    }

    @media @medium {
      padding-left: 0;
    }
  }
}

.post-layout {
  position: relative;

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

  .right {
    width: @right-width;
  }

  .rightContainer {
    float: right;
    display: none;
    width: @right-width;

    @media @small {
      display: block;
    }
  }

  .center {
    float: left;
    width: 100%;

    @media @small {
      width: calc(100% ~"-" (@right-width + @margin));
    }
  }
}


Fix filename tab font on Windows

Fix filename tab font on Windows

/* Brackets / CodeMirror Code Formatting */

.CodeMirror-scroll {
    background-color: @background-color-3;
    .code-font();
}

.cm-s-default {
    .CodeMirror-cursor {
        .code-cursor();
    }

    span.cm-keyword {color: @accent-keyword;}
    span.cm-atom {color: @accent-atom;}
    span.cm-number {color: @accent-number;}
    span.cm-def {color: @accent-def;}
    span.cm-variable {color: @accent-variable;}
    span.cm-variable-2 {color: @accent-variable-2;}
    span.cm-variable-3 {color: @accent-variable-3;}
    span.cm-property {color: @accent-property;}
    span.cm-operator {color: @accent-operator;}
    span.cm-comment {color: @accent-comment;}
    span.cm-string {color: @accent-string;}
    span.cm-string-2 {color: @accent-string-2;}
    span.cm-meta {color: @accent-meta;}
    span.cm-error {color: @accent-error;}
    span.cm-qualifier {color: @accent-qualifier;}
    span.cm-builtin {color: @accent-builtin;}
    span.cm-bracket {color: @accent-bracket;}
    span.cm-tag {color: @accent-tag;}
    span.cm-attribute {color: @accent-attribute;}
    span.cm-header {color: @accent-header;}
    span.cm-quote {color: @accent-quote;}
    span.cm-hr {color: @accent-hr;}
    span.cm-link {color: @accent-link;}

}

div.CodeMirror span.CodeMirror-matchingbracket {color: @accent-bracket; background-color: @background-color-2;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: @accent-bracket;}

/*
    CodeMirror's use of descendant selectors for certain styling causes problems when editors are
    nested because, for items in the inner editor, the left-hand clause in the selector will now
    match either the actual containing CodeMirror instance *OR* the outer "host" CodeMirror instance.

    TODO (issue #324): We'll still have problems if editors can be nested more than one level deep,
    or if any other descendant-selector-driven CM styles can differ between inner & outer editors
    (potential problem areas include line wrap and coloring theme: basically, anything in codemirror.css
    that uses a descandant selector where the CSS class name to the left of the space is something
    other than a vanilla .CodeMirror)
 */
.CodeMirror {
    .CodeMirror pre.CodeMirror-cursor {
        visibility: hidden;
    }
    .CodeMirror.CodeMirror-focused pre.CodeMirror-cursor {
        visibility: visible;
    }

    .CodeMirror div.CodeMirror-selected {
        background: #d9d9d9;
    }
    .CodeMirror.CodeMirror-focused div.CodeMirror-selected {
        background: #d2dcf8;
    }
}

.inlineCodeEditor {
    .cm-s-default {
        background-color: #F3F3F3;
    }
    .filename {
        position: absolute;
        top: 0;
        background: #FFF;
        padding: 0px 4px 3px;
        font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
        font-size: 12px;
        border: solid #C0C0C0;
        border-width: 0px 1px 1px;
        border-bottom-right-radius: 3px 5px;
        border-bottom-left-radius: 3px 5px;
        z-index: 11;
    }
    .shadow {
        display: block;
        height: 6px;
        width: 100%;
        position: absolute;
        content: " ";
        left: 0;
        z-index: 10;
    }
    .shadow.top {
        top: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
    }
    .shadow.bottom {
        bottom: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
    }
}

/* Brackets / CodeMirror Code Formatting */

.CodeMirror-scroll {
    background-color: @background-color-3;
    .code-font();
}

.cm-s-default {
    .CodeMirror-cursor {
        .code-cursor();
    }

    span.cm-keyword {color: @accent-keyword;}
    span.cm-atom {color: @accent-atom;}
    span.cm-number {color: @accent-number;}
    span.cm-def {color: @accent-def;}
    span.cm-variable {color: @accent-variable;}
    span.cm-variable-2 {color: @accent-variable-2;}
    span.cm-variable-3 {color: @accent-variable-3;}
    span.cm-property {color: @accent-property;}
    span.cm-operator {color: @accent-operator;}
    span.cm-comment {color: @accent-comment;}
    span.cm-string {color: @accent-string;}
    span.cm-string-2 {color: @accent-string-2;}
    span.cm-meta {color: @accent-meta;}
    span.cm-error {color: @accent-error;}
    span.cm-qualifier {color: @accent-qualifier;}
    span.cm-builtin {color: @accent-builtin;}
    span.cm-bracket {color: @accent-bracket;}
    span.cm-tag {color: @accent-tag;}
    span.cm-attribute {color: @accent-attribute;}
    span.cm-header {color: @accent-header;}
    span.cm-quote {color: @accent-quote;}
    span.cm-hr {color: @accent-hr;}
    span.cm-link {color: @accent-link;}

}

div.CodeMirror span.CodeMirror-matchingbracket {color: @accent-bracket; background-color: @background-color-2;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: @accent-bracket;}

/*
    CodeMirror's use of descendant selectors for certain styling causes problems when editors are
    nested because, for items in the inner editor, the left-hand clause in the selector will now
    match either the actual containing CodeMirror instance *OR* the outer "host" CodeMirror instance.

    TODO (issue #324): We'll still have problems if editors can be nested more than one level deep,
    or if any other descendant-selector-driven CM styles can differ between inner & outer editors
    (potential problem areas include line wrap and coloring theme: basically, anything in codemirror.css
    that uses a descandant selector where the CSS class name to the left of the space is something
    other than a vanilla .CodeMirror)
 */
.CodeMirror {
    .CodeMirror pre.CodeMirror-cursor {
        visibility: hidden;
    }
    .CodeMirror.CodeMirror-focused pre.CodeMirror-cursor {
        visibility: visible;
    }

    .CodeMirror div.CodeMirror-selected {
        background: #d9d9d9;
    }
    .CodeMirror.CodeMirror-focused div.CodeMirror-selected {
        background: #d2dcf8;
    }
}

.inlineCodeEditor {
    .cm-s-default {
        background-color: #F3F3F3;
    }
    .filename {
        position: absolute;
        top: 0;
        background: #FFF;
        padding: 0px 4px 3px;
        font-family: "Lucida Grande";
        font-size: 12px;
        border: solid #C0C0C0;
        border-width: 0px 1px 1px;
        border-bottom-right-radius: 3px 5px;
        border-bottom-left-radius: 3px 5px;
        z-index: 11;
    }
    .shadow {
        display: block;
        height: 6px;
        width: 100%;
        position: absolute;
        content: " ";
        left: 0;
        z-index: 10;
    }
    .shadow.top {
        top: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0));
    }
    .shadow.bottom {
        bottom: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1));
    }
}


Styling fixes

Styling fixes

Fix z-order of shadow and filename
Add background color

/* Brackets / CodeMirror Code Formatting */

.CodeMirror-scroll {
    background-color: @background-color-3;
    .code-font();
}

.cm-s-default {
    .CodeMirror-cursor {
        .code-cursor();
    }

    span.cm-keyword {color: @accent-keyword;}
    span.cm-atom {color: @accent-atom;}
    span.cm-number {color: @accent-number;}
    span.cm-def {color: @accent-def;}
    span.cm-variable {color: @accent-variable;}
    span.cm-variable-2 {color: @accent-variable-2;}
    span.cm-variable-3 {color: @accent-variable-3;}
    span.cm-property {color: @accent-property;}
    span.cm-operator {color: @accent-operator;}
    span.cm-comment {color: @accent-comment;}
    span.cm-string {color: @accent-string;}
    span.cm-string-2 {color: @accent-string-2;}
    span.cm-meta {color: @accent-meta;}
    span.cm-error {color: @accent-error;}
    span.cm-qualifier {color: @accent-qualifier;}
    span.cm-builtin {color: @accent-builtin;}
    span.cm-bracket {color: @accent-bracket;}
    span.cm-tag {color: @accent-tag;}
    span.cm-attribute {color: @accent-attribute;}
    span.cm-header {color: @accent-header;}
    span.cm-quote {color: @accent-quote;}
    span.cm-hr {color: @accent-hr;}
    span.cm-link {color: @accent-link;}

}

div.CodeMirror span.CodeMirror-matchingbracket {color: @accent-bracket; background-color: @background-color-2;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: @accent-bracket;}

/*
    CodeMirror's use of descendant selectors for certain styling causes problems when editors are
    nested because, for items in the inner editor, the left-hand clause in the selector will now
    match either the actual containing CodeMirror instance *OR* the outer "host" CodeMirror instance.

    TODO (issue #324): We'll still have problems if editors can be nested more than one level deep,
    or if any other descendant-selector-driven CM styles can differ between inner & outer editors
    (potential problem areas include line wrap and coloring theme: basically, anything in codemirror.css
    that uses a descandant selector where the CSS class name to the left of the space is something
    other than a vanilla .CodeMirror)
 */
.CodeMirror {
    .CodeMirror pre.CodeMirror-cursor {
        visibility: hidden;
    }
    .CodeMirror.CodeMirror-focused pre.CodeMirror-cursor {
        visibility: visible;
    }

    .CodeMirror div.CodeMirror-selected {
        background: #d9d9d9;
    }
    .CodeMirror.CodeMirror-focused div.CodeMirror-selected {
        background: #d2dcf8;
    }
}

.inlineCodeEditor {
    .cm-s-default {
        background-color: #E6E6E6;
    }
    .filename {
        position: absolute;
        top: 0;
        background: #FFF;
        padding: 0px 4px 3px;
        font-family: "Lucida Grande";
        font-size: 12px;
        border: solid #808080;
        border-width: 0px 1px 1px;
        border-bottom-right-radius: 3px 5px;
        border-bottom-left-radius: 3px 5px;
        z-index: 11;
    }
    .shadow {
        display: block;
        height: 10px;
        width: 100%;
        position: absolute;
        content: " ";
        left: 0;
        z-index: 10;
    }
    .shadow.top {
        top: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
    }
    .shadow.bottom {
        bottom: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
    }
}

/* Brackets / CodeMirror Code Formatting */

.CodeMirror-scroll {
    background-color: @background-color-3;
    .code-font();
}

.cm-s-default {
    .CodeMirror-cursor {
        .code-cursor();
    }

    span.cm-keyword {color: @accent-keyword;}
    span.cm-atom {color: @accent-atom;}
    span.cm-number {color: @accent-number;}
    span.cm-def {color: @accent-def;}
    span.cm-variable {color: @accent-variable;}
    span.cm-variable-2 {color: @accent-variable-2;}
    span.cm-variable-3 {color: @accent-variable-3;}
    span.cm-property {color: @accent-property;}
    span.cm-operator {color: @accent-operator;}
    span.cm-comment {color: @accent-comment;}
    span.cm-string {color: @accent-string;}
    span.cm-string-2 {color: @accent-string-2;}
    span.cm-meta {color: @accent-meta;}
    span.cm-error {color: @accent-error;}
    span.cm-qualifier {color: @accent-qualifier;}
    span.cm-builtin {color: @accent-builtin;}
    span.cm-bracket {color: @accent-bracket;}
    span.cm-tag {color: @accent-tag;}
    span.cm-attribute {color: @accent-attribute;}
    span.cm-header {color: @accent-header;}
    span.cm-quote {color: @accent-quote;}
    span.cm-hr {color: @accent-hr;}
    span.cm-link {color: @accent-link;}

}

div.CodeMirror span.CodeMirror-matchingbracket {color: @accent-bracket; background-color: @background-color-2;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: @accent-bracket;}

/*
    CodeMirror's use of descendant selectors for certain styling causes problems when editors are
    nested because, for items in the inner editor, the left-hand clause in the selector will now
    match either the actual containing CodeMirror instance *OR* the outer "host" CodeMirror instance.

    TODO (issue #324): We'll still have problems if editors can be nested more than one level deep,
    or if any other descendant-selector-driven CM styles can differ between inner & outer editors
    (potential problem areas include line wrap and coloring theme: basically, anything in codemirror.css
    that uses a descandant selector where the CSS class name to the left of the space is something
    other than a vanilla .CodeMirror)
 */
.CodeMirror {
    .CodeMirror pre.CodeMirror-cursor {
        visibility: hidden;
    }
    .CodeMirror.CodeMirror-focused pre.CodeMirror-cursor {
        visibility: visible;
    }

    .CodeMirror div.CodeMirror-selected {
        background: #d9d9d9;
    }
    .CodeMirror.CodeMirror-focused div.CodeMirror-selected {
        background: #d2dcf8;
    }
}

.inlineCodeEditor {
    .filename {
        position: absolute;
        top: 0;
        background: #FFF;
        padding: 0px 4px 3px;
        font-family: "Lucida Grande";
        font-size: 12px;
        border: solid #808080;
        border-width: 0px 1px 1px;
        border-bottom-right-radius: 3px 5px;
        border-bottom-left-radius: 3px 5px;
    }
    .shadow {
        display: block;
        height: 10px;
        width: 100%;
        position: absolute;
        content: " ";
        left: 0;
    }
    .shadow.top {
        top: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
    }
    .shadow.bottom {
        bottom: 0px;
        background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4));
    }
}


[FEATURE] sap.m.ResponsivePopover: Add HCB styles

Change-Id: I5cb23a4119b414aeb4715b25735d97c98ead553e

/* ================================================ */
/* CSS for control sap.m/ResponsivePopover.control  */
/* HCB theme                                        */
/* ================================================ */
.sapMResponsivePopover.sapMDialog .sapMIBar.sapMPageHeader:before {
	border-top: none;
}

/* HCB Additional Styles */
.sapMDialogPhone.sapMResponsivePopover {
	border: none;
}

error: pathspec 'src/sap.m/src/sap/m/themes/sap_hcb/ResponsivePopover.less' did not match any file(s) known to git


Use .source.gfm as root selector

Use .source.gfm as root selector

This matches the grammar's scope name and was an oversight from the
original CSS to Less conversion.

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


Correct shadows + button-big

Correct shadows + button-big

fatal: unable to access 'https://github.com/wicky-info/Framework7.git/': The requested URL returned error: 403


add css

add css

// Main colors
@primary-darkest: #934e9d;    // Navigation selected state
@primary-dark: #934e9d;       // Navigation hover state
@primary: #4e589d;            // Section headings and side-bar background
@primary-light: #ab69b5;      // Borders & horizontal rules
@primary-lightest: #cfd2e7;   // Background for Example

// Neutral Text
@text-dark: #273D44;            // Dark headings and bold items
@text-medium: rgb(39,47,68);  // Body copy (paragraphs, lists, etc.)

// Links
@link-color: #4e589d;         // Link text
@link-background: #adb3d6;    // Link background when hovered

// Layout
@aside-width: 230px;          // Width of the navigation side bar
@base-font-size: 16px;        // Base font size for body copy

body {
  font-family: "Fira Sans","Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  padding: 0;
  margin: 0;

  * {
    padding: 0;
    margin: 0;
    font-size: inherit;
    font-weight: 400;
  }
}

// Basic content & tags

h1 {
  font-size: 32px;
  margin: 0 0 35px 0;
  color: @text-dark;
  position: relative;
  line-height: 120%;
}

h2 {
  font-size: 32px;
  font-style: italic;
  color: @primary-darkest;
  margin: 30px 0 20px 0;
}

h3 {
  color: @primary-darkest;
  font-size: 20px;
  font-weight: 500;
  margin: 20px 0 8px 0;
}

h4 {
  color: @text-dark;
  margin: 0 0 10px 0;
  font-size: 18px;
}

p, li {
  color: @text-medium;
  line-height: 160%;
}

ul, ol {
  margin: 0 0 30px 0;

  li {
    margin-bottom: 6px;
  }
}

ul {
  li {
    list-style-type: none;
    position: relative;

    &:before {
      content: ".";
      position: absolute;
      left: -15px;
      font-weight: 700;
      color: inherit;
      font-size: 25px;
      top: -6px;
    }
  }
}

strong {
  font-weight: 500;
  color: @text-dark;
}

p {
  margin: 0 0 30px 0;
}

a {
  color: @link-color;
  transition: background .05s ease-out;

  &:hover {
    background: @link-background;
  }
}

// The main conent wrapper

article {
  max-width: 750px;
  min-width: 500px;
  position: relative;
  padding: 20px 0 40px @aside-width + 65;
  margin-right: 55px;
  z-index: 1;
}

.logo {
  position: relative;
  left: -12px;
  width: 175px;
  margin-bottom: 10px;

  a:hover {
    background: none;
    opacity: .8;
  }
}

// Example callout box

.example {
  display: flex;
  margin: 35px 0 40px 0;
  background: @primary-lightest;
  color: @primary-darkest;
  padding: 30px 35px;

  .title {
    flex: 1;
    color: inherit;
    padding-right: 20px;

    h1 {
      width: 100%;
      padding: 0 0 2px 0;
      font-size: 20px;
      font-style: italic;
      position: relative;
      top: 3px;
      color: inherit;
    }
  }

  .content {
    flex: 2;
    color: inherit;
    position: relative;
    padding-left: 22px;

    &:after {
      content: "";
      width: 2px;
      left: -2px;
      top: 4px;
      height: ~"calc(100% - 8px)";
      position: absolute;
      background: @primary-light;
    }

    p:last-child {
      margin: 0;
    }

    * {
      color: inherit;
    }
  }

}

// Summary, audience and duration
.meta-information {
  display: flex;
  margin: 0 -20px 50px -20px;

  .summary, .details {
    margin: 0 20px;
  }

  .summary {
    flex: 2;
    font-size: 18px;
    line-height: 145%;
    padding: 0 0 0 28px;
    font-style: italic;
    position: relative;

    &:after {
      content: "";
      width: 3px;
      height: ~"calc(100% - 10px)";
      left: 0;
      top: 5px;
      position: absolute;
      background: @primary-light;
    }
  }

  .details {
    flex: 1;

    time, .difficulty {
      color: @primary-darkest;
      font-weight: 700;
      margin-bottom: 3px;
      display: block;
    }

    time:before {
      content:   "\f017";
      font-family: FontAwesome;
      margin-right: 6px;
    }

    .difficulty:before {
      content:   "\f007";
      font-family: FontAwesome;
      margin-right: 6px;
    }
  }
}

// Format, target audience & materials
.track-details {
  display: flex;
  margin: 0 -20px 35px -20px;

  section {
    flex: 1;
    margin: 0 20px;

    :last-child {
      margin-bottom: 0;
    }

  }
}

// Side-bar with navigation
aside {
  background: @primary;
  position:fixed;
  height: 100vh;
  width: @aside-width;
  top: 0;
  z-index: 2;

  .image {
    position: relative;

    img {
      width: ~"calc(100% - 20px)";
    }
  }
}

/* Left-side Navigation */

nav {
  padding: 0;
  margin: 15px 0 80px 0;
  list-style-type: none;
  position: relative;

  a {
    display: block;
    position: relative;
    text-decoration: none;
    color: rgba(255,255,255,.7);
    padding: 18px 34px;
    transition: background .05s ease-out;

    &.selected, &.selected:hover {
      background: @primary-darkest;
      color: white;
      font-weight: 500;
    }

    &:hover {
      background: @primary-dark;
      color: rgba(255,255,255,1);
    }

    &:after {
      content: "";
      background: ~"url(../assets/images/nav-selected-indicator_violeta.svg)";
      background-position: top left;
      background-repeat: no-repeat;
      background-size: contain;
      height: 100%;
      width: 20px;
      position: absolute;
      top: 0;
      right: 0;
      opacity: 0;
      transition: all .075s ease-out;
    }

    &.selected {
      color: rgba(255,255,255,1);

      &:after {
        opacity: 1;
        right: -20px;
      }

    }
  }
}

/*The steps to complete list*/

.steps {
  margin: 30px 0 50px 0;
  padding: 0 0 0 60px;

  h1 {
    font-weight: 500;
    font-size: 22px;
    margin: 0 0 6px 0;
    padding: 0;
    color: @primary-darkest;
  }

  time {
    margin: 0 0 10px 0;
    display: block;
    color: @text-medium;
    font-weight: 500;

    &:before {
      content:   "\f017";
      font-family: FontAwesome;
      margin-right: 6px;
      color: rgba(0,0,0,.25);
    }
  }

  > ol {
    padding: 0;
  }

  > li {
    list-style-type: none;
    position: relative;
    padding: 0 0 10px 0;
    margin: 0 0 40px 0;

    &:not(:last-child):after {
      content: "";
      position: absolute;
      bottom: -2px;
      height: 2px;
      background: @primary-light;
      width: 35%;
      left: ~"calc(22% + 50px)";
    }

    &:last-child {
      border: none;
      margin: 0;

      :last-child {
        margin: 0;
      }
    }

    &:before {
      position: absolute;
      left: -60px;
      top: -10px;
      font-weight: 400;
      font-size: 22px;
      color: @primary-darkest;
      border: solid 2px @primary-light;
      height: 43px;
      width: 43px;
      text-align: center;
      box-sizing: border-box;
      padding-top: 9px;
      border-radius: 0 50% 50% 50%;
    }

    // Creates fancy number elements for the Steps-to-Complete list
    .make-steps(@counter) when (@counter > 0) {
      .make-steps((@counter - 1));
      &:nth-child(@{counter}):before {
        content: ~"'"@counter~"'";
      }
    }
    .make-steps(10);
  }

  // Lists within the steps to complete list
  ul, ol {
    padding: 0;

    li {
      list-style-type: none;

      &:before {
        display: none;
      }

      h2 {
        font-size: 15px;
        color: @text-dark;
        font-style: normal;
        font-weight: 500;
        margin: 0;
      }
    }
  }

}

.glossary {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: 30px;
     -moz-column-gap: 30px;
          column-gap: 30px;

  margin: 0 0 40px 0;

  .term {
    -webkit-column-break-inside: avoid;
            column-break-inside: avoid;
    display: table; // Weird hack for Firefox

    h3 {
      font-weight: 500;
      font-size: @base-font-size;
      color: @text-dark;
      margin: 0;
    }

    p {
      margin-bottom: 20px;
      margin-left: 15px;
    }
  }

}

.resources {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: 30px;
     -moz-column-gap: 30px;
          column-gap: 30px;
  padding-bottom: 30px;

  .resource  {
    -webkit-column-break-inside: avoid;
    break-inside: avoid;
    padding-bottom: 25px;

    h4 {
      margin: 0;
      padding: 0;
      font-size: 15px;
      font-weight: 500;
      line-height: 17px;
    }

    p {
      margin: 10px 0 0 0;
    }
  }
}

// TODO: Print styles
@media print {}

// Tables CSS
table.altrowstable {
  font-family: verdana,arial,sans-serif;
  font-size:11px;
  color:#333333;
  border-width: 1px;
  border-color: @primary-darkest;
  border-collapse: collapse;
  width: 100%;
}
table.altrowstable th {
  border-width: 1px;
  padding: 8px;
  border-style: solid;
  border-color: @primary-darkest;
}
table.altrowstable td {
  border-width: 1px;
  padding: 8px;
  border-style: solid;
  border-color: @primary-darkest;
}
.oddrowcolor{
  background-color:@primary-light;
}
.evenrowcolor{
  background-color:@primary-lightest;
}

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


Signed-off-by: duxinlixiaoxue <1207931454@qq.com>

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


tweaking header pulse position

tweaking header pulse position

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/pradeepmurugesan/incubator-freemarker-docgen.git/'


Adding LESS version with adjustments for mobile

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


Highlight more!

Highlight more!

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


Add styling for ComponentPlayground #87

Add styling for ComponentPlayground #87

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