Commit 8641c808 authored by Kevin Funk's avatar Kevin Funk Committed by Nicolas Borda
Browse files

Issue #3304623 by kevinfunk: Do not embed styles.css from library demo directory

parent 32356b38

css/tiny_slider.css

0 → 100755
+394 −0
Original line number Diff line number Diff line 
.tns-outer { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; margin: 0; padding: 0; }

.tns-outer li { list-style: none; }

.tns-outer ul, .tns-outer ol, .tns-outer li { margin: 0; padding: 0; }

.tns-outer pre[class*="language-"] > code[data-language] { overflow: auto !important; }

.tns-outer section { margin: 50px 0; }

.tns-outer h1 { font-size: 45px; }

.tns-outer h2 {

  padding-top: 60px;

  text-align: center;

}

@media (min-width: 300px) and (max-width: 799px) {

  .tns-outer h2 { padding-top: 20%; }

}

@media (min-width: 800px) {

  .tns-outer h2 { padding-top: 160px; }

}

.tns-outer p {

  margin: 0;

  padding: 0.8em 0;

  line-height: 1.4;

  font-weight: 300;

  text-align: center;

}

.tns-outer a:focus {

  outline: 1px solid red;

}

.tns-outer img { max-width: 100%; }

.tns-outer img:not(.tns-lazy-img), .lazyload img { height: auto; }

.tns-outer .autoWidth img { max-width: none; }

.tns-outer .autoHeight img { width: 100%; }

.tns-outer .img {

  font-size: 100px;

  font-weight: 100;

  color: #fff;

  text-align: center;

}

.tns-outer .img a {

  display: block;

  padding: 22% 0;

  color: inherit;

  text-decoration: none;

}

.tns-outer .visually-hidden {

  position: fixed;

  left: -10000px;

  opacity: 0;

}



/* nav */

.tns-outer .nav.active ul { left: 0; }

.tns-outer .nav.active .nav-toggle-handle { left: 17em; }

.tns-outer .nav.active .nav-toggle-handle:before { display: inline-block; }

.tns-outer .nav.active .nav-toggle-handle:after { display: none; }

.tns-outer .nav ul {

  position: fixed;

  top: 0;

  left: -17em;

  z-index: 100;

  width: 17em;

  height: 1000px;

  height: 100vh;

  background-color: #fff;

  -webkit-box-shadow: 2px 0 15px rgba(0, 0, 0, 0.15);

  box-shadow: 2px 0 15px rgba(0, 0, 0, 0.15);

  transition: left 0.25s;

  overflow-y: auto;

}

.tns-outer .nav a {

  display: block;

  padding: 0.7em 1em;

  color: inherit;

  text-decoration: none;

}

.tns-outer .nav a:hover { background-color: #F3F3F3; }

.tns-outer .nav .active {

  color: #fff;

  background-color: #af23ff !important;

}

.tns-outer .nav-toggle-handle {

  position: fixed;

  transition: left 0.25s;

  left: 0;

  top: 0;

  z-index: 100;

  padding: 10px;

  color: #fff;

  background-color: #af23ff;

  cursor: pointer;

}

.tns-outer .nav-toggle-handle:before {

  display: none;

  padding-right: 5px;

  content: '◄';

  font-size: 0.8em;

}

.tns-outer .nav-toggle-handle:after {

  padding-left: 5px;

  content: '►';

  font-size: 0.8em;

}



.tns-outer .img-1 { background: #D6D65B; background: hsl(60, 60%, 60%); }

.tns-outer .img-2 { background: #5BD6AD; background: hsl(160, 60%, 60%); }

.tns-outer .img-3 { background: #5B99D6; background: hsl(210, 60%, 60%); }

.tns-outer .img-4 { background: #D65BC1; background: hsl(310, 60%, 60%); }

.tns-outer .img-5 { background: #70D65B; background: hsl(110, 60%, 60%); }

.tns-outer .img-6 { background: #D65B5B; background: hsl(0, 60%, 60%); }

.tns-outer .img-7 { background: #D6995B; background: hsl(30, 60%, 60%); }

.tns-outer .img-8 { background: #705BD6; background: hsl(250, 60%, 60%); }

.tns-outer .customize-tools { position: relative; }

.tns-outer .thumbnails {

  margin: 20px 0;

  text-align: center;

}

.tns-outer .thumbnails li {

  display: inline-block;

  cursor: pointer;

  border: 5px solid #fff;

}

.tns-outer .thumbnails .tns-nav-active {

  background: none;

  border-color: #000;

}

.tns-outer .thumbnails li { width: 50px; }

.tns-outer .thumbnails img { vertical-align: bottom; height: auto; max-height: 50px; }

.tns-outer .controls { text-align: center; }

.tns-outer .controls li {

  display: block;

  position: absolute;

  top: 50%;

  height: 60px;

  line-height: 60px;

  margin-top: -30px;

  padding: 0 15px;

  cursor: pointer;

  transition: background 0.3s;

}

.tns-outer .controls li img { display: inline-block; vertical-align: middle; }

.tns-outer .controls .prev { left: 0; }

.tns-outer .controls .next { right: 0; }

.tns-outer .controls li:hover { background: #f2f2f2; }



.tns-outer .tns-controls { text-align: center; margin-bottom: 10px; }

.tns-outer .tns-controls [aria-controls] {

  font-size: 15px;

  margin: 0 5px;

  padding: 0 1em;

  height: 2.5em;

  color: #000;

  background: #66CCFF;

  border-radius: 3px;

  border: 0;

}

.tns-outer .lt-ie9 .tns-controls > [aria-controls] {

  line-height: 2.5em;

}

.tns-outer [data-action] {

  display: block;

  margin: 10px auto;

  font-size: 17px;

  min-width: 3em;

  text-align: center;

  background: transparent;

  border: 0;

}

.tns-outer .tns-controls [disabled] {

  color: #999999;

  background: #B3B3B3;

  cursor: not-allowed !important;

}

.tns-outer .tns-nav {

  text-align: center;

  margin: 10px 0;

}

.tns-outer .tns-nav > [aria-controls] {

  width: 9px;

  height: 9px;

  padding: 0;

  margin: 0 5px;

  border-radius: 50%;

  background: #ddd;

  border: 0;

}

.tns-outer .tns-nav > .tns-nav-active { background: #999; }

.tns-outer .playbutton-wrapper { text-align: center; }

.tns-outer .playbutton-wrapper button { height: 34px; padding: 0 10px; font-size: 14px; background: #fff; border-radius: 3px; border: 1px solid  #ccc; cursor: pointer; }

.tns-outer .wrapper { padding: 0 5em; }

.tns-outer .suite-container .title,

.tns-outer .suite-container .subtitle,

.tns-outer .suite-container li { padding: 5px 10px; }

.tns-outer .suite-container li {

  font-size: 12px;

  line-height: 1.4;

  background: #f5f5f5;

}

.tns-outer .suite-container .title { font-size: 14px; font-weight: bold; background: #8acac6; text-transform: capitalize; }

.tns-outer .suite-container .subtitle { font-size: 13px; font-weight: bold; background: #dedede; text-transform: capitalize; }

.tns-outer .suite-container .fail { background: #FFADE2; }



.tns-outer [class*="vertical"] .img { padding: 30px 0; }

.tns-outer [class*="vertical"] .img:before { content: ''; display: inline-block; width: 1px; margin-right: -1px; height: 100%; vertical-align: middle; }

.tns-outer [class*="vertical"] .img a { display: inline-block; padding: 0; }

.tns-outer [class*="vertical"] .img-1 { height: 137px; }

.tns-outer [class*="vertical"] .img-2 { height: 122px; }

.tns-outer [class*="vertical"] .img-3 { height: 143px; }

.tns-outer [class*="vertical"] .img-4 { height: 325px; }

.tns-outer [class*="vertical"] .img-5 { height: 140px; }

.tns-outer [class*="vertical"] .img-6 { height: 119px; }

.tns-outer [class*="vertical"] .img-7 { height: 223px; }

.tns-outer [class*="vertical"] .img-8 { height: 164px; }



/* reset prism */

.tns-outer pre[class*="language-"] { margin: 0; }



/* test results */

.tns-outer .test-results {

  line-height: 1.4;

  padding: 20px 10%;

  background-color: #f2f2f2;

}



/* go to */

.tns-outer .goto-controls {

  margin-bottom: 10px;

  text-align: center;

}

.tns-outer .goto-controls input,

.tns-outer .goto-controls .button {

  display: inline-block;

  font-size: 14px;

  height: 2.6em;

  line-height: 2.6;

  padding: 0 1em;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

  vertical-align: middle;

}

.tns-outer .goto-controls input {

  border: 1px solid  #ccc;

}

.tns-outer .goto-controls .button {

  min-width: 4em;

  border: none;

  color: #fff;

  background-color: #333;

  cursor: pointer;

}



/* test results */

.tns-outer .test-results { line-height: 1.6; }

.tns-outer .test-results .title { font-weight: bold; text-transform: capitalize; }

.tns-outer .test-results .title:nth-child(n+2) { margin-top: 1em; }

.tns-outer .test-results [class*="item"] { margin-left: 1em; font-size: 0.9em; }

.tns-outer .test-results [class*="item"] { font-weight: 300; }

.tns-outer .test-results [class*="item"]:after { margin-left: 0.5em; }

.tns-outer .test-results .item-success { color: #0EB80E; }

.tns-outer .test-results .item-success:after { content: '✓'; }

.tns-outer .test-results .item-fail { color: #ED1E1E; }

.tns-outer .test-results .item-fail:after { content: '✗'; }

.tns-outer .test-results .item-comment { font-style: italic; color: #666; }

.tns-outer .test-results .item-notsure:after { content: '？'; }

.tns-outer .test-results .item-running:after {

  display: inline-block;

  height: 16px;

  content: url('../images/pinwheel.svg');

  vertical-align: middle;

}

.tns-outer .customize-tools [hidden] { display: none; }



/* https://daneden.github.io/animate.css/ */

@-webkit-keyframes jello {

  from,

  11.1%,

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }



  22.2% {

    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg);

  }



  33.3% {

    -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg);

  }



  44.4% {

    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg);

  }



  55.5% {

    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg);

  }



  66.6% {

    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg);

  }



  77.7% {

    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

    transform: skewX(0.390625deg) skewY(0.390625deg);

  }



  88.8% {

    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

  }

}



@keyframes jello {

  from,

  11.1%,

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }



  22.2% {

    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg);

  }



  33.3% {

    -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg);

  }



  44.4% {

    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg);

  }



  55.5% {

    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg);

  }



  66.6% {

    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg);

  }



  77.7% {

    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

    transform: skewX(0.390625deg) skewY(0.390625deg);

  }



  88.8% {

    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

  }

}



.tns-outer .jello {

  -webkit-animation-name: jello;

  animation-name: jello;

  -webkit-transform-origin: center;

  transform-origin: center;

}



@-webkit-keyframes rollOut {

  from {

    opacity: 1;

  }



  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

  }

}



@keyframes rollOut {

  from {

    opacity: 1;

  }



  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

  }

}



.tns-outer .rollOut {

  -webkit-animation-name: rollOut;

  animation-name: rollOut;

}

tiny_slider.libraries.yml

+1 −1
Original line number Diff line number Diff line
@@ -7,7 +7,7 @@ tiny_slider: 
  css:

    theme:

      /libraries/tiny-slider/dist/tiny-slider.css: {}

      /libraries/tiny-slider/demo/css/styles.css: {}

      css/tiny_slider.css: {}

  js:

    /libraries/tiny-slider/dist/tiny-slider.js: {}

    js/tiny_slider.js: {}