Merge branch 'main' into bug/handle-http-error-oauth-exchange

src/js/components/bodyContainer.tsx

@@ -5,7 +5,9 @@ const BodyContainer = ({
 }: {
   children: ReactNode | null | undefined;
 }) => (
-  <div className="slds-p-around_medium slds-grid slds-wrap">{children}</div>
+  <div className="slds-p-around_medium slds-text-heading_small slds-grid slds-wrap">
+    {children}
+  </div>
 );
 
 export default BodyContainer;

src/js/components/jobs/progressBar.tsx

@@ -116,7 +116,7 @@ class ProgressBar extends Component<Props, State> {
     const progressRounded = Math.min(Math.round(progress), 100);
     const id = `${job.id}-progress`;
     return (
-      <div className="slds-p-around_medium slds-size_1-of-1">
+      <div className="slds-p-around_medium slds-text-heading_small slds-size_1-of-1">
         <div
           id={id}
           className="slds-grid

src/js/components/jobs/userInfo.tsx

@@ -53,6 +53,7 @@ const UserInfo = ({
   return contents ? (
     <div
       className="slds-p-around_medium
+        slds-text-heading_small
         slds-size_1-of-1
         slds-medium-size_1-of-2"
     >

src/js/components/plans/intro.tsx

@@ -27,6 +27,7 @@ const Intro = ({
   return (
     <div
       className="slds-p-around_medium
+        slds-text-heading_small
         slds-size_1-of-1
         slds-medium-size_1-of-2"
     >

src/js/components/plans/stepsTable/index.tsx

@@ -205,7 +205,7 @@ class StepsTable extends Component<Props, State> {
     const hasReadyPreflight = !plan.requires_preflight || preflight?.is_ready;
     const logsExpanded = expandedPanels.size > 0;
     return (
-      <div className="slds-p-around_medium slds-size_1-of-1">
+      <div className="slds-p-around_medium slds-text-heading_small slds-size_1-of-1">
         <article className="slds-card slds-scrollable_x">
           <DataTable items={steps} id="plan-steps-table">
             <DataTableColumn

src/js/components/plans/userInfo.tsx

@@ -115,6 +115,7 @@ const UserInfo = ({
   return contents ? (
     <div
       className="slds-p-around_medium
+        slds-text-heading_small
         slds-size_1-of-1
         slds-medium-size_1-of-2"
     >

src/js/components/products/detail.tsx

@@ -135,6 +135,7 @@ const BodySection = ({ children }: { children?: ReactNode }) => (
   <div
     className="slds-text-longform
       slds-p-around_medium
+      slds-text-heading_small
       slds-size_1-of-1
       slds-medium-size_1-of-2"
   >

src/js/components/products/list.tsx

@@ -25,6 +25,7 @@ const getProductsList = (products: Product[], category?: Category) => (
       <div
         className="slds-text-longform
           slds-p-around_small
+          slds-text-heading_small
           slds-size_1-of-1
           slds-large-size_2-of-3
           markdown"
@@ -206,13 +207,13 @@ const ProductsList = () => {
       <>
         <Header history={history} />
         <PageHeader />
-        <div className="slds-p-around_x-large">
+        <div className="slds-text-heading_small slds-p-around_x-large">
           {window.GLOBALS.SITE?.welcome_text ? (
             // These messages are pre-cleaned by the API
             <div
               className="markdown
                 slds-p-bottom_medium
-                slds-text-longform
+                slds-text-heading_small
                 slds-size_1-of-1
                 slds-large-size_2-of-3"
               dangerouslySetInnerHTML={{

src/js/components/products/listItem.tsx

@@ -37,11 +37,17 @@ const ProductItem = ({ item }: { item: Product }) => {
             {t('Version {{version}}', { version: label })}
           </div>
           {item.short_description ? (
-            <div className="slds-p-top_x-small">{item.short_description}</div>
+            <div
+              className="slds-p-top_x-small slds-text-heading_small"
+              style={{ fontWeight: 300 }}
+            >
+              {item.short_description}
+            </div>
           ) : (
             item.description && (
               <div
-                className="md-truncate-children slds-p-top_x-small"
+                className="md-truncate-children slds-text-heading_small "
+                style={{ fontWeight: 300 }}
                 // This description is pre-cleaned by the API
                 dangerouslySetInnerHTML={{ __html: item.description }}
               />

src/js/components/products/planCards.tsx

@@ -21,6 +21,7 @@ const PlanCard = ({
   return (
     <div
       className="slds-p-around_medium
+        slds-text-heading_small
         slds-size_1-of-1
         slds-medium-size_1-of-2
         slds-large-size_1-of-3"