Revert "Use local fonts"

This reverts commit 2c13a94.

aries-site/src/components/seo/Meta.js

@@ -26,7 +26,7 @@ export const Meta = ({
     // in dev mode, we allow unsafe-eval to work with react hot reloader
     process.env.NODE_ENV !== 'production' ? "'unsafe-eval'" : ''
   };
-  font-src 'self' *.hpe.com hpefonts.s3.amazonaws.com https://d3hq6blov2iije.cloudfront.net/fonts/;
+  font-src *.hpe.com hpefonts.s3.amazonaws.com https://d3hq6blov2iije.cloudfront.net/fonts/;
   object-src 'none';`;
 
   /*

aries-site/src/pages/_app.js

@@ -1,7 +1,6 @@
 import { MDXProvider } from '@mdx-js/react';
 import PropTypes from 'prop-types';
 import React, { useEffect, createContext, useState, useMemo } from 'react';
-import localFont from 'next/font/local';
 import { Layout, ThemeMode } from '../layouts';
 import { components } from '../components';
 import {
@@ -10,28 +9,6 @@ import {
 } from '../utils/pageVisitTracker';
 import { nameToSlug, getPageDetails } from '../utils';
 
-const metric = localFont({
-  src: [
-    {
-      path: '../../public/fonts/MetricHPE-Web-Regular.woff2',
-      weight: '400',
-    },
-    {
-      path: '../../public/fonts/MetricHPE-Web-Medium.woff2',
-      weight: '500',
-    },
-    {
-      path: '../../public/fonts/MetricHPE-Web-Light.woff2',
-      weight: '300',
-    },
-    {
-      path: '../../public/fonts/MetricHPE-Web-Bold.woff2',
-      weight: '700',
-    },
-  ],
-  variable: '--font-metric',
-});
-
 const slugToText = str => str.split('-').join(' ');
 
 const backgroundImages = {
@@ -260,22 +237,20 @@ function App({ Component, pageProps, router }) {
 
   return (
     <ThemeMode>
-      <div className={metric.className}>
-        <ViewContext.Provider value={viewContextValue}>
-          <Layout
-            title={title || ''}
-            topic={topic}
-            // What's new page is MDX
-            isLanding={!topic && title !== 'whats new'}
-            // applies card images to the "hub" pages
-            backgroundImage={backgroundImages[title]}
-          >
-            <MDXProvider components={components}>
-              <Component {...pageProps} />
-            </MDXProvider>
-          </Layout>
-        </ViewContext.Provider>
-      </div>
+      <ViewContext.Provider value={viewContextValue}>
+        <Layout
+          title={title || ''}
+          topic={topic}
+          // What's new page is MDX
+          isLanding={!topic && title !== 'whats new'}
+          // applies card images to the "hub" pages
+          backgroundImage={backgroundImages[title]}
+        >
+          <MDXProvider components={components}>
+            <Component {...pageProps} />
+          </MDXProvider>
+        </Layout>
+      </ViewContext.Provider>
     </ThemeMode>
   );
 }

aries-site/src/themes/aries.js

@@ -2,20 +2,11 @@ import { hpe, hpePop } from 'grommet-theme-hpe';
 import { deepMerge } from 'grommet/utils';
 import { Close, Info } from 'grommet-icons';
 
-const global = {
-  global: {
-    font: {
-      family: "'var(--font-metric)', Arial, sans-serif",
-    },
-  },
-};
-
 export const aries = deepMerge(hpe, {
   defaultMode: 'dark',
   // To be stripped out once theme changes are made in grommet-theme-hpe.
   // keeping file for use as playground for future theme adjusments that need
   // to be quickly tested
-  ...global,
   buttonGroup: {
     // any Box props
     gap: 'small',
@@ -67,7 +58,6 @@ export const aries = deepMerge(hpe, {
 
 export const ariesPop = deepMerge(aries, {
   ...hpePop,
-  ...global,
   anchor: {
     // rely on base anchor styling to meet color contrast on background-back
     size: {