Prepare 7.2.1 release

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

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 social cards][12]
-- [Setting up versioning][13]
+- [Setting up tags][13]
-- [Setting up the header][14]
+- [Setting up versioning][14]
-- [Setting up the footer][15]
+- [Setting up the header][15]
-- [Adding a git repository][16]
+- [Setting up the footer][16]
-- [Adding a comment system][17]
+- [Adding a git repository][17]
+- [Adding a comment system][18]
 
 </div>
 
@@ -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
+  [12]: setup/setting-up-social-cards.md
-  [13]: setup/setting-up-versioning.md
+  [13]: setup/setting-up-tags.md
-  [14]: setup/setting-up-the-header.md
+  [14]: setup/setting-up-versioning.md
-  [15]: setup/setting-up-the-footer.md
+  [15]: setup/setting-up-the-header.md
-  [16]: setup/adding-a-git-repository.md
+  [16]: setup/setting-up-the-footer.md
-  [17]: setup/adding-a-comment-system.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]: http://localhost:8000
-  [19]: assets/screenshots/creating-your-site.png
+  [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#github-pages
-  [21]: publishing-your-site.md#gitlab-pages
+  [22]: publishing-your-site.md#gitlab-pages

docs/insiders/index.md

@@ -117,9 +117,10 @@ The following features are currently exclusively available to sponsors:
 
 <div class="mdx-columns" markdown="1">
 
+- [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
+- [ ] Improved search result summaries
-- [ ] Table of contents follows active anchor
+- [ ] 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]: ../license.md
-  [38]: https://docs.github.com/en/github/setting-up-and-managing-your-github-user-account/removing-a-collaborator-from-a-personal-repository
+  [39]: https://docs.github.com/en/github/setting-up-and-managing-your-github-user-account/removing-a-collaborator-from-a-personal-repository

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:
+
+<figure markdown="1">
+
+[![Social Cards][3]][3]
+
+  <figcaption markdown="1">
+
+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.
+
+  </figcaption>
+</figure>
+
+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

material/base.html

@@ -27,7 +27,7 @@
         <link rel="canonical" href="{{ page.canonical_url }}">
       {% endif %}
       <link rel="icon" href="{{ config.theme.favicon | url }}">
-      <meta name="generator" content="mkdocs-{{ mkdocs_version }}, mkdocs-material-7.2.0">
+      <meta name="generator" content="mkdocs-{{ mkdocs_version }}, mkdocs-material-7.2.1">
     {% endblock %}
     {% block htmltitle %}
       {% if page and page.meta and page.meta.title %}

material/overrides/main.html

@@ -3,26 +3,7 @@
 -#}
 {% extends "base.html" %}
 {% block extrahead %}
-  {% set title = config.site_name %}
+  <link rel="stylesheet" href="{{ 'overrides/assets/stylesheets/main.14225c90.min.css' | url }}">
-  {% 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' %}
-  <meta property="og:type" content="website">
-  <meta property="og:title" content="{{ title }}">
-  <meta property="og:description" content="{{ config.site_description }}">
-  <meta property="og:url" content="{{ page.canonical_url }}">
-  <meta property="og:image" content="{{ image }}">
-  <meta property="og:image:type" content="image/png">
-  <meta property="og:image:width" content="1080">
-  <meta property="og:image:height" content="568">
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:site" content="@squidfunk">
-  <meta name="twitter:creator" content="@squidfunk">
-  <meta name="twitter:title" content="{{ title }}">
-  <meta name="twitter:description" content="{{ config.site_description }}">
-  <meta name="twitter:image" content="{{ image }}">
-  <link rel="stylesheet" href="{{ 'overrides/assets/stylesheets/main.90c53ea0.min.css' | url }}">
 {% endblock %}
 {% block announce %}
   <a href="https://twitter.com/squidfunk">

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

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "mkdocs-material",
-  "version": "7.2.0",
+  "version": "7.2.1",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

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",

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;