From aee387cc5ef8204791a79ef7b97fe555714eb716 Mon Sep 17 00:00:00 2001 From: Tessa Kelly Date: Thu, 14 Apr 2022 13:38:33 -0700 Subject: [PATCH] Add the subhead styles back --- styleguide-app/Debug/Control/View.elm | 3 ++- styleguide-app/Examples/Checkbox.elm | 4 ++-- styleguide-app/Examples/Colors.elm | 4 ++-- styleguide-app/Examples/Fonts.elm | 6 +++--- styleguide-app/Examples/Page.elm | 2 +- styleguide-app/Examples/SortableTable.elm | 4 ++-- styleguide-app/Examples/Switch.elm | 6 +++--- styleguide-app/Examples/Table.elm | 10 +++++----- styleguide-app/Examples/Tooltip.elm | 2 +- 9 files changed, 21 insertions(+), 20 deletions(-) diff --git a/styleguide-app/Debug/Control/View.elm b/styleguide-app/Debug/Control/View.elm index b4cf93d7..211d7bec 100644 --- a/styleguide-app/Debug/Control/View.elm +++ b/styleguide-app/Debug/Control/View.elm @@ -61,6 +61,7 @@ viewExampleCode ellieLink component values = [ summary [] [ Heading.h3 [ Heading.css [ Css.display Css.inline ] + , Heading.style Heading.Small ] [ text example.sectionName ] ] @@ -87,7 +88,7 @@ viewExampleCode ellieLink component values = viewSection : String -> List (Html msg) -> Html msg viewSection name children = section [ css [ flex (int 1) ] ] - (Heading.h2 [] [ text name ] + (Heading.h2 [ Heading.style Heading.Subhead ] [ text name ] :: children ) diff --git a/styleguide-app/Examples/Checkbox.elm b/styleguide-app/Examples/Checkbox.elm index ac3ca4c4..2857ca02 100644 --- a/styleguide-app/Examples/Checkbox.elm +++ b/styleguide-app/Examples/Checkbox.elm @@ -47,7 +47,7 @@ example = , viewLockedOnInsideCheckbox "styleguide-locked-on-inside-checkbox" state , viewDisabledCheckbox "styleguide-checkbox-disabled" state , viewMultilineCheckboxes state - , Heading.h2 [] [ text "Premium Checkboxes" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ text "Premium Checkboxes" ] , viewPremiumCheckboxes state ] , categories = [ Inputs ] @@ -141,7 +141,7 @@ viewMultilineCheckboxes : State -> Html Msg viewMultilineCheckboxes state = Html.section [ css [ Css.width (Css.px 500) ] ] - [ Heading.h2 [] [ Html.text "Multiline Text in Checkboxes" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Multiline Text in Checkboxes" ] , let id = "styleguide-checkbox-multiline" diff --git a/styleguide-app/Examples/Colors.elm b/styleguide-app/Examples/Colors.elm index de37e606..206fb65a 100644 --- a/styleguide-app/Examples/Colors.elm +++ b/styleguide-app/Examples/Colors.elm @@ -91,7 +91,7 @@ example = , ( "sunshine", Colors.sunshine, "Yellow highlights, tips" ) ] |> viewColors - , Heading.h2 [] [ Html.text "Background Highlight Colors" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Background Highlight Colors" ] , Text.mediumBody [ Text.plaintext "Background highlights should be used as the default highlight style because they are more noticeable and readable. The dark colors should be used in the case where headings need to harmonize with highlighted containers, such as in Guided Drafts." ] , [ ( "highlightYellow", Colors.highlightYellow, "Yellow background highlights" ) , ( "highlightYellowDark", Colors.highlightYellowDark, "Dark yellow background highlights" ) @@ -109,7 +109,7 @@ example = , ( "highlightBrownDark", Colors.highlightBrownDark, "Dark brown background highlights" ) ] |> viewColors - , Heading.h2 [] [ Html.text "Text Highlight Colors" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Text Highlight Colors" ] , Text.mediumBody [ Text.plaintext "Colors for highlighting text on a white background. These colors are readable at 14px bold and bigger." ] , [ ( "textHighlightYellow", Colors.textHighlightYellow, "Neutral text highlight #1" ) , ( "textHighlightCyan", Colors.textHighlightCyan, "Neutral text highlight #2" ) diff --git a/styleguide-app/Examples/Fonts.elm b/styleguide-app/Examples/Fonts.elm index 045143e1..b78248ee 100644 --- a/styleguide-app/Examples/Fonts.elm +++ b/styleguide-app/Examples/Fonts.elm @@ -43,13 +43,13 @@ example = |> List.map viewPreview , view = \ellieLinkConfig _ -> - [ Heading.h2 [] [ Html.text "baseFont" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "baseFont" ] , Html.p [ css [ Fonts.baseFont ] ] [ Html.text "AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz" ] - , Heading.h2 [] [ Html.text "quizFont" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "quizFont" ] , Html.p [ css [ Fonts.quizFont ] ] [ Html.text "AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz" ] - , Heading.h2 [] [ Html.text "ugFont" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "ugFont" ] , Html.p [ css [ Fonts.ugFont ] ] [ Html.text "AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz" ] ] diff --git a/styleguide-app/Examples/Page.elm b/styleguide-app/Examples/Page.elm index 86f9cb73..fb0c1ab8 100644 --- a/styleguide-app/Examples/Page.elm +++ b/styleguide-app/Examples/Page.elm @@ -117,7 +117,7 @@ viewExample viewName view recoveryText extras = , Css.marginBottom (Css.px 20) ] ] - [ Heading.h2 [] [ Html.text viewName ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text viewName ] , Html.div [] extras , Html.code [] [ Html.text <| diff --git a/styleguide-app/Examples/SortableTable.elm b/styleguide-app/Examples/SortableTable.elm index a1a2e7e0..d38c05ea 100644 --- a/styleguide-app/Examples/SortableTable.elm +++ b/styleguide-app/Examples/SortableTable.elm @@ -137,9 +137,9 @@ example = , { firstName = "First5", lastName = "Last5", coins = 5 } ] in - [ Heading.h2 [] [ Html.text "With sortable headers" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "With sortable headers" ] , SortableTable.view config sortState data - , Heading.h2 [] [ Html.text "Loading" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Loading" ] , SortableTable.viewLoading config sortState ] } diff --git a/styleguide-app/Examples/Switch.elm b/styleguide-app/Examples/Switch.elm index 59a2ef22..9e870fb7 100644 --- a/styleguide-app/Examples/Switch.elm +++ b/styleguide-app/Examples/Switch.elm @@ -45,7 +45,7 @@ example = ] , view = \ellieLinkConfig interactiveIsOn -> - [ Heading.h2 [] [ Html.text "Interactive" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Interactive" ] , Switch.view [ Switch.onSwitch Switch , Switch.id "switch-interactive" @@ -58,14 +58,14 @@ example = ) ] interactiveIsOn - , Heading.h2 [] [ Html.text "Disabled (On)" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Disabled (On)" ] , Switch.view [ Switch.disabled , Switch.id "switch-disabled-on" , Switch.label (Html.text "Permanently on") ] True - , Heading.h2 [] [ Html.text "Disabled (Off)" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Disabled (Off)" ] , Switch.view [ Switch.disabled , Switch.id "switch-disabled-off" diff --git a/styleguide-app/Examples/Table.elm b/styleguide-app/Examples/Table.elm index 95e10f78..a2f6bae1 100644 --- a/styleguide-app/Examples/Table.elm +++ b/styleguide-app/Examples/Table.elm @@ -106,15 +106,15 @@ example = , { firstName = "First5", lastName = "Last5", submitted = 8 } ] in - [ Heading.h2 [] [ Html.text "With header" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "With header" ] , Table.view columns data - , Heading.h2 [] [ Html.text "Without header" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Without header" ] , Table.viewWithoutHeader columns data - , Heading.h2 [] [ Html.text "With additional cell styles" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "With additional cell styles" ] , Table.view columns data - , Heading.h2 [] [ Html.text "Loading" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Loading" ] , Table.viewLoading columns - , Heading.h2 [] [ Html.text "Loading without header" ] + , Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Loading without header" ] , Table.viewLoadingWithoutHeader columns ] } diff --git a/styleguide-app/Examples/Tooltip.elm b/styleguide-app/Examples/Tooltip.elm index 9d3b45cd..74e6d9f7 100644 --- a/styleguide-app/Examples/Tooltip.elm +++ b/styleguide-app/Examples/Tooltip.elm @@ -114,7 +114,7 @@ update msg model = view : EllieLink.Config -> State -> List (Html Msg) view ellieLinkConfig model = - [ Heading.h2 [] [ Html.text "Using the Tooltip module" ] + [ Heading.h2 [ Heading.style Heading.Subhead ] [ Html.text "Using the Tooltip module" ] , Text.mediumBody [ Text.html [ Html.text "Label the Tooltip as either being the "