NoRedInk/noredink-ui
1
1
Fork 0
mirror of https://github.com/NoRedInk/noredink-ui.git synced 2024-11-27 13:02:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

🎨 organize the select styles

Browse Source
This commit is contained in:
Tessa Kelly 2020-01-16 12:41:34 -08:00
parent b6d5b413cf
commit ab8df6e560
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/Nri/Ui/Select/V7.elm
View File

@ -77,16 +77,25 @@ view config =
|> (++) defaultOption
|> Nri.Ui.styled Html.select
"nri-select-menu"
[ Css.backgroundColor Colors.white
, Css.border3 (Css.px 1) Css.solid Colors.gray75
[ -- border
Css.border3 (Css.px 1) Css.solid Colors.gray75
, Css.borderBottomWidth (Css.px 4)
, Css.borderRadius (Css.px 8)
-- Font and color
, Css.color Colors.gray20
, Css.cursor Css.pointer
, Fonts.baseFont
, Css.fontSize (Css.px 15)
-- Interaction
, Css.cursor Css.pointer
-- Size and spacing
, Css.height (Css.px 45)
, Css.width (Css.pct 100)
, Css.paddingLeft (Css.px 20)
-- Icons
, selectArrowsCss
]
[ onSelectHandler
@ -130,6 +139,7 @@ selectArrowsCss =
[ """<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="12px" height="16px" viewBox="0 0 12 16"><g fill="currentcolor"><path d="M2.10847,9.341803 C1.65347,8.886103 0.91427,8.886103 0.45857,9.341803 C0.23107,9.570003 0.11697,9.868203 0.11697,10.167103 C0.11697,10.465303 0.23107,10.763503 0.45857,10.991703 L5.12547,15.657903 C5.57977,16.114303 6.31897,16.114303 6.77537,15.657903 L11.44157,10.991703 C11.89727,10.536003 11.89727,9.797503 11.44157,9.341803 C10.98657,8.886103 10.24667,8.886103 9.79167,9.341803 L5.95007,13.182703 L2.10847,9.341803 Z"/><path d="M1.991556,6.658179 C1.536659,7.11394 0.797279,7.11394 0.3416911,6.658179 C0.1140698,6.43004 0,6.13173 0,5.83325 C0,5.53476 0.1140698,5.23645 0.3416911,5.00831 L5.008185,0.34182 C5.463081,-0.11394 6.202461,-0.11394 6.65805,0.34182 L11.32454,5.00831 C11.78031,5.4639 11.78031,6.202592 11.32454,6.658179 C10.86965,7.11394 10.13027,7.11394 9.674679,6.658179 L5.833118,2.81679 L1.991556,6.658179 Z"/></g></svg> """
|> urlUtf8
|> Css.property "background"
, Css.backgroundColor Colors.white
-- "appearance: none" removes the default dropdown arrows
, VendorPrefixed.property "appearance" "none"