improve docs

This commit is contained in:
Brian Hicks 2019-07-11 17:15:51 -05:00
parent 131a39dfa8
commit 6fef551cb2
2 changed files with 28 additions and 8 deletions

View File

@ -1,7 +1,7 @@
module Nri.Ui.Heading.V1 exposing module Nri.Ui.Heading.V1 exposing
( Heading, heading ( Heading, heading
, VisualLevel(..), withVisualLevel , withVisualLevel, VisualLevel(..)
, DocumentLevel(..), withDocumentLevel , withDocumentLevel, DocumentLevel(..)
, view , view
) )
@ -10,9 +10,9 @@ accessibility.
@docs Heading, heading @docs Heading, heading
@docs VisualLevel, withVisualLevel @docs withVisualLevel, VisualLevel
@docs DocumentLevel, withDocumentLevel @docs withDocumentLevel, DocumentLevel
@docs view @docs view
@ -25,7 +25,7 @@ import Nri.Ui.Colors.V1 exposing (..)
import Nri.Ui.Fonts.V1 as Fonts import Nri.Ui.Fonts.V1 as Fonts
{-| a custom heading {-| start a heading. Render it with `view`.
-} -}
type Heading msg type Heading msg
= Heading (List (Html msg)) VisualLevel DocumentLevel = Heading (List (Html msg)) VisualLevel DocumentLevel
@ -40,8 +40,7 @@ heading content =
-- VISUAL LEVEL -- VISUAL LEVEL
{-| Customize the heading level for visual reasons. {-| -}
-}
type VisualLevel type VisualLevel
= Top = Top
| Tagline | Tagline
@ -49,6 +48,14 @@ type VisualLevel
| Small | Small
{-| Customize how the heading looks. The visual hierarchy should go Top ->
Tagline -> Subhead -> Small.
heading [ text "Hello, World!" ]
|> withVisualLevel Top
|> view
-}
withVisualLevel : VisualLevel -> Heading msg -> Heading msg withVisualLevel : VisualLevel -> Heading msg -> Heading msg
withVisualLevel visualLevel (Heading content _ documentLevel) = withVisualLevel visualLevel (Heading content _ documentLevel) =
Heading content visualLevel documentLevel Heading content visualLevel documentLevel
@ -122,7 +129,14 @@ headingStyles config =
-- DOCUMENT LEVEL -- DOCUMENT LEVEL
{-| Customize the heading level for accessibility reasons. {-| Customize the document level of the heading. For accessibility reasons, you
should have exactly one H1, and only increase the level by one. You can use a
tool like [axe](https://www.deque.com/axe/) to check this.
heading [ text "Hello, World!" ]
|> withDocumentLevel H1
|> view
-} -}
type DocumentLevel type DocumentLevel
= H1 = H1
@ -164,6 +178,9 @@ getTag documentLevel =
-- VIEW -- VIEW
{-| render a Heading to Html. See the other docs in this module for
customizations.
-}
view : Heading msg -> Html msg view : Heading msg -> Html msg
view (Heading content visualLevel documentLevel) = view (Heading content visualLevel documentLevel) =
getTag documentLevel getTag documentLevel

View File

@ -24,6 +24,9 @@ module Nri.Ui.Text.V3 exposing
## Heading styles ## Heading styles
Please use `Nri.Ui.Heading.V1` instead of these in new code. If you're here to
make a new Text version, please remove them.
@docs heading, subHeading, smallHeading, tagline @docs heading, subHeading, smallHeading, tagline