Merge branch 'develop' into 'staging'

content update + new work

See merge request !16

gatsby-config.js

@@ -39,10 +39,10 @@ module.exports = {
         name: `AF Enterprise Digital Transformation Services`,
         short_name: `AFEIT`,
         start_url: `/`,
-        background_color: `#663399`,
-        theme_color: `#663399`,
+        background_color: `#1B337A`,
+        theme_color: `#1B337A`,
         display: `minimal-ui`,
-        icon: `src/images/usaf-logo.png`, // This path is relative to the root of the site.
+        icon: `src/images/favicon@2x.png`, // This path is relative to the root of the site.
       },
     },
     `gatsby-plugin-gatsby-cloud`,

src/components/app/Nav.js

@@ -39,6 +39,7 @@ const Nav = ({ sticky }) => {
             justify="end"
             gap="large"
             margin={{ right: sticky ? 'medium' : '0' }}
+            style={{ zIndex: 10 }}
           >
             <Box justify="center">
               <Link

src/components/app/SEO.js

@@ -39,7 +39,7 @@ function SEO({ description, lang, meta, title, image }) {
       htmlAttributes={{
         lang,
       }}
-      title={title}
+      title={title || defaultTitle}
       titleTemplate={title ? `%s | ${defaultTitle}` : null}
       meta={[
         {

src/components/hero/Hero.js

@@ -36,13 +36,33 @@ const Slide = ({ title, subtitle, core, cta, slug, logo }) => {
 
   return (
     <Box margin={{ top: '280px' }} align="start">
-      <Box width="large" style={{ position: 'relative' }}>
+      <Box width="large" gap="medium" style={{ position: 'relative' }}>
         {core && (
-          <Text size="small" style={{ textTransform: 'uppercase' }}>
-            Core Transformation Service
-          </Text>
+          <ThemeContext.Extend
+            value={{
+              heading: {
+                level: {
+                  5: {
+                    font: {
+                      family:
+                        'korolev, Helvetica Neue, Helvetica, Arial, sans-serif',
+                    },
+                  },
+                },
+              },
+            }}
+          >
+            <Heading
+              level={5}
+              size="small"
+              margin="0"
+              style={{ textTransform: 'uppercase' }}
+            >
+              Core Transformation Service
+            </Heading>
+          </ThemeContext.Extend>
         )}
-        <Box>
+        <Box gap="medium">
           {!logo && (
             <ThemeContext.Extend value={{ heading: headingTheme }}>
               <Heading margin="none">{title}</Heading>
@@ -53,7 +73,11 @@ const Slide = ({ title, subtitle, core, cta, slug, logo }) => {
               <Img fluid={logo.childImageSharp.fluid} />
             </Box>
           )}
-          {subtitle && <Text>{subtitle}</Text>}
+          {subtitle && (
+            <Text size="large" weight={300} style={{ letterSpacing: '0.01em' }}>
+              {subtitle}
+            </Text>
+          )}
         </Box>
         {cta && (
           <Box direction="row" justify="start" pad={{ vertical: 'medium' }}>
@@ -91,8 +115,19 @@ const Hero = () => {
               fluid(maxWidth: 600, quality: 100) {
                 ...GatsbyImageSharpFluid_tracedSVG
               }
-              fixed(height: 30) {
-                ...GatsbyImageSharpFixed_tracedSVG
+            }
+          }
+          thumblogo {
+            childImageSharp {
+              fluid(maxWidth: 100) {
+                ...GatsbyImageSharpFluid_tracedSVG
+              }
+            }
+          }
+          thumb {
+            childImageSharp {
+              fluid(maxWidth: 300, quality: 100) {
+                ...GatsbyImageSharpFluid_tracedSVG
               }
             }
           }
@@ -135,9 +170,10 @@ const Hero = () => {
             onClick={() => handleSetSlide(i)}
             style={{ position: 'relative' }}
           >
-            <Box style={abs}>
-              <Img fluid={node.image.childImageSharp.fluid} />
-            </Box>
+            <Img
+              style={{ ...abs, opacity: index === i ? '100%' : '0' }}
+              fluid={node.thumb.childImageSharp.fluid}
+            />
 
             <Box
               style={abs}
@@ -146,9 +182,23 @@ const Hero = () => {
               pad="small"
               align="center"
             >
-              <FormPrevious color="accent-1" />{' '}
-              {node.logo && <Img fixed={node.logo.childImageSharp.fixed} />}
-              {!node.logo && <Text size="small">{node.name}</Text>}
+              {index !== i && <FormPrevious color="accent-1" />}
+              {node.thumblogo && (
+                <Img
+                  fluid={node.thumblogo.childImageSharp.fluid}
+                  objectFit="contain"
+                  style={{ width: '80px' }}
+                />
+              )}
+              {!node.thumblogo && (
+                <Text
+                  size="small"
+                  weight="bold"
+                  style={{ textTransform: 'uppercase' }}
+                >
+                  {node.name}
+                </Text>
+              )}
             </Box>
           </Box>
         ))}

src/components/mega-menu/MegaMenu.js

@@ -65,7 +65,7 @@ const MegaMenu = ({ sticky }) => {
       <Box
         pad={containerPad[size]}
         background="white"
-        style={{ maxHeight: 'calc(100vh - 120px)' }}
+        style={{ maxHeight: 'calc(100vh - 140px)' }}
       >
         <Heading level={2} margin="none">
           Available Services
@@ -80,7 +80,11 @@ const MegaMenu = ({ sticky }) => {
           pad={{ vertical: 'medium' }}
           style={{ overflowY: 'auto' }}
         >
-          <Box {...{ border: !isVert && { side: 'right' } }} basis="45%">
+          <Box
+            {...{ border: !isVert && { side: 'right' } }}
+            {...(isVert && { flex: { shrink: 0 } })}
+            basis={isVert ? 'auto' : '45%'}
+          >
             <GroupHeader
               label="Networking & Connectivity"
               icon={<DtNetConn />}
@@ -112,7 +116,12 @@ const MegaMenu = ({ sticky }) => {
             </Box>
           </Box>
           {isVert && <Divider flex={{ grow: 0 }} />}
-          <Box direction="row" basis="55%" gap="large">
+          <Box
+            direction="row"
+            basis={isVert ? 'auto' : '55%'}
+            gap="large"
+            {...(isVert && { flex: { shrink: 0 } })}
+          >
             <Box basis="1/2">
               <Box>
                 <GroupHeader

src/components/mega-menu/MegaMobileMenu.js

@@ -14,6 +14,23 @@ const mainLinks = [
   { name: 'Our Other Programs', to: '/other-programs' },
 ];
 
+const serviceLinks = [
+  {
+    name: 'Networking & Connectivity',
+    to: '#categories',
+    overview: '/networking-connectivity',
+  },
+  {
+    name: 'Compute & Store',
+    to: '#categories',
+    overview: '/compute-and-store',
+  },
+  { name: 'Software Development & DevSecOps', to: '#categories' },
+  { name: 'Digital Engineering', to: '#categories' },
+  { name: 'Communications', to: '#categories' },
+  { name: 'Data Analysis', to: '#categories' },
+];
+
 const MenuItem = ({ name, to, onNavigate }) => {
   const isLink = to.indexOf('#') === -1;
 
@@ -75,14 +92,7 @@ const MenuServices = ({ onNavigate }) => (
         The following services are available to your organization through C3I&N
       </Text>
     </Box>
-    {[
-      { name: 'Networking & Connectivity', to: '#categories' },
-      { name: 'Compute & Store', to: '#categories' },
-      { name: 'Software Development & DevSecOps', to: '#categories' },
-      { name: 'Digital Engineering', to: '#categories' },
-      { name: 'Communications', to: '#categories' },
-      { name: 'Data Analysis', to: '#categories' },
-    ].map((item) => (
+    {serviceLinks.map((item) => (
       <MenuItem
         key={item.name}
         name={item.name}
@@ -93,17 +103,30 @@ const MenuServices = ({ onNavigate }) => (
   </Box>
 );
 
-const MenuCategory = ({ category, onNavigate }) => (
+const MenuCategory = ({ category, onNavigate, overview }) => (
   <Box
     gap="1px"
     background="black"
     style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}
     pad="xsmall"
   >
-    <Box background="white" pad="large" flex={{ shrink: 0 }}>
-      <Heading margin="0" level={4}>
+    <Box
+      background="white"
+      pad="medium"
+      basis="70px"
+      justify="center"
+      flex={{ shrink: 0 }}
+    >
+      <Heading margin="0" level={5}>
         {category}
       </Heading>
+      {overview && (
+        <Box direction="row" justify="start">
+          <Link size="xsmall" to={overview}>
+            Overview
+          </Link>
+        </Box>
+      )}
     </Box>
     <Box background="white" pad="large">
       <MenuGroup category={category} />
@@ -129,6 +152,8 @@ const MegaMobileMenu = ({ onClose }) => {
     setCategory(name);
   };
 
+  const currentService = serviceLinks.find((item) => item.name === category);
+
   return (
     <Box background="black" pad="medium" fill>
       <Box
@@ -154,8 +179,12 @@ const MegaMobileMenu = ({ onClose }) => {
       <Box overflow="auto" style={{ position: 'relative' }} fill>
         <MenuHome onNavigate={handleNavigate} />
         {depth === 1 && <MenuServices onNavigate={handleToCategory} />}
-        {depth === 2 && (
-          <MenuCategory category={category} onNavigate={() => {}} />
+        {depth === 2 && currentService && (
+          <MenuCategory
+            category={category}
+            overview={currentService.overview}
+            onNavigate={() => {}}
+          />
         )}
       </Box>
     </Box>

src/content/other-programs/ches.md

@@ -4,9 +4,18 @@ index: 2
 ---
 
 ### Cloud-hosted enterprise services (CHES)
+CHES is the USAF’s adoption of Microsoft Office365.  The core capabilities are email, messaging, document management and individual storage.  Some of the current products are, OWA, Exchange, SharePoint Online, OneDrive and Teams.  Below is a brief description of these services.
 
-#### Office 365
+#### Exchange Online
+Microsoft Exchange Online is a hosted messaging solution that delivers the capabilities of Microsoft Exchange Server as a cloud-based service. It gives users access to email, calendar, contacts, and tasks from PCs, the web, and mobile devices.
 
-#### SharePoint
+#### Teams
+Microsoft Teams is the hub for teamwork in Microsoft 365. The Teams service enables instant messaging, audio and video calling, rich online meetings, mobile experiences, and extensive web conferencing capabilities. In addition, Teams provides file and data collaboration and extensibility features, and integrates with Microsoft 365.
 
-#### Teams
+#### SharePoint Online
\ No newline at end of file
+Microsoft SharePoint is used to create websites. It is a secure place to store, organize, share, and access information.  SharePoint Online is the cloud-based service, hosted by Microsoft in the DoD IL5 environment. 
+
+#### One Drive for Business
+OneDrive is online storage space in the cloud that's provided for individual licensed users in an organization. Use it to help protect work files and access them across multiple devices. OneDrive lets you share files and collaborate on documents, and sync files to your computer.
+
+[Additional Information on 365](https://docs.microsoft.com/en-us/office365/servicedescriptions/office-365-service-descriptions-technet-library)
\ No newline at end of file

src/content/service-detail/enterprise-virtual-environment-eve.md → src/content/service-detail/atom.md

 ---
-slug: '/services/enterprise-virtual-environment'
-title: 'Enterprise Virtual Environment (EVE)'
-shortTitle: 'EVE'
+slug: '/services/atom'
+title: 'ATOM'
+shortTitle: 'ATOM'
 categories: 
   - Compute & Store
 levels: 
@@ -10,10 +10,11 @@ levels:
   - TS-SCI
 excerpt: 'A government owned/government operated hardware solution that provides a basic compute and store capability in a PL-3 environment.'
 share: '../../images/share/ogimage-compute_and_store.png'
-updated: March 23, 2021 at 2:54:52 PM EDT
+updated: April 1
 ---
+ATOM is a government owned/government operated hardware solution that provides a basic compute and store capability in a PL-3 environment.
 
-This infrastructure-as-a-service (IaaS) model allows EVE to host virtualized systems and field services supporting the USAF and DoD. EVE supports both Level 3 and Level 4/5 production mission systems.
+This infrastructure-as-a-service (IaaS) model allows ATOM to host virtualized systems and field services supporting the USAF and DoD. ATOM supports both Level 3 and Level 4/5 production mission systems.
 
 ### Benefits & Features
 

src/content/service-detail/core-rock.md

 ---
-slug: '/services/core-rock'
-title: 'CORE (Rock)'
+slug: '/services/core'
+title: 'CORE'
 categories: 
   - Communications
 levels: 
@@ -9,7 +9,7 @@ levels:
   - TS-SCI
 share: '../../images/share/ogimage-communications.png'
 excerpt: 'A suite of multi-level web applications that provide file sharing and webmail services enabling secure data and communication exchange between S//SAR, TS//SAR, and TS//SAR-SCI networks and users.'
-updated: March 23, 2021 at 2:54:52 PM EDT
+updated: April 1
 ---
 
 CORE is a suite of multi-level web applications that provide file sharing and webmail services enabling secure data and communication exchange between S//SAR, TS//SAR, and TS//SAR-SCI networks and users.
@@ -36,5 +36,5 @@ DoD, USAF and industry partners can utilize the capability.
 
 ### Requirements
 
-All necessary forms are provided by the Rock Connections Team
+All necessary forms are provided by the Core Connections Team
 

src/content/service-detail/misty-sierra.md

@@ -10,7 +10,7 @@ levels:
   - TS-SCI
 excerpt: 'Misty Sierra is a compartmented WAN that includes trusted MLS services, specifically providing an integrated PL-4 desktop environment with Automated Information System tools and functions.'
 share: '../../images/share/ogimage-networking_and_connectivity.png'
-updated: March 31
+updated: April 1
 ---
 
 Misty Sierra is a compartmented WAN that includes trusted MLS services, specifically providing an integrated PL-4 desktop environment with Automated Information System tools and functions.
@@ -44,7 +44,7 @@ Required Documentation
 - Scanning
 - DVD burning
 - Javelin
-- [Rock](/services/core-rock)
+- [CORE](/services/core)
 - Braces
 - Hawkeye
 - [FENCES](/services/fences)
\ No newline at end of file

src/data/hero/home.yaml → src/data/hero/0_home.yaml

 name: Home
 title: 'Cutting-Edge Digital Transformation'
 subtitle: 'Enterprise IT to Power a Digital Air Force'
-index: 0
 image: '../../images/hero/1-hero-home.png'
+thumb: '../../images/hero/thumb-home.png'
+index: 0

src/data/hero/cloud-one.yaml → src/data/hero/1_cloud-one.yaml

 name: Cloud One
 title: Cloud One
-subtitle: 'Fast, Secure, Streamlined'
+subtitle: "USAF's preeminent cloud hosting platform"
 core: true
-cta: Learn More
+cta: 'Learn More'
 slug: '/services/cloud-one'
 image: '../../images/hero/2-hero-cloud-one.png'
 logo: '../../images/hero/logo-cloud-one.png'
+thumb: '../../images/hero/thumb-cloud-one.png'
+thumblogo: '../../images/hero/logo-cloud-one.png'
 index: 1

src/data/hero/platform-one.yaml → src/data/hero/2_platform-one.yaml

 name: Platform One
 title: Platform One
-subtitle: 'Lorem Ipsum Change Me'
+subtitle: Services and tools to get to the cloud faster
 core: true
-cta: 'Learn More'
+cta: Learn More
 slug: '/services/platform-one'
 image: '../../images/hero/3-hero-platform-one.png'
 logo: '../../images/hero/logo-platform-one.png'
+thumb: '../../images/hero/thumb-platform-one.png'
+thumblogo: '../../images/hero/logo-platform-one.png'
 index: 2

src/data/hero/fences.yaml → src/data/hero/3_fences.yaml

 name: Fences
 title: Fences
-subtitle: Lispsum Ipsum Elementum
+subtitle: Multi-level SAP cloud hosting
 core: true
 cta: Learn More
 slug: '/services/fences'
 image: '../../images/hero/4-hero-fences.png'
 logo: '../../images/hero/logo-fences.png'
+thumb: '../../images/hero/thumb-fences.png'
+thumblogo: '../../images/hero/logo-fences.png'
 index: 3

src/data/hero/summit.yaml → src/data/hero/4_summit.yaml

 name: Summit
 title: Summit
-subtitle: 'Lorem Dipsum Fix This'
+subtitle: SAP network-as-a-service
 core: true
-cta: 'Learn More'
+cta: Learn More
 slug: '/services/summit'
 image: '../../images/hero/5-hero-summit.png'
+thumb: '../../images/hero/thumb-summit.png'
+thumblogo: '../../images/hero/logo-summit.png'
 index: 4

src/data/hero/5_dep.yaml

+name: Digital Engineering Platform
+title: Digital Engineering Platform
+subtitle: Modern development and collaboration tools
+cta: Learn More
+slug: '/services/digital-engineering-platform'
+image: '../../images/hero/6-hero-dep.png'
+logo: '../../images/hero/logo-dep.png'
+thumb: '../../images/hero/thumb-dep.png'
+thumblogo: '../../images/hero/logo-dep.png'
+index: 5