From 7947f9d8cb14b9562545949c352efc3da97f7a0d Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:30:15 -0500 Subject: [PATCH 1/7] Adds styling to page header --- _includes/hero.html | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/_includes/hero.html b/_includes/hero.html index 1533088d8..910a25aa0 100644 --- a/_includes/hero.html +++ b/_includes/hero.html @@ -120,6 +120,14 @@

{{ page.hero.text}}

{{ page.hero.subtext | markdownify }} +{% elsif page.class == "sprint-process" %} +
+
+

{{ page.hero.text}}

+
+ {{ page.hero.subtext | markdownify }} +
+
{% else %}
From f995ea80dd070c7516aca0862853c445bc3cefbb Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:31:31 -0500 Subject: [PATCH 2/7] Adds div and spacing --- _includes/how-it-works-details.html | 134 +++++++++++++++------------- 1 file changed, 72 insertions(+), 62 deletions(-) diff --git a/_includes/how-it-works-details.html b/_includes/how-it-works-details.html index 4afd6ccfc..6ac6d6aab 100644 --- a/_includes/how-it-works-details.html +++ b/_includes/how-it-works-details.html @@ -1,73 +1,83 @@ {% assign data = include.data %} -
-
    -
  1. - Identify Challenges -

    Government agencies or non-governmental organizations (NGOs) identify high-priority problems they seek to solve through the sprint. Challenges can be any priority facing the public.

    -
    2. -
  2. - Team Up -

    Technologists from industry, NGOs, and universities sign on to create data-driven, digital products in collaboration - with end users, community advocates, and data experts.

    -
    3. -
  3. -
    +
    +
    +
      +
    1. + Identify Challenges +

      Government agencies or non-governmental organizations (NGOs) identify high-priority problems they seek to solve through the sprint. Challenges can be any priority facing the public.

      +
      2. +
    2. + Team Up +

      Technologists from industry, NGOs, and universities sign on to create data-driven, digital products in collaboration + with end users, community advocates, and data experts.

      +
      3. +
    3. + Build +
      +

      + Tech teams build products during a 12-14 week technology development sprint that includes user research, data + exploration, and product development. Past products include mapping tools, apps, websites, games, AI algorithms, network + visualizations, and more. +

      +
      +
      +

      + +

      - -

      Build

      - - -

      - Tech teams build products during a 12-14 week technology development sprint that includes user research, data - exploration, and product development. Past products include mapping tools, apps, websites, games, AI algorithms, network - visualizations, and more. -

      -
      -
      -

      - -

      - -
      -
        -
      1. User Research: -

        Teams conduct user research and connect with user advocates who can offer insights into their communities.

        -
        2. -
      2. Data Discovery: -

        Teams begin identifying and exploring relevant datasets and connect with data stewards via email and phone to learn more about available datasets.

        -
        3. -
      3. Concept Pitch: -

        Teams present their initial progress and product concept for feedback.

        +
        +
          +
        1. User Research: +

          Teams conduct user research and connect with user advocates who can offer insights into their communities.

          2. -
        2. Product Advising: -

          Teams are paired with 1:1 product advisors that meet with the teams outside of milestones to discuss launch and product maintenance strategy

          - -
          3. -
        3. Beta Demo: -

          Teams present a prototype of their product for feedback.

          +
        4. Data Discovery: +

          Teams begin identifying and exploring relevant datasets and connect with data stewards via email and phone to learn more about available datasets.

          5. -
        5. MVP Demo: -

          Teams present a minimum viable product as the final outcome of the sprint and receive feedback on sustainability and longevity of their work.

          +
        6. Concept Pitch: +

          Teams present their initial progress and product concept for feedback.

          +
          7. +
        7. Product Advising: +

          Teams are paired with 1:1 product advisors that meet with the teams outside of milestones to discuss launch and product maintenance strategy

          +
          8. -
        +
      4. Beta Demo: +

        Teams present a prototype of their product for feedback.

        +
        5. +
      5. MVP Demo: +

        Teams present a minimum viable product as the final outcome of the sprint and receive feedback on sustainability and longevity of their work.

        +
        6. +
      + +
      +
      +
      4. +
    4. + Launch +

      Products are launched and federal agencies can decide how they want to showcase the results of their sprint.

      +
      5. +
    5. + Reach End Users +

      After the sprint, participants have the option to stay in touch and continue product development and deployment.

      +
      6. +
    -
    -
    -
    4. -
  4. - Launch -

    Products are launched and federal agencies can decide how they want to showcase the results of their sprint.

    -
    5. -
  5. - Reach End Users -

    After the sprint, participants have the option to stay in touch and continue product development and deployment.

    -
    6. -
+
+ + Facilitate a TOP sprint at your agency on your timeline with the TOPx Toolkit. + +
+
\ No newline at end of file From f8c26299dfb7876af4bbbcf76a230d40757ab65d Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:38:52 -0500 Subject: [PATCH 3/7] Removes section from include --- _includes/single-column-header-text-hot-dog-cta.html | 3 --- 1 file changed, 3 deletions(-) diff --git a/_includes/single-column-header-text-hot-dog-cta.html b/_includes/single-column-header-text-hot-dog-cta.html index 1d37f5869..3bed16e6b 100644 --- a/_includes/single-column-header-text-hot-dog-cta.html +++ b/_includes/single-column-header-text-hot-dog-cta.html @@ -1,7 +1,5 @@ {% assign data = include.data %} -
- {% for data in data %} {% if data.text.title %}

{{data.text.title}} @@ -51,4 +49,3 @@

{{data.blurb.title}}

{% endif %} {% endfor %} -
\ No newline at end of file From c169125183c18a34cdef52e8a92a49f6d631c61a Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:40:14 -0500 Subject: [PATCH 4/7] Restructures include and adds spacing --- ...single-column-header-text-hot-dog-cta.html | 84 ++++++++++++------- 1 file changed, 54 insertions(+), 30 deletions(-) diff --git a/_includes/single-column-header-text-hot-dog-cta.html b/_includes/single-column-header-text-hot-dog-cta.html index 3bed16e6b..66784c416 100644 --- a/_includes/single-column-header-text-hot-dog-cta.html +++ b/_includes/single-column-header-text-hot-dog-cta.html @@ -1,51 +1,75 @@ {% assign data = include.data %} -{% if data.text.title %} -

{{data.text.title}} -

-{% endif %} -
- {% if data.text.subtitle %} +{% for data in data %} +
+ {% if data.text.title %} +

{{ data.text.title }} +

+ {% endif %} -

{{data.text.subtitle}}

+
+ {% if data.text.subtitle %} - {% endif %} +

{{data.text.subtitle}}

- {% if data.role.title %} + {% endif %} -

{{data.role.title}}

+ {% if data.role.title %} - {% endif %} +

{{data.role.title}}

+ {% endif %} -

- {{ data.text.blurb | markdownify | remove: "

" | remove: "

" }} -

+ {% if data.text.blurb %} +

+ {{ data.text.blurb | markdownify | remove: "

" | remove: "

" }} +

-

- {{ data.role.blurb | markdownify | remove: "

" | remove: "

" }} -

+ {% endif %} -{% if data.download.href %} - -{{ data.download.text}} -{% endif %} + {% if data.role.blurb %} +

+ {{ data.role.blurb | markdownify | remove: "

" | remove: "

" }} +

+ {% endif%} -
+ {% if data.download.href %} +
+ + {{ data.download.text}} + +
+ {% endif %} +
-{% if data.cta %} -

{{data.blurb.title}}

-{% endif %} + {% if data.cta %} +

{{data.blurb.title}}

+ {% endif %} + + {% if data.role-details %} +
+
+
+

Interested in participating in a sprint?

+ + Email the TOP team. + +
+
+
+ {% endif %} +
{% endfor %} From bf370743a22a37228bde574df7d1c84833864329 Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:41:03 -0500 Subject: [PATCH 5/7] Adds styling --- css/_uswds-theme-custom-styles.scss | 220 +++++++++++++++++++++++++++- 1 file changed, 219 insertions(+), 1 deletion(-) diff --git a/css/_uswds-theme-custom-styles.scss b/css/_uswds-theme-custom-styles.scss index 8b0ab38d7..f7ef446cf 100644 --- a/css/_uswds-theme-custom-styles.scss +++ b/css/_uswds-theme-custom-styles.scss @@ -1392,15 +1392,212 @@ main { .page-sprint-process { h2 { font-size: 14px; + + @include at-media('tablet') { + font-size: 20px; + line-height: 20px; + } + @include at-media('desktop') { + font-size: 32px; + line-height: 32px; + } } h3 { font-size: 12px; + @include at-media('tablet') { + font-size: 14px; + line-height: 14px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 24px; + } } p { font-size: 12px; line-height: 17px; + @include at-media('tablet') { + font-size: 14px; + line-height: 17px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 30px; + } + } + + .interior-hero { + padding-bottom: 60px; + } + + .usa-hero__bg { + width: 200px; + min-height: 114px; + background-color: #121923; + @include at-media('tablet') { + width: 343px; + // min-height: ; + } + + @include at-media('desktop') { + width: 571px; + } + } + + .usa-hero__title { + font-size: 14px; + margin: 0; + padding: 0; + padding-top: 25px; + @include at-media('tablet') { + font-size: 20px; + line-height: 20px; + } + @include at-media('desktop') { + font-size: 32px; + line-height: 32px; + } + } + + .usa-hero__subtitle { + font-size: 12px; + line-height: 17px; + margin-bottom: 0; + padding-bottom: 16px; + @include at-media('tablet') { + font-size: 14px; + line-height: 17px; + } + + @include at-media('desktop') { + font-size: 32px; + line-height: 32px; + } + } + + div.header-text-hot-dog, div.how-it-works-details { + padding: 52.64px 30.08px; + + @include at-media('tablet') { + padding: 52.64px 67.68px; + } + @include at-media('desktop') { + padding: 112px 127.5px; + } + } + div.grid-container div.text-wrapper { + margin: 15.04px 0; + + @include at-media('tablet') { + margin: 30px 0 8px; + } + @include at-media('desktop') { + margin: 30px 0px 0px; + } + a { + font-size: 12px; + line-height: 17px; + @include at-media('tablet') { + font-size: 14px; + } + @include at-media('desktop') { + font-size: 24px; + } + } + } + .how-it-works-details { + ol { + list-style-position: inside; + font-size: 12px; + @include at-media('tablet') { + font-size: 14px; + line-height: 17px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 24px; + } + .usa-accordion__button { + font-size: 12px; + line-height: 12px; + @include at-media('tablet') { + font-size: 14px; + line-height: 14px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 24px; + } + } + } + } + .site-button.usa-button { + box-shadow: inset 0 0 0 1px black; + text-decoration: underline; + font-size: 12px; + line-height: 17px; + @include at-media('tablet') { + font-size: 14px; + line-height: 17px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 30px; + } + &::hover { + text-decoration: underline; + } + @include at-media('desktop') { + text-decoration: none; + &:hover { + text-decoration: underline; + } + &:visited { + color: black; + } + } + } + .full-width-screen-spilt { + display: grid; + // max width of grid-container is 64 + // padding in mobile is 1rem + grid-template-columns: minmax(30.08px, 1fr) minmax(0, auto) minmax(30.08px, 1fr); + grid-template-rows: auto auto; + grid-template-areas: + ". roles ." + "semi semi semi"; + + .roles-content-block { + grid-column: 1/2; + grid-area: roles; + } + + .roles-downloads { + a { + text-decoration: none; + color: black; + &:visited { + color: black; + } + &:hover { + text-decoration: underline; + color: black; + } + } + } + .semi-cta-block { + grid-column: 2/-1; + justify-self: end; + grid-area: semi; + } + @include at-media('tablet') { + grid-template-columns: 67.68px auto 67.68px; + } + @include at-media('desktop') { + grid-template-columns: 127.5px auto 127.5px; + } } } @@ -2104,15 +2301,36 @@ div.toolkit-todo__resources { } } +.roles-downloads a { + font-size: 12px; +} + .semi-cta { border: 1px black solid; // border-radius: 130px 0 0 130px; padding: 50px 25px; - min-height: 172px; + min-height: 108px; + + @include at-media('tablet') { + width: 100%; + } &.radius-left-pill { border-right-style: none; } + + a { + font-size: 12px; + line-height: 17px; + @include at-media('tablet') { + font-size: 14px; + } + @include at-media('desktop') { + font-size: 24px; + line-height: 24px; + + } + } } .footer-contact-links { From 57edae64069300253797af1acaf9903331295ad9 Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:43:38 -0500 Subject: [PATCH 6/7] Adds sections and divs around includes --- pages/our-process.md | 48 ++++++++++++++++++++++++++------------------ 1 file changed, 29 insertions(+), 19 deletions(-) diff --git a/pages/our-process.md b/pages/our-process.md index ea30ed0c5..a5f805489 100644 --- a/pages/our-process.md +++ b/pages/our-process.md @@ -91,27 +91,37 @@ cta-one: --- {% include hero.html %} +
+
{% include single-column-header-text-hot-dog-cta.html data=page.how-it-works %} -{% include how-it-works-details.html data=page.how-it-works %} - -
-
- - Facilitate a TOP sprint at your agency on your timeline with the TOPx Toolkit. -
-{% include single-column-header-text-hot-dog-cta.html data=page.roles-intro %} -{% include single-column-header-text-hot-dog-cta.html data=page.roles-details %} -
-
-
-

Interested in participating in a sprint?

- - Email the TOP team. - -
+ + +{% include how-it-works-details.html data=page.how-it-works utils='how-it-works' %} + + +
+
+ {% include single-column-header-text-hot-dog-cta.html data=page.roles-intro %}
+ +
+ +
+ {% include single-column-header-text-hot-dog-cta.html data=page.roles-details %} +
+
+
+
+

Interested in participating in a sprint?

+ + Email the TOP team. + +
+
+
+
From 835742aab00686a9fdd704a9070c671820fd633e Mon Sep 17 00:00:00 2001 From: Sadie <19538219+sadiejay@users.noreply.github.com> Date: Mon, 26 Aug 2024 12:44:28 -0500 Subject: [PATCH 7/7] Removes extra formatting --- pages/our-process.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/pages/our-process.md b/pages/our-process.md index a5f805489..0e92714d2 100644 --- a/pages/our-process.md +++ b/pages/our-process.md @@ -37,8 +37,7 @@ roles-intro: roles-details: - role: title: Tech Teams - blurb: |- - Tech teams are the companies, universities, non-profits, and students who build digital products in the sprints. They design, develop, and launch the products they build, and own and maintain the products after the sprints. Teams may also develop non-digital products, such as toolkits, policy interventions and more. + blurb: Tech teams are the companies, universities, non-profits, and students who build digital products in the sprints. They design, develop, and launch the products they build, and own and maintain the products after the sprints. Teams may also develop non-digital products, such as toolkits, policy interventions and more. download: href: files/sprint-process-page/tech-team-role-overview.pdf text: Tech Team Overview