Fix newly introduced Listing footer css bugs

.container {
  margin: 0 auto !important;
  max-width: @max-width !important;
  width: auto !important;
}

.Listing-container.compact {
  padding: 0;
}

.Listing {
  position: relative;

  &.compact {
    @media (min-width: @max-width) {
      border-left: @gray-border;
      border-right: @gray-border;
    }

    &:first-child .ListingContent-image {
      border-top: @gray-border;
    }

    .Listing-header {
      border-top: @gray-border;
    }

    .Listing-header, .Listing-footer {
      margin-left: @listing-compact-width;
    }

    &:last-child {
      border-bottom: @gray-border;
    }

    .Listing-header-row2 {
      font-size: 14px;
    }

    .Listing-commentsbutton {
      padding-top: 1px;
    }
  }

  &:not(.compact) {
    @radius: 3px;
    margin-bottom: @row-spacing-base;
    border-radius: @radius;
    .shadow;

    .Listing-header {
      border-top-left-radius: @radius;
      border-top-right-radius: @radius;
    }

    .Listing-footer {
      border-bottom-left-radius: @radius;
      border-bottom-right-radius: @radius;
    }
  }

  &.Listing-sponsored {
    background: rgb(240,240,240);

    .linkbar-single-line {
      height: 1.5em;
      overflow: hidden;
      width: 100%;
      position: relative;

      &:after {
       content: '';
       position: absolute;
       height: 2em;
       z-index: 1;
       bottom: 0;
       right: 0;
       width: 3em;

       #gradient > .horizontal(@start-color: rgba(240,240,240,0); @end-color: rgba(240,240,240,1););
      }
    }
  }

  a:hover {
    text-decoration: none;
  }
}

.Listing-link-flair {
  font-weight: normal;
  display: inline-block;
  margin-right: 1em;
}

.Listing-header {
  background-color: @white;
  padding: 5px 10px 10px;
  position: relative;

  &.single-row {
    .Listing-title {
      padding-right: 30px;
      display: inline-block;
    }
  }

  .Dropdown {
    position: absolute;
    right: 10px;
    top: 10px;
  }
}

  .Listing-header-row1 {
    margin-bottom: 30px;
  }

    .Listing-subreddit {
      font-size: 12px;
      float: left;
      color: @gray;
      font-weight: bold;
      line-height: 240%;
      margin-right: 5px;
      display: inline-block;
      min-height: 24px;

      &:visited {
        color: @gray;
      }
    }

      .Listing-subreddit .SVG-icon, .Listing-icon {
        width: 24px;
        height: 24px;
        font-size: 24px;
        line-height: 24px;
        margin-right: 5px;
        vertical-align: middle;
        display: inline-block;
      }

      .Listing-icon {
        background-color: @light-gray;
        border-radius: 12px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 50% 50%;
        margin-right: 5px;
      }

    .Listing-flair {
      float: left;
    }

  .Listing-header-row2 {
    clear: both;
    font-size: 18px;
    display: block;
    line-height: 130%;
  }

    .Listing-title {
      color: @black;

      &.text-admin {
        color: @admin-text;
      }

      &.text-moderator {
        color: @mod-text;
      }

      &:active {
        color: lighten(@black, 20%);
      }

      &:visited {
        color: lighten(@black, 40%);
      }
    }

.Listing-footer {
  padding: 0 10px;
  background-color: @white;
  overflow: auto;
  font-size: 12px;
  margin:0;

  .linkbar {
    margin: 0;

    > li {
      vertical-align: middle;

      &:last-child {
        margin-right: 0;
      }
    }
  }

  .SVG-icon {
    top: -1px;
    position: relative;
  }
}

  .Listing-comments {
    .SVG-icon {
      margin-right: 5px;
    }
  }

  .Listing-vote {
    float: right;
    color: #8e8e8e;
    position: absolute;
    padding: 0 10px;
    right: 0;
    bottom: 0;

    #gradient > .horizontal(@start-color: rgba(255, 255, 255, 0); @end-color: rgba(255, 255, 255, 1); @start-percent: 0%; @end-percent: 15%);

    .vote {
      padding: 10px 0;
    }
  }

  .Listing-commentsbutton {
    padding: 10px 0;
    display: inline-block;
  }

  .Listing-numcomments {
    margin-right: 0.5em;
    vertical-align: middle;
  }

  .Listing-when, .Listing-domain {
    vertical-align: middle;
    padding: 0;
    margin-right: 0.5em;

    &:before {
      content:'·';
      padding-right: 0.5em;
    }
  }

//this and below seem like the probably shouldn't be root level selectors?
.external-image-meta {
  .text-overflow();
  margin: 5px 0;

  span,
  a {
    color: darken(@light-gray, 20%);
  }

  a:hover,
  a:active {
    color: @blue;
  }
}

.pageNav {
  margin-bottom: 1em;
}

.label.label-danger {
  color: #fff;
}

.vote-form {
  margin: 0;
}

.vote {
  position: relative;
}

.container {
  margin: 0 auto !important;
  max-width: @max-width !important;
  width: auto !important;
}

.Listing-container.compact {
  padding: 0;
}

.Listing {
  position: relative;

  &.compact {
    @media (min-width: @max-width) {
      border-left: @gray-border;
      border-right: @gray-border;
    }

    &:first-child .ListingContent-image {
      border-top: @gray-border;
    }

    .Listing-header {
      border-top: @gray-border;
    }

    .Listing-header, .Listing-footer {
      margin-left: @listing-compact-width;
    }

    &:last-child {
      border-bottom: @gray-border;
    }

    .Listing-header-row2 {
      font-size: 14px;
    }

    .Listing-commentsbutton {
      padding-top: 1px;
    }

    .Listing-vote {
      .vote-score {
        position: relative;
        top: -5px;
      }

      .vote {
        padding-top: 1px;
      }
    }
  }

  &:not(.compact) {
    @radius: 3px;
    margin-bottom: @row-spacing-base;
    border-radius: @radius;
    .shadow;

    .Listing-header {
      border-top-left-radius: @radius;
      border-top-right-radius: @radius;
    }

    .Listing-footer {
      border-bottom-left-radius: @radius;
      border-bottom-right-radius: @radius;
    }
  }

  &.Listing-sponsored {
    background: rgb(240,240,240);

    .linkbar-single-line {
      height: 1.5em;
      overflow: hidden;
      width: 100%;
      position: relative;

      &:after {
       content: '';
       position: absolute;
       height: 2em;
       z-index: 1;
       bottom: 0;
       right: 0;
       width: 3em;

       #gradient > .horizontal(@start-color: rgba(240,240,240,0); @end-color: rgba(240,240,240,1););
      }
    }
  }

  a:hover {
    text-decoration: none;
  }
}

.Listing-link-flair {
  font-weight: normal;
  display: inline-block;
  margin-right: 1em;
}

.Listing-header {
  background-color: @white;
  padding: 5px 10px 10px;
  position: relative;

  &.single-row {
    .Listing-title {
      padding-right: 30px;
      display: inline-block;
    }
  }

  .Dropdown {
    position: absolute;
    right: 10px;
    top: 10px;
  }
}

  .Listing-header-row1 {
    margin-bottom: 30px;
  }

    .Listing-subreddit {
      font-size: 12px;
      float: left;
      color: @gray;
      font-weight: bold;
      line-height: 240%;
      margin-right: 5px;
      display: inline-block;
      min-height: 24px;

      &:visited {
        color: @gray;
      }
    }

      .Listing-subreddit .SVG-icon, .Listing-icon {
        width: 24px;
        height: 24px;
        font-size: 24px;
        line-height: 24px;
        margin-right: 5px;
        vertical-align: middle;
        display: inline-block;
      }

      .Listing-icon {
        background-color: @light-gray;
        border-radius: 12px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 50% 50%;
        margin-right: 5px;
      }

    .Listing-flair {
      float: left;
    }

  .Listing-header-row2 {
    clear: both;
    font-size: 18px;
    display: block;
    line-height: 130%;
  }

    .Listing-title {
      color: @black;

      &.text-admin {
        color: @admin-text;
      }

      &.text-moderator {
        color: @mod-text;
      }

      &:active {
        color: lighten(@black, 20%);
      }

      &:visited {
        color: lighten(@black, 40%);
      }
    }

.Listing-footer {
  padding: 0 10px;
  background-color: @white;
  overflow: auto;
  font-size: 12px;
  margin:0;

  .linkbar {
    margin: 0;

    > li {
      vertical-align: middle;

      &:last-child {
        margin-right: 0;
      }
    }
  }

  .SVG-icon {
    top: -1px;
    position: relative;
  }
}

  .Listing-comments {
    .SVG-icon {
      margin-right: 5px;
    }
  }

  .Listing-vote {
    float: right;
    color: #8e8e8e;

    .vote {
      padding: 10px 0;
    }
  }

  .Listing-commentsbutton {
    padding: 10px 0;
    display: inline-block;
  }

  .Listing-numcomments {
    margin-right: 0.5em;
  }

  .Listing-when, .Listing-domain {
    vertical-align: middle;
    padding: 0;
    margin-right: 0.5em;

    &:before {
      content:'·';
      padding-right: 0.5em;
    }
  }

//this and below seem like the probably shouldn't be root level selectors?
.external-image-meta {
  .text-overflow();
  margin: 5px 0;

  span,
  a {
    color: darken(@light-gray, 20%);
  }

  a:hover,
  a:active {
    color: @blue;
  }
}

.pageNav {
  margin-bottom: 1em;
}

.label.label-danger {
  color: #fff;
}

.vote-form {
  margin: 0;
}

.vote {
  position: relative;
}


Add style

Add style

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/Digipalvelutehdas/APIKA.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/'


reorder and clean up variables

reorder and clean up variables

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


keep the box-shadow but overlap the content

@import 'lib';

.home {
    #site-header {
        position: relative;
        z-index: 1;
    }
}

.homepage-promo {
    background-image: url(../../img/mkt/grain.png),
                      linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -moz-linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -webkit-linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -webkit-gradient(linear, left bottom, left top, from(#60747F), to(#394C58));
    /*.gradient-two-color(#394C58, #60747F);*/
    min-height: 320px;
    color: @white;
    text-shadow: 0 1px 0 rgba(0,0,0,.25);
    div {
        .border-box;
        background: url(../../img/mkt/quest.png) 100% 58px no-repeat;
        min-height: 330px;
        padding-top: 58px;
        position: relative;
        .width(10);
        margin: 0 auto;
    }
    p {
        font-size: 14px;
        width: 320px;
    }
    h1 {
        font-size: 48px;
        letter-spacing: -2px;
        line-height: 100%;
    }
}

@media (max-width: @10col) {
    .homepage-promo {
        div {
            .background-size(60% auto);
        }
        h2, p {
            .width(3);
        }
    }
    .home #page > section.full > div {
        margin: 0 15px;
        width: 100%;
    }
}

@media (max-width: @4col) {
    .homepage-promo div {
        background-position: 150% 58px;
    }
}

.featured, .popular {
    &.slider {
        height: 282px;
    }
}
.featured {
    background: #60747F;
    .grain;
    color: @white;
    &.slider {
        border-bottom: 1px solid #666;
    }
    a {
        color: lighten(@text, 60%);
        &:hover {
            color: @white;
        }
    }
}

.popular {
    h2 {
        padding-top: 10px;
    }
    a {
        color: @text;
        &:hover {
            color: darken(@text, 15%);
        }
    }
}

.popular, .categories {
    h2 {
        padding-top: 10px;
    }
}

.categories {
    background: @pale-bg;
    .controls {
        .next-page, .prev-page {
            height: 162px;
            top: 12px;
        }
    }
    a {
        color: @medium-gray;
        &:hover {
            color: @dark-gray;
        }
    }
    .promo-slider {
        li, li a, img {
            height: 120px;
            width: 120px;
        }
        li {
            h3 {
                margin: 0;
                text-align: center;
                width: 100%;
            }
            a {
                .box-shadow(~'0 1px 2px 0 rgba(0,0,0,.3),'
                             '0 2px 1px 0 rgba(0,0,0,0.1),'
                             '0 0 0 1px rgba(0,0,0,.05),'
                             '0 0 12px 0 rgba(0,0,0,.05),'
                             '0 0 12px 0 rgba(0,0,0,.05) inset');
                .transition-duration(0.1s);
                .transition-property(~'background-color,'
                                      '-moz-box-shadow, -webkit-box-shadow,'
                                      'box-shadow, line-height');
                background-color: #D9DDE0;
                display: block;
                line-height: 120px;
                margin: 0 auto;
                text-align: center;
                &:hover {
                    .box-shadow(~'0 1px 2px 0 rgba(0,0,0,.3),'
                                 '0 4px 1px 0 rgba(0,0,0,.1),'
                                 '0 0 0 1px rgba(0,0,0,.05),'
                                 '0 0 12px 0 rgba(0,0,0,.05),'
                                 '0 0 48px 0 @white inset,'
                                 '0 -3px 0 0 rgba(0,0,0,.15) inset');
                    line-height: 118px;
                }
                &:active {
                    background-color: rgba(0,0,0,0.1);
                    .box-shadow(~'0 2px 0 0 rgba(0,0,0,.2) inset,'
                                 '0 12px 24px 6px rgba(0,0,0,.2) inset',
                                 '0 2px 2px 2px rgba(0,0,0,.2) inset');
                    line-height: 124px;
                }
            }
        }
        img {
            background: url(../../img/mkt/glyphs/rocket.png) 50% 50% no-repeat;
        }
    }
    .promo-slider ul a:after {
        bottom: 5px;
        right: 5px;
    }
}

.arrow.button {
    .border-box;
    .width(3);
    color: lighten(@text, 60%);
    font-size: 18px;
    line-height: 35px;
    position: relative;
    text-align: left;
    &:after {
        background: url(../../img/mkt/arrows/plain-lrg-go.png) 0 0 no-repeat;
        content: "";
        display: block;
        height: 19px;
        opacity: .7;
        position: absolute;
        top: 8px;
        right: 15px;
        width: 18px;
    }
    &:hover {
        color: @white;
        &:after {
            opacity: 1;
        }
    }
}

.html-rtl .arrow.button {
    text-align: right;
}

@import 'lib';

.home {
    #page {
        .box-shadow(none);
    }
}

.homepage-promo {
    background-image: url(../../img/mkt/grain.png),
                      linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -moz-linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -webkit-linear-gradient(#394C58, #60747F);
    background-image: url(../../img/mkt/grain.png),
                      -webkit-gradient(linear, left bottom, left top, from(#60747F), to(#394C58));
    /*.gradient-two-color(#394C58, #60747F);*/
    min-height: 320px;
    color: @white;
    text-shadow: 0 1px 0 rgba(0,0,0,.25);
    div {
        .border-box;
        background: url(../../img/mkt/quest.png) 100% 58px no-repeat;
        min-height: 330px;
        padding-top: 58px;
        position: relative;
        .width(10);
        margin: 0 auto;
    }
    p {
        font-size: 14px;
        width: 320px;
    }
    h1 {
        font-size: 48px;
        letter-spacing: -2px;
        line-height: 100%;
    }
}

@media (max-width: @10col) {
    .homepage-promo {
        div {
            .background-size(60% auto);
        }
        h2, p {
            .width(3);
        }
    }
    .home #page > section.full > div {
        margin: 0 15px;
        width: 100%;
    }
}

@media (max-width: @4col) {
    .homepage-promo div {
        background-position: 150% 58px;
    }
}

.featured, .popular {
    &.slider {
        height: 282px;
    }
}
.featured {
    background: #60747F;
    .grain;
    color: @white;
    &.slider {
        border-bottom: 1px solid #666;
    }
    a {
        color: lighten(@text, 60%);
        &:hover {
            color: @white;
        }
    }
}

.popular {
    h2 {
        padding-top: 10px;
    }
    a {
        color: @text;
        &:hover {
            color: darken(@text, 15%);
        }
    }
}

.popular, .categories {
    h2 {
        padding-top: 10px;
    }
}

.categories {
    background: @pale-bg;
    .controls {
        .next-page, .prev-page {
            height: 162px;
            top: 12px;
        }
    }
    a {
        color: @medium-gray;
        &:hover {
            color: @dark-gray;
        }
    }
    .promo-slider {
        li, li a, img {
            height: 120px;
            width: 120px;
        }
        li {
            h3 {
                margin: 0;
                text-align: center;
                width: 100%;
            }
            a {
                .box-shadow(~'0 1px 2px 0 rgba(0,0,0,.3),'
                             '0 2px 1px 0 rgba(0,0,0,0.1),'
                             '0 0 0 1px rgba(0,0,0,.05),'
                             '0 0 12px 0 rgba(0,0,0,.05),'
                             '0 0 12px 0 rgba(0,0,0,.05) inset');
                .transition-duration(0.1s);
                .transition-property(~'background-color,'
                                      '-moz-box-shadow, -webkit-box-shadow,'
                                      'box-shadow, line-height');
                background-color: #D9DDE0;
                display: block;
                line-height: 120px;
                margin: 0 auto;
                text-align: center;
                &:hover {
                    .box-shadow(~'0 1px 2px 0 rgba(0,0,0,.3),'
                                 '0 4px 1px 0 rgba(0,0,0,.1),'
                                 '0 0 0 1px rgba(0,0,0,.05),'
                                 '0 0 12px 0 rgba(0,0,0,.05),'
                                 '0 0 48px 0 @white inset,'
                                 '0 -3px 0 0 rgba(0,0,0,.15) inset');
                    line-height: 118px;
                }
                &:active {
                    background-color: rgba(0,0,0,0.1);
                    .box-shadow(~'0 2px 0 0 rgba(0,0,0,.2) inset,'
                                 '0 12px 24px 6px rgba(0,0,0,.2) inset',
                                 '0 2px 2px 2px rgba(0,0,0,.2) inset');
                    line-height: 124px;
                }
            }
        }
        img {
            background: url(../../img/mkt/glyphs/rocket.png) 50% 50% no-repeat;
        }
    }
    .promo-slider ul a:after {
        bottom: 5px;
        right: 5px;
    }
}

.arrow.button {
    .border-box;
    .width(3);
    color: lighten(@text, 60%);
    font-size: 18px;
    line-height: 35px;
    position: relative;
    text-align: left;
    &:after {
        background: url(../../img/mkt/arrows/plain-lrg-go.png) 0 0 no-repeat;
        content: "";
        display: block;
        height: 19px;
        opacity: .7;
        position: absolute;
        top: 8px;
        right: 15px;
        width: 18px;
    }
    &:hover {
        color: @white;
        &:after {
            opacity: 1;
        }
    }
}

.html-rtl .arrow.button {
    text-align: right;
}


Update static/vendors/bootstrap/less/media.less

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

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


Remove justification on StoryFull

Remove justification on StoryFull

@import "../../styles/custom.less";
@import "../../styles/fonts.less";

.StoryFull {
  margin: 12px 0;

  &__title {
    color: #353535;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.3em;
  }

  &__comments_title {
    color: @purple;
    font-weight: 500;
    margin-top: 8px;
  }

  &__topics {
    margin: 16px 0;

    & > .Topic {
      margin: 2px 4px 2px 0;
    }
  }

  &__header {
    position: relative;
    display: flex;
    padding: 16px 0;

    &__text {
      margin-left: 16px;

      & > a {
        display: block;
        font-size: 20px;
        font-weight: bold;
      }

      &__date {
        color: #99aab5;
        font-size: 14px;
      }
    }

    &__more {
      position: absolute;
      right: 8px;
      top: 36px;
      line-height: 12px !important;
      font-size: 36px !important;
      color: @purple;

      &:hover {
        cursor: pointer;
        color: darken(@purple, 15%);
      }
    }
  }

  &__content {
    font-family: @font-text;
    color: rgba(0, 0, 0, .8);

    & h1, h2, h3, h4, h5, h6 {
      margin: 8px 0;
    }

    & p:not(:empty) {
      margin: 32px 0;
      line-height: 1.6em;
      font-size: 21px;
    }

    & img {
      margin: 0 auto;
      max-width: 100%;
      display: block;
    }
  }
}

@import "../../styles/custom.less";
@import "../../styles/fonts.less";

.StoryFull {
  margin: 12px 0;

  &__title {
    color: #353535;
    font-size: 34px;
    font-weight: 700;
    line-height: 1.3em;
  }

  &__comments_title {
    color: @purple;
    font-weight: 500;
    margin-top: 8px;
  }

  &__topics {
    margin: 16px 0;

    & > .Topic {
      margin: 2px 4px 2px 0;
    }
  }

  &__header {
    position: relative;
    display: flex;
    padding: 16px 0;

    &__text {
      margin-left: 16px;

      & > a {
        display: block;
        font-size: 20px;
        font-weight: bold;
      }

      &__date {
        color: #99aab5;
        font-size: 14px;
      }
    }

    &__more {
      position: absolute;
      right: 8px;
      top: 36px;
      line-height: 12px !important;
      font-size: 36px !important;
      color: @purple;

      &:hover {
        cursor: pointer;
        color: darken(@purple, 15%);
      }
    }
  }

  &__content {
    font-family: @font-text;
    color: rgba(0, 0, 0, .8);

    & h1, h2, h3, h4, h5, h6 {
      margin: 8px 0;
    }

    & p:not(:empty) {
      text-align: justify;
      margin: 32px 0;
      line-height: 1.6em;
      font-size: 21px;
    }

    & img {
      margin: 0 auto;
      max-width: 100%;
      display: block;
    }
  }
}


reduced controls bar width in fullscreen

// @import url('../core/vars.less');

#player {
	display: block;
	clear:both;
}
@media (min-width: 320px) {
	.youtube-toolbar {
		.media-info {
			float: left;
		}
	}
	.youtube-player {
		border: 0;

		.dropdown .dropdown-menu,
		.dropup .dropdown-menu {
			position: absolute;
		}

		.nav.navbar-nav {
			margin: 0;
		}

		.add-to-playlist {
			display: block;
			padding: 15px;
			background: transparent;
			border: none;
			width: 100%;

			&:hover {
				background-color: @primary-color;
			}
		}

		.current-playlist-info {
			display: none;

			.playlist-provider-item {
				height: 52px;

				img {
					width: 60px;
				}
			}
		}

		.current-track-info-container {
			.btn.dropdown-toggle {
				padding: 1px;
				height: 46px;
				width: 100px;

				.caret {
					margin-top: -28px;
					margin-right: 8px;
				}
			}
			.yt-media-title {
				display: inline-block;
				width: 90%;
				line-height: 38px;

				img {
					height: 38px;
					margin-right: 5px;
				}
			}
		}
	}
}
@media (min-width: 768px) {
	.youtube-toolbar {
		.yt-media-title {
			width: 450px;
		}
		.donation {
			display: none;
		}
	}

	.youtube-player {
		.current-track-info-container {
			.btn.dropdown-toggle {
				width: 405px;
			}
		}

		.nav.navbar-nav .current-track-info-container .dropdown-menu div.track-info {
			width: 400px;
		}
	}
}
@media (min-width: 1024px) {
	.donation {
		display: block;

		li form {
			padding: 6px;
		}
	}

}
.youtube-toolbar {
	position: relative;
	z-index: @zindex-navbar-fixed;
	margin: 0;
	float: left;

	.navbar-inner {
		border-radius: 0;
	}

	.player-controls .btn {
		// padding: 8px 20px;
		border: none;
		border-bottom: 4px solid #333;
		background: transparent;
		color:whitesmoke;
		border-radius: 0;
	}

	> li > button.play:hover,
	> li > button.pause:hover {
		padding:5px 20px;
	}

	.play {
		padding:5px 20px;
		font-size: 25px;
	}

	.pause {
		display: none;
		padding: 5px 20px;
		font-size: 25px;
	}
}

.control-button-active(){
	border-bottom: 4px solid @turquoise;
}

.yt-playing {
	.play {
		display: none;
	}

	.pause {
		display: inline-block;
	}
}

.youtube-player {
	z-index: @zindex-navbar-fixed;

	&.fullscreen .btn.fullscreen {
		.control-button-active();
		i {
			.transform(scale(.8) rotate(45deg));
		}
	}

	&.fullscreen.show-youtube-player {
		@toolbar-position-on-hover: -55px;
		.container-fluid {
			position: fixed;
			.transform(translatey(40px));
			opacity: .6;

			&:hover {
				.transform(translatey(@toolbar-position-on-hover));
			}
		}
		.yt-player {
			top: 40px;

			&:hover + .container-fluid {
				.transform(translatey(@toolbar-position-on-hover));
			}
		}
	}

	.youtube-toolbar.navbar-inner {
		box-shadow: 0 0px 10px 2px rgba(0, 0, 0, 0.56);
		background: #323538;
		border: none;
	}
	> .navbar-inner {
		border-color: #555;
	}
	.container-fluid {
		padding: 0;
		z-index: @zindex-navbar-fixed;
		background-color: @gray-darker;
		position: relative;
		transition: all .3s ease-out;
	}
	.progress {
		position: absolute;
		left:0;
		bottom: 0;
		z-index: 9;
	}
	.nav.navbar-nav .dropdown-menu,
	.nav.navbar-nav .open .dropdown-menu {
		box-shadow: 0 0 5px black;
		background: @bg-dark-color;
		border-radius: 0;

		.track-info,
		.playlist-info {
			width: auto;
			max-width: 400px;
			overflow: auto;
			white-space: pre-line;
			padding: 0;
			color: white;
			max-height: 240px;
			word-wrap: break-word;
		}
		li a {
			color: @inverse;
		}
	}

	.current-playlist-info .playlist-info .active a,
	.current-playlist-info .playlist-info  a:hover {
		background: @turquoise;
	}

	.current-track-info {
		font-family: Asap;
		.btn {
			background-color: #1abc9c;
			background-image: none;
			color: white;
			text-shadow: none;
			outline: none;
		}
		.btn.dropdown-toggle {
			padding: 3px 10px 0;
			margin: 0;
			height: 46px;
			border: 0;
			border-radius: 0;
			.caret {
				border-top-color: #fff;
				border-bottom-color: #fff;
			}
		}

		.dropup > .dropdown-menu:after {
			left: 18px;
		}

	}

	.show-player i {
		transform: rotateZ(0deg);
	}

	&.show-youtube-player .player-controls .btn.show-player {
		.control-button-active();

		i {
			transform: rotateZ(180deg);
		}
	}

	.now-playing-actions {
		.dropdown-toggle {
			padding: 13px 15px;
			background-color: @primary-color;
			color: @btn-primary-color;

			&:hover, &:focus {
				color: white;
				background-color: @primary-color;
			}
		}

		.dropdown-menu:after {
			left: 18px;
		}
	}
}

.yt-player {
	z-index: @zindex-navbar;
	position: absolute;
	left: 0;
	top:0;
	box-shadow: 1px -1px 2px 0px rgba(0, 0, 0, 1);
	background: rgba(0,0,0,.8);
	transition-duration: 0.5s;
	-webkit-transform: translate3d(0,20%,0);
	-moz-transform: translate3d(0,20%,0);
	transform: translate3d(0,20%,0);
}
.show-youtube-player .yt-player {
	-webkit-transform: translate3d(0,-100%,0);
	-moz-transform: translate3d(0,-100%,0);
	transform: translate3d(0,-100%,0);
}

.youtube-toolbar li > button {
	padding: 10px 20px;
	box-shadow: inset 0 0 0 #000;
	border: none;
	border-bottom: 4px solid #333;
	background: transparent;
	color:whitesmoke;
}

// @import url('../core/vars.less');

#player {
	display: block;
	clear:both;
}
@media (min-width: 320px) {
	.youtube-toolbar {
		.media-info {
			float: left;
		}
	}
	.youtube-player {
		border: 0;

		.dropdown .dropdown-menu,
		.dropup .dropdown-menu {
			position: absolute;
		}

		.nav.navbar-nav {
			margin: 0;
		}

		.add-to-playlist {
			display: block;
			padding: 15px;
			background: transparent;
			border: none;
			width: 100%;

			&:hover {
				background-color: @primary-color;
			}
		}

		.current-playlist-info {
			display: none;

			.playlist-provider-item {
				height: 52px;

				img {
					width: 60px;
				}
			}
		}

		.current-track-info-container {
			.btn.dropdown-toggle {
				padding: 1px;
				height: 46px;
				width: 100px;

				.caret {
					margin-top: -28px;
					margin-right: 8px;
				}
			}
			.yt-media-title {
				display: inline-block;
				width: 90%;
				line-height: 38px;

				img {
					height: 38px;
					margin-right: 5px;
				}
			}
		}
	}
}
@media (min-width: 768px) {
	.youtube-toolbar {
		.yt-media-title {
			width: 450px;
		}
		.donation {
			display: none;
		}
	}

	.youtube-player {
		.current-track-info-container {
			.btn.dropdown-toggle {
				width: 405px;
			}
		}

		.nav.navbar-nav .current-track-info-container .dropdown-menu div.track-info {
			width: 400px;
		}
	}
}
@media (min-width: 1024px) {
	.donation {
		display: block;

		li form {
			padding: 6px;
		}
	}

}
.youtube-toolbar {
	position: relative;
	z-index: @zindex-navbar-fixed;
	margin: 0;
	float: left;

	.navbar-inner {
		border-radius: 0;
	}

	.player-controls .btn {
		// padding: 8px 20px;
		border: none;
		border-bottom: 4px solid #333;
		background: transparent;
		color:whitesmoke;
		border-radius: 0;
	}

	> li > button.play:hover,
	> li > button.pause:hover {
		padding:5px 20px;
	}

	.play {
		padding:5px 20px;
		font-size: 25px;
	}

	.pause {
		display: none;
		padding: 5px 20px;
		font-size: 25px;
	}
}

.control-button-active(){
	border-bottom: 4px solid @turquoise;
}

.yt-playing {
	.play {
		display: none;
	}

	.pause {
		display: inline-block;
	}
}

.youtube-player {
	z-index: @zindex-navbar-fixed;

	&.fullscreen .btn.fullscreen {
		.control-button-active();
		i {
			.transform(scale(.8) rotate(45deg));
		}
	}

	&.fullscreen.show-youtube-player {
		@toolbar-position-on-hover: -55px;
		.container-fluid {
			position: fixed;
			.transform(translatey(40px));
			width: 100%;
			opacity: .6;

			&:hover {
				.transform(translatey(@toolbar-position-on-hover));
			}
		}
		.yt-player {
			top: 40px;

			&:hover + .container-fluid {
				.transform(translatey(@toolbar-position-on-hover));
			}
		}
	}

	.youtube-toolbar.navbar-inner {
		box-shadow: 0 0px 10px 2px rgba(0, 0, 0, 0.56);
		background: #323538;
		border: none;
	}
	> .navbar-inner {
		border-color: #555;
	}
	.container-fluid {
		padding: 0;
		z-index: @zindex-navbar-fixed;
		background-color: @gray-darker;
		position: relative;
		transition: all .3s ease-out;
	}
	.progress {
		position: absolute;
		left:0;
		bottom: 0;
		z-index: 9;
	}
	.nav.navbar-nav .dropdown-menu,
	.nav.navbar-nav .open .dropdown-menu {
		box-shadow: 0 0 5px black;
		background: @bg-dark-color;
		border-radius: 0;

		.track-info,
		.playlist-info {
			width: auto;
			max-width: 400px;
			overflow: auto;
			white-space: pre-line;
			padding: 0;
			color: white;
			max-height: 240px;
			word-wrap: break-word;
		}
		li a {
			color: @inverse;
		}
	}

	.current-playlist-info .playlist-info .active a,
	.current-playlist-info .playlist-info  a:hover {
		background: @turquoise;
	}

	.current-track-info {
		font-family: Asap;
		.btn {
			background-color: #1abc9c;
			background-image: none;
			color: white;
			text-shadow: none;
			outline: none;
		}
		.btn.dropdown-toggle {
			padding: 3px 10px 0;
			margin: 0;
			height: 46px;
			border: 0;
			border-radius: 0;
			.caret {
				border-top-color: #fff;
				border-bottom-color: #fff;
			}
		}

		.dropup > .dropdown-menu:after {
			left: 18px;
		}

	}

	.show-player i {
		transform: rotateZ(0deg);
	}

	&.show-youtube-player .player-controls .btn.show-player {
		.control-button-active();

		i {
			transform: rotateZ(180deg);
		}
	}

	.now-playing-actions {
		.dropdown-toggle {
			padding: 13px 15px;
			background-color: @primary-color;
			color: @btn-primary-color;

			&:hover, &:focus {
				color: white;
				background-color: @primary-color;
			}
		}

		.dropdown-menu:after {
			left: 18px;
		}
	}
}

.yt-player {
	z-index: @zindex-navbar;
	position: absolute;
	left: 0;
	top:0;
	box-shadow: 1px -1px 2px 0px rgba(0, 0, 0, 1);
	background: rgba(0,0,0,.8);
	transition-duration: 0.5s;
	-webkit-transform: translate3d(0,20%,0);
	-moz-transform: translate3d(0,20%,0);
	transform: translate3d(0,20%,0);
}
.show-youtube-player .yt-player {
	-webkit-transform: translate3d(0,-100%,0);
	-moz-transform: translate3d(0,-100%,0);
	transform: translate3d(0,-100%,0);
}

.youtube-toolbar li > button {
	padding: 10px 20px;
	box-shadow: inset 0 0 0 #000;
	border: none;
	border-bottom: 4px solid #333;
	background: transparent;
	color:whitesmoke;
}


Delete rotated-flipped.less

Delete rotated-flipped.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/hackersvsharassment/hackersvsharassment.github.io.git/'


Upgrades to the variables.less file.

Upgrades to the variables.less file.

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


Initial commit

Initial commit

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


center listing adjustments

center listing adjustments

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


comment glyphicons because of FontAw

comment glyphicons because of FontAw

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