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

Merge remote-tracking branch 'origin/master' into lab/slidimations

Browse Source
This commit is contained in:
Tessa Kelly 2019-04-11 09:57:49 -07:00
commit dbc4d3709e
7 changed files with 55 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
elm.json
View File

@ -3,7 +3,7 @@
"name": "NoRedInk/noredink-ui",
"summary": "UI Widgets we use at NRI",
"license": "BSD-3-Clause",
"version": "6.11.0",
"version": "6.11.1",
"exposed-modules": [
"Nri.Ui.Alert.V2",
"Nri.Ui.Alert.V3",

38
src/Nri/Ui/ClickableText/V2.elm
View File

@ -101,24 +101,38 @@ viewContent config =
sizeToPx config.size
in
span [ Attributes.css [ Css.fontSize fontSize ] ]
[ case config.icon of
(case config.icon of
Just icon ->
div
[ div
[ Attributes.css
[ Css.height fontSize
, Css.maxWidth fontSize
, Css.display Css.inlineBlock
, Css.verticalAlign Css.baseline
, Css.marginRight (Css.px 2)
[ Css.displayFlex
, Css.alignItems Css.center
, Css.property "line-height" "normal"
]
]
[ NriSvg.toHtml icon
[ div
[ Attributes.css
[ Css.height fontSize
, Css.maxWidth fontSize
, case config.size of
Small ->
Css.marginRight (Css.px 2)
Medium ->
Css.marginRight (Css.px 3)
Large ->
Css.marginRight (Css.px 4)
]
]
[ NriSvg.toHtml icon ]
, span [] [ text config.label ]
]
]
Nothing ->
text ""
, text config.label
]
[ text config.label ]
)
clickableTextStyles : List Css.Style
@ -138,6 +152,8 @@ clickableTextStyles =
, Css.textDecoration Css.none
, Css.hover [ Css.textDecoration Css.underline ]
, Css.padding Css.zero
, Css.display Css.inlineBlock
, Css.verticalAlign Css.textBottom
]

6
src/Nri/Ui/SlideModal/V1.elm
View File

@ -104,6 +104,7 @@ viewModal height ( labelledById, panels ) =
"modal-container"
[ Css.width (Css.px 600)
, Css.height height
, Css.minHeight (Css.px 400)
, Css.maxHeight <| Css.calc (Css.vh 100) Css.minus (Css.px 100)
, Css.padding4 (Css.px 35) Css.zero (Css.px 25) Css.zero
, Css.margin2 (Css.px 75) Css.auto
@ -197,6 +198,7 @@ viewIcon svg =
[ css
[ Css.width (Css.px 100)
, Css.height (Css.px 100)
, Css.flexShrink Css.zero
, Css.displayFlex
, Css.alignItems Css.center
, Css.justifyContent Css.center
@ -222,7 +224,8 @@ viewFooter { previous, current, upcoming } =
in
Nri.Ui.styled div
"modal-footer"
[ Css.displayFlex
[ Css.flexShrink Css.zero
, Css.displayFlex
, Css.flexDirection Css.column
, Css.alignItems Css.center
, Css.margin4 (Css.px 20) Css.zero Css.zero Css.zero
@ -273,6 +276,7 @@ dot type_ =
, Css.borderRadius (Css.px 5)
, Css.margin2 Css.zero (Css.px 2)
, Css.display Css.inlineBlock
, Css.verticalAlign Css.middle
, Css.cursor cursor
, Css.backgroundColor backgroundColor

6
src/Nri/Ui/SlideModal/V2.elm
View File

@ -164,6 +164,7 @@ panelContainer height direction panel =
[ css
[ -- Layout
Css.height height
, Css.minHeight (Css.px 400)
, Css.width (Css.px 600)
, Css.minHeight (Css.px 360)
, Css.maxHeight <| Css.calc (Css.vh 100) Css.minus (Css.px 100)
@ -361,6 +362,7 @@ viewIcon svg =
[ css
[ Css.width (Css.px 100)
, Css.height (Css.px 100)
, Css.flexShrink Css.zero
, Css.displayFlex
, Css.alignItems Css.center
, Css.justifyContent Css.center
@ -386,7 +388,8 @@ viewFooter { previous, current, upcoming } =
in
Nri.Ui.styled div
"modal-footer"
[ Css.displayFlex
[ Css.flexShrink Css.zero
, Css.displayFlex
, Css.flexDirection Css.column
, Css.alignItems Css.center
, Css.margin4 (Css.px 20) Css.zero Css.zero Css.zero
@ -437,6 +440,7 @@ dot type_ =
, Css.borderRadius (Css.px 5)
, Css.margin2 Css.zero (Css.px 2)
, Css.display Css.inlineBlock
, Css.verticalAlign Css.middle
, Css.cursor cursor
, Css.backgroundColor backgroundColor

10
styleguide-app/Assets.elm
View File

@ -15,8 +15,8 @@ type alias Assets =
, checkboxCheckedPartially_svg : Asset
, checkboxLockOnInside_svg : Asset
, checkboxUnchecked_svg : Asset
, checkWhite_svg : Asset
, checkmark : String
, checkWhite_svg : Asset
, class : String
, clever : String
, clock : String
@ -36,6 +36,7 @@ type alias Assets =
, footsteps : String
, gear : String
, guidedDraft : String
, help : String
, hint_png : Asset
, iconCalendar_svg : Asset
, iconCheck_png : Asset
@ -89,8 +90,8 @@ type alias Assets =
, startingOffBadge_png : Asset
, submitting : String
, teach_assignments_copyWhite_svg : Asset
, twitterBlue_svg : Asset
, tip_svg : Asset
, twitterBlue_svg : Asset
, unarchiveBlue2x_png : Asset
, writingAssignment : String
, writingcycle : String
@ -103,11 +104,11 @@ assets : Assets
assets =
{ activity = "icon-activity"
, arrowDown = "icon-arrow-down"
, assignmentStartButtonPrimary_svg = Asset "assets/images/assignment-start-button-primary.svg"
, assignmentStartButtonSecondary_svg = Asset "assets/images/assignment-start-button-secondary.svg"
, attention_svg = Asset "assets/images/attention.svg"
, bulb = "icon-bulb"
, calendar = "icon-calendar"
, assignmentStartButtonPrimary_svg = Asset "assets/images/assignment-start-button-primary.svg"
, assignmentStartButtonSecondary_svg = Asset "assets/images/assignment-start-button-secondary.svg"
, checkboxChecked_svg = Asset "assets/images/checkbox_checked.svg"
, checkboxCheckedPartially_svg = Asset "assets/images/checkbox_checkedPartially.svg"
, checkboxLockOnInside_svg = Asset "assets/images/checkbox_lock_on_inside.svg"
@ -133,6 +134,7 @@ assets =
, footsteps = "icon-footsteps"
, gear = "icon-gear"
, guidedDraft = "icon-guided-draft"
, help = "icon-help"
, hint_png = Asset "assets/images/hint.png"
, iconCalendar_svg = Asset "assets/images/icon-calendar.svg"
, iconCheck_png = Asset "assets/images/icon-check.png"

14
styleguide-app/Examples/ClickableText.elm
View File

@ -46,20 +46,26 @@ example unnamedMessages state =
{-| -}
init : { r | performance : String, lock : String } -> State
init : { r | performance : String, lock : String, help : String } -> State
init assets =
Control.record Model
|> Control.field "label" (Control.string "Clickable Text")
|> Control.field "icon"
(Control.maybe True <|
Control.choice
( "Performance"
, Icon.performance assets
( "Help"
, Icon.helpSvg assets
|> Icon.decorativeIcon
|> NriSvg.fromHtml
|> Control.value
)
[ ( "Lock"
[ ( "Performance"
, Icon.performance assets
|> Icon.decorativeIcon
|> NriSvg.fromHtml
|> Control.value
)
, ( "Lock"
, Icon.lock assets
|> Icon.decorativeIcon
|> NriSvg.fromHtml

2
styleguide-app/assets/generated_svgs.js
View File

File diff suppressed because one or more lines are too long