Something went wrong. Try again.
[READ-ONLY] Mirror of https://github.com/okikio/postcss-spring-easing. PostCSS plugin to add that bounce and boogie that only springs can bring
easings linear postcss postcss-plugin spring spring-easing
Something went wrong. Try again.
5.7 kB · 287 lines
CSS
at commit 23712df9
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287/* @import url("https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;700&display=swap"); */
@font-face { font-family: "FluentSystemIcons-Regular"; src: url("/media/fonts/FluentSystemIcons-Regular.woff2") format("woff2"), url("/media/fonts/FluentSystemIcons-Regular.ttf") format("truetype");}
:root { --light-color-background-secondary: #fff; --dark-color-background: #1b1c1f; --dark-color-background-secondary: #36393f;
--light-color-panel-divider: #dadce0; --dark-color-panel-divider: #47474d;
--color-panel-divider: var(--light-color-panel-divider); --dark-color-text-aside: #8486b4; /* --light-color-background: #f8f9fa; --light-color-panel-divider: #dadce0; --light-link-color: #1155cc; --dark-color-panel-divider: #47474d; --dark-color-menu-divider-focus: #d73a49; --dark-color-background: #1b1c1f; --dark-color-secondary-background: #2d2f34; */}
@media (prefers-color-scheme: light) { :root { --light-color-background-secondary: #fff; --light-color-panel-divider: #dadce0; --color-panel-divider: var(--light-color-panel-divider); }}
@media (prefers-color-scheme: dark) { :root { --dark-color-background: #1b1c1f; --dark-color-background-secondary: #36393f; --dark-color-panel-divider: #47474d; --color-panel-divider: var(--dark-color-panel-divider); --dark-color-text-aside: #8486b4; }}
html,body { font-family: "Lexend", "Manrope", "Century Gothic", sans-serif; font-weight: 400; }
h1 { font-weight: 300; padding-bottom: 0.9rem;}
h2 { font-weight: 400; color: var(--color-ts);}
h3 { font-weight: 500;}
h4 { font-weight: 500;}
a :is(h1, h2, h3, h4, h5, h6):after { font-family: FluentSystemIcons-Regular !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f4e5";
visibility: hidden; font-weight: 800; font-size: 1em; padding-left: 0.25em; vertical-align: middle; color: var(--color-link);}
a :is(h1, h2, h3, h4, h5, h6):hover:after { visibility: visible;}
a :is(h1, h2, h3, h4, h5, h6):is(:hover, :focus):after { visibility: visible;}
a .external-icon svg { vertical-align: middle; display: inline-block; stroke-width: 2; opacity: .8; width: 1em; height: 1em; fill: currentColor;}
details { cursor: pointer;}
pre { padding: 14px;}
pre,code { border-radius: 6px; border: 1px solid rgb(20 20 20 / 0.25);}
pre code { border: none;}
blockquote { padding: 0.2em 0.8em 0.2em 1em; border-left: 5px solid gray; margin-bottom: 2.5rem; background-color: var(--color-background-secondary); border-radius: 0.45em;}
a[href^="https://bundlejs.com/"] .external-icon { display: none;}
img[src^="https://bundlejs.com/"] { overflow: hidden; border-radius: 20em; border: 1px solid rgb(20 20 20 / 0.25);}
.container { max-width: 1200px;}
.container.tsd-generator { max-width: 100%;}
.container.tsd-generator p { line-height: 28px; max-width: 1200px; width: 100%; margin: auto;}
header.tsd-page-toolbar { border-bottom: 1px solid var(--color-panel-divider);}
.tsd-signature { border-radius: 0.5rem;}
.tsd-breadcrumb { padding-block-start: 0.5rem;}
.tsd-typography p, .tsd-typography ul, .tsd-typography ol { line-height: 1.85em; font-weight: 300;}.tsd-navigation { padding-inline-end: 0.25rem;}
.tsd-accordion-details { padding-inline-start: 1.35rem;}
.tsd-accordion-details > ul > li > ul { padding-left: 0;}
.container-main { --mask-image: linear-gradient(0deg, transparent 0%, white 2%, white 50%, white 98%, transparent 100%);}
@media (min-width: 769px) { .container-main { grid-template-columns: minmax(0, 15rem) minmax(0, 2.5fr); }
.col-sidebar { border-right: 1px solid var(--color-panel-divider); mask-image: var(--mask-image); -webkit-mask-image: var(--mask-image); padding-block: 1rem; }}
@media (min-width: 1200px) { .container-main { grid-template-columns: minmax(0, 1.15fr) minmax(0, 2.5fr) minmax(0, 15.5rem); }
.page-menu { border-left: 1px solid var(--color-panel-divider); }
.site-menu { border-right: 1px solid var(--color-panel-divider); mask-image: var(--mask-image); -webkit-mask-image: var(--mask-image); padding-block: 1rem; }}
.tsd-accordion-details ul { padding-left: 1rem;}
.tsd-accordion-details > ul { padding-left: 0;}
:is(.tsd-page-navigation, .tsd-navigation) svg { vertical-align: middle;}
.tsd-navigation a.current, .tsd-page-navigation a.current { border-radius: 0.45rem; padding-block: 0.3rem; padding-inline: 0.3rem;}
.col-menu { border-left: 1px solid var(--color-panel-divider);}
.tsd-widget:is(.search, .options, .menu) svg { display: none;}
.tsd-widget:is(.search, .options, .menu):after { font-family: FluentSystemIcons-Regular !important; font-style: normal; font-weight: normal !important; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
font-size: 24px; color: var(--color-toolbar-text); width: 100%; height: 100%;
position: absolute; text-align: center; display: flex; top: 0; left: 0; align-items: center; justify-content: center;}
.tsd-widget.search:after { content: "\f690";}
.tsd-widget.options:after { content: "\f407";}
.tsd-widget.menu { position: relative; height: 40px; vertical-align: bottom;}
.tsd-widget.menu:after { content: "\f561";}