Updates and blog post for Discord (lit#928)

- Updates all references and links to Slack with Discord
- Adds a blog post about launching the new Discord server
- This is intended to merge on Tuesday, September 6.

Fixes lit#923
Fixes lit#924

Author: aomarks

packages/lit-dev-content/site/_includes/footer.html

@@ -10,15 +10,15 @@
 
     <div id="footerSocialLinks">
       <a
-        href="/slack-invite/"
+        href="/discord/"
         target="_blank"
         rel="noopener"
-        title="Slack"
-        aria-label="Slack"
+        title="Discord"
+        aria-label="Discord"
       >
         <lazy-svg
-          href="{{ site.baseurl }}/images/social/slack.svg#slack"
-          label="Slack"
+          href="{{ site.baseurl }}/images/social/discord.svg#discord"
+          label="Discord"
           loading="visible">
         </lazy-svg>
       </a>

packages/lit-dev-content/site/blog/2019-02-05-lit-element-and-lit-html-release.md

@@ -161,7 +161,7 @@ templating into another project, see the lit-html docs:
 * [lit-html docs](https://lit-html.polymer-project.org/)
 
 As always, let us know what you think. You can reach us on
-[Slack](/slack-invite/) or [Twitter](https://twitter.com/buildWithLit). Our projects
+[Discord](/discord/) or [Twitter](https://twitter.com/buildWithLit). Our projects
 are open source (of course!) and you can report bugs, file feature requests or
 suggest improvements on GitHub:
 

packages/lit-dev-content/site/blog/2021-09-21-announcing-lit-2.md

@@ -77,5 +77,5 @@ For a full list of changes, see the [changelog](https://github.com/lit/lit/blob/
 
 Want to try out Lit 2? Visit [lit.dev](https://lit.dev/docs/getting-started/) to get started. The site features a [catalog of interactive tutorials](https://lit.dev/tutorials) to get you started with Lit 2, an interactive [playground](https://lit.dev/playground/) for live coding, guides, and API docs.
 
-Want to talk Lit? Join the [Lit & Friends Slack](https://lit.dev/slack-invite/) for discussions on Lit and web components, or open a discussion on our [GitHub Discussions](https://github.com/lit/lit/discussions) board.
+Want to talk Lit? Join the [Lit Discord](https://lit.dev/discord/) for discussions on Lit and web components, or open a discussion on our [GitHub Discussions](https://github.com/lit/lit/discussions) board.
 

packages/lit-dev-content/site/blog/2022-01-05-lit-2.1-release.md

@@ -154,7 +154,7 @@ dependencies footprint, and refactored the `importModule` function into a new
 
 We hope your 2022 is off to a good start. If you've tried the new releases, we'd
 love to hear from you. For questions and discussions, please join us on
-[Slack](https://lit.dev/slack-invite/) or on [GitHub
+[Discord](https://lit.dev/discord/) or on [GitHub
 Discussions](https://github.com/lit/lit/discussions). As always you can check
 out our documentation and code playground at [lit.dev](https://lit.dev) and
 report issues on our [GitHub issue tracker](https://github.com/lit/lit/issues).

packages/lit-dev-content/site/blog/2022-09-06-discord.md

@@ -0,0 +1,48 @@
+---
+tags: blogPosts
+layout: blog-post.html
+title: "Lit on Discord!"
+summary: "We've launched a brand new Lit Discord server, and here's why you should join it now!"
+date: 2022-09-06
+author:
+  - al-marks
+---
+
+We've just launched a brand new [Lit Discord server](/discord/), and we'd love
+for you to [join it now](/discord/)! Everybody is welcome, whether you are brand
+new to Lit, or an experienced user.
+
+We think the Lit Discord will be the best place to chat with the Lit community,
+talk to the Lit dev team, get help using Lit, and show off your Lit projects! We
+also plan to host special events there, using both chat and voice!
+
+<img src="/images/blog/discord/discord-screenshot.png" width="600" height="385.25" class="block centered">
+
+## Why Discord?
+
+Here's what we like best about Discord:
+
+1. **It's easy to be in *many* communities**, becuase you can quickly switch
+   between them.
+
+   There are already Discords for Modern Web, Shoelace, Vaadin, Material, Astro,
+   and many other open source projects, so we think it will be great to be able
+   to easily jump between them, share announcements, and more.
+
+2. **Syntax highlighting**, including for nested html tagged template literals!
+
+3. **Traction & growth**. Discord has had huge growth in recent years, and new
+   open source projects seem to be choosing Discord more often than not now. We
+   think that's becuase using Discord is a great experience, and because the
+   friction to joining new Discord servers is low after you've started using it.
+
+## What's happening to Slack?
+
+The *Lit & Friends* workspace on Slack will be going into read-only mode on
+**Tuesday, September 13, 2022**. After that, you'll be able to read existing
+messages, but won't be able to post new ones. We've already sent a message to
+every channel about these plans.
+
+We decided to retire the Slack instead of maintaining both because we want to
+encourage more communication and less silos. Slack has served the Lit community
+well, but we think now is the right time to move to Discord!

packages/lit-dev-content/site/css/home/1-splash.css

@@ -2,13 +2,14 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  background: #325cff;
+  background: #283198;
   color: white;
-  height: var(--header-height);
+  height: 48px;
 }
 
 #new-banner > p {
   text-align: center;
+  font-size: 18px;
 }
 
 #new-banner a {
@@ -20,6 +21,10 @@
   text-decoration: underline;
 }
 
+#new-banner .emoji {
+  margin-right: 10px;
+}
+
 #intro {
   display: flex;
   align-items: center;

packages/lit-dev-content/site/docs/resources/community.md

@@ -13,9 +13,8 @@ share what you've built, and more. Participation in our community is subject to
 [Code of Conduct](https://github.com/lit/lit/blob/master/CODE_OF_CONDUCT.md)—be
 excellent to each other!
 
-*   **Join us on [Slack](/slack-invite/)!** The
-    Lit & Friends workspace has thousands of users discussing Lit, web components, and related topics.
-    Check out `#lit`, `#beginners`, or `#tools` to get started.
+*   **Join us on [Discord](/discord/)!** The
+    Chat about Lit, get help, or share your project in the Lit Discord server.
 
 *   **Follow us at [@buildWithLit  on Twitter](https://twitter.com/buildWithLit)**
     for the latest on Lit and web components. Many

packages/lit-dev-content/site/docs/v1/resources/community.md

@@ -13,10 +13,8 @@ share what you've built, and more. All community participation is subject to the
 <a href="https://github.com/lit/lit/blob/main/CODE_OF_CONDUCT.md">Code of Conduct</a>—be
 excellent to each other!
 
-*   <strong>Join us on <a href="https://lit.dev/slack-invite/">Slack</a>!</strong> The
-    Lit & Friends Slack workspace has thousands of users discussing LitElement, web components, and related topics.
-    Check out <code>#general</code>, <code>#beginners</code>, or
-    <code>#tools</code> to get started.
+*   <strong>Join us on <a href="https://lit.dev/discord/">Discord</a>!</strong>
+    Chat about Lit, get help, or share your project in the Lit Discord server.
 
 *   Follow us on <a href="https://twitter.com/buildWithLit">Twitter</a>
     for the latest on Lit and web components. Many

packages/lit-dev-content/site/home/1-splash.html

@@ -1,5 +1,5 @@
 <section id="new-banner">
-  <p>📣 Check out our brand-new <a href="{{site.baseurl}}/tutorials">Tutorials</a> page and <a href="{{site.baseurl}}/youtube">Lit YouTube Channel!</a></p>
+  <p><span class="emoji">📣</span> Check out our brand-new <a href="{{site.baseurl}}/discord/">Discord server!</a></p>
 </section>
 <section id="intro">
   <div id="splashLogo" role="heading" aria-level="1">

packages/lit-dev-content/site/home/7-connect.html

@@ -14,12 +14,12 @@ <h1>Connect with Lit and the web components community</h1>
       <ol id="connectList">
         <li>
           <a
-            href="/slack-invite/"
+            href="/discord/"
             target="_blank"
             rel="noopener"
           >
-            <span class="title">Lit Slack workspace</span>
-            <span class="desc">Chat with the Lit community and dev team</span>
+            <span class="title">Lit Discord</span>
+            <span class="desc">Chat about Lit with the Lit community and dev team</span>
           </a>
         </li>
         <li>

packages/lit-dev-content/site/images/blog/discord/discord-screenshot.png

@@ -44,6 +44,6 @@ You might enjoy our [Lit for React Developers Codelab](https://codelabs.develope
 
 ### Community
 
-* [Lit and Friends Slack](https://lit.dev/slack-invite) - The largest web components community
+* [Lit Discord](https://lit.dev/discord) - Chat about Lit, get help, or share your project
 * [@buildWithLit on Twitter](https://twitter.com/buildWithLit) - The Twitter account of the team that made Lit
-* [Web Components SF](https://twitter.com/WebComponentsSF) - A web components meetup for San Francisco
+* [Web Components SF](https://twitter.com/WebComponentsSF) - A web components meetup for San Francisco

packages/lit-dev-content/site/images/social/discord.svg

@@ -5,7 +5,8 @@
  */
 
 export const pageRedirects = new Map([
-  ['/slack-invite',                   'https://join.slack.com/t/lit-and-friends/shared_invite/zt-1etplu7f6-h1I1D0S16VMOluYyZ_2JUQ'],
+  ['/discord',                        'https://discord.gg/NqrQepWTym'],
+  ['/slack-invite',                   'https://discord.gg/NqrQepWTym'],
   ['/youtube',                        'https://www.youtube.com/channel/UCok4ZKSzM3jY7JQRMlF-DPg'],
   ['/msg/dev-mode',                   '/docs/tools/development/#development-and-production-builds'],
   // TODO(sorvell) https://github.com/lit/lit.dev/issues/455

packages/lit-dev-content/site/images/social/slack.svg

@@ -444,6 +444,7 @@ https://github.com/lit/lit/tree/main/packages/labs/ssr
 https://github.com/lit/lit/tree/main/packages/labs/eleventy-plugin-lit#polyfill
 https://github.com/lit/lit/tree/main/packages/labs/eleventy-plugin-lit#roadmap
 https://github.com/lit/lit/issues
+https://lit.dev/discord/
 https://lit.dev/slack-invite/
 https://lit.dev/
 https://github.com/justinfagnani