@codecademy/gamut 72.2.3-alpha.6fbda1.0 → 72.2.3-alpha.74c8a3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import _styled from "@emotion/styled/base";
|
|
2
2
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
3
|
+
/* Third-party Vidstack default theme styles */
|
|
3
4
|
/* eslint-disable gamut/no-css-standalone */
|
|
4
|
-
import '../
|
|
5
|
+
import '../vidstack-vendor.css';
|
|
5
6
|
import { styledOptions } from '@codecademy/gamut-styles';
|
|
6
7
|
import { isYouTubeProvider, MediaPlayer, MediaProvider, Poster, Track, useMediaRemote, useMediaState } from '@vidstack/react';
|
|
7
8
|
import React, { useRef, createElement as _createElement } from 'react';
|
|
8
9
|
import { Box } from '../../Box';
|
|
10
|
+
import { vdsBaseThemeStyles } from '../styles';
|
|
9
11
|
import { keyboardShortcuts } from './utils/constants';
|
|
10
12
|
import { vdsVariables } from './utils/variables';
|
|
11
13
|
import { VideoLayout } from './VideoLayout';
|
|
@@ -15,7 +17,7 @@ const VariableProvider = /*#__PURE__*/_styled(Box, _extends({}, {
|
|
|
15
17
|
label: "VariableProvider"
|
|
16
18
|
}, styledOptions(['variables'])))(({
|
|
17
19
|
variables
|
|
18
|
-
}) => variables, "width:100%;height:100%;position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
20
|
+
}) => variables, vdsBaseThemeStyles, "width:100%;height:100%;position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9WaWRlby9saWIvVmlkc3RhY2tQbGF5ZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBCeUIiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL1ZpZGVvL2xpYi9WaWRzdGFja1BsYXllci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKiBUaGlyZC1wYXJ0eSBWaWRzdGFjayBkZWZhdWx0IHRoZW1lIHN0eWxlcyAqL1xuLyogZXNsaW50LWRpc2FibGUgZ2FtdXQvbm8tY3NzLXN0YW5kYWxvbmUgKi9cbmltcG9ydCAnLi4vdmlkc3RhY2stdmVuZG9yLmNzcyc7XG5cbmltcG9ydCB7IHN0eWxlZE9wdGlvbnMgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCwgeyBDU1NPYmplY3QgfSBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHtcbiAgaXNZb3VUdWJlUHJvdmlkZXIsXG4gIE1lZGlhUGxheWVyLFxuICBNZWRpYVBsYXllckluc3RhbmNlLFxuICBNZWRpYVByb3ZpZGVyLFxuICBNZWRpYVByb3ZpZGVyQWRhcHRlcixcbiAgUG9zdGVyLFxuICBUcmFjayxcbiAgdXNlTWVkaWFSZW1vdGUsXG4gIHVzZU1lZGlhU3RhdGUsXG59IGZyb20gJ0B2aWRzdGFjay9yZWFjdCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlUmVmIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgeyBCb3ggfSBmcm9tICcuLi8uLi9Cb3gnO1xuaW1wb3J0IHsgVmlkZW9Qcm9wcyB9IGZyb20gJy4uJztcbmltcG9ydCB7IHZkc0Jhc2VUaGVtZVN0eWxlcyB9IGZyb20gJy4uL3N0eWxlcyc7XG5pbXBvcnQgeyBrZXlib2FyZFNob3J0Y3V0cyB9IGZyb20gJy4vdXRpbHMvY29uc3RhbnRzJztcbmltcG9ydCB7IHZkc1ZhcmlhYmxlcyB9IGZyb20gJy4vdXRpbHMvdmFyaWFibGVzJztcbmltcG9ydCB7IFZpZGVvTGF5b3V0IH0gZnJvbSAnLi9WaWRlb0xheW91dCc7XG5cbmNvbnN0IFZhcmlhYmxlUHJvdmlkZXIgPSBzdHlsZWQoQm94LCBzdHlsZWRPcHRpb25zKFsndmFyaWFibGVzJ10pKTx7XG4gIHZhcmlhYmxlcz86IENTU09iamVjdDtcbn0+KCh7IHZhcmlhYmxlcyB9KSA9PiB2YXJpYWJsZXMsIHZkc0Jhc2VUaGVtZVN0eWxlcywge1xuICB3aWR0aDogJzEwMCUnLFxuICBoZWlnaHQ6ICcxMDAlJyxcbiAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG59KTtcblxudHlwZSBWaWRzdGFja1BsYXllclByb3BzID0gVmlkZW9Qcm9wcyAmIHtcbiAgb25Mb2FkOiAoKSA9PiB2b2lkO1xufTtcbmV4cG9ydCBjb25zdCBWaWRzdGFja1BsYXllcjogUmVhY3QuRkM8Vmlkc3RhY2tQbGF5ZXJQcm9wcz4gPSAoe1xuICBhdXRvcGxheSA9IGZhbHNlLFxuICBjb250cm9scyA9IHRydWUsXG4gIGxvb3AgPSBmYWxzZSxcbiAgbXV0ZWQgPSBmYWxzZSxcbiAgb25QbGF5LFxuICBvblJlYWR5LFxuICBvbkxvYWQsXG4gIHBsYWNlaG9sZGVySW1hZ2UsXG4gIHZpZGVvVGl0bGUsXG4gIHZpZGVvVXJsLFxuICB0ZXh0VHJhY2tzLFxuICB0aHVtYm5haWxzLFxuICB0cmFuc2xhdGlvbnMsXG4gIHdpZHRoLFxuICBoZWlnaHQsXG4gIGNsYXNzTmFtZSxcbiAgc2hvd0RlZmF1bHRQcm92aWRlckNvbnRyb2xzID0gZmFsc2UsXG59KSA9PiB7XG4gIGNvbnN0IHBsYXllciA9IHVzZVJlZjxNZWRpYVBsYXllckluc3RhbmNlPihudWxsKTtcbiAgY29uc3QgcGF1c2VkID0gdXNlTWVkaWFTdGF0ZSgncGF1c2VkJywgcGxheWVyKTtcbiAgY29uc3QgbWVkaWFSZW1vdGUgPSB1c2VNZWRpYVJlbW90ZShwbGF5ZXIpO1xuXG4gIC8qKlxuICAgKiAhV29ya2Fyb3VuZCBmb3IgVmlkc3RhY2sgWW91dHViZSBQcm92aWRlciBpc3N1ZSB3aXRoIG5hdGl2ZSBjb250cm9scyFcbiAgICogKE5vdCBuZWVkZWQgd2l0aCBDdXN0b20gQ29udHJvbHMgaS5lIHdoZW4gY29udHJvbHMgcHJvcHMgaXMgbm90IHNldCB0byB0cnVlIGluIDxNZWRpYVBsYXllcj4pXG4gICAqIFdoZW4gdGhlIHByb3ZpZGVyIGNoYW5nZXMgb3IgcGxheWVyIGlzIGluIHdhaXRpbmcgc3RhdGUsIHdlIG5lZWQgdG8gZm9yY2UgcmUtcGxheSB0aGUgdmlkZW8uXG4gICAqIFRoaXMgaXMgYmVjYXVzZSBvZiBhbiBpc3N1ZSBpbiBWaWRzdGFjayB3aGVyZSBZb3V0dWJlIHZpZGVvcyB3aXRoIG5hdGl2ZSBjb250cm9scyBrZWVwcyBwYXVzaW5nLlxuICAgKi9cbiAgY29uc3Qgb25Qcm92aWRlckNoYW5nZSA9IGFzeW5jIChwcm92aWRlcjogTWVkaWFQcm92aWRlckFkYXB0ZXIgfCBudWxsKSA9PiB7XG4gICAgaWYgKGlzWW91VHViZVByb3ZpZGVyKHByb3ZpZGVyKSkge1xuICAgICAgYXdhaXQgcHJvdmlkZXIucGxheSgpO1xuICAgIH1cbiAgfTtcbiAgY29uc3Qgb25QbGF5ZXJXYWl0aW5nID0gKCkgPT4ge1xuICAgIGlmIChpc1lvdVR1YmVQcm92aWRlcihwbGF5ZXIuY3VycmVudD8ucHJvdmlkZXIpICYmIHBhdXNlZCkge1xuICAgICAgbWVkaWFSZW1vdGU/LnRvZ2dsZVBhdXNlZCgpO1xuICAgIH1cbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDxWYXJpYWJsZVByb3ZpZGVyXG4gICAgICBjbGFzc05hbWU9e2NsYXNzTmFtZX1cbiAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBnYW11dC9uby1pbmxpbmUtc3R5bGVcbiAgICAgIHN0eWxlPXt7IHdpZHRoLCBoZWlnaHQgfX1cbiAgICAgIHZhcmlhYmxlcz17dmRzVmFyaWFibGVzfVxuICAgID5cbiAgICAgIDxNZWRpYVBsYXllclxuICAgICAgICBhdXRvUGxheT17YXV0b3BsYXl9XG4gICAgICAgIGNvbnRyb2xzPXtzaG93RGVmYXVsdFByb3ZpZGVyQ29udHJvbHN9XG4gICAgICAgIGtleVNob3J0Y3V0cz17a2V5Ym9hcmRTaG9ydGN1dHN9XG4gICAgICAgIGxvb3A9e2xvb3B9XG4gICAgICAgIG11dGVkPXtcbiAgICAgICAgICBhdXRvcGxheSAmJiBpc1lvdVR1YmVQcm92aWRlcihwbGF5ZXI/LmN1cnJlbnQ/LnByb3ZpZGVyKVxuICAgICAgICAgICAgPyB0cnVlXG4gICAgICAgICAgICA6IG11dGVkXG4gICAgICAgIH1cbiAgICAgICAgcGxheXNJbmxpbmVcbiAgICAgICAgcmVmPXtwbGF5ZXJ9XG4gICAgICAgIHNyYz17dmlkZW9Vcmx9XG4gICAgICAgIHRpdGxlPXt2aWRlb1RpdGxlfVxuICAgICAgICBvbkNhblBsYXk9e29uUmVhZHl9XG4gICAgICAgIG9uTG9hZD17b25Mb2FkfVxuICAgICAgICBvblBsYXk9e29uUGxheX1cbiAgICAgICAgb25QbGF5aW5nPXsoKSA9PiB7XG4gICAgICAgICAgaWYgKGF1dG9wbGF5ICYmIHBsYXllci5jdXJyZW50Py5tdXRlZCAmJiAhbXV0ZWQpIHtcbiAgICAgICAgICAgIG1lZGlhUmVtb3RlPy51bm11dGUoKTtcbiAgICAgICAgICB9XG4gICAgICAgIH19XG4gICAgICAgIG9uUHJvdmlkZXJDaGFuZ2U9e29uUHJvdmlkZXJDaGFuZ2V9XG4gICAgICAgIG9uV2FpdGluZz17b25QbGF5ZXJXYWl0aW5nfVxuICAgICAgPlxuICAgICAgICA8TWVkaWFQcm92aWRlcj5cbiAgICAgICAgICB7cGxhY2Vob2xkZXJJbWFnZSAmJiAoXG4gICAgICAgICAgICA8UG9zdGVyXG4gICAgICAgICAgICAgIGFsdD17dmlkZW9UaXRsZX1cbiAgICAgICAgICAgICAgY2xhc3NOYW1lPVwidmRzLXBvc3RlclwiXG4gICAgICAgICAgICAgIHNyYz17cGxhY2Vob2xkZXJJbWFnZSBhcyBzdHJpbmd9XG4gICAgICAgICAgICAvPlxuICAgICAgICAgICl9XG4gICAgICAgICAge3RleHRUcmFja3M/Lm1hcCgodHJhY2spID0+IChcbiAgICAgICAgICAgIDxUcmFjayB7Li4udHJhY2t9IGtleT17dHJhY2suc3JjfSAvPlxuICAgICAgICAgICkpfVxuICAgICAgICA8L01lZGlhUHJvdmlkZXI+XG4gICAgICAgIDxWaWRlb0xheW91dFxuICAgICAgICAgIGNvbnRyb2xzPXtjb250cm9sc31cbiAgICAgICAgICB0aHVtYm5haWxzPXt0aHVtYm5haWxzfVxuICAgICAgICAgIHRyYW5zbGF0aW9ucz17dHJhbnNsYXRpb25zfVxuICAgICAgICAvPlxuICAgICAgPC9NZWRpYVBsYXllcj5cbiAgICA8L1ZhcmlhYmxlUHJvdmlkZXI+XG4gICk7XG59O1xuIl19 */"));
|
|
19
21
|
export const VidstackPlayer = ({
|
|
20
22
|
autoplay = false,
|
|
21
23
|
controls = true,
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const vdsBaseThemeStyles: import("@emotion/react").SerializedStyles;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
|
|
2
|
+
import { css } from '@emotion/react';
|
|
3
|
+
export const vdsBaseThemeStyles = process.env.NODE_ENV === "production" ? {
|
|
4
|
+
name: "169rs5q-vdsBaseThemeStyles",
|
|
5
|
+
styles: "iframe.vds-youtube[data-no-controls]{height:120%;}[data-started] iframe.vds-youtube[data-no-controls]{height:1000%;}:where(.vds-button .vds-icon){border-radius:unset;}.vds-controls button{border-radius:var(--media-button-border-radius);}:where(.vds-video-layout[data-sm]) :where(.vds-button){padding:0px 4px!important;}:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track){background-color:var(--color-gray-600);}:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track-fill){background-color:var(--color-secondary);}.vds-video-layout .vds-time-slider .vds-slider-value{border:unset;color:white;}.vds-tooltip-content::after{content:'';-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);border-style:solid;display:block;width:1rem;height:1rem;position:absolute;border-color:currentColor;}:where(.vds-tooltip-content[data-placement~='top'])::after{border-width:0 1px 1px 0;bottom:-0.5rem;left:calc(50% - 0.5rem);background-image:linear-gradient(\n to top left,\n var(--color-background-contrast) 55%,\n rgba(0, 0, 0, 0) 20%\n );}:where(.vds-tooltip-content[data-placement~='bottom'])::after{border-width:1px 0px 0px 1px;top:-0.5rem;left:calc(50% - 0.5rem);background-image:linear-gradient(\n to bottom right,\n var(--color-background-contrast) 55%,\n rgba(0, 0, 0, 0) 20%\n );}:where(.vds-tooltip-content[data-placement~='start'])::after{left:calc(0% + 0.5rem);}:where(.vds-tooltip-content[data-placement~='end'])::after{left:unset;right:calc(0% + 0.5rem);}@keyframes vds-tooltip-exit{0%{opacity:1;}100%{opacity:0;}}@keyframes vds-tooltip-enter{0%{opacity:0;}100%{opacity:1;}};label:vdsBaseThemeStyles;"
|
|
6
|
+
} : {
|
|
7
|
+
name: "169rs5q-vdsBaseThemeStyles",
|
|
8
|
+
styles: "iframe.vds-youtube[data-no-controls]{height:120%;}[data-started] iframe.vds-youtube[data-no-controls]{height:1000%;}:where(.vds-button .vds-icon){border-radius:unset;}.vds-controls button{border-radius:var(--media-button-border-radius);}:where(.vds-video-layout[data-sm]) :where(.vds-button){padding:0px 4px!important;}:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track){background-color:var(--color-gray-600);}:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track-fill){background-color:var(--color-secondary);}.vds-video-layout .vds-time-slider .vds-slider-value{border:unset;color:white;}.vds-tooltip-content::after{content:'';-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);border-style:solid;display:block;width:1rem;height:1rem;position:absolute;border-color:currentColor;}:where(.vds-tooltip-content[data-placement~='top'])::after{border-width:0 1px 1px 0;bottom:-0.5rem;left:calc(50% - 0.5rem);background-image:linear-gradient(\n to top left,\n var(--color-background-contrast) 55%,\n rgba(0, 0, 0, 0) 20%\n );}:where(.vds-tooltip-content[data-placement~='bottom'])::after{border-width:1px 0px 0px 1px;top:-0.5rem;left:calc(50% - 0.5rem);background-image:linear-gradient(\n to bottom right,\n var(--color-background-contrast) 55%,\n rgba(0, 0, 0, 0) 20%\n );}:where(.vds-tooltip-content[data-placement~='start'])::after{left:calc(0% + 0.5rem);}:where(.vds-tooltip-content[data-placement~='end'])::after{left:unset;right:calc(0% + 0.5rem);}@keyframes vds-tooltip-exit{0%{opacity:1;}100%{opacity:0;}}@keyframes vds-tooltip-enter{0%{opacity:0;}100%{opacity:1;}};label:vdsBaseThemeStyles;/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9WaWRlby9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRXFDIiwiZmlsZSI6Ii4uLy4uL3NyYy9WaWRlby9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBjb25zdCB2ZHNCYXNlVGhlbWVTdHlsZXMgPSBjc3NgXG4gIC8qKlxuICAgKiBZb3V0dWJlIG92ZXJsYXlcbiAgICogLSBXaHkgMTIwJSA/IGhpZGluZyB5dCBsb2dvIGFuZCBjb3B5IGxpbmsgYnV0dG9uIHdoaWNoIGFyZSBub3QgYWNjZXNzaWJsZS5cbiAgICovXG4gIGlmcmFtZS52ZHMteW91dHViZVtkYXRhLW5vLWNvbnRyb2xzXSB7XG4gICAgaGVpZ2h0OiAxMjAlO1xuICB9XG5cbiAgW2RhdGEtc3RhcnRlZF0gaWZyYW1lLnZkcy15b3V0dWJlW2RhdGEtbm8tY29udHJvbHNdIHtcbiAgICBoZWlnaHQ6IDEwMDAlO1xuICB9XG5cbiAgLyogQ29udHJvbCBidXR0b25zICovXG4gIDp3aGVyZSgudmRzLWJ1dHRvbiAudmRzLWljb24pIHtcbiAgICBib3JkZXItcmFkaXVzOiB1bnNldDtcbiAgfVxuXG4gIC52ZHMtY29udHJvbHMgYnV0dG9uIHtcbiAgICBib3JkZXItcmFkaXVzOiB2YXIoLS1tZWRpYS1idXR0b24tYm9yZGVyLXJhZGl1cyk7XG4gIH1cblxuICA6d2hlcmUoLnZkcy12aWRlby1sYXlvdXRbZGF0YS1zbV0pIDp3aGVyZSgudmRzLWJ1dHRvbikge1xuICAgIHBhZGRpbmc6IDBweCA0cHggIWltcG9ydGFudDtcbiAgfVxuXG4gIC8qIFNtYWxsIGxheW91dCB2b2x1bWUgLyB0aW1lIHNsaWRlciAqL1xuICA6d2hlcmUoLnZkcy12aWRlby1sYXlvdXRbZGF0YS1zbV0gLnZkcy12b2x1bWUtc2xpZGVyIC52ZHMtc2xpZGVyLXRyYWNrKSB7XG4gICAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItZ3JheS02MDApO1xuICB9XG4gIDp3aGVyZSgudmRzLXZpZGVvLWxheW91dFtkYXRhLXNtXSAudmRzLXZvbHVtZS1zbGlkZXIgLnZkcy1zbGlkZXItdHJhY2stZmlsbCkge1xuICAgIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLXNlY29uZGFyeSk7XG4gIH1cbiAgLnZkcy12aWRlby1sYXlvdXQgLnZkcy10aW1lLXNsaWRlciAudmRzLXNsaWRlci12YWx1ZSB7XG4gICAgYm9yZGVyOiB1bnNldDtcbiAgICBjb2xvcjogd2hpdGU7XG4gIH1cblxuICAvKiBUb29sdGlwICovXG4gIC52ZHMtdG9vbHRpcC1jb250ZW50OjphZnRlciB7XG4gICAgY29udGVudDogJyc7XG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XG4gICAgLW1vei10cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XG4gICAgLW1zLXRyYW5zZm9ybTogcm90YXRlKDQ1ZGVnKTtcbiAgICB0cmFuc2Zvcm06IHJvdGF0ZSg0NWRlZyk7XG4gICAgYm9yZGVyLXN0eWxlOiBzb2xpZDtcbiAgICBkaXNwbGF5OiBibG9jaztcbiAgICB3aWR0aDogMXJlbTtcbiAgICBoZWlnaHQ6IDFyZW07XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIGJvcmRlci1jb2xvcjogY3VycmVudENvbG9yO1xuICB9XG4gIDp3aGVyZSgudmRzLXRvb2x0aXAtY29udGVudFtkYXRhLXBsYWNlbWVudH49J3RvcCddKTo6YWZ0ZXIge1xuICAgIGJvcmRlci13aWR0aDogMCAxcHggMXB4IDA7XG4gICAgYm90dG9tOiAtMC41cmVtO1xuICAgIGxlZnQ6IGNhbGMoNTAlIC0gMC41cmVtKTtcbiAgICBiYWNrZ3JvdW5kLWltYWdlOiBsaW5lYXItZ3JhZGllbnQoXG4gICAgICB0byB0b3AgbGVmdCxcbiAgICAgIHZhcigtLWNvbG9yLWJhY2tncm91bmQtY29udHJhc3QpIDU1JSxcbiAgICAgIHJnYmEoMCwgMCwgMCwgMCkgMjAlXG4gICAgKTtcbiAgfVxuXG4gIDp3aGVyZSgudmRzLXRvb2x0aXAtY29udGVudFtkYXRhLXBsYWNlbWVudH49J2JvdHRvbSddKTo6YWZ0ZXIge1xuICAgIGJvcmRlci13aWR0aDogMXB4IDBweCAwcHggMXB4O1xuICAgIHRvcDogLTAuNXJlbTtcbiAgICBsZWZ0OiBjYWxjKDUwJSAtIDAuNXJlbSk7XG4gICAgYmFja2dyb3VuZC1pbWFnZTogbGluZWFyLWdyYWRpZW50KFxuICAgICAgdG8gYm90dG9tIHJpZ2h0LFxuICAgICAgdmFyKC0tY29sb3ItYmFja2dyb3VuZC1jb250cmFzdCkgNTUlLFxuICAgICAgcmdiYSgwLCAwLCAwLCAwKSAyMCVcbiAgICApO1xuICB9XG5cbiAgOndoZXJlKC52ZHMtdG9vbHRpcC1jb250ZW50W2RhdGEtcGxhY2VtZW50fj0nc3RhcnQnXSk6OmFmdGVyIHtcbiAgICBsZWZ0OiBjYWxjKDAlICsgMC41cmVtKTtcbiAgfVxuICA6d2hlcmUoLnZkcy10b29sdGlwLWNvbnRlbnRbZGF0YS1wbGFjZW1lbnR+PSdlbmQnXSk6OmFmdGVyIHtcbiAgICBsZWZ0OiB1bnNldDtcbiAgICByaWdodDogY2FsYygwJSArIDAuNXJlbSk7XG4gIH1cblxuICBAa2V5ZnJhbWVzIHZkcy10b29sdGlwLWV4aXQge1xuICAgIDAlIHtcbiAgICAgIG9wYWNpdHk6IDE7XG4gICAgfVxuICAgIDEwMCUge1xuICAgICAgb3BhY2l0eTogMDtcbiAgICB9XG4gIH1cbiAgQGtleWZyYW1lcyB2ZHMtdG9vbHRpcC1lbnRlciB7XG4gICAgMCUge1xuICAgICAgb3BhY2l0eTogMDtcbiAgICB9XG4gICAgMTAwJSB7XG4gICAgICBvcGFjaXR5OiAxO1xuICAgIH1cbiAgfVxuYDtcbiJdfQ== */",
|
|
9
|
+
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
10
|
+
};
|
package/package.json
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@codecademy/gamut",
|
|
3
3
|
"description": "Styleguide & Component library for Codecademy",
|
|
4
|
-
"version": "72.2.3-alpha.
|
|
4
|
+
"version": "72.2.3-alpha.74c8a3.0",
|
|
5
5
|
"author": "Codecademy Engineering <dev@codecademy.com>",
|
|
6
6
|
"bin": "./bin/gamut.mjs",
|
|
7
7
|
"dependencies": {
|
|
8
|
-
"@codecademy/gamut-icons": "9.57.10-alpha.
|
|
9
|
-
"@codecademy/gamut-illustrations": "0.58.16-alpha.
|
|
10
|
-
"@codecademy/gamut-patterns": "0.10.35-alpha.
|
|
11
|
-
"@codecademy/gamut-styles": "20.0.3-alpha.
|
|
12
|
-
"@codecademy/variance": "0.26.2-alpha.
|
|
8
|
+
"@codecademy/gamut-icons": "9.57.10-alpha.74c8a3.0",
|
|
9
|
+
"@codecademy/gamut-illustrations": "0.58.16-alpha.74c8a3.0",
|
|
10
|
+
"@codecademy/gamut-patterns": "0.10.35-alpha.74c8a3.0",
|
|
11
|
+
"@codecademy/gamut-styles": "20.0.3-alpha.74c8a3.0",
|
|
12
|
+
"@codecademy/variance": "0.26.2-alpha.74c8a3.0",
|
|
13
13
|
"@formatjs/intl-locale": "5.3.1",
|
|
14
14
|
"@react-aria/interactions": "3.25.0",
|
|
15
15
|
"@types/marked": "^4.0.8",
|
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
@import "~@vidstack/react/player/styles/default/theme.css";
|
|
2
|
-
@import "~@vidstack/react/player/styles/default/layouts/video.css";
|
|
3
|
-
@import "~@vidstack/react/player/styles/default/layouts/audio.css";
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* Youtube overlay
|
|
7
|
-
* - Why 120% ? hiding yt logo and copy link button which are not accessible.
|
|
8
|
-
*/
|
|
9
|
-
iframe.vds-youtube[data-no-controls] {
|
|
10
|
-
height: 120%;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
[data-started] iframe.vds-youtube[data-no-controls] {
|
|
14
|
-
height: 1000%;
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
// Control buttons
|
|
18
|
-
:where(.vds-button .vds-icon) {
|
|
19
|
-
border-radius: unset;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.vds-controls button {
|
|
23
|
-
border-radius: var(--media-button-border-radius);
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
:where(.vds-video-layout[data-sm]) :where(.vds-button) {
|
|
27
|
-
padding: 0px 4px !important;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
// Small layout volume / time slider
|
|
31
|
-
:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track) {
|
|
32
|
-
background-color: var(--color-gray-600);
|
|
33
|
-
}
|
|
34
|
-
:where(.vds-video-layout[data-sm] .vds-volume-slider .vds-slider-track-fill) {
|
|
35
|
-
background-color: var(--color-secondary);
|
|
36
|
-
}
|
|
37
|
-
.vds-video-layout .vds-time-slider .vds-slider-value {
|
|
38
|
-
border: unset;
|
|
39
|
-
color: white;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
// Tooltip
|
|
43
|
-
.vds-tooltip-content::after {
|
|
44
|
-
content: "";
|
|
45
|
-
-webkit-transform: rotate(45deg);
|
|
46
|
-
-moz-transform: rotate(45deg);
|
|
47
|
-
-ms-transform: rotate(45deg);
|
|
48
|
-
transform: rotate(45deg);
|
|
49
|
-
border-style: solid;
|
|
50
|
-
display: block;
|
|
51
|
-
width: 1rem;
|
|
52
|
-
height: 1rem;
|
|
53
|
-
position: absolute;
|
|
54
|
-
border-color: currentColor;
|
|
55
|
-
}
|
|
56
|
-
:where(.vds-tooltip-content[data-placement~="top"])::after {
|
|
57
|
-
border-width: 0 1px 1px 0;
|
|
58
|
-
bottom: -0.5rem;
|
|
59
|
-
left: calc(50% - 0.5rem);
|
|
60
|
-
background-image: linear-gradient(
|
|
61
|
-
to top left,
|
|
62
|
-
var(--color-background-contrast) 55%,
|
|
63
|
-
rgba(0, 0, 0, 0) 20%
|
|
64
|
-
);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
:where(.vds-tooltip-content[data-placement~="bottom"])::after {
|
|
68
|
-
border-width: 1px 0px 0px 1px;
|
|
69
|
-
top: -0.5rem;
|
|
70
|
-
left: calc(50% - 0.5rem);
|
|
71
|
-
background-image: linear-gradient(
|
|
72
|
-
to bottom right,
|
|
73
|
-
var(--color-background-contrast) 55%,
|
|
74
|
-
rgba(0, 0, 0, 0) 20%
|
|
75
|
-
);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
:where(.vds-tooltip-content[data-placement~="start"])::after {
|
|
79
|
-
left: calc(0% + 0.5rem);
|
|
80
|
-
}
|
|
81
|
-
:where(.vds-tooltip-content[data-placement~="end"])::after {
|
|
82
|
-
left: unset;
|
|
83
|
-
right: calc(0% + 0.5rem);
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
@keyframes vds-tooltip-exit {
|
|
87
|
-
0% {
|
|
88
|
-
opacity: 1;
|
|
89
|
-
}
|
|
90
|
-
100% {
|
|
91
|
-
opacity: 0;
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
@keyframes vds-tooltip-enter {
|
|
95
|
-
0% {
|
|
96
|
-
opacity: 0;
|
|
97
|
-
}
|
|
98
|
-
100% {
|
|
99
|
-
opacity: 1;
|
|
100
|
-
}
|
|
101
|
-
}
|