Update copy; update jump links structure; improve sass readability

uswds · Feb 11, 2025 · 3bb5305 · 3bb5305
1 parent 8e59ba6
commit 3bb5305
Show file tree

Hide file tree

Showing 3 changed files with 100 additions and 106 deletions.
diff --git a/_includes/jump-links.html b/_includes/jump-links.html
@@ -13,14 +13,14 @@
 <ul class="site-checklist-jump-links {{ include.listClasses }}">
   {% for link in page.jump_links %}
     <li class="{{ include.listItemClasses }}">
-      <a href="#{{ link | downcase | slugify }}">
+      <a href="#{{ link.href | default: link.text | downcase | slugify }}">
         <span>
           <svg class="usa-icon" aria-hidden="true" role="img">
             <use href="{{ site.baseurl }}/assets/img/sprite.svg#arrow_downward"></use>
         </svg>
-        {{ link }}
+        {{ link.text }}
         </span>
       </a>
     </li>
   {% endfor %}
-</ul>
+</ul>
diff --git a/css/custom-styles/_whats-new.scss b/css/custom-styles/_whats-new.scss
@@ -1,109 +1,103 @@
 .site-prose {
-  .whats-new {
-    &__heading {
-      @include u-margin-top(6);
-      @include u-text("normal");
-      @include u-font("lang","md");
-      @include u-text("gray-70");
-      scroll-margin-top: 3.5rem;
-    }
-
-    &__card-group {
-      .usa-card {
-        @include at-media("desktop-lg") {
-          @include u-margin-bottom(0);
-        }
-      }
+  .whats-new__heading {
+    @include u-margin-top(6);
+    @include u-text("normal");
+    @include u-font("lang","md");
+    @include u-text("gray-70");
+    scroll-margin-top: 3.5rem;
+  }
 
-      .usa-button {
-        @include u-font('lang', 'xs')
+  .whats-new__card-group {
+    .usa-card {
+      @include at-media("desktop-lg") {
+        @include u-margin-bottom(0);
       }
+    }
 
-      .usa-card__container {
-        border: none;
-        border-radius: 0;
-        border-top: units(1) solid color("blue-80v");
-      }
+    .usa-button {
+      @include u-font('lang', 'xs')
     }
 
-    &-card--mc {
-      @include u-margin-y(4);
-      @include u-measure(6);
+    .usa-card__container {
+      border: none;
+      border-radius: 0;
+      border-top: units(1) solid color("blue-80v");
+    }
+  }
 
-      .usa-card__container {
-        @include u-bg("blue-warm-80v");
-        @include u-border(0);
-        @include u-margin-x(0);
-        @include u-text("gray-warm-5");
+  .whats-new-card--monthly-call {
+    @include u-margin-y(6);
+    @include u-measure(6);
 
-        @include at-media("tablet") {
-          @include u-padding(1);
-        }
+    .usa-card__container {
+      @include u-bg("blue-warm-80v");
+      @include u-border(0);
+      @include u-margin-x(0);
+      @include u-text("gray-warm-5");
 
-        @include at-media("desktop-lg") {
-          @include u-padding-x(2);
-          @include u-padding-y(3);
-        }
+      @include at-media("desktop-lg") {
+        @include u-padding-x(2);
+        @include u-padding-y(3);
       }
+    }
 
-      .site-subheading {
-        color: color("gray-warm-10");
-      }
+    .site-subheading {
+      color: color("gray-warm-10");
+    }
 
-      .usa-card__heading {
-        line-height: unset;
-      }
+    .usa-card__heading {
+      line-height: unset;
+    }
 
-      .usa-card__body,
-      .usa-card__header,
-      .usa-card__footer {
-        @include at-media("tablet") {
-          width: 100%;
-        }
+    .usa-card__body,
+    .usa-card__header,
+    .usa-card__footer {
+      @include at-media("tablet") {
+        width: 100%;
+      }
 
-        @include at-media("desktop-lg") {
-          @include grid-col(7);
-        }
+      @include at-media("desktop-lg") {
+        @include grid-col(7);
       }
+    }
 
-      .usa-card__media {
-        @include u-padding(4);
-        background-image: url("../img/monthly_call_bg.png");
-        background-position-y: center;
-        background-size: 15rem;
-        display:flex;
-        justify-content: center;
-
-        @include at-media("tablet") {
-          position: relative;
-          width: 100%;
-        }
+    .usa-card__media {
+      @include u-padding(4);
+      background-image: url("../img/monthly_call_bg.png");
+      background-position-y: center;
+      background-size: 15rem;
+      display:flex;
+      justify-content: center;
+
+      @include at-media("tablet") {
+        position: relative;
+        width: 100%;
+      }
 
-        @include at-media("desktop-lg") {
-          @include grid-col(5);
-          @include u-padding(6);
-          position: absolute;
-        }
+      @include at-media("desktop-lg") {
+        @include grid-col(5);
+        @include u-padding(6);
+        position: absolute;
       }
+    }
 
-      .usa-card__img {
-        background-color: initial;
-        max-width: 10rem;
+    .usa-card__img {
+      background-color: initial;
+      max-width: 10rem;
 
-        @include at-media("desktop-lg") {
-          max-width: 15rem;
-        }
+      @include at-media("desktop-lg") {
+        max-width: 15rem;
       }
+    }
 
-      .usa-card__img img {
-        object-fit: initial;
-      }
+    .usa-card__img img {
+      object-fit: initial;
+    }
 
-      .usa-button {
-        @include u-bg("gold-20v");
-        @include u-margin-top(1);
-        @include u-text("blue-80v");
-      }
+    .usa-button {
+      @include u-bg("gold-30v");
+      @include u-margin-top(1);
+      @include u-text("blue-80v");
     }
   }
 

diff --git a/pages/whats-new/overview.md b/pages/whats-new/overview.md
@@ -4,7 +4,7 @@ layout: styleguide
 title: What’s new
 category: About
 lead: |
-  Get the latest USWDS news and information here. Learn more about our product development and process, dive deeper into our monthly call topics, and see how we work with our partners to improve the government technology space.
+  Stay up to date on the latest U.S. Web Design System (USWDS) product launches, learn how to use the design system, and dive deeper into our monthly call topics.
 columns:
   - title: New users
     source: New Users
@@ -27,19 +27,19 @@ subnav:
   - text: Changelog
     href: /about/whats-new/changelog/
 jump_links:
-  - Latest releases
-  - Latest news and events
-  - Connect with USWDS
-  - Changelog
+  - text: Latest releases
+  - text: Latest news and events
+  - text:  Connect with USWDS
+  - text: Changelog
 connect_cards:
   - heading: "Stay up to date in your inbox"
     subheading: Newsletter
-    body: "Get news, updates, and resources from the U.S. Web Design System, and learn about the USWDS community."
+    body: "Get the latest news, product updates, and resources from USWDS."
     linkText: "Sign up for our newsletter"
     linkUrl: "https://public.govdelivery.com/accounts/USGSATTS/subscriber/new?qsp=GSA_TTS"
   - heading: "GitHub discussions"
     subheading: Community discussions
-    body: "How our growing community of government engineers, content specialists, and designers participate and contribute to improving USWDS."
+    body: "Join our growing community of USWDS users and contribute to design system improvements."
     linkText: "USWDS GitHub discussions"
     linkUrl: "https://github.com/uswds/uswds/discussions"
 in_page_nav_headings: "h2"
@@ -90,27 +90,30 @@ in_page_nav_headings: "h2"
       {% include site-card.html
         subheading="Design system"
         heading="USWDS"
-        body="The U.S. Web Design System helps the federal government build fast, accessible, mobile-friendly websites."
+        body="The official U.S. design system, enabling the government to build fast, accessible, mobile-friendly websites."
         linkText=uswds_link_text
         linkUrl="https://github.com/uswds/uswds/releases"
+        subheadingLevel="h3"
       %}
     </li>
     <li class="{{ product_grid_list_classes }}">
       {% include site-card.html
         subheading="Compilation tool"
         heading="USWDS Compile"
-        body="Simple Gulp 5 functions for copying USWDS static assets and transforming USWDS Sass into browser-readable CSS."
+        body="A tool that makes it easy to customize and compile USWDS Sass into browser-readable CSS."
         linkText=uswds_compile_link_text
         linkUrl="https://github.com/uswds/uswds-compile/releases"
+        subheadingLevel="h3"
       %}
     </li>
     <li class="{{ product_grid_list_classes }}">
       {% include site-card.html
         subheading="Design kit"
         heading="USWDS Figma"
-        body="An official United States Web Design System (USWDS) design kit from the USWDS team."
+        body="The official USWDS design kit."
         linkText=uswds_figma_link_text
         linkUrl="https://www.figma.com/community/file/1440921849343185329"
+        subheadingLevel="h3"
       %}
     </li>
   </ul>
@@ -124,7 +127,12 @@ in_page_nav_headings: "h2"
 {% endfor %}
 </div>
 
-<div class="usa-card usa-card--flag usa-card--media-right whats-new-card--mc">
+<a class="usa-button margin-top-105"
+  href="{{ site.baseurl }}/about/whats-new/all/">
+  See all USWDS news and updates
+</a>
+
+<div class="usa-card usa-card--flag usa-card--media-right whats-new-card--monthly-call">
 {% include site-card.html
   subheading="Monthly call"
   heading=monthly_call_heading
@@ -135,15 +143,6 @@ in_page_nav_headings: "h2"
 %}
 </div>
 
-{% for post in all_posts offset:3 limit:3 %}
-  {% include post-preview.html heading="h3" meta=false %}
-{% endfor %}
-
-<a class="usa-button margin-top-105"
-  href="{{ site.baseurl }}/about/whats-new/all/">
-  See all USWDS news and updates
-</a>
-
 {:.whats-new__heading}
 ## Connect with USWDS
 
@@ -153,6 +152,7 @@ in_page_nav_headings: "h2"
     listClasses="measure-6"
     listItemClasses="desktop-lg:grid-col-6"
     containerClasses="bg-gray-4"
+    subheadingLevel="h4"
   %}
 </div>