docs: publish 2.0.0 release blog post + adapt website for the launch (#…

…7863)

.gitignore

@@ -9,6 +9,7 @@
 
 node_modules
 .yarn
+package-lock.json
 
 .eslintcache
 

admin/scripts/resizeImageBlog.js

@@ -0,0 +1,53 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import fs from 'fs-extra';
+import path from 'path';
+import logger from '@docusaurus/logger';
+import sharp from 'sharp';
+import imageSize from 'image-size';
+import globby from 'globby';
+
+// TODO duplicate temporary script: factorize!
+
+const imgDir = 'website/blog/2022-08-01-announcing-docusaurus-2.0/img';
+
+const imgWidth = 1200;
+
+const allImages = (await globby(`${imgDir}/**`)).filter((file) =>
+  ['.png', 'jpg', '.jpeg'].includes(path.extname(file)),
+);
+
+const [, , ...selectedImages] = process.argv;
+const images = selectedImages.length > 0 ? selectedImages : allImages;
+
+const stats = {
+  skipped: 0,
+  resized: 0,
+};
+
+await Promise.all(
+  images.map(async (imgPath) => {
+    const {width, height} = imageSize(imgPath);
+    if (width === imgWidth && imgPath.endsWith('.png')) {
+      // Do not emit if not resized. Important because we can't guarantee
+      // idempotency during resize -> optimization
+      stats.skipped += 1;
+      return;
+    }
+    logger.info`Resized path=${imgPath}: Before number=${width}×number=${height}`;
+    const data = await sharp(imgPath)
+      .resize(imgWidth)
+      .png({quality: 100})
+      .toBuffer();
+    await fs.writeFile(imgPath.replace(/jpe?g/, 'png'), data);
+    stats.resized += 1;
+  }),
+);
+
+console.log(`Blog images resizing complete.
+${JSON.stringify(stats, null, 2)}`);

project-words.txt

@@ -195,6 +195,7 @@ npmrc
 nprogress
 ntfs
 nuxt
+O’Shannessy
 onboarded
 openapi
 opensearch
@@ -250,6 +251,7 @@ quasis
 quddus
 quddús
 quotify
+rachelnabors
 ramón
 reactjs
 rearchitecture
@@ -364,3 +366,28 @@ yangshun
 yangshunz
 zhou
 zoomable
+zpao
+paularmstrong
+devs
+Viet
+dabit
+Dabit
+alexbdebrie
+Investec
+Quickwit
+Hamel
+Husain
+Outerbounds
+jodyheavener
+Heavener
+maxlynch
+gabrielcsapo
+Csapo
+Hasura
+Solana
+solana
+shiki
+twoslash
+Shiki
+Therox
+plushies

website/blog/2022-08-01-announcing-docusaurus-2.0/ShowcaseCarousel.module.css

@@ -0,0 +1,85 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+.carousel {
+  position: relative;
+}
+
+.navButton {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  border: 0;
+  border-radius: 50%;
+  color: #fff;
+  font-size: 20px;
+  height: 40px;
+  width: 40px;
+
+  background-color: rgb(0 0 0 / 30%);
+  transition: all var(--ifm-transition-fast)
+    var(--ifm-transition-timing-default);
+}
+
+.navButton:hover {
+  background-color: rgb(0 0 0 / 45%);
+}
+
+.dotGroup {
+  position: absolute;
+  bottom: 5px;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  pointer-events: none;
+}
+
+.dotGroup > :global(.carousel__dot) {
+  pointer-events: auto;
+  display: inline-block;
+  border: none;
+  height: 1rem;
+  width: 1rem;
+  border-radius: 50%;
+  margin: 2px;
+  background: rgb(0 0 0 / 20%);
+}
+
+.dotGroup > :global(.carousel__dot--selected) {
+  background: rgb(0 0 0 / 45%);
+}
+
+.siteSlide {
+  position: relative;
+}
+
+.siteLink {
+  position: absolute;
+  bottom: 2px;
+  right: 2px;
+  padding: 0 12px;
+  background-color: rgb(0 0 0 / 30%);
+  border-radius: 6px;
+  font-size: 16px;
+  --ifm-link-color: var(--ifm-color-gray-400);
+  transition: all var(--ifm-transition-fast)
+    var(--ifm-transition-timing-default);
+}
+
+.siteLink:hover {
+  background-color: rgb(0 0 0 / 45%);
+  --ifm-link-color: var(--ifm-color-gray-200);
+  --ifm-link-hover-color: var(--ifm-color-gray-200);
+  --ifm-link-hover-decoration: none;
+}
+
+@media only screen and (max-width: 768px) {
+  .siteLink {
+    font-size: 12px;
+    padding: 0 8px;
+  }
+}