cleanup;

HubSpot · Jun 10, 2024 · 8a153d4 · 8a153d4
1 parent 4e8c0cf
commit 8a153d4
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 206 deletions.
diff --git a/examples/getting-started/getting-started-project/src/components/islands/WeatherForecast.tsx b/examples/getting-started/getting-started-project/src/components/islands/WeatherForecast.tsx
@@ -3,7 +3,31 @@ import weatherStyles from '../../styles/weather.module.css';
 import { getWeatherForecast } from '../../utils.ts';
 import { UpcomingWeatherCard } from '../UpcomingWeatherCard.tsx';
 import { CurrentWeatherCard } from '../CurrentWeatherCard.tsx';
-import { WeatherData } from '../../types.ts';
+
+type WeatherCondition = {
+  text: string;
+  icon: string;
+  code: number;
+};
+
+type DailyForecast = Record<string, string | number | Day>;
+
+type Day = {
+  day: Record<string, number | WeatherCondition>;
+};
+
+type Forecast = {
+  forecastday: DailyForecast[];
+};
+
+export type CurrentWeather = Record<string, number | string | WeatherCondition>;
+type Location = Record<string, number | string>;
+
+export type WeatherData = {
+  location: Location;
+  current: CurrentWeather;
+  forecast: Forecast;
+};
 
 type WeatherForecastProps = {
   headline: string;

diff --git a/examples/getting-started/getting-started-project/src/components/modules/Header/index.tsx b/examples/getting-started/getting-started-project/src/components/modules/Header/index.tsx
@@ -1,3 +1,4 @@
+import React from 'react';
 import { Menu, logInfo } from '@hubspot/cms-components';
 import {
   ImageField,
@@ -12,143 +13,7 @@ export function Component({ fieldValues }) {
     <header className={headerStyles.wrapper}>
       <nav>
         <img src={fieldValues.logo.src} alt="Logo" width={100} />
-        {/* <Menu fieldPath="menu" /> */}
-        <div>
-          <span
-            id="hs_cos_wrapper_widget_1717899743787_"
-            className="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_menu"
-            data-hs-cos-general-type="widget"
-            data-hs-cos-type="menu"
-          >
-            <div
-              id="hs_menu_wrapper_widget_1717899743787_"
-              className="hs-menu-wrapper active-branch flyouts hs-menu-flow-horizontal"
-              role="navigation"
-              data-sitemap-name="default"
-              data-menu-id="53522818668"
-              aria-label="Navigation Menu"
-            >
-              <ul role="menu">
-                <li className="hs-menu-item hs-menu-depth-1" role="none">
-                  <a href="javascript:;" role="menuitem">
-                    Home
-                  </a>
-                </li>
-                <li
-                  className="hs-menu-item hs-menu-depth-1 hs-item-has-children"
-                  role="none"
-                >
-                  <a
-                    href="javascript:;"
-                    aria-haspopup="true"
-                    aria-expanded="false"
-                    role="menuitem"
-                  >
-                    Software
-                  </a>
-                  <ul role="menu" className="hs-menu-children-wrapper">
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Free HubSpot CRM
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Marketing Hub
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Sales Hub
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Service Hub
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        CMS Hub
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        App Marketplace
-                      </a>
-                    </li>
-                  </ul>
-                </li>
-                <li className="hs-menu-item hs-menu-depth-1" role="none">
-                  <a href="javascript:;" role="menuitem">
-                    Pricing
-                  </a>
-                </li>
-                <li
-                  className="hs-menu-item hs-menu-depth-1 hs-item-has-children"
-                  role="none"
-                >
-                  <a
-                    href="javascript:;"
-                    aria-haspopup="true"
-                    aria-expanded="false"
-                    role="menuitem"
-                  >
-                    Resources
-                  </a>
-                  <ul role="menu" className="hs-menu-children-wrapper">
-                    <li
-                      className="hs-menu-item hs-menu-depth-2 hs-item-has-children"
-                      role="none"
-                    >
-                      <a href="javascript:;" role="menuitem">
-                        Blog
-                      </a>
-                      <ul role="menu" className="hs-menu-children-wrapper">
-                        <li
-                          className="hs-menu-item hs-menu-depth-3"
-                          role="none"
-                        >
-                          <a href="javascript:;" role="menuitem">
-                            Blog Topic Generator
-                          </a>
-                        </li>
-                        <li
-                          className="hs-menu-item hs-menu-depth-3"
-                          role="none"
-                        >
-                          <a href="javascript:;" role="menuitem">
-                            Blog Ideas Generator
-                          </a>
-                        </li>
-                      </ul>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Customer Stories
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Developers
-                      </a>
-                    </li>
-                    <li className="hs-menu-item hs-menu-depth-2" role="none">
-                      <a href="javascript:;" role="menuitem">
-                        Ebooks, Guides &amp; More
-                      </a>
-                    </li>
-                  </ul>
-                </li>
-                <li className="hs-menu-item hs-menu-depth-1" role="none">
-                  <a href="javascript:;" role="menuitem">
-                    About
-                  </a>
-                </li>
-              </ul>
-            </div>
-          </span>
-        </div>
+        <Menu fieldPath="menu" />
       </nav>
     </header>
   );

diff --git a/examples/getting-started/getting-started-project/src/styles/header.module.css b/examples/getting-started/getting-started-project/src/styles/header.module.css
@@ -1,11 +1,6 @@
 :root {
   --primary-color: #ff7a59;
-  --primary-color-dark: #e66e50;
-  --primary-color-med: #ffbcac;
-  --primary-color-light: #fff1ee;
-  --secondary-color: #dfe3eb;
   --accent-color: #2d3e50;
-  --light-accent-color: #eaf0f6;
 }
 
 .wrapper {
@@ -14,7 +9,7 @@
 
   & nav {
     display: flex;
-    align-items: flex-start;
+    align-items: center;
     justify-content: space-between;
     flex-direction: row;
     padding: 15px 25px;
@@ -29,47 +24,12 @@
       & li {
         & a {
           text-decoration: none;
-          color: var(--accent-color);
-          &:hover {
-            color: var(--primary-color);
+          color: #ff7a59;
+            &:hover {
+              color: #2d3e50;
             }
           }
-        & ul {
-          margin-top: 10px;
-          display: flex;
-          flex-direction: column;
-          gap: 5px;
-          border: 1px solid #ccc;
-          padding: 10px;
-          & li {
-            position: relative;
-            &  a {
-                color: gray;
-                text-decoration: none;
-              }
-            & ul {
-              position: absolute;
-              top: 10px;
-              left: 0px;
-              margin-top: 0px;
-              border: none;
-              & li {
-                display: block;
-                top: unset;
-                left: unset;
-                & a {
-                  color: gray;
-                  text-decoration: none;
-                }
-              }
-            }
-          }
-        }
       }
     }
   }
 }
-
-ul.hs-menu-children-wrapper li {
-  display: none;
-}
diff --git a/examples/getting-started/getting-started-project/src/types.ts b/examples/getting-started/getting-started-project/src/types.ts