chore: add alt tags to images (#1144)

microsoft · Sep 1, 2023 · da5d475 · da5d475
1 parent c03e509
commit da5d475
Show file tree

Hide file tree

Showing 5 changed files with 27 additions and 25 deletions.
diff --git a/package.json b/package.json
@@ -25,7 +25,7 @@
     "build-python": "npm run cleanup && cp -r python/* . && node --max-old-space-size=4096 node_modules/.bin/docusaurus build --out-dir=build/python",
     "build-java": "npm run cleanup && cp -r java/* . && node --max-old-space-size=4096 node_modules/.bin/docusaurus build --out-dir=build/java",
     "build-dotnet": "npm run cleanup && cp -r dotnet/* . && node --max-old-space-size=4096 node_modules/.bin/docusaurus build --out-dir=build/dotnet",
-    "build": "rm -rf build && npm run build-nodejs && npm run build-python && npm run build-java && npm run build-dotnet",
+    "build": "tsc && rm -rf build && npm run build-nodejs && npm run build-python && npm run build-java && npm run build-dotnet",
     "version-dotnet": "npm run prepare-dotnet && docusaurus docs:version stable && cp -r docs/* dotnet/docs/ && cp -r versioned_docs/* dotnet/versioned_docs/ && cp -r versioned_sidebars/* dotnet/versioned_sidebars/ && cp versions.json dotnet/",
     "version-java": "npm run prepare-java && docusaurus docs:version stable && cp -r docs/* java/docs/ && cp -r versioned_docs/* java/versioned_docs/ && cp -r versioned_sidebars/* java/versioned_sidebars/ && cp versions.json java/",
     "version-node": "npm run prepare-nodejs && docusaurus docs:version stable && cp -r docs/* nodejs/docs/ && cp -r versioned_docs/* nodejs/versioned_docs/ && cp -r versioned_sidebars/* nodejs/versioned_sidebars/ && cp versions.json nodejs/",

diff --git a/src/components/GitHubStarButton/index.tsx b/src/components/GitHubStarButton/index.tsx
@@ -9,6 +9,8 @@ type StarButtonProps = {
 const STARS = '54k+'; // NOTE: this line is generated by src/generate.js. Do not change!
 
 const StarButton: React.FC<StarButtonProps> = ({owner, repo}) => {
+    if (!repo)
+        throw new Error('repo is required');
     return (
         <span className="github-btn github-stargazers github-btn-large">
             <a className="gh-btn" href={`https://github.com/${owner}/${repo}`} rel="noopener noreferrer" target="_blank"

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -119,12 +119,11 @@ const features = [
 
 type FeatureProps = {
   imageUrl?: string
-  title: string
-  description: React.ReactElement
-  link: string
+  title?: string
+  description?: React.ReactElement
 }
 
-const Feature: React.FC<FeatureProps> = ({ imageUrl, title, description, link }) => {
+const Feature: React.FC<FeatureProps> = ({ imageUrl, title, description }) => {
   const imgUrl = useBaseUrl(imageUrl);
   return (
     <div className={clsx("col col--6", styles.feature)} style={{ marginTop: 40 }}>
@@ -182,32 +181,36 @@ const FeatureRow: React.FC<FeatureRowProps> = ({ title, description, videoUrl, i
 }
 
 const logos = [
-  { imageUrl: "img/logos/VSCode.png", href: "https://code.visualstudio.com" },
-  { imageUrl: "img/logos/Bing.png", href: "https://bing.com" },
-  { imageUrl: "img/logos/Outlook.png", href: "https://outlook.com" },
-  { imageUrl: "img/logos/DHotstar.jpg", href: "https://www.hotstar.com/" },
+  { imageUrl: "img/logos/VSCode.png", href: "https://code.visualstudio.com", alt: "VS Code" },
+  { imageUrl: "img/logos/Bing.png", href: "https://bing.com", alt: "Bing" },
+  { imageUrl: "img/logos/Outlook.png", href: "https://outlook.com", alt: "Outlook" },
+  { imageUrl: "img/logos/DHotstar.jpg", href: "https://www.hotstar.com/", alt: "Disney+ Hotstar" },
   {
     imageUrl: "img/logos/MUI.png",
     href: "https://github.com/mui-org/material-ui",
+    alt: "Material UI",
   },
-  { imageUrl: "img/logos/ING.png", href: "https://github.com/ing-bank/lion" },
+  { imageUrl: "img/logos/ING.png", href: "https://github.com/ing-bank/lion", alt: "ING" },
   {
     imageUrl: "img/logos/Adobe2.png",
     href: "https://github.com/adobe/spectrum-web-components",
+    alt: "Adobe",
   },
   {
     imageUrl: "img/logos/ReactNavigation.png",
     href: "https://github.com/react-navigation/react-navigation",
+    alt: "React Navigation",
   },
   {
     imageUrl: "img/logos/accessibilityinsights.png",
     href: "https://accessibilityinsights.io/",
+    alt: "Accessibility Insights",
   },
 ];
 
 const Home: React.FC = () => {
   const context = useDocusaurusContext();
-  const { siteConfig = {} } = context;
+  const { siteConfig } = context;
   return (
     <Layout
       title={siteConfig.tagline}
@@ -226,17 +229,17 @@ const Home: React.FC = () => {
             >
               Get started
             </Link>
-            <GitHubStarButton owner="microsoft" repo={siteConfig.customFields.repositoryName}/>
+            <GitHubStarButton owner="microsoft" repo={siteConfig.customFields.repositoryName as string}/>
           </div>
         </div>
       </header>
       <br></br>
       <main>
         <br></br>
         <br></br>
-        <center>
-          <img src="img/logos/Browsers.png" width="40%"></img>
-        </center>
+        <div style={{textAlign: 'center'}}>
+          <img src="img/logos/Browsers.png" width="40%" alt="Browsers (Chromium, Firefox, WebKit)" />
+        </div>
         <section className={styles.features}>
           <div className="container">
             <div className="row">
@@ -253,10 +256,10 @@ const Home: React.FC = () => {
               <div className={clsx("col col--12", styles.logosColumn)}>
                 <h2>Chosen by companies and open source projects</h2>
                 <ul className={styles.logosList}>
-                  {logos.map(({ imageUrl, href }, idx) => (
+                  {logos.map(({ imageUrl, href, alt }, idx) => (
                     <li key={idx}>
-                      <a href={href} target="_blank">
-                        <img src={imageUrl} />
+                      <a href={href} target="_blank" rel="noreferrer noopener">
+                        <img src={imageUrl} alt={alt} />
                       </a>
                     </li>
                   ))}

diff --git a/src/pages/versions.tsx b/src/pages/versions.tsx
@@ -8,8 +8,8 @@ import {
 } from '@docusaurus/plugin-content-docs/client';
 
 const Version: React.FC = () => {
-  const versions = useVersions();
-  const latestVersion = useLatestVersion();
+  const versions = useVersions(undefined);
+  const latestVersion = useLatestVersion(undefined);
   const currentVersion = versions.find((version) => version.name === 'current');
   const pastVersions = versions.filter(
     (version) => version !== latestVersion && version.name !== 'current',
@@ -20,7 +20,6 @@ const Version: React.FC = () => {
   return (
     <Layout
       title="Versions"
-      permalink="/versions"
       description="Docusaurus 2 Versions page listing all documented site versions">
       <main className="container margin-vert--lg">
         <h1>Versions</h1>

diff --git a/tsconfig.json b/tsconfig.json
@@ -1,9 +1,7 @@
 {
     "extends": "@tsconfig/docusaurus/tsconfig.json",
-    "include": [
-        "src/"
-    ],
     "compilerOptions": {
-        "downlevelIteration": true
+      "baseUrl": ".",
+      "downlevelIteration": true
     },
 }