Add outline CSS property

src/CSS.purs

@@ -2,7 +2,7 @@ module CSS (module X) where
 
 import CSS.Animation (AnimationDirection(..), AnimationName(..), FillMode(..), IterationCount(..), alternate, alternateReverse, animation, backwards, forwards, infinite, iterationCount, normalAnimationDirection, reverse) as X
 import CSS.Background (class Background, class Loc, BackgroundAttachment, BackgroundClip, BackgroundImage, BackgroundOrigin, BackgroundPosition, BackgroundRepeat, BackgroundSize, Direction, Location, Side, angular, attachFixed, attachScroll, background, backgroundAttachment, backgroundAttachments, backgroundClip, backgroundClips, backgroundColor, backgroundImage, backgroundImages, backgroundOrigin, backgroundOrigins, backgroundPosition, backgroundPositions, backgroundRepeat, backgroundRepeats, backgroundSize, backgroundSizes, boxClip, by, contain, cover, location, noRepeat, origin, placed, positioned, repeat, repeatX, repeatY, round, sideBottom, sideCenter, sideLeft, sideMiddle, sideRight, sideTop, space, straight, url, xyRepeat) as X
-import CSS.Border (Stroke(..), border, borderBottom, borderColor, borderLeft, borderRadius, borderRight, borderTop, dashed, dotted, double, groove, inset, outset, ridge, solid, wavy) as X
+import CSS.Border (Stroke(..), outline, border, borderBottom, borderColor, borderLeft, borderRadius, borderRight, borderTop, dashed, dotted, double, groove, inset, outset, ridge, solid, wavy) as X
 import CSS.Box (BoxType, borderBox, boxShadow, boxSizing, contentBox, insetBoxShadow, paddingBox) as X
 import CSS.Color (Color, ColorSpace(..), aliceblue, antiquewhite, aqua, aquamarine, azure, beige, bisque, black, blanchedalmond, blue, blueviolet, brightness, brown, burlywood, cadetblue, chartreuse, chocolate, complementary, contrast, coral, cornflowerblue, cornsilk, crimson, cssStringHSLA, cssStringRGBA, cyan, darkblue, darkcyan, darken, darkgoldenrod, darkgray, darkgreen, darkgrey, darkkhaki, darkmagenta, darkolivegreen, darkorange, darkorchid, darkred, darksalmon, darkseagreen, darkslateblue, darkslategray, darkslategrey, darkturquoise, darkviolet, deeppink, deepskyblue, desaturate, dimgray, dimgrey, distance, dodgerblue, firebrick, floralwhite, forestgreen, fromHexString, fromInt, fuchsia, gainsboro, ghostwhite, gold, goldenrod, gray, graytone, green, greenyellow, grey, honeydew, hotpink, hsl, hsla, indianred, indigo, isLight, isReadable, ivory, khaki, lab, lavender, lavenderblush, lawngreen, lch, lemonchiffon, lightblue, lightcoral, lightcyan, lighten, lightgoldenrodyellow, lightgray, lightgreen, lightgrey, lightpink, lightsalmon, lightseagreen, lightskyblue, lightslategray, lightslategrey, lightsteelblue, lightyellow, lime, limegreen, linen, luminance, magenta, maroon, mediumaquamarine, mediumblue, mediumorchid, mediumpurple, mediumseagreen, mediumslateblue, mediumspringgreen, mediumturquoise, mediumvioletred, midnightblue, mintcream, mistyrose, mix, moccasin, navajowhite, navy, oldlace, olive, olivedrab, orange, orangered, orchid, palegoldenrod, palegreen, paleturquoise, palevioletred, papayawhip, peachpuff, peru, pink, plum, powderblue, purple, red, rgb, rgb', rgba, rgba', rosybrown, rotateHue, royalblue, saddlebrown, salmon, sandybrown, saturate, seagreen, seashell, sienna, silver, skyblue, slateblue, slategray, slategrey, snow, springgreen, steelblue, tan, teal, textColor, thistle, toGray, toHSLA, toHexString, toLCh, toLab, toRGBA, toRGBA', toXYZ, tomato, turquoise, violet, wheat, white, whitesmoke, xyz, yellow, yellowgreen) as X
 import CSS.Display (ClearFloat(..), Display(..), Float(..), Position(..), absolute, block, clear, clearBoth, clearInlineEnd, clearInlineStart, clearLeft, clearRight, display, displayInherit, displayNone, fixed, flex, float, floatLeft, floatRight, grid, inline, inlineBlock, inlineFlex, inlineGrid, inlineTable, listItem, position, relative, runIn, static, table, tableCaption, tableCell, tableColumn, tableColumnGroup, tableFooterGroup, tableHeaderGroup, tableRow, tableRowGroup, zIndex) as X

src/CSS/Border.purs

@@ -65,3 +65,6 @@ borderColor = key $ fromString "border-color"
 
 borderRadius :: forall a. Size a -> Size a -> Size a -> Size a -> CSS
 borderRadius a b c d = key (fromString "border-radius") (tuple4 a b c d)
+
+outline :: Stroke -> Size Abs -> Color -> CSS
+outline a b c = key (fromString "outline") $ tuple3 a b c

test/Main.purs

@@ -4,7 +4,7 @@ import Prelude
 
 import Effect (Effect)
 import Effect.Exception (error, throwException)
-import CSS (Rendered, Path(..), Predicate(..), Refinement(..), Selector(..), FontFaceSrc(..), FontFaceFormat(..), renderedSheet, renderedInline, fromString, selector, block, display, render, borderBox, boxSizing, contentBox, blue, color, body, px, dashed, border, inlineBlock, red, (?), fontFaceSrc, zIndex)
+import CSS (Rendered, Path(..), Predicate(..), Refinement(..), Selector(..), FontFaceSrc(..), FontFaceFormat(..), renderedSheet, renderedInline, fromString, selector, block, display, render, borderBox, boxSizing, contentBox, blue, violet, color, body, px, dashed, solid, border, outline, inlineBlock, red, (?), fontFaceSrc, zIndex)
 import Data.Maybe (Maybe(..))
 import Data.NonEmpty (singleton)
 
@@ -17,10 +17,14 @@ example2 :: Rendered
 example2 = render do
   display inlineBlock
 
-example3 :: Rendered
-example3 = render do
+example3a :: Rendered
+example3a = render do
   border dashed (px 2.0) blue
 
+example3b :: Rendered
+example3b = render do
+  outline solid (px 1.0) violet
+
 example4 :: Rendered
 example4 = render do
   body ? do
@@ -59,7 +63,8 @@ main :: Effect Unit
 main = do
   renderedInline example1 `assertEqual` Just "color: hsl(0.0, 100.0%, 50.0%); display: block"
   renderedInline example2 `assertEqual` Just "display: inline-block"
-  renderedInline example3 `assertEqual` Just "border: dashed 2.0px hsl(240.0, 100.0%, 50.0%) "
+  renderedInline example3a `assertEqual` Just "border: dashed 2.0px hsl(240.0, 100.0%, 50.0%) "
+  renderedInline example3b `assertEqual` Just "outline: solid 1.0px hsl(300.0, 76.06%, 72.16%) "
 
   selector (Selector (Refinement [Id "test"]) Star) `assertEqual` "#test"