NoRedInk/noredink-ui
1
1
Fork 0
mirror of https://github.com/NoRedInk/noredink-ui.git synced 2024-12-26 07:04:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1 from NoRedInk/add-small-header-to-text

Browse Source 
Add small header to text
This commit is contained in:
Brooke 2018-02-12 12:29:49 -08:00 committed by GitHub
commit fdbdb45fb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 53 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

74
elm-package.json
View File

@ -1,39 +1,39 @@
{ {
"version": "1.0.0", "version": "1.1.0",
"summary": "UI Widgets we use at NRI", "summary": "UI Widgets we use at NRI",
"repository": "https://github.com/NoRedInk/noredink-ui.git", "repository": "https://github.com/NoRedInk/noredink-ui.git",
"license": "BSD3", "license": "BSD3",
"source-directories": [ "source-directories": [
"src" "src"
], ],
"exposed-modules": [ "exposed-modules": [
"Nri.Ui.AssetPath", "Nri.Ui.AssetPath",
"Nri.Ui.Alert.V1", "Nri.Ui.Alert.V1",
"Nri.Ui.BannerAlert.V1", "Nri.Ui.BannerAlert.V1",
"Nri.Ui.Button.V1", "Nri.Ui.Button.V1",
"Nri.Ui.Checkbox.V1", "Nri.Ui.Checkbox.V1",
"Nri.Ui.Divider.V1", "Nri.Ui.Divider.V1",
"Nri.Ui.Effects.V1", "Nri.Ui.Effects.V1",
"Nri.Ui.Modal.V1", "Nri.Ui.Modal.V1",
"Nri.Ui.Outline.V1", "Nri.Ui.Outline.V1",
"Nri.Ui.Palette.V1", "Nri.Ui.Palette.V1",
"Nri.Ui.Styles.V1", "Nri.Ui.Styles.V1",
"Nri.Ui.Tabs.V1", "Nri.Ui.Tabs.V1",
"Nri.Ui.Text.V1", "Nri.Ui.Text.V1",
"Nri.Ui.TextArea.V1", "Nri.Ui.TextArea.V1",
"Nri.Ui.TextInput.V1" "Nri.Ui.TextInput.V1"
], ],
"dependencies": { "dependencies": {
"NoRedInk/nri-elm-css": "5.0.0 <= v <= 5.0.0", "NoRedInk/nri-elm-css": "5.0.0 <= v <= 5.0.0",
"NoRedInk/view-extra": "2.0.0 <= v < 3.0.0", "NoRedInk/view-extra": "2.0.0 <= v < 3.0.0",
"elm-lang/core": "5.1.1 <= v < 6.0.0", "elm-lang/core": "5.1.1 <= v < 6.0.0",
"elm-lang/html": "2.0.0 <= v < 3.0.0", "elm-lang/html": "2.0.0 <= v < 3.0.0",
"pablohirafuji/elm-markdown": "2.0.4 <= v < 3.0.0", "pablohirafuji/elm-markdown": "2.0.4 <= v < 3.0.0",
"rtfeldman/elm-css": "11.2.0 <= v < 12.0.0", "rtfeldman/elm-css": "11.2.0 <= v < 12.0.0",
"rtfeldman/elm-css-helpers": "2.1.0 <= v < 3.0.0", "rtfeldman/elm-css-helpers": "2.1.0 <= v < 3.0.0",
"rtfeldman/elm-css-util": "1.0.2 <= v < 2.0.0", "rtfeldman/elm-css-util": "1.0.2 <= v < 2.0.0",
"tesk9/accessible-html": "3.0.0 <= v < 4.0.0", "tesk9/accessible-html": "3.0.0 <= v < 4.0.0",
"wernerdegroot/listzipper": "3.0.0 <= v < 4.0.0" "wernerdegroot/listzipper": "3.0.0 <= v < 4.0.0"
}, },
"elm-version": "0.18.0 <= v < 0.19.0" "elm-version": "0.18.0 <= v < 0.19.0"
} }

16
src/Nri/Ui/Text/V1.elm
View File

@ -9,6 +9,7 @@ module Nri.Ui.Text.V1
, smallBody , smallBody
, smallBodyClassString , smallBodyClassString
, smallBodyGray , smallBodyGray
, smallHeading
, styles , styles
, subHeading , subHeading
, tagline , tagline
@ -22,6 +23,7 @@ module Nri.Ui.Text.V1
@docs smallBody @docs smallBody
@docs smallBodyGray @docs smallBodyGray
@docs subHeading @docs subHeading
@docs smallHeading
@docs tagline @docs tagline
Text class strings: Text class strings:
@ -67,6 +69,13 @@ subHeading content =
h3 [ class [ SubHeading, Text ] ] content h3 [ class [ SubHeading, Text ] ] content
{-| This is a small Page Heading.
-}
smallHeading : List (Html msg) -> Html msg
smallHeading content =
h4 [ class [ SmallHeading, Text ] ] content
{-| This is some medium body copy. {-| This is some medium body copy.
-} -}
mediumBody : List (Html msg) -> Html msg mediumBody : List (Html msg) -> Html msg
@ -149,6 +158,7 @@ type CssClasses
| Heading | Heading
| Tagline | Tagline
| SubHeading | SubHeading
| SmallHeading
| MediumBody | MediumBody
| SmallBody | SmallBody
| SmallBodyGray | SmallBodyGray
@ -177,6 +187,12 @@ styles =
, fontWeight (int 700) , fontWeight (int 700)
, margin4 (px 20) (px 0) (px 10) (px 0) , margin4 (px 20) (px 0) (px 10) (px 0)
] ]
, Css.class SmallHeading
[ makeFont (px 16) gray20
, lineHeight (px 23)
, fontWeight (int 700)
, margin zero
]
, Css.class MediumBody , Css.class MediumBody
[ makeFont (px 18) gray20 [ makeFont (px 18) gray20
, lineHeight (px 27) , lineHeight (px 27)