Add CommunityMenu component and change MoreMenu to ContributeMenu

src/components/LeftSidebar/LeftSidebar.astro

@@ -4,6 +4,7 @@ import { removeLeadingSlash, removeTrailingSlash } from '../../util';
 import { getNav, useTranslations } from "../../i18n/util";
 import SidebarContent from './SidebarContent.astro';
 import SidebarToggleTabGroup from '../TabGroup/SidebarToggleTabGroup.tsx';
+import CommunityMenu from "../RightSidebar/CommunityMenu.astro";
 
 export interface Props {
 	currentPage: string;
@@ -43,6 +44,7 @@ for (const section of sidebarSections) {
 	<ul class={`nav-groups`}>
 		<SidebarContent type={'learn'} defaultActiveTab={activeTab} sidebarSections={learnSections} {currentPageMatch} />
 		<SidebarContent type={'api'} defaultActiveTab={activeTab} sidebarSections={apiSections} {currentPageMatch} />
+		<CommunityMenu hideOnLargerScreens={true} />
 		<li>
 			<Sponsors />
 		</li>

src/components/RightSidebar/CommunityMenu.astro

@@ -0,0 +1,99 @@
+---
+import UIString from '../UIString.astro';
+
+export interface Props {
+  hideOnLargerScreens: boolean;
+}
+
+const { hideOnLargerScreens = false } = Astro.props as Props;
+---
+
+<div class:list={["heading", {'hide-on-large-screens': hideOnLargerScreens}]}>
+<h2 class="heading"><UIString key="rightSidebar.community" /></h2>
+<ul>
+	<li class={`header-link depth-2`}>
+	<a href="https://astro.build/chat" target="_blank">
+			<svg
+				aria-hidden="true"
+				focusable="false"
+				data-prefix="fas"
+				data-icon="comment-alt"
+				class="svg-inline--fa fa-comment-alt fa-w-16"
+				role="img"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 512 512"
+				height="1em"
+				width="1em">
+				<path fill="currentColor" d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"></path>
+			</svg>
+			<span><UIString key="rightSidebar.joinDiscord" /></span>
+		</a>
+	</li>
+	<li class={`header-link depth-2`}>
+		<a href="https://astro.build/blog/" target="_blank">
+			<svg 
+				 xmlns="http://www.w3.org/2000/svg" 
+				 aria-hidden="true" role="img" 
+				 width="1em" 
+				 height="1em" 
+				 preserveAspectRatio="xMidYMid meet" 
+				 viewBox="0 0 1024 1024">
+				 <path fill="currentColor" d="M928 161H699.2c-49.1 0-97.1 14.1-138.4 40.7L512 233l-48.8-31.3A255.2 255.2 0 0 0 324.8 161H96c-17.7 0-32 14.3-32 32v568c0 17.7 14.3 32 32 32h228.8c49.1 0 97.1 14.1 138.4 40.7l44.4 28.6c1.3.8 2.8 1.3 4.3 1.3s3-.4 4.3-1.3l44.4-28.6C602 807.1 650.1 793 699.2 793H928c17.7 0 32-14.3 32-32V193c0-17.7-14.3-32-32-32zM404 553.5c0 4.1-3.2 7.5-7.1 7.5H211.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm0-140c0 4.1-3.2 7.5-7.1 7.5H211.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm416 140c0 4.1-3.2 7.5-7.1 7.5H627.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45zm0-140c0 4.1-3.2 7.5-7.1 7.5H627.1c-3.9 0-7.1-3.4-7.1-7.5v-45c0-4.1 3.2-7.5 7.1-7.5h185.7c3.9 0 7.1 3.4 7.1 7.5v45z"/>
+				 </svg>
+			<span><UIString key="rightSidebar.readBlog" /></span>
+		</a>
+	</li>
+	<li class={`header-link depth-2`}>
+		<a href="https://opencollective.com/astrodotbuild" target="_blank">
+			<svg xmlns="http://www.w3.org/2000/svg" 
+				 aria-hidden="true" 
+				 role="img" 
+				 width="1em" 
+				 height="1em" 
+				 preserveAspectRatio="xMidYMid meet" 
+				 viewBox="0 0 256 256">
+				 <path fill="currentColor" d="M209.765 128.15c0 16.013-4.9 31.34-13.266 44.575l33.447 33.447a128.918 128.918 0 0 0 25.783-77.35c0-29.265-9.754-55.751-26.47-77.336l-32.776 32.729a79.442 79.442 0 0 1 13.267 43.888l.015.047Z"/>
+				 <path fill="currentColor" d="M127.513 210.355c-45.367-.086-82.125-36.838-82.22-82.205c.069-45.386 36.835-82.166 82.22-82.252c16.732 0 32.058 4.901 44.607 13.267l32.744-32.776A128.965 128.965 0 0 0 127.514.636C57.123.636 0 57.76 0 128.15c0 70.359 57.124 127.513 127.513 127.513a125.126 125.126 0 0 0 77.351-26.501l-33.447-33.431c-11.861 9.754-27.157 14.624-43.904 14.624Z"/>
+				 </svg>
+			<span><UIString key="rightSidebar.openCollective" /></span>
+		</a>
+	</li>
+	<li class={`header-link depth-2`}>
+		<a href="https://github.com/withastro/docs" target="_blank">
+			<svg
+				aria-hidden="true"
+				focusable="false"
+				data-prefix="fas"
+				data-icon="github"
+				class="svg-inline--fa fa-brands fa-github fa-w-16"
+				role="img"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 496 512"
+				height="1em"
+				width="1em"
+				xmlns="http://www.w3.org/2000/svg"
+			>
+			<path fill="currentColor" d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
+			<span><UIString key="rightSidebar.github" /></span>
+		</a>
+	</li>
+</ul>
+</div>
+
+<style>
+	@media (max-width: 72em) {
+	h2 {
+		padding-left: 16px;
+	}
+}
+@media (min-width: 72em) {
+	:global(.hide-on-large-screens) {
+		display: none;
+	}
+}
+	@media (max-width: 50em) {
+		h2, ul {
+			padding-left: 32px;
+		}
+	}
+</style>

src/components/RightSidebar/ContributeMenu.astro

@@ -0,0 +1,51 @@
+---
+import UIString from '../UIString.astro';
+
+const { editHref } = Astro.props;
+---
+
+<h2 class="heading"><UIString key="rightSidebar.contribute" /></h2>
+<ul>
+	<li class={`header-link depth-2`}>
+		<a class="edit-on-github" href={editHref} target="_blank">
+			<svg
+				aria-hidden="true"
+				focusable="false"
+				data-prefix="fas"
+				data-icon="pen"
+				class="svg-inline--fa fa-pen fa-w-16"
+				role="img"
+				xmlns="http://www.w3.org/2000/svg"
+				viewBox="0 0 512 512"
+				height="1em"
+				width="1em"
+			>
+				<path
+					fill="currentColor"
+					d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z"
+				></path>
+			</svg>
+			<span><UIString key="rightSidebar.editPage" /></span>
+		</a>
+	</li>
+	<li class={`header-link depth-2`}>
+		<a href="https://github.com/withastro/docs/blob/main/src/i18n#readme" target="_blank">
+			<svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88.6 77.3" height="1.24em" width="1.24em" style="margin: -2px;">
+				<path fill="currentColor" d="M61,24.6h7.9l18.7,51.6h-7.7l-5.4-15.5H54.3l-5.6,15.5h-7.2L61,24.6z M72.6,55l-8-22.8L56.3,55H72.6z"></path>
+				<path
+					fill="currentColor"
+					d="M53.6,60.6c-10-4-16-9-22-14c0,0,1.3,1.3,0,0c-6,5-20,13-20,13l-4-6c8-5,10-6,19-13c-2.1-1.9-12-13-13-19h8          c4,9,10,14,10,14c10-8,10-19,10-19h8c0,0-1,13-12,24l0,0c5,5,10,9,19,13L53.6,60.6z M1.6,16.6h56v-8h-23v-7h-9v7h-24V16.6z"
+				></path>
+			</svg>
+			<span><UIString key="rightSidebar.translatePage" /></span>
+		</a>
+	</li>
+</ul>
+
+<style>
+	.edit-on-github {
+		text-decoration: none;
+		font: inherit;
+		font-size: 1rem;
+	}
+</style>

src/components/RightSidebar/RightSidebar.astro

@@ -1,7 +1,8 @@
 ---
 import TableOfContents from './TableOfContents.tsx';
 import ThemeToggleButton from './ThemeToggleButton.tsx';
-import MoreMenu from './MoreMenu.astro';
+import ContributeMenu from './ContributeMenu.astro';
+import CommunityMenu from './CommunityMenu.astro';
 import { useTranslations } from "../../i18n/util.ts";
 
 const t = useTranslations(Astro);
@@ -19,7 +20,8 @@ const headers = content.astro?.headers;
 				labels={{ onThisPage: t('rightSidebar.onThisPage'), overview: t('rightSidebar.overview') }}
 			/>
 		)}
-		<MoreMenu editHref={githubEditUrl} />
+		<ContributeMenu editHref={githubEditUrl} />
+		<CommunityMenu/>
 		<div style="margin: 2rem 0; text-align: center;">
 			<ThemeToggleButton 
 				client:visible 

src/i18n/en/ui.ts

@@ -16,10 +16,13 @@ export default {
 	'rightSidebar.a11yTitle': 'Table of Contents',
 	'rightSidebar.onThisPage': 'On this page',
 	'rightSidebar.overview': 'Overview',
-	'rightSidebar.more': 'More',
+	'rightSidebar.community': 'Community',
+	'rightSidebar.joinDiscord': 'Join us on Discord',
+	'rightSidebar.readBlog': 'Read our blog posts',
+	'rightSidebar.openCollective': 'Our Open Collective',
+	'rightSidebar.contribute': 'Contribute',
 	'rightSidebar.editPage': 'Edit this page',
 	'rightSidebar.translatePage': 'Translate this page',
-	'rightSidebar.joinCommunity': 'Join our community',
 	'rightSidebar.github': 'Astro Docs on GitHub',
 	// `<ThemeToggleButton>` acessibility labels
 	'themeToggle.useLight': 'Use light theme',