slippery 0.4.0 → 0.4.2

data/assets/shower/themes/ribbon/styles/blocks/progress.css

@@ -0,0 +1,46 @@
+/* Progress */
+
+.progress {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 0;
+    height: var(--progress-size);
+    overflow: hidden;
+    transition: all 0.2s linear;
+}
+
+.progress::before {
+    display: block;
+    width: 100%;
+    height: var(--progress-size);
+    background: var(--color-blue);
+    content: '';
+    transform-origin: 0 100%;
+    transform: skewX(45deg);
+}
+
+.progress[style*='100%']::before {
+    transform: none;
+}
+
+/* List */
+
+.shower.list .progress {
+    display: none;
+}
+
+/* Full */
+
+.shower.full .progress {
+    display: block;
+}
+
+/* Print */
+
+@media print {
+    .shower.list .progress,
+    .shower.full .progress {
+        display: none;
+    }
+}

data/assets/shower/themes/ribbon/styles/blocks/region.css

@@ -0,0 +1,29 @@
+/* Region */
+
+.region {
+    position: absolute;
+    top: 0;
+    left: 0;
+    clip: rect(0 0 0 0);
+}
+
+/* List */
+
+.shower.list .region {
+    display: none;
+}
+
+/* Full */
+
+.shower.full .region {
+    display: block;
+}
+
+/* Print */
+
+@media print {
+    .shower.list .region,
+    .shower.full .region {
+        display: none;
+    }
+}

data/assets/shower/themes/ribbon/styles/fonts.css

@@ -0,0 +1,64 @@
+/* PT Sans */
+
+@font-face {
+    font-family: 'PT Sans';
+    font-display: swap;
+    src:
+        local('PT Sans'),
+        local('PTSans-Regular'),
+        url('../fonts/pt-sans-regular.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: 'PT Sans';
+    font-weight: bold;
+    font-display: swap;
+    src:
+        local('PT Sans Bold'),
+        local('PTSans-Bold'),
+        url('../fonts/pt-sans-bold.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: 'PT Sans';
+    font-style: italic;
+    font-display: swap;
+    src:
+        local('PT Sans Italic'),
+        local('PTSans-Italic'),
+        url('../fonts/pt-sans-italic.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: 'PT Sans';
+    font-style: italic;
+    font-weight: bold;
+    font-display: swap;
+    src:
+        local('PT Sans Bold Italic'),
+        local('PTSans-BoldItalic'),
+        url('../fonts/pt-sans-bold-italic.woff2') format('woff2');
+}
+
+/* PT Narrow */
+
+@font-face {
+    font-family: 'PT Sans Narrow';
+    font-weight: bold;
+    font-display: swap;
+    src:
+        local('PT Sans Narrow Bold'),
+        local('PTSans-NarrowBold'),
+        url('../fonts/pt-sans-narrow-bold.woff2') format('woff2');
+}
+
+/* PT Mono */
+
+@font-face {
+    font-family: 'PT Mono';
+    font-display: swap;
+    src:
+        local('PT Mono'),
+        local('PTMono-Regular'),
+        url('../fonts/pt-mono-regular.woff2') format('woff2');
+}

data/assets/shower/themes/ribbon/styles/shower/grid.svg

@@ -0,0 +1,40 @@
+<svg width="1024" height="768" xmlns="http://www.w3.org/2000/svg">
+	<defs>
+		<style>
+			.square {
+				stroke: red;
+                stroke-opacity: 0.1;
+				stroke-width: 1;
+				fill: transparent;
+			}
+
+            .grid {
+                fill: url(#grid);
+            }
+
+            .line {
+                stroke: #8af8f9;
+            }
+		</style>
+		<pattern x="0" y="0" width="25" height="25" viewBox="0 0 25 25" patternUnits="userSpaceOnUse" id="grid">
+			<rect x="0" y="0" width="25" height="25" class="square"/>
+		</pattern>
+	</defs>
+
+	<rect x="0" y="0" width="1024" height="768" class="grid"/>
+
+	<line x1="100" x2="100" y1="0" y2="768" class="line"/>
+	<line x1="475" x2="475" y1="0" y2="768" class="line"/>
+	<line x1="550" x2="550" y1="0" y2="768" class="line"/>
+	<line x1="925" x2="925" y1="0" y2="768" class="line"/>
+
+	<line y1="125" y2="125" x1="0" x2="1024" class="line"/>
+	<line y1="200" y2="200" x1="0" x2="1024" class="line"/>
+	<line y1="275" y2="275" x1="0" x2="1024" class="line"/>
+	<line y1="350" y2="350" x1="0" x2="1024" class="line"/>
+	<line y1="425" y2="425" x1="0" x2="1024" class="line"/>
+	<line y1="500" y2="500" x1="0" x2="1024" class="line"/>
+	<line y1="575" y2="575" x1="0" x2="1024" class="line"/>
+	<line y1="650" y2="650" x1="0" x2="1024" class="line"/>
+	<line y1="725" y2="725" x1="0" x2="1024" class="line"/>
+</svg>

data/assets/shower/themes/ribbon/styles/shower/shower-full.css

@@ -0,0 +1,13 @@
+/* Shower Full */
+
+.shower.full {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    overflow: hidden;
+    margin-top: calc(var(--slide-height) / 2 * -1);
+    margin-left: calc(var(--slide-width) / 2 * -1);
+    width: var(--slide-width);
+    height: var(--slide-height);
+    background: black;
+}

data/assets/shower/themes/ribbon/styles/shower/shower-grid.css

@@ -0,0 +1,13 @@
+/* Shower Grid */
+
+.shower.full.grid::before {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1;
+    content: '';
+    pointer-events: none;
+    background-image: url('grid.svg');
+}

data/assets/shower/themes/ribbon/styles/shower/shower-list.css

@@ -0,0 +1,30 @@
+/* Shower List */
+
+.shower.list {
+    padding-top: 25px;
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    background: var(--color-grey);
+}
+
+/* IE & Edge Fix */
+
+.shower.list {
+    position: absolute;
+    clip: rect(0, auto, auto, 0);
+}
+
+/* Responsive */
+
+@media (min-width: 1174px) {
+    .shower.list {
+        padding-top: 50px;
+    }
+}
+
+@media (min-width: 2348px) {
+    .shower.list {
+        padding-top: 100px;
+    }
+}

data/assets/shower/themes/ribbon/styles/shower/shower-print.css

@@ -0,0 +1,11 @@
+/* Shower Print */
+
+@page {
+    margin: 0;
+    size: 1024px 576px;
+}
+
+.shower {
+    -webkit-print-color-adjust: exact;
+    text-rendering: geometricPrecision;
+}

data/assets/shower/themes/ribbon/styles/shower/shower.css

@@ -0,0 +1,32 @@
+/* Shower */
+
+@import 'shower-list.css' screen;
+@import 'shower-full.css' screen;
+@import 'shower-grid.css' screen;
+@import 'shower-print.css' print;
+
+.shower {
+    --slide-gap: 100px;
+    --slide-ratio: calc(16 / 9);
+    --slide-width: 1024px;
+    --slide-height: calc(var(--slide-width) / var(--slide-ratio));
+
+    --color-blue: #4b86c2;
+    --color-red: #cc0000;
+    --color-yellow: #fafaa2;
+    --color-grey: #585a5e;
+    --color-fill: rgba(88, 90, 94, 0.1);
+    --color-line: rgba(88, 90, 94, 0.5);
+
+    --ribbon-size: 50px;
+    --progress-size: 10px;
+
+    -webkit-text-size-adjust: none;
+    -moz-text-size-adjust: none;
+    -ms-text-size-adjust: none;
+
+    margin: 0;
+    color: black;
+    counter-reset: slide;
+    font: 25px/2 'PT Sans', sans-serif;
+}

data/assets/shower/themes/ribbon/styles/slide/content/basic.css

@@ -0,0 +1,21 @@
+/* Basic */
+
+.slide h2 {
+    margin-top: 0;
+    margin-bottom: 34px;
+    color: var(--color-grey);
+    font: bold 50px/1 'PT Sans Narrow', sans-serif;
+}
+
+.slide p {
+    margin-top: 0;
+    margin-bottom: 1em;
+}
+
+.slide p.note {
+    color: var(--color-grey);
+}
+
+.slide figure {
+    margin: 0;
+}

data/assets/shower/themes/ribbon/styles/slide/content/code.css

@@ -0,0 +1,82 @@
+/* Code */
+
+.slide pre {
+    margin-top: 0;
+    margin-bottom: 1em;
+    counter-reset: code;
+    white-space: normal;
+}
+
+/* Inner */
+
+.slide pre code {
+    display: block;
+    margin-left: -100px;
+    padding: 0 0 0 100px;
+    width: calc(100% + 100px + 100px);
+    border-radius: 0;
+    background: none;
+    line-height: 2;
+    white-space: pre;
+    tab-size: 4;
+}
+
+/* Line Numbers */
+
+.slide pre code:not(:only-child)::before {
+    position: absolute;
+    margin-left: -2em;
+    color: var(--color-grey);
+    opacity: 0.75;
+    counter-increment: code;
+    content: counter(code, decimal-leading-zero) '.';
+}
+
+/* Marked */
+
+.slide pre mark {
+    position: relative;
+    z-index: -1;
+    margin: 0 -0.3em;
+}
+
+/* Important */
+
+.slide pre mark.important {
+    background: var(--color-red);
+    color: #ffffff;
+}
+
+/* Comment */
+
+.slide pre .comment {
+    color: #999999;
+}
+
+/* Marked Line */
+
+.slide pre code.mark:not(:only-child) {
+    background: var(--color-fill);
+}
+
+/* Next Line */
+
+.slide pre code.mark.next:not(:only-child) {
+    visibility: visible;
+    background: none;
+}
+
+.slide pre code.mark.next.active:not(:only-child) {
+    background: var(--color-fill);
+}
+
+/* Full */
+
+.shower.full .slide pre code:not(:only-child).mark.next {
+    visibility: visible;
+    background: none;
+}
+
+.shower.full .slide pre code:not(:only-child).mark.next.active {
+    background: var(--color-fill);
+}

data/assets/shower/themes/ribbon/styles/slide/content/footer.css

@@ -0,0 +1,29 @@
+/* Footer */
+
+.slide > footer {
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1;
+    padding: 50px 100px 25px;
+    background: var(--color-yellow);
+    transition: transform 0.3s linear;
+}
+
+/* List */
+
+.shower.list .slide > footer {
+    transform: translateY(100%);
+}
+
+.shower.list .slide.active > footer,
+.shower.list .slide:hover > footer {
+    transform: translateY(0);
+}
+
+/* Full */
+
+.shower.full .slide > footer {
+    display: none;
+}

data/assets/shower/themes/ribbon/styles/slide/content/inline.css

@@ -0,0 +1,50 @@
+/* Inline */
+
+.slide a {
+    background-image:
+        linear-gradient(
+            to top,
+            currentColor 0.09em,
+            transparent 0.09em
+        );
+    background-repeat: repeat-x;
+    color: var(--color-blue);
+    text-decoration: none;
+}
+
+.slide code,
+.slide kbd,
+.slide mark,
+.slide samp {
+    margin: 0 -0.3em;
+    padding: 0.1em 0.3em;
+    border-radius: 0.2em;
+}
+
+.slide code,
+.slide kbd,
+.slide samp {
+    background: var(--color-fill);
+    line-height: 1;
+    font-family: 'PT Mono', monospace;
+}
+
+.slide mark {
+    background: var(--color-yellow);
+}
+
+.slide sub,
+.slide sup {
+    position: relative;
+    vertical-align: baseline;
+    line-height: 0;
+    font-size: 75%;
+}
+
+.slide sub {
+    bottom: -0.25em;
+}
+
+.slide sup {
+    top: -0.5em;
+}

data/assets/shower/themes/ribbon/styles/slide/content/lists.css

@@ -0,0 +1,55 @@
+/* Lists */
+
+.slide ol,
+.slide ul {
+    padding-left: 0;
+    margin-top: 0;
+    margin-bottom: 1em;
+    list-style: none;
+    counter-reset: list;
+}
+
+/* Marker */
+
+.slide li::before {
+    position: absolute;
+    width: 3em;
+    color: var(--color-grey);
+    text-align: right;
+    opacity: 0.75;
+    transform:
+        translateX(
+            calc(-100% - 0.5em)
+        );
+}
+
+.slide li ol,
+.slide li ul {
+    margin-bottom: 0;
+    margin-left: 2em;
+}
+
+/* Markers */
+
+.slide ol > li::before {
+    counter-increment: list;
+    content: counter(list) '.';
+}
+
+.slide ul > li::before {
+    content: '•';
+}
+
+.slide ul > li:lang(ru)::before {
+    content: '—';
+}
+
+/* Custom */
+
+.slide ol > li[value]::before {
+    content: attr(value) '.';
+}
+
+.slide ul > li[value]::before {
+    content: attr(value);
+}

data/assets/shower/themes/ribbon/styles/slide/content/quote.css

@@ -0,0 +1,23 @@
+/* Quote */
+
+.slide blockquote {
+    margin: 0;
+    font-style: italic;
+}
+
+.slide blockquote::before {
+    position: absolute;
+    margin: -0.15em 0 0 -0.43em;
+    color: #cccccc;
+    line-height: 1;
+    font-size: 8em;
+    content: '\201C';
+}
+
+/* Author */
+
+.slide blockquote + figcaption {
+    margin: -1em 0 1em;
+    font-style: italic;
+    font-weight: bold;
+}

data/assets/shower/themes/ribbon/styles/slide/content/table.css

@@ -0,0 +1,53 @@
+/* Table */
+
+.slide table {
+    margin-left: -100px;
+    margin-bottom: 1em;
+    width: calc(100% + 100px + 100px);
+    border-collapse: collapse;
+    border-spacing: 0;
+}
+
+/* Cells */
+
+.slide th,
+.slide td {
+    padding-top: 0;
+    padding-bottom: 0;
+}
+
+.slide th {
+    text-align: left;
+    font-weight: bold;
+}
+
+.slide th:first-child,
+.slide td:first-child {
+    padding-left: 96px;
+}
+
+.slide th:last-child,
+.slide td:last-child {
+    padding-right: 96px;
+}
+
+/* Lines */
+
+.slide tr:not(:last-of-type) > * {
+    background:
+        linear-gradient(
+            to top,
+            var(--color-line) 0.06em,
+            transparent 0.06em
+        ) repeat-x;
+}
+
+/* Stripes */
+
+.slide table.striped tr:nth-child(even) {
+    background: var(--color-fill);
+}
+
+.slide table.striped tr > * {
+    background-image: none;
+}

data/assets/shower/themes/ribbon/styles/slide/elements/columns.css

@@ -0,0 +1,19 @@
+/* Columns */
+
+.columns {
+    display: grid;
+    width: 100%;
+    grid-column-gap: 75px;
+}
+
+.columns.two {
+    grid-template-columns: 1fr 1fr;
+}
+
+.columns.three {
+    grid-template-columns: 1fr 1fr 1fr;
+}
+
+.columns.four {
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+}

data/assets/shower/themes/ribbon/styles/slide/elements/copyright.css

@@ -0,0 +1,38 @@
+/* Copyright */
+
+.copyright {
+    position: absolute;
+    font-size: 12px;
+    opacity: 0.7;
+}
+
+/* Sides */
+
+.copyright.top {
+    top: 10px;
+    left: 20px;
+}
+
+.copyright.right {
+    bottom: 20px;
+    right: 10px;
+    transform-origin: 0 100%;
+    transform: translateX(100%) rotate(-90deg);
+}
+
+.copyright.bottom {
+    bottom: 20px;
+    left: 20px;
+}
+
+/* White */
+
+.copyright.white {
+    color: white;
+}
+
+/* Links */
+
+.copyright a {
+    color: currentColor;
+}

data/assets/shower/themes/ribbon/styles/slide/elements/cover.css

@@ -0,0 +1,25 @@
+/* Cover */
+
+.cover {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    z-index: -1;
+    transform: translate(-50%, -50%);
+    max-width: 100%;
+    max-height: 100%;
+}
+
+/* Fitting */
+
+.cover.w,
+.cover.width {
+    width: 100%;
+    max-height: none;
+}
+
+.cover.h,
+.cover.height {
+    height: 100%;
+    max-width: none;
+}

data/assets/shower/themes/ribbon/styles/slide/elements/next.css

@@ -0,0 +1,9 @@
+/* Next */
+
+.shower.full .next {
+    visibility: hidden;
+}
+
+.shower.full .next.active {
+    visibility: visible;
+}