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

Merge branch 'master' into fix-text-line-height

Browse Source
This commit is contained in:
Aaron VonderHaar 2019-07-01 16:04:06 -07:00 committed by GitHub
commit ba61f82a37
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 34 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/Nri/Ui/SegmentedControl/V7.elm
View File

@ -205,6 +205,12 @@ sharedTabStyles =
, cursor pointer
, property "transition" "background-color 0.2s, color 0.2s, box-shadow 0.2s, border 0.2s, border-width 0s"
, textDecoration none
, hover
[ textDecoration none
]
, focus
[ textDecoration none
]
]
@ -221,7 +227,9 @@ unFocusedTabStyles =
[ backgroundColor Colors.white
, boxShadow5 inset zero (px -2) zero Colors.azure
, color Colors.azure
, hover [ backgroundColor Colors.glacier ]
, hover
[ backgroundColor Colors.frost
]
]

42
src/Nri/Ui/Tabs/V4.elm
View File

@ -32,7 +32,7 @@ import Accessibility.Aria
import Accessibility.Key
import Accessibility.Role
import Accessibility.Widget
import Css exposing (Style)
import Css exposing (..)
import EventExtras
import Html.Styled as Html exposing (Attribute, Html)
import Html.Styled.Attributes as Attributes
@ -40,7 +40,7 @@ import Html.Styled.Events as Events
import Json.Decode
import List.Zipper exposing (Zipper(..))
import Nri.Ui.Colors.Extra
import Nri.Ui.Colors.V1
import Nri.Ui.Colors.V1 as Colors
import Nri.Ui.Fonts.V1
@ -99,7 +99,7 @@ viewCustom config viewInnerTab =
, Css.alignItems Css.flexEnd
, Css.borderBottom (Css.px 1)
, Css.borderBottomStyle Css.solid
, Css.borderBottomColor Nri.Ui.Colors.V1.navy
, Css.borderBottomColor Colors.navy
, Nri.Ui.Fonts.V1.baseFont
]
[]
@ -131,7 +131,7 @@ viewTitle title =
, Css.margin Css.zero
, Css.marginTop (Css.px 5)
, Css.marginBottom (Css.px 10)
, Css.color Nri.Ui.Colors.V1.navy
, Css.color Colors.navy
, Css.width (Css.px 430)
]
[]
@ -175,9 +175,7 @@ viewTab { onSelect, tabs } viewInnerTab selected tab =
Events.keyCode
]
[ Html.styled Html.div
[ Css.color Nri.Ui.Colors.V1.navy
, Css.hover [ Css.textDecoration Css.none ]
, Css.focus [ Css.textDecoration Css.none ]
[ Css.color Colors.navy
, Css.display Css.inlineBlock
, Css.padding4 (Css.px 14) (Css.px 20) (Css.px 12) (Css.px 20)
, Css.position Css.relative
@ -233,7 +231,7 @@ links config =
, Css.alignItems Css.flexEnd
, Css.borderBottom (Css.px 1)
, Css.borderBottomStyle Css.solid
, Css.borderBottomColor Nri.Ui.Colors.V1.navy
, Css.borderBottomColor Colors.navy
, Nri.Ui.Fonts.V1.baseFont
]
[]
@ -281,17 +279,23 @@ viewTabLink config isSelected tabConfig =
[ case tabHref of
Just href ->
Html.styled Html.a
[ Css.color Nri.Ui.Colors.V1.navy
[ Css.color Colors.navy
, Css.display Css.inlineBlock
, Css.padding4 (Css.px 14) (Css.px 20) (Css.px 12) (Css.px 20)
, Css.textDecoration Css.none
, hover
[ textDecoration none
]
, focus
[ textDecoration none
]
]
([ Attributes.href href ] ++ preventDefault ++ currentPage)
[ Html.text tabLabel ]
Nothing ->
Html.styled Html.button
[ Css.color Nri.Ui.Colors.V1.navy
[ Css.color Colors.navy
, Css.display Css.inlineBlock
, Css.padding4 (Css.px 14) (Css.px 20) (Css.px 12) (Css.px 20)
, Css.textDecoration Css.none
@ -365,19 +369,19 @@ stylesTabSelectable isSelected =
let
stylesDynamic =
if isSelected then
[ Css.backgroundColor Nri.Ui.Colors.V1.white
[ Css.backgroundColor Colors.white
, Css.borderBottom (Css.px 1)
, Css.borderBottomStyle Css.solid
, Css.borderBottomColor Nri.Ui.Colors.V1.white
, Css.borderBottomColor Colors.white
]
else
[ Css.backgroundColor Nri.Ui.Colors.V1.frost
[ Css.backgroundColor Colors.frost
, Css.backgroundImage <|
Css.linearGradient2 Css.toTop
(Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0.25 Nri.Ui.Colors.V1.azure) (Css.pct 0))
(Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0 Nri.Ui.Colors.V1.azure) (Css.pct 25))
[ Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0 Nri.Ui.Colors.V1.azure) (Css.pct 100) ]
(Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0.25 Colors.azure) (Css.pct 0))
(Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0 Colors.azure) (Css.pct 25))
[ Css.stop2 (Nri.Ui.Colors.Extra.withAlpha 0 Colors.azure) (Css.pct 100) ]
]
in
stylesTab ++ stylesDynamic
@ -388,11 +392,15 @@ stylesTab =
[ Css.display Css.inlineBlock
, Css.borderTopLeftRadius (Css.px 10)
, Css.borderTopRightRadius (Css.px 10)
, Css.border3 (Css.px 1) Css.solid Nri.Ui.Colors.V1.navy
, Css.border3 (Css.px 1) Css.solid Colors.navy
, Css.marginBottom (Css.px -1)
, Css.marginLeft (Css.px 10)
, Css.cursor Css.pointer
, Css.firstChild
[ Css.marginLeft Css.zero
]
, property "transition" "background-color 0.2s"
, hover
[ backgroundColor Colors.white
]
]