diff --git a/CHANGELOG b/CHANGELOG index f1c8b5dfc..d873db89e 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -1,3 +1,7 @@ +mkdocs-material-7.2.1 (2021-07-25) + + * Fixed #2862: Back-to-top button overlays active search bar + mkdocs-material-7.2.0 (2021-07-21) * Added support for search suggestions to save keystrokes diff --git a/docs/assets/screenshots/social-cards.png b/docs/assets/screenshots/social-cards.png new file mode 100644 index 000000000..3b348db34 Binary files /dev/null and b/docs/assets/screenshots/social-cards.png differ diff --git a/docs/creating-your-site.md b/docs/creating-your-site.md index 1adf7694f..afb512c81 100644 --- a/docs/creating-your-site.md +++ b/docs/creating-your-site.md @@ -100,12 +100,13 @@ and much more: - [Setting up navigation][9] - [Setting up site search][10] - [Setting up site analytics][11] -- [Setting up tags][12] -- [Setting up versioning][13] -- [Setting up the header][14] -- [Setting up the footer][15] -- [Adding a git repository][16] -- [Adding a comment system][17] +- [Setting up social cards][12] +- [Setting up tags][13] +- [Setting up versioning][14] +- [Setting up the header][15] +- [Setting up the footer][16] +- [Adding a git repository][17] +- [Adding a comment system][18] @@ -116,12 +117,13 @@ and much more: [9]: setup/setting-up-navigation.md [10]: setup/setting-up-site-search.md [11]: setup/setting-up-site-analytics.md - [12]: setup/setting-up-tags.md - [13]: setup/setting-up-versioning.md - [14]: setup/setting-up-the-header.md - [15]: setup/setting-up-the-footer.md - [16]: setup/adding-a-git-repository.md - [17]: setup/adding-a-comment-system.md + [12]: setup/setting-up-social-cards.md + [13]: setup/setting-up-tags.md + [14]: setup/setting-up-versioning.md + [15]: setup/setting-up-the-header.md + [16]: setup/setting-up-the-footer.md + [17]: setup/adding-a-git-repository.md + [18]: setup/adding-a-comment-system.md ## Previewing as you write @@ -147,12 +149,12 @@ If you're running Material for MkDocs from within Docker, use: docker run --rm -it -p 8000:8000 -v "%cd%":/docs squidfunk/mkdocs-material ``` -Point your browser to [localhost:8000][18] and you should see: +Point your browser to [localhost:8000][19] and you should see: -[![Creating your site][19]][19] +[![Creating your site][20]][20] - [18]: http://localhost:8000 - [19]: assets/screenshots/creating-your-site.png + [19]: http://localhost:8000 + [20]: assets/screenshots/creating-your-site.png ## Building your site @@ -165,8 +167,8 @@ mkdocs build The contents of this directory make up your project documentation. There's no need for operating a database or server, as it is completely self-contained. -The site can be hosted on [GitHub Pages][20], [GitLab Pages][21], a CDN of your +The site can be hosted on [GitHub Pages][21], [GitLab Pages][22], a CDN of your choice or your private web space. - [20]: publishing-your-site.md#github-pages - [21]: publishing-your-site.md#gitlab-pages + [21]: publishing-your-site.md#github-pages + [22]: publishing-your-site.md#gitlab-pages diff --git a/docs/insiders/index.md b/docs/insiders/index.md index 4dfbb324b..8de6299ca 100644 --- a/docs/insiders/index.md +++ b/docs/insiders/index.md @@ -117,9 +117,10 @@ The following features are currently exclusively available to sponsors:
+- [x] [Social cards :material-new-box:][34] - [x] [Cookie consent :material-new-box:][33] - [x] [Linking content tabs :material-new-box:][32] -- [x] [Boosting pages in search :material-new-box:][30] +- [x] [Boosting pages in search][30] - [x] [Tags (with search integration)][29] - [x] [Stay on page when switching versions][28] - [x] [Version warning][26] @@ -190,25 +191,28 @@ the public for general availability. #### $ 7,000 – Royal Gold - [x] [Cookie consent][33] -- [ ] Table of contents auto-collapse -- [ ] Table of contents follows active anchor +- [ ] Improved search result summaries +- [ ] List of last searches [33]: ../setup/setting-up-site-analytics.md#cookie-consent #### $ 8,000 – Scotch Bonnet -- [ ] Improved search result summaries +- [x] [Social cards][34] - [ ] Stay on page when switching languages -- [ ] List of last searches +- [ ] Table of contents follows active anchor + + [34]: ../setup/setting-up-social-cards.md #### Future -- [ ] [Material for MkDocs Live Edit][34] +- [ ] [Material for MkDocs Live Edit][35] - [ ] New layouts and styles - [ ] Code block palette toggle - [ ] Native lightbox integration +- [ ] Table of contents auto-collapse - [34]: https://twitter.com/squidfunk/status/1338252230265360391 + [35]: https://twitter.com/squidfunk/status/1338252230265360391 ### Goals completed @@ -273,23 +277,23 @@ implemented behind feature flags; all configuration changes are backward-compatible. This means that your users will be able to build the documentation locally with Material for MkDocs and when they push their changes, it can be built with Insiders (e.g. as part of GitHub Actions). Thus, it's -recommended to [install Insiders][35] only in CI, as you don't want to expose +recommended to [install Insiders][36] only in CI, as you don't want to expose your `GH_TOKEN` to users. - [35]: ../publishing-your-site.md#github-pages + [36]: ../publishing-your-site.md#github-pages ### Payment _We don't want to pay for sponsorship every month. Are there any other options?_ Yes. You can sponsor on a yearly basis by [switching your GitHub account to a -yearly billing cycle][36]. If for some reason you cannot do that, you could +yearly billing cycle][37]. If for some reason you cannot do that, you could also create a dedicated GitHub account with a yearly billing cycle, which you only use for sponsoring (some sponsors already do that). One-time payments are not eligible for Insiders. - [36]: https://docs.github.com/en/github/setting-up-and-managing-billing-and-payments-on-github/changing-the-duration-of-your-billing-cycle + [37]: https://docs.github.com/en/github/setting-up-and-managing-billing-and-payments-on-github/changing-the-duration-of-your-billing-cycle ### Terms @@ -298,7 +302,7 @@ commercial project. Can we use Insiders under the same terms and conditions?_ Yes. Whether you're an individual or a company, you may use _Material for MkDocs Insiders_ precisely under the same terms as Material for MkDocs, which are given -by the [MIT license][37]. However, we kindly ask you to respect the following +by the [MIT license][38]. However, we kindly ask you to respect the following guidelines: - Please __don't distribute the source code__ of Insiders. You may freely use @@ -309,7 +313,7 @@ guidelines: - If you cancel your subscription, you're removed as a collaborator and will miss out on future updates of Insiders. However, you may __use the latest version__ that's available to you __as long as you like__. Just remember that - [GitHub deletes private forks][38]. + [GitHub deletes private forks][39]. - [37]: ../license.md - [38]: https://docs.github.com/en/github/setting-up-and-managing-your-github-user-account/removing-a-collaborator-from-a-personal-repository + [38]: ../license.md + [39]: https://docs.github.com/en/github/setting-up-and-managing-your-github-user-account/removing-a-collaborator-from-a-personal-repository diff --git a/docs/setup/setting-up-social-cards.md b/docs/setup/setting-up-social-cards.md new file mode 100644 index 000000000..f566f8173 --- /dev/null +++ b/docs/setup/setting-up-social-cards.md @@ -0,0 +1,63 @@ +--- +template: overrides/main.html +--- + +# Setting up social cards + +Social cards, also known as social previews, are images that are displayed when +a link to your project documentation is shared on social media. Material for +MkDocs can generate beautiful social cards automatically, using the colors, +fonts and logo defined in `mkdocs.yml`. + +## Configuration + +### Built-in social cards + +[:octicons-file-code-24: Source][1] · +[:octicons-cpu-24: Plugin][1] · +:octicons-beaker-24: Experimental · +[:octicons-heart-fill-24:{ .mdx-heart } Insiders only][1]{ .mdx-insiders } + +The [built-in social cards plugin][1] generates a social card image for every +page and adds the necessary meta tags, so it's displayed on social media when +shared. Enable it via `mkdocs.yml`: + +``` yaml +plugins: + - social +``` + +For example, the page on [setting up site analytics][2] renders as: + +
+ +[![Social Cards][3]][3] + +
+ +Want to try it out? Copy the current URL and enter it into [Twitter's Card +validator][4] to see how social cards look in action. + +
+
+ +This is a built-in plugin, which means that no third-party plugin needs to be +installed, as Material for MkDocs already bundles it. The following options +are available: + +`cards_directory`{ #cards_directory } + +: :octicons-milestone-24: Default: `assets/images/social` – This option + specifies where the generated social card images will be written to. It + should normally not be necessary to change this option. + + ``` yaml + plugins: + - social: + cards_directory: assets/images/social + ``` + + [1]: ../insiders/index.md + [2]: setting-up-site-analytics.md + [3]: ../assets/screenshots/social-cards.png + [4]: https://cards-dev.twitter.com/validator diff --git a/material/base.html b/material/base.html index 0154f029c..7ce64e619 100644 --- a/material/base.html +++ b/material/base.html @@ -27,7 +27,7 @@ {% endif %} - + {% endblock %} {% block htmltitle %} {% if page and page.meta and page.meta.title %} diff --git a/material/overrides/assets/stylesheets/main.14225c90.min.css b/material/overrides/assets/stylesheets/main.14225c90.min.css new file mode 100644 index 000000000..0428efd35 --- /dev/null +++ b/material/overrides/assets/stylesheets/main.14225c90.min.css @@ -0,0 +1,2 @@ +@-webkit-keyframes mdx-heart{0%,40%,80%,to{transform:scale(1)}20%,60%{transform:scale(1.15)}}@keyframes mdx-heart{0%,40%,80%,to{transform:scale(1)}20%,60%{transform:scale(1.15)}}.md-typeset .twitter{color:#00acee}.md-typeset .mdx-video{width:auto}.md-typeset .mdx-video__inner{height:0;padding-bottom:56.138%;position:relative;width:100%}.md-typeset .mdx-video iframe{border:none;height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.md-typeset .mdx-heart{-webkit-animation:mdx-heart 1s infinite;animation:mdx-heart 1s infinite}.md-typeset .mdx-insiders{color:#e91e63}.md-typeset .mdx-switch button{cursor:pointer;transition:opacity .25s}.md-typeset .mdx-switch button:focus,.md-typeset .mdx-switch button:hover{opacity:.75}.md-typeset .mdx-switch button>code{background-color:var(--md-primary-fg-color);color:var(--md-primary-bg-color);display:block}.md-typeset .mdx-columns ol,.md-typeset .mdx-columns ul{-moz-columns:2;column-count:2}@media screen and (max-width:29.9375em){.md-typeset .mdx-columns ol,.md-typeset .mdx-columns ul{-moz-columns:initial;columns:initial}}.md-typeset .mdx-columns li{-moz-column-break-inside:avoid;break-inside:avoid}.md-announce a,.md-announce a:focus,.md-announce a:hover{color:currentColor}.md-announce strong{white-space:nowrap}.md-announce .twitter{margin-left:.2em}.mdx-container{background:url("data:image/svg+xml;utf8,") no-repeat bottom,linear-gradient(to bottom,var(--md-primary-fg-color),#a63fd9 99%,var(--md-default-bg-color) 99%);padding-top:1rem}[data-md-color-scheme=slate] .mdx-container{background:url("data:image/svg+xml;utf8,") no-repeat bottom,linear-gradient(to bottom,var(--md-primary-fg-color),#a63fd9 99%,var(--md-default-bg-color) 99%)}.mdx-hero{color:var(--md-primary-bg-color);margin:0 .8rem}.mdx-hero h1{color:currentColor;font-weight:700;margin-bottom:1rem}@media screen and (max-width:29.9375em){.mdx-hero h1{font-size:1.4rem}}.mdx-hero__content{padding-bottom:6rem}@media screen and (min-width:60em){.mdx-hero{align-items:stretch;display:flex}.mdx-hero__content{margin-top:3.5rem;max-width:19rem;padding-bottom:14vw}.mdx-hero__image{order:1;transform:translateX(4rem);width:38rem}}@media screen and (min-width:76.25em){.mdx-hero__image{transform:translateX(8rem)}}.mdx-hero .md-button{color:var(--md-primary-bg-color);margin-right:.5rem;margin-top:.5rem}.mdx-hero .md-button:focus,.mdx-hero .md-button:hover{background-color:var(--md-accent-fg-color);border-color:var(--md-accent-fg-color);color:var(--md-accent-bg-color)}.mdx-hero .md-button--primary{background-color:var(--md-primary-bg-color);border-color:var(--md-primary-bg-color);color:#894da8}.md-typeset .mdx-iconsearch{background-color:var(--md-default-bg-color);border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(0,0,0,.1),0 .025rem .05rem rgba(0,0,0,.1);position:relative;transition:box-shadow 125ms}.md-typeset .mdx-iconsearch:focus-within,.md-typeset .mdx-iconsearch:hover{box-shadow:0 .4rem 1rem rgba(0,0,0,.15),0 .025rem .05rem rgba(0,0,0,.15)}.md-typeset .mdx-iconsearch .md-input{background:var(--md-default-bg-color);box-shadow:0 0 .6rem rgba(0,0,0,.07)}[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch .md-input{background:var(--md-code-bg-color)}.md-typeset .mdx-iconsearch-result{-webkit-backface-visibility:hidden;backface-visibility:hidden;max-height:50vh;overflow-y:auto;scrollbar-color:var(--md-default-fg-color--lighter) transparent;scrollbar-width:thin;touch-action:pan-y}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar{height:.2rem;width:.2rem}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb{background-color:var(--md-default-fg-color--lighter)}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb:hover{background-color:var(--md-accent-fg-color)}.md-typeset .mdx-iconsearch-result__meta{color:var(--md-default-fg-color--lighter);font-size:.64rem;position:absolute;right:.6rem;top:.4rem}.md-typeset .mdx-iconsearch-result__list{list-style:none;margin:0;padding:0}.md-typeset .mdx-iconsearch-result__item{border-bottom:.05rem solid var(--md-default-fg-color--lightest);margin:0;padding:.2rem .6rem}.md-typeset .mdx-iconsearch-result__item:last-child{border-bottom:none}.md-typeset .mdx-iconsearch-result__item>*{margin-right:.6rem}.md-typeset .mdx-iconsearch-result__item img{height:.9rem;width:.9rem}[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch-result__item img[src*=squidfunk]{-webkit-filter:invert(1);filter:invert(1)}.md-typeset .mdx-sponsorship__list{margin:2em 0;overflow:auto}.md-typeset .mdx-sponsorship__item{border-radius:100%;display:block;float:left;height:3rem;margin:.2rem;overflow:hidden;transform:scale(1);transition:color 125ms,transform 125ms;width:3rem}.md-typeset .mdx-sponsorship__item:focus,.md-typeset .mdx-sponsorship__item:hover{transform:scale(1.1)}.md-typeset .mdx-sponsorship__item:focus img,.md-typeset .mdx-sponsorship__item:hover img{-webkit-filter:grayscale(0);filter:grayscale(0)}.md-typeset .mdx-sponsorship__item--private{background:var(--md-default-fg-color--lightest);color:var(--md-default-fg-color--lighter);font-size:1.2rem;font-weight:700;line-height:3rem;text-align:center}.md-typeset .mdx-sponsorship__item img{display:block;-webkit-filter:grayscale(100%);filter:grayscale(100%);height:auto;transition:-webkit-filter 125ms;transition:filter 125ms;transition:filter 125ms,-webkit-filter 125ms;width:100%}.md-typeset .mdx-sponsorship-button{font-weight:400}.md-typeset .mdx-sponsorship-count,.md-typeset .mdx-sponsorship-total{font-weight:700} +/*# sourceMappingURL=main.14225c90.min.css.map */ \ No newline at end of file diff --git a/material/overrides/assets/stylesheets/main.14225c90.min.css.map b/material/overrides/assets/stylesheets/main.14225c90.min.css.map new file mode 100644 index 000000000..b0d505363 --- /dev/null +++ b/material/overrides/assets/stylesheets/main.14225c90.min.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["src/overrides/assets/stylesheets/main/_typeset.scss","src/overrides/assets/stylesheets/main.scss","src/assets/stylesheets/utilities/_break.scss","src/overrides/assets/stylesheets/main/layout/_announce.scss","src/overrides/assets/stylesheets/main/layout/_hero.scss","src/overrides/assets/stylesheets/main/layout/_iconsearch.scss","src/overrides/assets/stylesheets/main/layout/_sponsorship.scss"],"names":[],"mappings":"AA2BA,6BACE,cAIE,kBC7BF,CDgCA,QAEE,qBC/BF,CACF,CDoBA,qBACE,cAIE,kBC7BF,CDgCA,QAEE,qBC/BF,CACF,CD0CE,qBACE,aCxCJ,CD4CE,uBACE,UC1CJ,CD6CI,8BAGE,QAAA,CACA,sBAAA,CAHA,iBAAA,CACA,UCzCN,CD+CI,8BAOE,WAAA,CAFA,WAAA,CAFA,MAAA,CAGA,eAAA,CALA,iBAAA,CACA,KAAA,CAEA,UC1CN,CDkDE,uBACE,uCAAA,CAAA,+BChDJ,CDoDE,0BACE,aClDJ,CDsDE,+BACE,cAAA,CACA,uBCpDJ,CDuDI,0EAEE,WCtDN,CD0DI,oCAGE,2CAAA,CADA,gCAAA,CADA,aCtDN,CDgEI,wDAEE,cAAA,CAAA,cC9DN,CC8JI,wCFlGA,wDAMI,oBAAA,CAAA,eC7DN,CACF,CDiEI,4BACE,8BAAA,CAAA,kBC/DN,CE7BE,yDAGE,kBFgCJ,CE5BE,oBACE,kBF8BJ,CE1BE,sBACE,gBF4BJ,CG5CA,eAEE,uYACE,CAFF,gBHgDF,CGrCE,4CACE,yYHuCJ,CG3BA,UAEE,gCAAA,CADA,cH+BF,CG3BE,aAEE,kBAAA,CACA,eAAA,CAFA,kBH+BJ,CCuHI,wCEvJF,aAOI,gBH6BJ,CACF,CGzBE,mBACE,mBH2BJ,CC4FI,mCEzIJ,UAwBI,mBAAA,CADA,YH2BF,CGvBE,mBAEE,iBAAA,CADA,eAAA,CAEA,mBHyBJ,CGrBE,iBACE,OAAA,CAEA,0BAAA,CADA,WHwBJ,CACF,CC4EI,sCE5FA,iBACE,0BHmBJ,CACF,CGfE,qBAGE,gCAAA,CADA,kBAAA,CADA,gBHmBJ,CGdI,sDAGE,0CAAA,CACA,sCAAA,CAFA,+BHiBN,CGXI,8BAEE,2CAAA,CACA,uCAAA,CAFA,aHeN,CIvGE,4BAEE,2CAAA,CACA,mBAAA,CACA,uEACE,CAJF,iBAAA,CAMA,2BJwGJ,CIrGI,2EAEE,wEJsGN,CIhGI,sCACE,qCAAA,CACA,oCJkGN,CI/FM,mEACE,kCJiGR,CI3FE,mCAIE,kCAAA,CAAA,0BAAA,CAHA,eAAA,CACA,eAAA,CAKA,+DAAA,CADA,oBAAA,CADA,kBJ8FJ,CIzFI,sDAEE,YAAA,CADA,WJ4FN,CIvFI,4DACE,oDJyFN,CItFM,kEACE,0CJwFR,CInFI,yCAIE,yCAAA,CACA,gBAAA,CAJA,iBAAA,CAEA,WAAA,CADA,SJwFN,CIjFI,yCAGE,eAAA,CAFA,QAAA,CACA,SJoFN,CI/EI,yCAGE,+DAAA,CAFA,QAAA,CACA,mBJkFN,CI9EM,oDACE,kBJgFR,CI5EM,2CACE,kBJ8ER,CI1EM,6CAEE,YAAA,CADA,WJ6ER,CIzEQ,0FACE,wBAAA,CAAA,gBJ2EV,CKtKI,mCACE,YAAA,CACA,aLyKN,CKrKI,mCAOE,kBAAA,CANA,aAAA,CACA,UAAA,CAEA,WAAA,CACA,YAAA,CACA,eAAA,CAEA,kBAAA,CACA,sCACE,CAPF,UL6KN,CKlKM,kFAEE,oBLmKR,CKhKQ,0FACE,2BAAA,CAAA,mBLkKV,CK7JM,4CAME,+CAAA,CALA,yCAAA,CAEA,gBAAA,CADA,eAAA,CAEA,gBAAA,CACA,iBLgKR,CK3JM,uCACE,aAAA,CAGA,8BAAA,CAAA,sBAAA,CADA,WAAA,CAEA,+BAAA,CAAA,uBAAA,CAAA,4CAAA,CAHA,ULgKR,CKvJE,oCACE,eLyJJ,CKrJE,sEAEE,eLuJJ","file":"src/overrides/assets/stylesheets/main.scss","sourcesContent":["////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Keyframes\n// ----------------------------------------------------------------------------\n\n// Pumping heart animation\n@keyframes mdx-heart {\n 0%,\n 40%,\n 80%,\n 100% {\n transform: scale(1);\n }\n\n 20%,\n 60% {\n transform: scale(1.15);\n }\n}\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Twitter icon\n .twitter {\n color: #00acee;\n }\n\n // Insiders video\n .mdx-video {\n width: auto;\n\n // Insiders video container\n &__inner {\n position: relative;\n width: 100%;\n height: 0;\n padding-bottom: 56.138%;\n }\n\n // Insiders video iframe\n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow: hidden;\n border: none;\n }\n }\n\n // Pumping heart\n .mdx-heart {\n animation: mdx-heart 1000ms infinite;\n }\n\n // Insiders color (for links, etc.)\n .mdx-insiders {\n color: $clr-pink-500;\n }\n\n // Switch buttons\n .mdx-switch button {\n cursor: pointer;\n transition: opacity 250ms;\n\n // Button on focus/hover\n &:focus,\n &:hover {\n opacity: 0.75;\n }\n\n // Code block\n > code {\n display: block;\n color: var(--md-primary-bg-color);\n background-color: var(--md-primary-fg-color);\n }\n }\n\n // Two-column layout\n .mdx-columns {\n\n // Column\n ol,\n ul {\n columns: 2;\n\n // [mobile portrait -]: Reset columns on mobile\n @include break-to-device(mobile portrait) {\n columns: initial;\n }\n }\n\n // Column item\n li {\n break-inside: avoid;\n }\n }\n}\n","@keyframes mdx-heart {\n 0%, 40%, 80%, 100% {\n transform: scale(1);\n }\n 20%, 60% {\n transform: scale(1.15);\n }\n}\n.md-typeset .twitter {\n color: #00acee;\n}\n.md-typeset .mdx-video {\n width: auto;\n}\n.md-typeset .mdx-video__inner {\n position: relative;\n width: 100%;\n height: 0;\n padding-bottom: 56.138%;\n}\n.md-typeset .mdx-video iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow: hidden;\n border: none;\n}\n.md-typeset .mdx-heart {\n animation: mdx-heart 1000ms infinite;\n}\n.md-typeset .mdx-insiders {\n color: #e91e63;\n}\n.md-typeset .mdx-switch button {\n cursor: pointer;\n transition: opacity 250ms;\n}\n.md-typeset .mdx-switch button:focus, .md-typeset .mdx-switch button:hover {\n opacity: 0.75;\n}\n.md-typeset .mdx-switch button > code {\n display: block;\n color: var(--md-primary-bg-color);\n background-color: var(--md-primary-fg-color);\n}\n.md-typeset .mdx-columns ol,\n.md-typeset .mdx-columns ul {\n columns: 2;\n}\n@media screen and (max-width: 29.9375em) {\n .md-typeset .mdx-columns ol,\n.md-typeset .mdx-columns ul {\n columns: initial;\n }\n}\n.md-typeset .mdx-columns li {\n break-inside: avoid;\n}\n\n.md-announce a,\n.md-announce a:focus,\n.md-announce a:hover {\n color: currentColor;\n}\n.md-announce strong {\n white-space: nowrap;\n}\n.md-announce .twitter {\n margin-left: 0.2em;\n}\n\n.mdx-container {\n padding-top: 1rem;\n background: url(\"data:image/svg+xml;utf8,\") no-repeat bottom, linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%);\n}\n[data-md-color-scheme=slate] .mdx-container {\n background: url(\"data:image/svg+xml;utf8,\") no-repeat bottom, linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%);\n}\n\n.mdx-hero {\n margin: 0 0.8rem;\n color: var(--md-primary-bg-color);\n}\n.mdx-hero h1 {\n margin-bottom: 1rem;\n color: currentColor;\n font-weight: 700;\n}\n@media screen and (max-width: 29.9375em) {\n .mdx-hero h1 {\n font-size: 1.4rem;\n }\n}\n.mdx-hero__content {\n padding-bottom: 6rem;\n}\n@media screen and (min-width: 60em) {\n .mdx-hero {\n display: flex;\n align-items: stretch;\n }\n .mdx-hero__content {\n max-width: 19rem;\n margin-top: 3.5rem;\n padding-bottom: 14vw;\n }\n .mdx-hero__image {\n order: 1;\n width: 38rem;\n transform: translateX(4rem);\n }\n}\n@media screen and (min-width: 76.25em) {\n .mdx-hero__image {\n transform: translateX(8rem);\n }\n}\n.mdx-hero .md-button {\n margin-top: 0.5rem;\n margin-right: 0.5rem;\n color: var(--md-primary-bg-color);\n}\n.mdx-hero .md-button:focus, .mdx-hero .md-button:hover {\n color: var(--md-accent-bg-color);\n background-color: var(--md-accent-fg-color);\n border-color: var(--md-accent-fg-color);\n}\n.mdx-hero .md-button--primary {\n color: #894da8;\n background-color: var(--md-primary-bg-color);\n border-color: var(--md-primary-bg-color);\n}\n\n.md-typeset .mdx-iconsearch {\n position: relative;\n background-color: var(--md-default-bg-color);\n border-radius: 0.1rem;\n box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.1), 0 0.025rem 0.05rem rgba(0, 0, 0, 0.1);\n transition: box-shadow 125ms;\n}\n.md-typeset .mdx-iconsearch:focus-within, .md-typeset .mdx-iconsearch:hover {\n box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.15), 0 0.025rem 0.05rem rgba(0, 0, 0, 0.15);\n}\n.md-typeset .mdx-iconsearch .md-input {\n background: var(--md-default-bg-color);\n box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.07);\n}\n[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch .md-input {\n background: var(--md-code-bg-color);\n}\n.md-typeset .mdx-iconsearch-result {\n max-height: 50vh;\n overflow-y: auto;\n backface-visibility: hidden;\n touch-action: pan-y;\n scrollbar-width: thin;\n scrollbar-color: var(--md-default-fg-color--lighter) transparent;\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar {\n width: 0.2rem;\n height: 0.2rem;\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb {\n background-color: var(--md-default-fg-color--lighter);\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb:hover {\n background-color: var(--md-accent-fg-color);\n}\n.md-typeset .mdx-iconsearch-result__meta {\n position: absolute;\n top: 0.4rem;\n right: 0.6rem;\n color: var(--md-default-fg-color--lighter);\n font-size: 0.64rem;\n}\n.md-typeset .mdx-iconsearch-result__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n.md-typeset .mdx-iconsearch-result__item {\n margin: 0;\n padding: 0.2rem 0.6rem;\n border-bottom: 0.05rem solid var(--md-default-fg-color--lightest);\n}\n.md-typeset .mdx-iconsearch-result__item:last-child {\n border-bottom: none;\n}\n.md-typeset .mdx-iconsearch-result__item > * {\n margin-right: 0.6rem;\n}\n.md-typeset .mdx-iconsearch-result__item img {\n width: 0.9rem;\n height: 0.9rem;\n}\n[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch-result__item img[src*=squidfunk] {\n filter: invert(1);\n}\n\n.md-typeset .mdx-sponsorship__list {\n margin: 2em 0;\n overflow: auto;\n}\n.md-typeset .mdx-sponsorship__item {\n display: block;\n float: left;\n width: 3rem;\n height: 3rem;\n margin: 0.2rem;\n overflow: hidden;\n border-radius: 100%;\n transform: scale(1);\n transition: color 125ms, transform 125ms;\n}\n.md-typeset .mdx-sponsorship__item:focus, .md-typeset .mdx-sponsorship__item:hover {\n transform: scale(1.1);\n}\n.md-typeset .mdx-sponsorship__item:focus img, .md-typeset .mdx-sponsorship__item:hover img {\n filter: grayscale(0%);\n}\n.md-typeset .mdx-sponsorship__item--private {\n color: var(--md-default-fg-color--lighter);\n font-weight: 700;\n font-size: 1.2rem;\n line-height: 3rem;\n text-align: center;\n background: var(--md-default-fg-color--lightest);\n}\n.md-typeset .mdx-sponsorship__item img {\n display: block;\n width: 100%;\n height: auto;\n filter: grayscale(100%);\n transition: filter 125ms;\n}\n.md-typeset .mdx-sponsorship-button {\n font-weight: 400;\n}\n.md-typeset .mdx-sponsorship-count,\n.md-typeset .mdx-sponsorship-total {\n font-weight: 700;\n}\n\n/*# sourceMappingURL=main.css.map */","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Variables\n// ----------------------------------------------------------------------------\n\n///\n/// Device-specific breakpoints\n///\n/// @example\n/// $break-devices: (\n/// mobile: (\n/// portrait: 220px 479px,\n/// landscape: 480px 719px\n/// ),\n/// tablet: (\n/// portrait: 720px 959px,\n/// landscape: 960px 1219px\n/// ),\n/// screen: (\n/// small: 1220px 1599px,\n/// medium: 1600px 1999px,\n/// large: 2000px\n/// )\n/// );\n///\n$break-devices: () !default;\n\n// ----------------------------------------------------------------------------\n// Helpers\n// ----------------------------------------------------------------------------\n\n///\n/// Choose minimum and maximum device widths\n///\n@function break-select-min-max($devices) {\n $min: 1000000;\n $max: 0;\n @each $key, $value in $devices {\n @while type-of($value) == map {\n $value: break-select-min-max($value);\n }\n @if type-of($value) == list {\n @each $number in $value {\n @if type-of($number) == number {\n $min: min($number, $min);\n @if $max {\n $max: max($number, $max);\n }\n } @else {\n @error \"Invalid number: #{$number}\";\n }\n }\n } @else if type-of($value) == number {\n $min: min($value, $min);\n $max: null;\n } @else {\n @error \"Invalid value: #{$value}\";\n }\n }\n @return $min, $max;\n}\n\n///\n/// Select minimum and maximum widths for a device breakpoint\n///\n@function break-select-device($device) {\n $current: $break-devices;\n @for $n from 1 through length($device) {\n @if type-of($current) == map {\n $current: map-get($current, nth($device, $n));\n } @else {\n @error \"Invalid device map: #{$devices}\";\n }\n }\n @if type-of($current) == list or type-of($current) == number {\n $current: (default: $current);\n }\n @return break-select-min-max($current);\n}\n\n// ----------------------------------------------------------------------------\n// Mixins\n// ----------------------------------------------------------------------------\n\n///\n/// A minimum-maximum media query breakpoint\n///\n@mixin break-at($breakpoint) {\n @if type-of($breakpoint) == number {\n @media screen and (min-width: $breakpoint) {\n @content;\n }\n } @else if type-of($breakpoint) == list {\n $min: nth($breakpoint, 1);\n $max: nth($breakpoint, 2);\n @if type-of($min) == number and type-of($max) == number {\n @media screen and (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// An orientation media query breakpoint\n///\n@mixin break-at-orientation($breakpoint) {\n @if type-of($breakpoint) == string {\n @media screen and (orientation: $breakpoint) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// A maximum-aspect-ratio media query breakpoint\n///\n@mixin break-at-ratio($breakpoint) {\n @if type-of($breakpoint) == number {\n @media screen and (max-aspect-ratio: $breakpoint) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// A minimum-maximum media query device breakpoint\n///\n@mixin break-at-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n @if nth($breakpoint, 2) {\n $min: nth($breakpoint, 1);\n $max: nth($breakpoint, 2);\n\n @media screen and (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n\n///\n/// A minimum media query device breakpoint\n///\n@mixin break-from-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n $min: nth($breakpoint, 1);\n\n @media screen and (min-width: $min) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n\n///\n/// A maximum media query device breakpoint\n///\n@mixin break-to-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n $max: nth($breakpoint, 2);\n\n @media screen and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Announcement bar\n.md-announce {\n\n // Text link, also on focus/hover\n a,\n a:focus,\n a:hover {\n color: currentColor;\n }\n\n // Don't wrap name of blog article\n strong {\n white-space: nowrap;\n }\n\n // Twitter icon\n .twitter {\n margin-left: 0.2em;\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Landing page container\n.mdx-container {\n padding-top: px2rem(20px);\n background:\n url(\"data:image/svg+xml;utf8,\") no-repeat bottom,\n linear-gradient(\n to bottom,\n var(--md-primary-fg-color),\n hsla(280, 67%, 55%, 1) 99%,\n var(--md-default-bg-color) 99%\n );\n\n // Adjust background for slate theme\n [data-md-color-scheme=\"slate\"] & {\n background:\n url(\"data:image/svg+xml;utf8,\") no-repeat bottom,\n linear-gradient(\n to bottom,\n var(--md-primary-fg-color),\n hsla(280, 67%, 55%, 1) 99%,\n var(--md-default-bg-color) 99%\n );\n }\n}\n\n// Landing page hero\n.mdx-hero {\n margin: 0 px2rem(16px);\n color: var(--md-primary-bg-color);\n\n // Hero headline\n h1 {\n margin-bottom: px2rem(20px);\n color: currentColor;\n font-weight: 700;\n\n // [mobile portrait -]: Larger hero headline\n @include break-to-device(mobile portrait) {\n font-size: px2rem(28px);\n }\n }\n\n // Hero content\n &__content {\n padding-bottom: px2rem(120px);\n }\n\n // [tablet landscape +]: Columnar display\n @include break-from-device(tablet landscape) {\n display: flex;\n align-items: stretch;\n\n // Adjust spacing and set dimensions\n &__content {\n max-width: px2rem(380px);\n margin-top: px2rem(70px);\n padding-bottom: 14vw;\n }\n\n // Hero image\n &__image {\n order: 1;\n width: px2rem(760px);\n transform: translateX(#{px2rem(80px)});\n }\n }\n\n // [screen +]: Columnar display and adjusted spacing\n @include break-from-device(screen) {\n\n // Hero image\n &__image {\n transform: translateX(#{px2rem(160px)});\n }\n }\n\n // Button\n .md-button {\n margin-top: px2rem(10px);\n margin-right: px2rem(10px);\n color: var(--md-primary-bg-color);\n\n // Button on focus/hover\n &:focus,\n &:hover {\n color: var(--md-accent-bg-color);\n background-color: var(--md-accent-fg-color);\n border-color: var(--md-accent-fg-color);\n }\n\n // Primary button\n &--primary {\n color: hsla(280deg, 37%, 48%, 1);\n background-color: var(--md-primary-bg-color);\n border-color: var(--md-primary-bg-color);\n }\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Icon search\n .mdx-iconsearch {\n position: relative;\n background-color: var(--md-default-bg-color);\n border-radius: px2rem(2px);\n box-shadow:\n 0 px2rem(4px) px2rem(10px) hsla(0, 0%, 0%, 0.1),\n 0 px2rem(0.5px) px2rem(1px) hsla(0, 0%, 0%, 0.1);\n transition: box-shadow 125ms;\n\n // Icon search on focus/hover\n &:focus-within,\n &:hover {\n box-shadow:\n 0 px2rem(8px) px2rem(20px) hsla(0, 0%, 0%, 0.15),\n 0 px2rem(0.5px) px2rem(1px) hsla(0, 0%, 0%, 0.15);\n }\n\n // Icon search input\n .md-input {\n background: var(--md-default-bg-color);\n box-shadow: 0 0 px2rem(12px) hsla(0, 0%, 0%, 0.07);\n\n // Slate theme, i.e. dark mode\n [data-md-color-scheme=\"slate\"] & {\n background: var(--md-code-bg-color);\n }\n }\n }\n\n // Icon search result\n .mdx-iconsearch-result {\n max-height: 50vh;\n overflow-y: auto;\n // Hack: promote to own layer to reduce jitter\n backface-visibility: hidden;\n touch-action: pan-y;\n scrollbar-width: thin;\n scrollbar-color: var(--md-default-fg-color--lighter) transparent;\n\n // Webkit scrollbar\n &::-webkit-scrollbar {\n width: px2rem(4px);\n height: px2rem(4px);\n }\n\n // Webkit scrollbar thumb\n &::-webkit-scrollbar-thumb {\n background-color: var(--md-default-fg-color--lighter);\n\n // Webkit scrollbar thumb on hover\n &:hover {\n background-color: var(--md-accent-fg-color);\n }\n }\n\n // Icon search result metadata\n &__meta {\n position: absolute;\n top: px2rem(8px);\n right: px2rem(12px);\n color: var(--md-default-fg-color--lighter);\n font-size: px2rem(12.8px);\n }\n\n // Icon search result list\n &__list {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n // Icon search result item\n &__item {\n margin: 0;\n padding: px2rem(4px) px2rem(12px);\n border-bottom: px2rem(1px) solid var(--md-default-fg-color--lightest);\n\n // Omit border on last child\n &:last-child {\n border-bottom: none;\n }\n\n // Item content\n > * {\n margin-right: px2rem(12px);\n }\n\n // Set icon dimensions to fit\n img {\n width: px2rem(18px);\n height: px2rem(18px);\n\n // Slate theme, i.e. dark mode\n [data-md-color-scheme=\"slate\"] &[src*=squidfunk] {\n filter: invert(1);\n }\n }\n }\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Sponsorship\n .mdx-sponsorship {\n\n // Sponsorship list\n &__list {\n margin: 2em 0;\n overflow: auto;\n }\n\n // Sponsorship item\n &__item {\n display: block;\n float: left;\n width: px2rem(60px);\n height: px2rem(60px);\n margin: px2rem(4px);\n overflow: hidden;\n border-radius: 100%;\n transform: scale(1);\n transition:\n color 125ms,\n transform 125ms;\n\n // Sponsor item on focus/hover\n &:focus,\n &:hover {\n transform: scale(1.1);\n\n // Sponsor avatar\n img {\n filter: grayscale(0%);\n }\n }\n\n // Private sponsor\n &--private {\n color: var(--md-default-fg-color--lighter);\n font-weight: 700;\n font-size: px2rem(24px);\n line-height: px2rem(60px);\n text-align: center;\n background: var(--md-default-fg-color--lightest);\n }\n\n // Sponsor avatar\n img {\n display: block;\n width: 100%;\n height: auto;\n filter: grayscale(100%);\n transition: filter 125ms;\n }\n }\n }\n\n // Sponsorship button\n .mdx-sponsorship-button {\n font-weight: 400;\n }\n\n // Sponsorship count and total\n .mdx-sponsorship-count,\n .mdx-sponsorship-total {\n font-weight: 700;\n }\n}\n"]} \ No newline at end of file diff --git a/material/overrides/assets/stylesheets/main.90c53ea0.min.css b/material/overrides/assets/stylesheets/main.90c53ea0.min.css deleted file mode 100644 index d0390444f..000000000 --- a/material/overrides/assets/stylesheets/main.90c53ea0.min.css +++ /dev/null @@ -1,2 +0,0 @@ -@-webkit-keyframes mdx-heart{0%,40%,80%,to{transform:scale(1)}20%,60%{transform:scale(1.15)}}@keyframes mdx-heart{0%,40%,80%,to{transform:scale(1)}20%,60%{transform:scale(1.15)}}.md-typeset figure>p+figcaption{margin-top:-1.2rem}.md-typeset .twitter{color:#00acee}.md-typeset .mdx-video{width:auto}.md-typeset .mdx-video__inner{height:0;padding-bottom:56.138%;position:relative;width:100%}.md-typeset .mdx-video iframe{border:none;height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.md-typeset .mdx-heart{-webkit-animation:mdx-heart 1s infinite;animation:mdx-heart 1s infinite}.md-typeset .mdx-insiders{color:#e91e63}.md-typeset .mdx-switch button{cursor:pointer;transition:opacity .25s}.md-typeset .mdx-switch button:focus,.md-typeset .mdx-switch button:hover{opacity:.75}.md-typeset .mdx-switch button>code{background-color:var(--md-primary-fg-color);color:var(--md-primary-bg-color);display:block}.md-typeset .mdx-columns ol,.md-typeset .mdx-columns ul{-moz-columns:2;column-count:2}@media screen and (max-width:29.9375em){.md-typeset .mdx-columns ol,.md-typeset .mdx-columns ul{-moz-columns:initial;columns:initial}}.md-typeset .mdx-columns li{-moz-column-break-inside:avoid;break-inside:avoid}.md-announce a,.md-announce a:focus,.md-announce a:hover{color:currentColor}.md-announce strong{white-space:nowrap}.md-announce .twitter{margin-left:.2em}.mdx-container{background:url("data:image/svg+xml;utf8,") no-repeat bottom,linear-gradient(to bottom,var(--md-primary-fg-color),#a63fd9 99%,var(--md-default-bg-color) 99%);padding-top:1rem}[data-md-color-scheme=slate] .mdx-container{background:url("data:image/svg+xml;utf8,") no-repeat bottom,linear-gradient(to bottom,var(--md-primary-fg-color),#a63fd9 99%,var(--md-default-bg-color) 99%)}.mdx-hero{color:var(--md-primary-bg-color);margin:0 .8rem}.mdx-hero h1{color:currentColor;font-weight:700;margin-bottom:1rem}@media screen and (max-width:29.9375em){.mdx-hero h1{font-size:1.4rem}}.mdx-hero__content{padding-bottom:6rem}@media screen and (min-width:60em){.mdx-hero{align-items:stretch;display:flex}.mdx-hero__content{margin-top:3.5rem;max-width:19rem;padding-bottom:14vw}.mdx-hero__image{order:1;transform:translateX(4rem);width:38rem}}@media screen and (min-width:76.25em){.mdx-hero__image{transform:translateX(8rem)}}.mdx-hero .md-button{color:var(--md-primary-bg-color);margin-right:.5rem;margin-top:.5rem}.mdx-hero .md-button:focus,.mdx-hero .md-button:hover{background-color:var(--md-accent-fg-color);border-color:var(--md-accent-fg-color);color:var(--md-accent-bg-color)}.mdx-hero .md-button--primary{background-color:var(--md-primary-bg-color);border-color:var(--md-primary-bg-color);color:#894da8}.md-typeset .mdx-iconsearch{background-color:var(--md-default-bg-color);border-radius:.1rem;box-shadow:0 .2rem .5rem rgba(0,0,0,.1),0 .025rem .05rem rgba(0,0,0,.1);position:relative;transition:box-shadow 125ms}.md-typeset .mdx-iconsearch:focus-within,.md-typeset .mdx-iconsearch:hover{box-shadow:0 .4rem 1rem rgba(0,0,0,.15),0 .025rem .05rem rgba(0,0,0,.15)}.md-typeset .mdx-iconsearch .md-input{background:var(--md-default-bg-color);box-shadow:0 0 .6rem rgba(0,0,0,.07)}[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch .md-input{background:var(--md-code-bg-color)}.md-typeset .mdx-iconsearch-result{-webkit-backface-visibility:hidden;backface-visibility:hidden;max-height:50vh;overflow-y:auto;scrollbar-color:var(--md-default-fg-color--lighter) transparent;scrollbar-width:thin;touch-action:pan-y}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar{height:.2rem;width:.2rem}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb{background-color:var(--md-default-fg-color--lighter)}.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb:hover{background-color:var(--md-accent-fg-color)}.md-typeset .mdx-iconsearch-result__meta{color:var(--md-default-fg-color--lighter);font-size:.64rem;position:absolute;right:.6rem;top:.4rem}.md-typeset .mdx-iconsearch-result__list{list-style:none;margin:0;padding:0}.md-typeset .mdx-iconsearch-result__item{border-bottom:.05rem solid var(--md-default-fg-color--lightest);margin:0;padding:.2rem .6rem}.md-typeset .mdx-iconsearch-result__item:last-child{border-bottom:none}.md-typeset .mdx-iconsearch-result__item>*{margin-right:.6rem}.md-typeset .mdx-iconsearch-result__item img{height:.9rem;width:.9rem}[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch-result__item img[src*=squidfunk]{-webkit-filter:invert(1);filter:invert(1)}.md-typeset .mdx-sponsorship__list{margin:2em 0;overflow:auto}.md-typeset .mdx-sponsorship__item{border-radius:100%;display:block;float:left;height:3rem;margin:.2rem;overflow:hidden;transform:scale(1);transition:color 125ms,transform 125ms;width:3rem}.md-typeset .mdx-sponsorship__item:focus,.md-typeset .mdx-sponsorship__item:hover{transform:scale(1.1)}.md-typeset .mdx-sponsorship__item:focus img,.md-typeset .mdx-sponsorship__item:hover img{-webkit-filter:grayscale(0);filter:grayscale(0)}.md-typeset .mdx-sponsorship__item--private{background:var(--md-default-fg-color--lightest);color:var(--md-default-fg-color--lighter);font-size:1.2rem;font-weight:700;line-height:3rem;text-align:center}.md-typeset .mdx-sponsorship__item img{display:block;-webkit-filter:grayscale(100%);filter:grayscale(100%);height:auto;transition:-webkit-filter 125ms;transition:filter 125ms;transition:filter 125ms,-webkit-filter 125ms;width:100%}.md-typeset .mdx-sponsorship-button{font-weight:400}.md-typeset .mdx-sponsorship-count,.md-typeset .mdx-sponsorship-total{font-weight:700} -/*# sourceMappingURL=main.90c53ea0.min.css.map */ \ No newline at end of file diff --git a/material/overrides/assets/stylesheets/main.90c53ea0.min.css.map b/material/overrides/assets/stylesheets/main.90c53ea0.min.css.map deleted file mode 100644 index 8518fba24..000000000 --- a/material/overrides/assets/stylesheets/main.90c53ea0.min.css.map +++ /dev/null @@ -1 +0,0 @@ -{"version":3,"sources":["src/overrides/assets/stylesheets/main/_typeset.scss","src/overrides/assets/stylesheets/main.scss","src/assets/stylesheets/utilities/_break.scss","src/overrides/assets/stylesheets/main/layout/_announce.scss","src/overrides/assets/stylesheets/main/layout/_hero.scss","src/overrides/assets/stylesheets/main/layout/_iconsearch.scss","src/overrides/assets/stylesheets/main/layout/_sponsorship.scss"],"names":[],"mappings":"AA2BA,6BACE,cAIE,kBC7BF,CDgCA,QAEE,qBC/BF,CACF,CDoBA,qBACE,cAIE,kBC7BF,CDgCA,QAEE,qBC/BF,CACF,CD0CE,gCACE,kBCxCJ,CD4CE,qBACE,aC1CJ,CD8CE,uBACE,UC5CJ,CD+CI,8BAGE,QAAA,CACA,sBAAA,CAHA,iBAAA,CACA,UC3CN,CDiDI,8BAOE,WAAA,CAFA,WAAA,CAFA,MAAA,CAGA,eAAA,CALA,iBAAA,CACA,KAAA,CAEA,UC5CN,CDoDE,uBACE,uCAAA,CAAA,+BClDJ,CDsDE,0BACE,aCpDJ,CDwDE,+BACE,cAAA,CACA,uBCtDJ,CDyDI,0EAEE,WCxDN,CD4DI,oCAGE,2CAAA,CADA,gCAAA,CADA,aCxDN,CDkEI,wDAEE,cAAA,CAAA,cChEN,CC2JI,wCF7FA,wDAMI,oBAAA,CAAA,eC/DN,CACF,CDmEI,4BACE,8BAAA,CAAA,kBCjEN,CEhCE,yDAGE,kBFmCJ,CE/BE,oBACE,kBFiCJ,CE7BE,sBACE,gBF+BJ,CG/CA,eAEE,uYACE,CAFF,gBHmDF,CGxCE,4CACE,yYH0CJ,CG9BA,UAEE,gCAAA,CADA,cHkCF,CG9BE,aAEE,kBAAA,CACA,eAAA,CAFA,kBHkCJ,CCoHI,wCEvJF,aAOI,gBHgCJ,CACF,CG5BE,mBACE,mBH8BJ,CCyFI,mCEzIJ,UAwBI,mBAAA,CADA,YH8BF,CG1BE,mBAEE,iBAAA,CADA,eAAA,CAEA,mBH4BJ,CGxBE,iBACE,OAAA,CAEA,0BAAA,CADA,WH2BJ,CACF,CCyEI,sCE5FA,iBACE,0BHsBJ,CACF,CGlBE,qBAGE,gCAAA,CADA,kBAAA,CADA,gBHsBJ,CGjBI,sDAGE,0CAAA,CACA,sCAAA,CAFA,+BHoBN,CGdI,8BAEE,2CAAA,CACA,uCAAA,CAFA,aHkBN,CI1GE,4BAEE,2CAAA,CACA,mBAAA,CACA,uEACE,CAJF,iBAAA,CAMA,2BJ2GJ,CIxGI,2EAEE,wEJyGN,CInGI,sCACE,qCAAA,CACA,oCJqGN,CIlGM,mEACE,kCJoGR,CI9FE,mCAIE,kCAAA,CAAA,0BAAA,CAHA,eAAA,CACA,eAAA,CAKA,+DAAA,CADA,oBAAA,CADA,kBJiGJ,CI5FI,sDAEE,YAAA,CADA,WJ+FN,CI1FI,4DACE,oDJ4FN,CIzFM,kEACE,0CJ2FR,CItFI,yCAIE,yCAAA,CACA,gBAAA,CAJA,iBAAA,CAEA,WAAA,CADA,SJ2FN,CIpFI,yCAGE,eAAA,CAFA,QAAA,CACA,SJuFN,CIlFI,yCAGE,+DAAA,CAFA,QAAA,CACA,mBJqFN,CIjFM,oDACE,kBJmFR,CI/EM,2CACE,kBJiFR,CI7EM,6CAEE,YAAA,CADA,WJgFR,CI5EQ,0FACE,wBAAA,CAAA,gBJ8EV,CKzKI,mCACE,YAAA,CACA,aL4KN,CKxKI,mCAOE,kBAAA,CANA,aAAA,CACA,UAAA,CAEA,WAAA,CACA,YAAA,CACA,eAAA,CAEA,kBAAA,CACA,sCACE,CAPF,ULgLN,CKrKM,kFAEE,oBLsKR,CKnKQ,0FACE,2BAAA,CAAA,mBLqKV,CKhKM,4CAME,+CAAA,CALA,yCAAA,CAEA,gBAAA,CADA,eAAA,CAEA,gBAAA,CACA,iBLmKR,CK9JM,uCACE,aAAA,CAGA,8BAAA,CAAA,sBAAA,CADA,WAAA,CAEA,+BAAA,CAAA,uBAAA,CAAA,4CAAA,CAHA,ULmKR,CK1JE,oCACE,eL4JJ,CKxJE,sEAEE,eL0JJ","file":"src/overrides/assets/stylesheets/main.scss","sourcesContent":["////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Keyframes\n// ----------------------------------------------------------------------------\n\n// Pumping heart animation\n@keyframes mdx-heart {\n 0%,\n 40%,\n 80%,\n 100% {\n transform: scale(1);\n }\n\n 20%,\n 60% {\n transform: scale(1.15);\n }\n}\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Screenshot caption\n figure > p + figcaption {\n margin-top: px2rem(-24px);\n }\n\n // Twitter icon\n .twitter {\n color: #00acee;\n }\n\n // Insiders video\n .mdx-video {\n width: auto;\n\n // Insiders video container\n &__inner {\n position: relative;\n width: 100%;\n height: 0;\n padding-bottom: 56.138%;\n }\n\n // Insiders video iframe\n iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow: hidden;\n border: none;\n }\n }\n\n // Pumping heart\n .mdx-heart {\n animation: mdx-heart 1000ms infinite;\n }\n\n // Insiders color (for links, etc.)\n .mdx-insiders {\n color: $clr-pink-500;\n }\n\n // Switch buttons\n .mdx-switch button {\n cursor: pointer;\n transition: opacity 250ms;\n\n // Button on focus/hover\n &:focus,\n &:hover {\n opacity: 0.75;\n }\n\n // Code block\n > code {\n display: block;\n color: var(--md-primary-bg-color);\n background-color: var(--md-primary-fg-color);\n }\n }\n\n // Two-column layout\n .mdx-columns {\n\n // Column\n ol,\n ul {\n columns: 2;\n\n // [mobile portrait -]: Reset columns on mobile\n @include break-to-device(mobile portrait) {\n columns: initial;\n }\n }\n\n // Column item\n li {\n break-inside: avoid;\n }\n }\n}\n","@keyframes mdx-heart {\n 0%, 40%, 80%, 100% {\n transform: scale(1);\n }\n 20%, 60% {\n transform: scale(1.15);\n }\n}\n.md-typeset figure > p + figcaption {\n margin-top: -1.2rem;\n}\n.md-typeset .twitter {\n color: #00acee;\n}\n.md-typeset .mdx-video {\n width: auto;\n}\n.md-typeset .mdx-video__inner {\n position: relative;\n width: 100%;\n height: 0;\n padding-bottom: 56.138%;\n}\n.md-typeset .mdx-video iframe {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow: hidden;\n border: none;\n}\n.md-typeset .mdx-heart {\n animation: mdx-heart 1000ms infinite;\n}\n.md-typeset .mdx-insiders {\n color: #e91e63;\n}\n.md-typeset .mdx-switch button {\n cursor: pointer;\n transition: opacity 250ms;\n}\n.md-typeset .mdx-switch button:focus, .md-typeset .mdx-switch button:hover {\n opacity: 0.75;\n}\n.md-typeset .mdx-switch button > code {\n display: block;\n color: var(--md-primary-bg-color);\n background-color: var(--md-primary-fg-color);\n}\n.md-typeset .mdx-columns ol,\n.md-typeset .mdx-columns ul {\n columns: 2;\n}\n@media screen and (max-width: 29.9375em) {\n .md-typeset .mdx-columns ol,\n.md-typeset .mdx-columns ul {\n columns: initial;\n }\n}\n.md-typeset .mdx-columns li {\n break-inside: avoid;\n}\n\n.md-announce a,\n.md-announce a:focus,\n.md-announce a:hover {\n color: currentColor;\n}\n.md-announce strong {\n white-space: nowrap;\n}\n.md-announce .twitter {\n margin-left: 0.2em;\n}\n\n.mdx-container {\n padding-top: 1rem;\n background: url(\"data:image/svg+xml;utf8,\") no-repeat bottom, linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%);\n}\n[data-md-color-scheme=slate] .mdx-container {\n background: url(\"data:image/svg+xml;utf8,\") no-repeat bottom, linear-gradient(to bottom, var(--md-primary-fg-color), #a63fd9 99%, var(--md-default-bg-color) 99%);\n}\n\n.mdx-hero {\n margin: 0 0.8rem;\n color: var(--md-primary-bg-color);\n}\n.mdx-hero h1 {\n margin-bottom: 1rem;\n color: currentColor;\n font-weight: 700;\n}\n@media screen and (max-width: 29.9375em) {\n .mdx-hero h1 {\n font-size: 1.4rem;\n }\n}\n.mdx-hero__content {\n padding-bottom: 6rem;\n}\n@media screen and (min-width: 60em) {\n .mdx-hero {\n display: flex;\n align-items: stretch;\n }\n .mdx-hero__content {\n max-width: 19rem;\n margin-top: 3.5rem;\n padding-bottom: 14vw;\n }\n .mdx-hero__image {\n order: 1;\n width: 38rem;\n transform: translateX(4rem);\n }\n}\n@media screen and (min-width: 76.25em) {\n .mdx-hero__image {\n transform: translateX(8rem);\n }\n}\n.mdx-hero .md-button {\n margin-top: 0.5rem;\n margin-right: 0.5rem;\n color: var(--md-primary-bg-color);\n}\n.mdx-hero .md-button:focus, .mdx-hero .md-button:hover {\n color: var(--md-accent-bg-color);\n background-color: var(--md-accent-fg-color);\n border-color: var(--md-accent-fg-color);\n}\n.mdx-hero .md-button--primary {\n color: #894da8;\n background-color: var(--md-primary-bg-color);\n border-color: var(--md-primary-bg-color);\n}\n\n.md-typeset .mdx-iconsearch {\n position: relative;\n background-color: var(--md-default-bg-color);\n border-radius: 0.1rem;\n box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.1), 0 0.025rem 0.05rem rgba(0, 0, 0, 0.1);\n transition: box-shadow 125ms;\n}\n.md-typeset .mdx-iconsearch:focus-within, .md-typeset .mdx-iconsearch:hover {\n box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.15), 0 0.025rem 0.05rem rgba(0, 0, 0, 0.15);\n}\n.md-typeset .mdx-iconsearch .md-input {\n background: var(--md-default-bg-color);\n box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.07);\n}\n[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch .md-input {\n background: var(--md-code-bg-color);\n}\n.md-typeset .mdx-iconsearch-result {\n max-height: 50vh;\n overflow-y: auto;\n backface-visibility: hidden;\n touch-action: pan-y;\n scrollbar-width: thin;\n scrollbar-color: var(--md-default-fg-color--lighter) transparent;\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar {\n width: 0.2rem;\n height: 0.2rem;\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb {\n background-color: var(--md-default-fg-color--lighter);\n}\n.md-typeset .mdx-iconsearch-result::-webkit-scrollbar-thumb:hover {\n background-color: var(--md-accent-fg-color);\n}\n.md-typeset .mdx-iconsearch-result__meta {\n position: absolute;\n top: 0.4rem;\n right: 0.6rem;\n color: var(--md-default-fg-color--lighter);\n font-size: 0.64rem;\n}\n.md-typeset .mdx-iconsearch-result__list {\n margin: 0;\n padding: 0;\n list-style: none;\n}\n.md-typeset .mdx-iconsearch-result__item {\n margin: 0;\n padding: 0.2rem 0.6rem;\n border-bottom: 0.05rem solid var(--md-default-fg-color--lightest);\n}\n.md-typeset .mdx-iconsearch-result__item:last-child {\n border-bottom: none;\n}\n.md-typeset .mdx-iconsearch-result__item > * {\n margin-right: 0.6rem;\n}\n.md-typeset .mdx-iconsearch-result__item img {\n width: 0.9rem;\n height: 0.9rem;\n}\n[data-md-color-scheme=slate] .md-typeset .mdx-iconsearch-result__item img[src*=squidfunk] {\n filter: invert(1);\n}\n\n.md-typeset .mdx-sponsorship__list {\n margin: 2em 0;\n overflow: auto;\n}\n.md-typeset .mdx-sponsorship__item {\n display: block;\n float: left;\n width: 3rem;\n height: 3rem;\n margin: 0.2rem;\n overflow: hidden;\n border-radius: 100%;\n transform: scale(1);\n transition: color 125ms, transform 125ms;\n}\n.md-typeset .mdx-sponsorship__item:focus, .md-typeset .mdx-sponsorship__item:hover {\n transform: scale(1.1);\n}\n.md-typeset .mdx-sponsorship__item:focus img, .md-typeset .mdx-sponsorship__item:hover img {\n filter: grayscale(0%);\n}\n.md-typeset .mdx-sponsorship__item--private {\n color: var(--md-default-fg-color--lighter);\n font-weight: 700;\n font-size: 1.2rem;\n line-height: 3rem;\n text-align: center;\n background: var(--md-default-fg-color--lightest);\n}\n.md-typeset .mdx-sponsorship__item img {\n display: block;\n width: 100%;\n height: auto;\n filter: grayscale(100%);\n transition: filter 125ms;\n}\n.md-typeset .mdx-sponsorship-button {\n font-weight: 400;\n}\n.md-typeset .mdx-sponsorship-count,\n.md-typeset .mdx-sponsorship-total {\n font-weight: 700;\n}\n\n/*# sourceMappingURL=main.css.map */","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Variables\n// ----------------------------------------------------------------------------\n\n///\n/// Device-specific breakpoints\n///\n/// @example\n/// $break-devices: (\n/// mobile: (\n/// portrait: 220px 479px,\n/// landscape: 480px 719px\n/// ),\n/// tablet: (\n/// portrait: 720px 959px,\n/// landscape: 960px 1219px\n/// ),\n/// screen: (\n/// small: 1220px 1599px,\n/// medium: 1600px 1999px,\n/// large: 2000px\n/// )\n/// );\n///\n$break-devices: () !default;\n\n// ----------------------------------------------------------------------------\n// Helpers\n// ----------------------------------------------------------------------------\n\n///\n/// Choose minimum and maximum device widths\n///\n@function break-select-min-max($devices) {\n $min: 1000000;\n $max: 0;\n @each $key, $value in $devices {\n @while type-of($value) == map {\n $value: break-select-min-max($value);\n }\n @if type-of($value) == list {\n @each $number in $value {\n @if type-of($number) == number {\n $min: min($number, $min);\n @if $max {\n $max: max($number, $max);\n }\n } @else {\n @error \"Invalid number: #{$number}\";\n }\n }\n } @else if type-of($value) == number {\n $min: min($value, $min);\n $max: null;\n } @else {\n @error \"Invalid value: #{$value}\";\n }\n }\n @return $min, $max;\n}\n\n///\n/// Select minimum and maximum widths for a device breakpoint\n///\n@function break-select-device($device) {\n $current: $break-devices;\n @for $n from 1 through length($device) {\n @if type-of($current) == map {\n $current: map-get($current, nth($device, $n));\n } @else {\n @error \"Invalid device map: #{$devices}\";\n }\n }\n @if type-of($current) == list or type-of($current) == number {\n $current: (default: $current);\n }\n @return break-select-min-max($current);\n}\n\n// ----------------------------------------------------------------------------\n// Mixins\n// ----------------------------------------------------------------------------\n\n///\n/// A minimum-maximum media query breakpoint\n///\n@mixin break-at($breakpoint) {\n @if type-of($breakpoint) == number {\n @media screen and (min-width: $breakpoint) {\n @content;\n }\n } @else if type-of($breakpoint) == list {\n $min: nth($breakpoint, 1);\n $max: nth($breakpoint, 2);\n @if type-of($min) == number and type-of($max) == number {\n @media screen and (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// An orientation media query breakpoint\n///\n@mixin break-at-orientation($breakpoint) {\n @if type-of($breakpoint) == string {\n @media screen and (orientation: $breakpoint) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// A maximum-aspect-ratio media query breakpoint\n///\n@mixin break-at-ratio($breakpoint) {\n @if type-of($breakpoint) == number {\n @media screen and (max-aspect-ratio: $breakpoint) {\n @content;\n }\n } @else {\n @error \"Invalid breakpoint: #{$breakpoint}\";\n }\n}\n\n///\n/// A minimum-maximum media query device breakpoint\n///\n@mixin break-at-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n @if nth($breakpoint, 2) {\n $min: nth($breakpoint, 1);\n $max: nth($breakpoint, 2);\n\n @media screen and (min-width: $min) and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n\n///\n/// A minimum media query device breakpoint\n///\n@mixin break-from-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n $min: nth($breakpoint, 1);\n\n @media screen and (min-width: $min) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n\n///\n/// A maximum media query device breakpoint\n///\n@mixin break-to-device($device) {\n @if type-of($device) == string {\n $device: $device,;\n }\n @if type-of($device) == list {\n $breakpoint: break-select-device($device);\n $max: nth($breakpoint, 2);\n\n @media screen and (max-width: $max) {\n @content;\n }\n } @else {\n @error \"Invalid device: #{$device}\";\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Announcement bar\n.md-announce {\n\n // Text link, also on focus/hover\n a,\n a:focus,\n a:hover {\n color: currentColor;\n }\n\n // Don't wrap name of blog article\n strong {\n white-space: nowrap;\n }\n\n // Twitter icon\n .twitter {\n margin-left: 0.2em;\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Landing page container\n.mdx-container {\n padding-top: px2rem(20px);\n background:\n url(\"data:image/svg+xml;utf8,\") no-repeat bottom,\n linear-gradient(\n to bottom,\n var(--md-primary-fg-color),\n hsla(280, 67%, 55%, 1) 99%,\n var(--md-default-bg-color) 99%\n );\n\n // Adjust background for slate theme\n [data-md-color-scheme=\"slate\"] & {\n background:\n url(\"data:image/svg+xml;utf8,\") no-repeat bottom,\n linear-gradient(\n to bottom,\n var(--md-primary-fg-color),\n hsla(280, 67%, 55%, 1) 99%,\n var(--md-default-bg-color) 99%\n );\n }\n}\n\n// Landing page hero\n.mdx-hero {\n margin: 0 px2rem(16px);\n color: var(--md-primary-bg-color);\n\n // Hero headline\n h1 {\n margin-bottom: px2rem(20px);\n color: currentColor;\n font-weight: 700;\n\n // [mobile portrait -]: Larger hero headline\n @include break-to-device(mobile portrait) {\n font-size: px2rem(28px);\n }\n }\n\n // Hero content\n &__content {\n padding-bottom: px2rem(120px);\n }\n\n // [tablet landscape +]: Columnar display\n @include break-from-device(tablet landscape) {\n display: flex;\n align-items: stretch;\n\n // Adjust spacing and set dimensions\n &__content {\n max-width: px2rem(380px);\n margin-top: px2rem(70px);\n padding-bottom: 14vw;\n }\n\n // Hero image\n &__image {\n order: 1;\n width: px2rem(760px);\n transform: translateX(#{px2rem(80px)});\n }\n }\n\n // [screen +]: Columnar display and adjusted spacing\n @include break-from-device(screen) {\n\n // Hero image\n &__image {\n transform: translateX(#{px2rem(160px)});\n }\n }\n\n // Button\n .md-button {\n margin-top: px2rem(10px);\n margin-right: px2rem(10px);\n color: var(--md-primary-bg-color);\n\n // Button on focus/hover\n &:focus,\n &:hover {\n color: var(--md-accent-bg-color);\n background-color: var(--md-accent-fg-color);\n border-color: var(--md-accent-fg-color);\n }\n\n // Primary button\n &--primary {\n color: hsla(280deg, 37%, 48%, 1);\n background-color: var(--md-primary-bg-color);\n border-color: var(--md-primary-bg-color);\n }\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Icon search\n .mdx-iconsearch {\n position: relative;\n background-color: var(--md-default-bg-color);\n border-radius: px2rem(2px);\n box-shadow:\n 0 px2rem(4px) px2rem(10px) hsla(0, 0%, 0%, 0.1),\n 0 px2rem(0.5px) px2rem(1px) hsla(0, 0%, 0%, 0.1);\n transition: box-shadow 125ms;\n\n // Icon search on focus/hover\n &:focus-within,\n &:hover {\n box-shadow:\n 0 px2rem(8px) px2rem(20px) hsla(0, 0%, 0%, 0.15),\n 0 px2rem(0.5px) px2rem(1px) hsla(0, 0%, 0%, 0.15);\n }\n\n // Icon search input\n .md-input {\n background: var(--md-default-bg-color);\n box-shadow: 0 0 px2rem(12px) hsla(0, 0%, 0%, 0.07);\n\n // Slate theme, i.e. dark mode\n [data-md-color-scheme=\"slate\"] & {\n background: var(--md-code-bg-color);\n }\n }\n }\n\n // Icon search result\n .mdx-iconsearch-result {\n max-height: 50vh;\n overflow-y: auto;\n // Hack: promote to own layer to reduce jitter\n backface-visibility: hidden;\n touch-action: pan-y;\n scrollbar-width: thin;\n scrollbar-color: var(--md-default-fg-color--lighter) transparent;\n\n // Webkit scrollbar\n &::-webkit-scrollbar {\n width: px2rem(4px);\n height: px2rem(4px);\n }\n\n // Webkit scrollbar thumb\n &::-webkit-scrollbar-thumb {\n background-color: var(--md-default-fg-color--lighter);\n\n // Webkit scrollbar thumb on hover\n &:hover {\n background-color: var(--md-accent-fg-color);\n }\n }\n\n // Icon search result metadata\n &__meta {\n position: absolute;\n top: px2rem(8px);\n right: px2rem(12px);\n color: var(--md-default-fg-color--lighter);\n font-size: px2rem(12.8px);\n }\n\n // Icon search result list\n &__list {\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n // Icon search result item\n &__item {\n margin: 0;\n padding: px2rem(4px) px2rem(12px);\n border-bottom: px2rem(1px) solid var(--md-default-fg-color--lightest);\n\n // Omit border on last child\n &:last-child {\n border-bottom: none;\n }\n\n // Item content\n > * {\n margin-right: px2rem(12px);\n }\n\n // Set icon dimensions to fit\n img {\n width: px2rem(18px);\n height: px2rem(18px);\n\n // Slate theme, i.e. dark mode\n [data-md-color-scheme=\"slate\"] &[src*=squidfunk] {\n filter: invert(1);\n }\n }\n }\n }\n}\n","////\n/// Copyright (c) 2016-2021 Martin Donath \n///\n/// Permission is hereby granted, free of charge, to any person obtaining a\n/// copy of this software and associated documentation files (the \"Software\"),\n/// to deal in the Software without restriction, including without limitation\n/// the rights to use, copy, modify, merge, publish, distribute, sublicense,\n/// and/or sell copies of the Software, and to permit persons to whom the\n/// Software is furnished to do so, subject to the following conditions:\n///\n/// The above copyright notice and this permission notice shall be included in\n/// all copies or substantial portions of the Software.\n///\n/// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n/// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n/// FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL\n/// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n/// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\n/// FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER\n/// DEALINGS\n////\n\n// ----------------------------------------------------------------------------\n// Rules\n// ----------------------------------------------------------------------------\n\n// Scoped in typesetted content to match specificity of regular content\n.md-typeset {\n\n // Sponsorship\n .mdx-sponsorship {\n\n // Sponsorship list\n &__list {\n margin: 2em 0;\n overflow: auto;\n }\n\n // Sponsorship item\n &__item {\n display: block;\n float: left;\n width: px2rem(60px);\n height: px2rem(60px);\n margin: px2rem(4px);\n overflow: hidden;\n border-radius: 100%;\n transform: scale(1);\n transition:\n color 125ms,\n transform 125ms;\n\n // Sponsor item on focus/hover\n &:focus,\n &:hover {\n transform: scale(1.1);\n\n // Sponsor avatar\n img {\n filter: grayscale(0%);\n }\n }\n\n // Private sponsor\n &--private {\n color: var(--md-default-fg-color--lighter);\n font-weight: 700;\n font-size: px2rem(24px);\n line-height: px2rem(60px);\n text-align: center;\n background: var(--md-default-fg-color--lightest);\n }\n\n // Sponsor avatar\n img {\n display: block;\n width: 100%;\n height: auto;\n filter: grayscale(100%);\n transition: filter 125ms;\n }\n }\n }\n\n // Sponsorship button\n .mdx-sponsorship-button {\n font-weight: 400;\n }\n\n // Sponsorship count and total\n .mdx-sponsorship-count,\n .mdx-sponsorship-total {\n font-weight: 700;\n }\n}\n"]} \ No newline at end of file diff --git a/material/overrides/main.html b/material/overrides/main.html index 0cd0fd83e..74741a5cf 100644 --- a/material/overrides/main.html +++ b/material/overrides/main.html @@ -3,26 +3,7 @@ -#} {% extends "base.html" %} {% block extrahead %} - {% set title = config.site_name %} - {% if page and page.title and not page.is_homepage %} - {% set title = config.site_name ~ " - " ~ page.title | striptags %} - {% endif %} - {% set image = config.site_url ~ 'assets/images/banner.png' %} - - - - - - - - - - - - - - - + {% endblock %} {% block announce %} diff --git a/mkdocs.yml b/mkdocs.yml index c6b74c4d1..c2afba4e9 100755 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -189,6 +189,7 @@ nav: - Setting up navigation: setup/setting-up-navigation.md - Setting up site search: setup/setting-up-site-search.md - Setting up site analytics: setup/setting-up-site-analytics.md + - Setting up social cards: setup/setting-up-social-cards.md - Setting up tags: setup/setting-up-tags.md - Setting up versioning: setup/setting-up-versioning.md - Setting up the header: setup/setting-up-the-header.md diff --git a/package-lock.json b/package-lock.json index 39a2a246f..bab5b3f23 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "mkdocs-material", - "version": "7.2.0", + "version": "7.2.1", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 9216971e9..331aeff44 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "mkdocs-material", - "version": "7.2.0", + "version": "7.2.1", "description": "A Material Design theme for MkDocs", "keywords": [ "mkdocs", diff --git a/src/overrides/assets/stylesheets/main/_typeset.scss b/src/overrides/assets/stylesheets/main/_typeset.scss index c6885d6b7..fc938604c 100644 --- a/src/overrides/assets/stylesheets/main/_typeset.scss +++ b/src/overrides/assets/stylesheets/main/_typeset.scss @@ -46,11 +46,6 @@ // Scoped in typesetted content to match specificity of regular content .md-typeset { - // Screenshot caption - figure > p + figcaption { - margin-top: px2rem(-24px); - } - // Twitter icon .twitter { color: #00acee;