diff --git a/styleguide-app/Example.elm b/styleguide-app/Example.elm index c646ac32..6c917ed2 100644 --- a/styleguide-app/Example.elm +++ b/styleguide-app/Example.elm @@ -114,7 +114,14 @@ preview_ navigate example = [ ClickableText.href (exampleHref example) , ClickableText.css [ Css.marginBottom (Css.px 10) ] ] - :: List.map (Html.map never) example.preview + :: [ Html.div + [ Attributes.css + [ Css.displayFlex + , Css.flexDirection Css.column + ] + ] + (List.map (Html.map never) example.preview) + ] ) ] diff --git a/styleguide-app/Examples/Balloon.elm b/styleguide-app/Examples/Balloon.elm index 9616c223..9ba1a24a 100644 --- a/styleguide-app/Examples/Balloon.elm +++ b/styleguide-app/Examples/Balloon.elm @@ -33,7 +33,7 @@ example = [ Balloon.balloon [ Balloon.onTop , Balloon.navy - , Balloon.paddingPx 4 + , Balloon.paddingPx 15 ] (text "This is a balloon.") ] diff --git a/styleguide-app/Examples/Button.elm b/styleguide-app/Examples/Button.elm index 88f2d33a..1dd39854 100644 --- a/styleguide-app/Examples/Button.elm +++ b/styleguide-app/Examples/Button.elm @@ -28,7 +28,21 @@ example = , state = init , update = update , subscriptions = \_ -> Sub.none - , preview = [] + , preview = + [ Button.link "Primary" [ Button.small, Button.fillContainerWidth ] + , Button.link "Secondary" + [ Button.small + , Button.fillContainerWidth + , Button.secondary + , Button.css [ Css.marginTop (Css.px 8) ] + ] + , Button.link "Premium" + [ Button.small + , Button.fillContainerWidth + , Button.premium + , Button.css [ Css.marginTop (Css.px 8) ] + ] + ] , view = \state -> [ viewButtonExamples state ] , categories = [ Buttons ] , keyboardSupport = [] diff --git a/styleguide-app/Examples/IconExamples.elm b/styleguide-app/Examples/IconExamples.elm index 762a00b7..fae857f2 100644 --- a/styleguide-app/Examples/IconExamples.elm +++ b/styleguide-app/Examples/IconExamples.elm @@ -14,12 +14,13 @@ preview icons = [ Html.div [ css [ Css.displayFlex - , Css.justifyContent Css.spaceBetween + , Css.flexWrap Css.wrap + , Css.property "gap" "10px" , Css.color Colors.gray45 ] ] (List.map - (Svg.withWidth (Css.px 18) >> Svg.withHeight (Css.px 18) >> Svg.toHtml) + (Svg.withWidth (Css.px 30) >> Svg.withHeight (Css.px 30) >> Svg.toHtml) icons ) ]