add some rounded corners and theme transition fading

2025-11-04 13:50:12 -05:00 · 2022-01-21 12:05:01 -05:00
parent 7e37adabc1
commit 224358fd68
26 changed files with 127 additions and 207 deletions
--- a/components/CodeBlock/CodeBlock.module.css
+++ b/components/CodeBlock/CodeBlock.module.css
@@ -1,14 +1,19 @@
 /* all code */
 .code {
  font-size: 0.925em;
+  color: var(--code-text);
  tab-size: 2;
  page-break-inside: avoid;
+  background-color: var(--code-background);
  border: 1px solid var(--kinda-light);
+  border-radius: var(--rounded-edge-radius);
+  /* light-dark theme switch fading */
+  transition: background 0.25s ease, border 0.25s ease;
 }

 /* inline code in paragraphs/elsewhere (single backticks) */
 .inline {
-  padding: 0.1em 0.25em;
+  padding: 0.2em 0.3em;
 }

 .block {
@@ -25,6 +30,10 @@
  color: var(--medium-dark);
  background-color: var(--background-inner);
  border: 1px solid var(--kinda-light);
+  border-top-right-radius: var(--rounded-edge-radius);
+  border-end-start-radius: var(--rounded-edge-radius);
+  /* light-dark theme switch fading */
+  transition: background 0.25s ease, border 0.25s ease;
 }

 .block .copy_btn:hover {
@@ -37,8 +46,6 @@
  display: block;
  overflow-x: auto;
  padding: 1em;
-  color: var(--code-text);
-  background-color: var(--code-background);
 }

 /* leave room for clipboard button to the right of the first line */
--- a/components/ContactForm/ContactForm.module.css
+++ b/components/ContactForm/ContactForm.module.css
@@ -3,7 +3,7 @@
  padding: 0.8em;
  margin: 0.6em 0;
  border: 2px solid;
-  border-radius: 0.3em;
+  border-radius: var(--rounded-edge-radius);
  color: var(--text);
  background-color: var(--super-duper-light);
  border-color: var(--light);
@@ -18,6 +18,12 @@
  border-color: var(--error);
 }

+.input,
+.btn_submit {
+  /* light-dark theme switch fading */
+  transition: background 0.25s ease;
+}
+
 .textarea {
  height: 12em;
  min-height: 6em;
@@ -51,7 +57,7 @@
  padding: 1em 1.25em;
  margin-right: 1.5em;
  border: 0;
-  border-radius: 0.3em;
+  border-radius: var(--rounded-edge-radius);
  cursor: pointer;
  user-select: none;
  font-weight: 500;
@@ -65,7 +71,7 @@
 }

 .btn_submit .send_icon {
-  margin-right: 0.4em;
+  margin-right: var(--rounded-edge-radius);
 }

 .result_success,
--- a/components/ContactForm/ContactForm.tsx
+++ b/components/ContactForm/ContactForm.tsx
@@ -113,7 +113,7 @@ const ContactForm = ({ className }: Props) => {
            className={cx({ input: true, missing: errors.email && touched.email })}
            name="email"
            type="email"
-            inputmode="email"
+            inputMode="email"
            placeholder="Email"
            disabled={success}
          />
--- a/components/Figure/Figure.module.css
+++ b/components/Figure/Figure.module.css
@@ -7,6 +7,7 @@
  font-size: 0.9em;
  line-height: 1.5;
  color: var(--medium);
+  margin-top: -0.4em;
 }

 /* some figcaptions contain paragraphs, some don't, so reset all of them */
--- a/components/Footer/Footer.module.css
+++ b/components/Footer/Footer.module.css
@@ -3,6 +3,8 @@
  padding: 1.25em 1.5em;
  border-top: 1px solid var(--kinda-light);
  color: var(--medium-dark);
+  /* light-dark theme switch fading */
+  transition: color 0.25s ease, background 0.25s ease, border 0.25s ease;
 }

 .footer a {
--- a/components/Header/Header.module.css
+++ b/components/Header/Header.module.css
@@ -8,6 +8,8 @@
  background-color: var(--background-header);
  backdrop-filter: saturate(180%) blur(5px);
  z-index: 1000;
+  /* light-dark theme switch fading */
+  transition: color 0.25s ease, background 0.25s ease, border 0.25s ease;
 }

 .nav {
--- a/components/IFrame/IFrame.module.css
+++ b/components/IFrame/IFrame.module.css
@@ -3,4 +3,5 @@
  display: block;
  margin: 1em auto;
  border: 2px solid var(--kinda-light);
+  border-radius: var(--rounded-edge-radius);
 }
--- a/components/Image/Image.module.css
+++ b/components/Image/Image.module.css
@@ -5,3 +5,7 @@
  margin: 1em auto;
  text-align: center;
 }
+
+.wrapper img {
+  border-radius: var(--rounded-edge-radius);
+}
--- a/components/Layout/Layout.module.css
+++ b/components/Layout/Layout.module.css
@@ -3,6 +3,8 @@
  padding: 1.5em;
  color: var(--text);
  background-color: var(--background-inner);
+  /* light-dark theme switch fading */
+  transition: color 0.25s ease, background 0.25s ease, border 0.25s ease;
 }

 .container {
--- a/components/Menu/Menu.module.css
+++ b/components/Menu/Menu.module.css
@@ -20,6 +20,7 @@

 .menu li .link:hover {
  color: var(--link);
+  transition: none;
 }

 .menu li .icon {
--- a/components/Name/Name.module.css
+++ b/components/Name/Name.module.css
@@ -8,6 +8,7 @@

 .link:hover {
  color: var(--link);
+  transition: none;
 }

 .selfie {
@@ -22,10 +23,6 @@
  border-radius: 50%;
 }

-.link:hover .selfie {
-  opacity: 0.9;
-}
-
 .name {
  margin: 0 0.6em;
  font-size: 1.2em;
--- a/components/NoteMeta/NoteMeta.module.css
+++ b/components/NoteMeta/NoteMeta.module.css
@@ -8,7 +8,7 @@
 }

 .meta a {
-  color: inherit;
+  color: var(--medium);
  background: none;
  padding-bottom: 0;
 }
--- a/components/NoteTitle/NoteTitle.module.css
+++ b/components/NoteTitle/NoteTitle.module.css
@@ -8,7 +8,7 @@
 .title a {
  background: none;
  padding-bottom: 0;
-  color: inherit;
+  color: var(--text);
 }

 .title code {
--- a/components/OctocatLink/OctocatLink.module.css
+++ b/components/OctocatLink/OctocatLink.module.css
@@ -3,7 +3,6 @@
  color: var(--text);
  background: none !important;
  padding-bottom: 0;
-  transition: none;
 }

 .link:hover {
--- a/components/RepositoryCard/RepositoryCard.module.css
+++ b/components/RepositoryCard/RepositoryCard.module.css
@@ -2,10 +2,12 @@
  width: 100%;
  padding: 1.2em 1.2em 0.8em;
  border: 1px solid;
-  border-radius: 0.5em;
+  border-radius: var(--rounded-edge-radius);
  font-size: 0.85em;
  color: var(--medium-dark);
  border-color: var(--kinda-light);
+  /* light-dark theme switch fading */
+  transition: border 0.25s ease;
 }

 .name {
@@ -34,7 +36,7 @@
 .meta_item a {
  background: none;
  padding-bottom: 0;
-  color: inherit;
+  color: var(--medium);
 }

 .meta_item a:hover {
--- a/components/Video/Video.module.css
+++ b/components/Video/Video.module.css
@@ -8,3 +8,7 @@
  top: 0;
  left: 0;
 }
+
+.wrapper video {
+  border-radius: var(--rounded-edge-radius);
+}
--- a/components/YouTubeEmbed/YouTubeEmbed.module.css
+++ b/components/YouTubeEmbed/YouTubeEmbed.module.css
@@ -8,3 +8,8 @@
  top: 0;
  left: 0;
 }
+
+.wrapper :global(.react-player__preview),
+.wrapper iframe {
+  border-radius: var(--rounded-edge-radius);
+}
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
    "next-mdx-remote": "4.0.0-rc.1",
    "next-seo": "^4.29.0",
    "next-themes": "^0.0.15",
-    "node-fetch": "^3.1.1",
+    "node-fetch": "^3.2.0",
    "p-retry": "^5.0.0",
    "prop-types": "^15.8.1",
    "query-string": "^7.1.0",
@@ -95,7 +95,7 @@
    "eslint-plugin-import": "~2.25.4",
    "eslint-plugin-mdx": "~1.16.0",
    "eslint-plugin-prettier": "~4.0.0",
-    "lint-staged": "^12.2.1",
+    "lint-staged": "^12.2.2",
    "npm-run-all": "^4.1.5",
    "postcss": "^8.4.5",
    "postcss-flexbugs-fixes": "^5.0.2",
@@ -106,7 +106,7 @@
    "stylelint": "~14.2.0",
    "stylelint-config-prettier": "~9.0.3",
    "stylelint-prettier": "~2.0.0",
-    "typescript": "^4.5.4"
+    "typescript": "^4.5.5"
  },
  "simple-git-hooks": {
    "pre-commit": "npx lint-staged"
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -25,6 +25,7 @@ import "@fontsource/roboto-mono/variable-italic.css";

 // global styles
 import "modern-normalize/modern-normalize.css";
+import "../styles/settings.css";
 import "../styles/colors.css";
 import "../styles/typography.css";
 import "../styles/index.css";
--- a/pages/api/tracks.ts
+++ b/pages/api/tracks.ts
@@ -1,135 +0,0 @@
-// @ts-nocheck
-
-// Fetches my Spotify most-played tracks or currently playing track.
-// Heavily inspired by @leerob: https://leerob.io/snippets/spotify
-
-import * as Sentry from "@sentry/node";
-import fetch from "node-fetch";
-import queryString from "query-string";
-import type { NextApiRequest, NextApiResponse } from "next";
-
-Sentry.init({
-  dsn: process.env.SENTRY_DSN || process.env.NEXT_PUBLIC_SENTRY_DSN || "",
-  environment: process.env.NODE_ENV || process.env.VERCEL_ENV || process.env.NEXT_PUBLIC_VERCEL_ENV || "",
-});
-
-const { SPOTIFY_CLIENT_ID, SPOTIFY_CLIENT_SECRET, SPOTIFY_REFRESH_TOKEN } = process.env;
-
-const basic = Buffer.from(`${SPOTIFY_CLIENT_ID}:${SPOTIFY_CLIENT_SECRET}`).toString("base64");
-
-// https://developer.spotify.com/documentation/general/guides/authorization-guide/#authorization-code-flow
-const TOKEN_ENDPOINT = "https://accounts.spotify.com/api/token";
-// https://developer.spotify.com/documentation/web-api/reference/#endpoint-get-the-users-currently-playing-track
-const NOW_PLAYING_ENDPOINT = "https://api.spotify.com/v1/me/player/currently-playing";
-// https://developer.spotify.com/documentation/web-api/reference/#endpoint-get-users-top-artists-and-tracks
-const TOP_TRACKS_ENDPOINT = "https://api.spotify.com/v1/me/top/tracks?time_range=long_term&limit=10";
-
-const handler = async (req: NextApiRequest, res: NextApiResponse) => {
-  try {
-    if (req.method !== "GET") {
-      return res.status(405).send(""); // 405 Method Not Allowed
-    }
-
-    // default to top tracks
-    let response;
-
-    // get currently playing track (/api/tracks/?now), otherwise top 10 tracks
-    if (typeof req.query.now !== "undefined") {
-      response = await getNowPlaying();
-
-      // let Vercel edge cache results for 5 mins
-      res.setHeader("Cache-Control", "s-maxage=300, stale-while-revalidate");
-    } else {
-      response = await getTopTracks();
-
-      // let Vercel edge cache results for 3 hours
-      res.setHeader("Cache-Control", "s-maxage=10800, stale-while-revalidate");
-    }
-
-    return res.status(200).json(response);
-  } catch (error) {
-    console.error(error);
-
-    // log error to sentry, give it 2 seconds to finish sending
-    Sentry.captureException(error);
-    await Sentry.flush(2000);
-
-    const message = error instanceof Error ? error.message : "Unknown error.";
-
-    // 500 Internal Server Error
-    return res.status(500).json({ success: false, message });
-  }
-};
-
-const getAccessToken = async () => {
-  const response = await fetch(TOKEN_ENDPOINT, {
-    method: "POST",
-    headers: {
-      Authorization: `Basic ${basic}`,
-      "Content-Type": "application/x-www-form-urlencoded",
-    },
-    body: queryString.stringify({
-      grant_type: "refresh_token",
-      refresh_token: SPOTIFY_REFRESH_TOKEN,
-    }),
-  });
-
-  return response.json();
-};
-
-const getNowPlaying = async () => {
-  const { access_token } = await getAccessToken();
-
-  const response = await fetch(NOW_PLAYING_ENDPOINT, {
-    headers: {
-      // eslint-disable-next-line camelcase
-      Authorization: `Bearer ${access_token}`,
-      Accept: "application/json",
-      "Content-Type": "application/json",
-    },
-  });
-
-  if (response.status === 204 || response.status > 400) {
-    return { isPlaying: false };
-  }
-
-  const active = await response.json();
-
-  if (active.is_playing === true && active.item) {
-    return {
-      isPlaying: active.is_playing,
-      artist: active.item.artists.map((artist) => artist.name).join(", "),
-      title: active.item.name,
-      album: active.item.album.name,
-      imageUrl: active.item.album.images ? active.item.album.images[0].url : undefined,
-      songUrl: active.item.external_urls.spotify,
-    };
-  }
-
-  return { isPlaying: false };
-};
-
-const getTopTracks = async () => {
-  const { access_token } = await getAccessToken();
-
-  const response = await fetch(TOP_TRACKS_ENDPOINT, {
-    headers: {
-      // eslint-disable-next-line camelcase
-      Authorization: `Bearer ${access_token}`,
-      Accept: "application/json",
-      "Content-Type": "application/json",
-    },
-  });
-
-  const { items } = await response.json();
-
-  return items.map((track) => ({
-    artist: track.artists.map((artist) => artist.name).join(", "),
-    title: track.name,
-    album: track.album.name,
-    imageUrl: track.album.images ? track.album.images[0].url : undefined,
-    songUrl: track.external_urls.spotify,
-  }));
-};
-
-export default handler;
--- a/pages/previously.tsx
+++ b/pages/previously.tsx
@@ -246,6 +246,7 @@ const Previously = () => (
      }
      figure img {
        margin-bottom: 0;
+        border-radius: var(--rounded-edge-radius);
      }
      figcaption {
        margin-top: 0.2em;
--- a/pages/uses.tsx
+++ b/pages/uses.tsx
@@ -1079,11 +1079,13 @@ const Uses = () => (

    {/* TODO: use OrderedList component */}
    <style jsx global>{`
+      img {
+        border-radius: var(--rounded-edge-radius);
+      }
      ul {
        margin-left: 1.5em;
        padding-left: 0;
      }
-
      li {
        padding-left: 0.25em;
      }
--- a/styles/index.css
+++ b/styles/index.css
@@ -2,7 +2,10 @@ body {
  width: 100%;
  height: 100%;
  margin: 0 auto;
+  color: var(--text);
  background-color: var(--background-outer);
+  /* light-dark theme switch fading */
+  transition: background 0.25s ease;
 }

 a {
@@ -10,21 +13,20 @@ a {
  text-decoration: none;
  background-position: 0% 100%;
  background-repeat: no-repeat;
-  background-size: 0% 2px;
-  padding-bottom: 2px;
-  transition: background-size 0.25s ease-in-out;
+  background-size: 0% var(--link-underline-size);
+  padding-bottom: var(--link-underline-size);
+  transition: background-size 0.25s ease-in-out, color 0.25s ease, border 0.25s ease;
  background-image: linear-gradient(var(--link-underline), var(--link-underline));
 }

 a:hover {
-  background-size: 100% 2px;
+  background-size: 100% var(--link-underline-size);
 }

 /* set an anchor's class to `no-underline` to disable all of the above */
 a.no-underline {
  background: none !important;
  padding-bottom: 0;
-  transition: none;
 }

 /* make SVG icons relative in size/position to surrounding text */
--- a/styles/settings.css
+++ b/styles/settings.css
@@ -0,0 +1,12 @@
+:root {
+  --rounded-edge-radius: 8px;
+  --link-underline-size: 2px;
+
+  --font-family-sans: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
+    sans-serif;
+  --font-family-sans-variable: InterVariable, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+    Helvetica, Arial, sans-serif;
+  --font-family-mono: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier;
+  --font-family-mono-variable: "Roboto MonoVariable", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo,
+    Courier;
+}
--- a/styles/typography.css
+++ b/styles/typography.css
@@ -1,5 +1,5 @@
 body {
-  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  font-family: var(--font-family-sans);
  font-kerning: normal;
  font-variant-ligatures: normal;
  font-feature-settings: "kern", "liga", "calt", "clig", "ss01";
@@ -10,7 +10,7 @@ kbd,
 samp,
 pre,
 .monospace {
-  font-family: "Roboto Mono", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  font-family: var(--font-family-mono);
 }

 /*
@@ -19,8 +19,7 @@ pre,
 */
@supports (font-variation-settings: normal) {
  body {
-    font-family: InterVariable, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
-      sans-serif;
+    font-family: var(--font-family-sans-variable);
    font-optical-sizing: auto;
  }

@@ -29,8 +28,7 @@ pre,
  samp,
  pre,
  .monospace {
-    font-family: "Roboto MonoVariable", ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, Courier,
-      monospace;
+    font-family: var(--font-family-mono-variable);
  }

  /*
--- a/yarn.lock
+++ b/yarn.lock
@@ -91,7 +91,7 @@
    browserslist "^4.17.5"
    semver "^6.3.0"

-"@babel/helper-create-class-features-plugin@^7.16.7":
+"@babel/helper-create-class-features-plugin@^7.16.10", "@babel/helper-create-class-features-plugin@^7.16.7":
  version "7.16.10"
  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.16.10.tgz#8a6959b9cc818a88815ba3c5474619e9c0f2c21c"
  integrity sha512-wDeej0pu3WN/ffTxMNCPW5UCiOav8IcLRxSIyp/9+IF2xJUM9h/OYjg0IJLHaL6F8oU8kqMz9nc1vryXhMsgXg==
@@ -419,12 +419,12 @@
    "@babel/helper-skip-transparent-expression-wrappers" "^7.16.0"
    "@babel/plugin-syntax-optional-chaining" "^7.8.3"

-"@babel/plugin-proposal-private-methods@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.16.7.tgz#e418e3aa6f86edd6d327ce84eff188e479f571e0"
-  integrity sha512-7twV3pzhrRxSwHeIvFE6coPgvo+exNDOiGUMg39o2LiLo1Y+4aKpfkcLGcg1UHonzorCt7SNXnoMyCnnIOA8Sw==
+"@babel/plugin-proposal-private-methods@^7.16.11":
+  version "7.16.11"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-private-methods/-/plugin-proposal-private-methods-7.16.11.tgz#e8df108288555ff259f4527dbe84813aac3a1c50"
+  integrity sha512-F/2uAkPlXDr8+BHpZvo19w3hLFKge+k75XUprE6jaqKxjGkSYcK+4c+bup5PdW/7W/Rpjwql7FTVEDW+fRAQsw==
  dependencies:
-    "@babel/helper-create-class-features-plugin" "^7.16.7"
+    "@babel/helper-create-class-features-plugin" "^7.16.10"
    "@babel/helper-plugin-utils" "^7.16.7"

 "@babel/plugin-proposal-private-property-in-object@^7.16.7":
@@ -871,9 +871,9 @@
    "@babel/helper-plugin-utils" "^7.16.7"

 "@babel/preset-env@^7.15.6":
-  version "7.16.10"
-  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.16.10.tgz#84400e6b5ee1efd982f55c61f3b6ac3fb5c8ab57"
-  integrity sha512-iCac3fZn9oOcLqc1N2/copPiX7aoxzsvjeDdXoZobrlbQ6YGgS3bL9HyldOJ8V8AY5P7pFynCATrn7M4dMw0Yg==
+  version "7.16.11"
+  resolved "https://registry.yarnpkg.com/@babel/preset-env/-/preset-env-7.16.11.tgz#5dd88fd885fae36f88fd7c8342475c9f0abe2982"
+  integrity sha512-qcmWG8R7ZW6WBRPZK//y+E3Cli151B20W1Rv7ln27vuPaXU/8TKms6jFdiJtF7UDTxcrb7mZd88tAeK9LjdT8g==
  dependencies:
    "@babel/compat-data" "^7.16.8"
    "@babel/helper-compilation-targets" "^7.16.7"
@@ -893,7 +893,7 @@
    "@babel/plugin-proposal-object-rest-spread" "^7.16.7"
    "@babel/plugin-proposal-optional-catch-binding" "^7.16.7"
    "@babel/plugin-proposal-optional-chaining" "^7.16.7"
-    "@babel/plugin-proposal-private-methods" "^7.16.7"
+    "@babel/plugin-proposal-private-methods" "^7.16.11"
    "@babel/plugin-proposal-private-property-in-object" "^7.16.7"
    "@babel/plugin-proposal-unicode-property-regex" "^7.16.7"
    "@babel/plugin-syntax-async-generators" "^7.8.4"
@@ -2064,9 +2064,9 @@ camelcase@^6.2.0:
  integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==

 caniuse-lite@^1.0.30001283, caniuse-lite@^1.0.30001286, caniuse-lite@^1.0.30001297, caniuse-lite@^1.0.30001299:
-  version "1.0.30001300"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001300.tgz#11ab6c57d3eb6f964cba950401fd00a146786468"
-  integrity sha512-cVjiJHWGcNlJi8TZVKNMnvMid3Z3TTdDHmLDzlOdIiZq138Exvo0G+G0wTdVYolxKb4AYwC+38pxodiInVtJSA==
+  version "1.0.30001301"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001301.tgz#ebc9086026534cab0dab99425d9c3b4425e5f450"
+  integrity sha512-csfD/GpHMqgEL3V3uIgosvh+SVIQvCh43SNu9HRbP1lnxkKm1kjDG4f32PP571JplkLjfS+mg2p1gxR7MYrrIA==

 ccount@^1.0.0:
  version "1.1.0"
@@ -2307,11 +2307,11 @@ cross-env@^7.0.3:
    cross-spawn "^7.0.1"

 cross-fetch@^3.0.6:
-  version "3.1.4"
-  resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.1.4.tgz#9723f3a3a247bf8b89039f3a380a9244e8fa2f39"
-  integrity sha512-1eAtFWdIubi6T4XPy6ei9iUFoKpUkIF971QLN8lIvvvwueI65+Nw5haMNKUwfJxabqlIIDODJKGrQ66gxC0PbQ==
+  version "3.1.5"
+  resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.1.5.tgz#e1389f44d9e7ba767907f7af8454787952ab534f"
+  integrity sha512-lvb1SBsI0Z7GDwmuid+mU3kWVBwTVUbe7S0H52yaaAdQOXq2YktTCZdlAcNKFzE6QtRz0snpw9bNiPeOIkkQvw==
  dependencies:
-    node-fetch "2.6.1"
+    node-fetch "2.6.7"

 cross-spawn@^6.0.5:
  version "6.0.5"
@@ -3066,11 +3066,12 @@ feed@^4.2.2:
  dependencies:
    xml-js "^1.6.11"

-fetch-blob@^3.1.2, fetch-blob@^3.1.3:
-  version "3.1.3"
-  resolved "https://registry.yarnpkg.com/fetch-blob/-/fetch-blob-3.1.3.tgz#a7dca4855e39d3e3c5a1da62d4ee335c37d26012"
-  integrity sha512-ax1Y5I9w+9+JiM+wdHkhBoxew+zG4AJ2SvAD1v1szpddUIiPERVGBxrMcB2ZqW0Y3PP8bOWYv2zqQq1Jp2kqUQ==
+fetch-blob@^3.1.2, fetch-blob@^3.1.4:
+  version "3.1.4"
+  resolved "https://registry.yarnpkg.com/fetch-blob/-/fetch-blob-3.1.4.tgz#e8c6567f80ad7fc22fd302e7dcb72bafde9c1717"
+  integrity sha512-Eq5Xv5+VlSrYWEqKrusxY1C3Hm/hjeAsCGVG3ft7pZahlUAChpGZT/Ms1WmSLnEAisEXszjzu/s+ce6HZB2VHA==
  dependencies:
+    node-domexception "^1.0.0"
    web-streams-polyfill "^3.0.3"

 file-entry-cache@^6.0.1:
@@ -3958,10 +3959,10 @@ lines-and-columns@^1.1.6:
  resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
  integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==

-lint-staged@^12.2.1:
-  version "12.2.1"
-  resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-12.2.1.tgz#e37b5a81deaabf5823f43b3aa903a70c15c9d0b3"
-  integrity sha512-VCVcA9C2Vt5HHxSR4EZVZFJcQRJH984CGBeY+cJ/xed4mBd+JidbM/xbKcCq5ASaygAV0iITtdsCTnID7h/1OQ==
+lint-staged@^12.2.2:
+  version "12.2.2"
+  resolved "https://registry.yarnpkg.com/lint-staged/-/lint-staged-12.2.2.tgz#e03d93b41092316e0f38b37c9630da807aae3cca"
+  integrity sha512-bcHEoM1M/f+K1BYdHcEuIn8K+zMOSJR3mkny6PAuQiTgcSUcRbUWaUD6porAYypxF4k1vYZZ2HutZt1p94Z1jQ==
  dependencies:
    cli-truncate "^3.1.0"
    colorette "^2.0.16"
@@ -4880,25 +4881,30 @@ nice-try@^1.0.4:
  resolved "https://registry.yarnpkg.com/nice-try/-/nice-try-1.0.5.tgz#a3378a7696ce7d223e88fc9b764bd7ef1089e366"
  integrity sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ==

+node-domexception@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/node-domexception/-/node-domexception-1.0.0.tgz#6888db46a1f71c0b76b3f7555016b63fe64766e5"
+  integrity sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==
+
 node-fetch@2.6.1:
  version "2.6.1"
  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052"
  integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw==

-node-fetch@^2.6.1:
+node-fetch@2.6.7, node-fetch@^2.6.1:
  version "2.6.7"
  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.7.tgz#24de9fba827e3b4ae44dc8b20256a379160052ad"
  integrity sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==
  dependencies:
    whatwg-url "^5.0.0"

-node-fetch@^3.1.1:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-3.1.1.tgz#d0d9607e455b3087e3092b821b5b1f1ebf4c2147"
-  integrity sha512-SMk+vKgU77PYotRdWzqZGTZeuFKlsJ0hu4KPviQKkfY+N3vn2MIzr0rvpnYpR8MtB3IEuhlEcuOLbGvLRlA+yg==
+node-fetch@^3.2.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-3.2.0.tgz#59390db4e489184fa35d4b74caf5510e8dfbaf3b"
+  integrity sha512-8xeimMwMItMw8hRrOl3C9/xzU49HV/yE6ORew/l+dxWimO5A4Ra8ld2rerlJvc/O7et5Z1zrWsPX43v1QBjCxw==
  dependencies:
    data-uri-to-buffer "^4.0.0"
-    fetch-blob "^3.1.3"
+    fetch-blob "^3.1.4"
    formdata-polyfill "^4.0.10"

 node-releases@^2.0.1:
@@ -5479,9 +5485,9 @@ postcss-selector-not@^5.0.0:
    balanced-match "^1.0.0"

 postcss-selector-parser@^6.0.2, postcss-selector-parser@^6.0.4, postcss-selector-parser@^6.0.7, postcss-selector-parser@^6.0.8:
-  version "6.0.8"
-  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.8.tgz#f023ed7a9ea736cd7ef70342996e8e78645a7914"
-  integrity sha512-D5PG53d209Z1Uhcc0qAZ5U3t5HagH3cxu+WLZ22jt3gLUpXM4eXXfiO14jiDWST3NNooX/E8wISfOhZ9eIjGTQ==
+  version "6.0.9"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.9.tgz#ee71c3b9ff63d9cd130838876c13a2ec1a992b2f"
+  integrity sha512-UO3SgnZOVTwu4kyLR22UQ1xZh086RyNZppb7lLAKBFK8a32ttG5i87Y/P3+2bRSjZNyJ1B7hfFNo273tKe9YxQ==
  dependencies:
    cssesc "^3.0.0"
    util-deprecate "^1.0.2"
@@ -5944,9 +5950,9 @@ resolve-from@^5.0.0:
  integrity sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==

 resolve@^1.10.0, resolve@^1.14.2, resolve@^1.20.0, resolve@^1.3.2:
-  version "1.21.0"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.21.0.tgz#b51adc97f3472e6a5cf4444d34bc9d6b9037591f"
-  integrity sha512-3wCbTpk5WJlyE4mSOtDLhqQmGFi0/TD9VPwmiolnk8U0wRgMEktqCXd3vy5buTO3tljvalNvKrjHEfrd2WpEKA==
+  version "1.21.1"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.21.1.tgz#1a88c73f5ca8ab0aabc8b888c4170de26c92c4cc"
+  integrity sha512-lfEImVbnolPuaSZuLQ52cAxPBHeI77sPwCOWRdy12UG/CNa8an7oBHH1R+Fp1/mUqSJi4c8TIP6FOIPSZAUrEQ==
  dependencies:
    is-core-module "^2.8.0"
    path-parse "^1.0.7"
@@ -6708,10 +6714,10 @@ typedarray-to-buffer@^3.1.5:
  dependencies:
    is-typedarray "^1.0.0"

-typescript@^4.5.4:
-  version "4.5.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.5.4.tgz#a17d3a0263bf5c8723b9c52f43c5084edf13c2e8"
-  integrity sha512-VgYs2A2QIRuGphtzFV7aQJduJ2gyfTljngLzjpfW9FoYZF6xuw1W0vW9ghCKLfcWrCFxK81CSGRAvS1pn4fIUg==
+typescript@^4.5.5:
+  version "4.5.5"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.5.5.tgz#d8c953832d28924a9e3d37c73d729c846c5896f3"
+  integrity sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==

 unbox-primitive@^1.0.1:
  version "1.0.1"