appearance property; resolves #16. (#18)

Author: nsaunders

CHANGELOG.md

@@ -8,6 +8,7 @@ Breaking changes:
 
 New features:
 - `:focus-within` pseudo-class nsaunders/purescript-tecton#17
+- `appearance` property nsaunders/purescript-tecton#18
 
 Bugfixes:
 

src/Tecton.purs

@@ -33,6 +33,7 @@ import Tecton.Internal
   , animationName
   , animationPlayState
   , animationTimingFunction
+  , appearance
   , arabicIndic
   , armenian
   , article
@@ -367,6 +368,7 @@ import Tecton.Internal
   , media'
   , medium
   , menu
+  , menulistButton
   , method
   , middle
   , min
@@ -633,6 +635,7 @@ import Tecton.Internal
   , textTop
   , textTransform
   , textarea
+  , textfield
   , tfoot
   , th
   , thai

src/Tecton/Internal.purs

@@ -7,6 +7,7 @@ module Tecton.Internal
   , class AnimationDirectionKeyword
   , class AnimationFillModeKeyword
   , class AnimationPlayStateKeyword
+  , class AppearanceKeyword
   , class Assoc
   , class AttachmentKeyword
   , class Attribute
@@ -235,6 +236,7 @@ module Tecton.Internal
   , animationName
   , animationPlayState
   , animationTimingFunction
+  , appearance
   , arabicIndic
   , armenian
   , article
@@ -590,6 +592,7 @@ module Tecton.Internal
   , media'
   , medium
   , menu
+  , menulistButton
   , method
   , middle
   , min
@@ -865,6 +868,7 @@ module Tecton.Internal
   , textTop
   , textTransform
   , textarea
+  , textfield
   , tfoot
   , th
   , thai
@@ -7069,6 +7073,29 @@ instance declarationOutlineOffset ::
   Declaration "outline-offset" (Measure t) where
   pval = const val
 
+-- https://www.w3.org/TR/css-ui-4/#propdef-appearance
+
+appearance = Proxy :: Proxy "appearance"
+
+instance Property "appearance"
+
+textfield = Proxy :: Proxy "textfield"
+menulistButton = Proxy :: Proxy "menulist-button"
+
+class AppearanceKeyword (s :: Symbol)
+
+instance AppearanceKeyword "none"
+instance AppearanceKeyword "auto"
+instance AppearanceKeyword "textfield"
+instance AppearanceKeyword "menulist-button"
+
+instance declarationAppearance ::
+  ( AppearanceKeyword s
+  , IsSymbol s
+  ) =>
+  Declaration "appearance" (Proxy s) where
+  pval = const val
+
 --------------------------------------------------------------------------------
 
 -- https://www.w3.org/TR/CSS2/visufx.html

test/UISpec.purs

@@ -5,7 +5,7 @@ module Test.UISpec where
 import Prelude
 
 import Color (rgb)
-import Tecton (auto, dashed, dotted, double, groove, inherit, initial, inset, invert, medium, nil, none, outlineColor, outlineOffset, outlineStyle, outlineWidth, outset, px, ridge, solid, thick, thin, transparent, unset, (:=))
+import Tecton (appearance, auto, dashed, dotted, double, groove, inherit, initial, inset, invert, medium, menulistButton, nil, none, outlineColor, outlineOffset, outlineStyle, outlineWidth, outset, px, ridge, solid, textfield, thick, thin, transparent, unset, (:=))
 import Test.Spec (Spec, describe)
 import Test.Util (isRenderedFromInline)
 
@@ -85,3 +85,21 @@ spec = do
       "outline-offset:4px" `isRenderedFrom` (outlineOffset := px 4)
 
       "outline-offset:0" `isRenderedFrom` (outlineOffset := nil)
+
+    describe "appearance property" do
+
+      "appearance:inherit" `isRenderedFrom` (appearance := inherit)
+
+      "appearance:initial" `isRenderedFrom` (appearance := initial)
+
+      "appearance:unset" `isRenderedFrom` (appearance := unset)
+
+      "appearance:none" `isRenderedFrom` (appearance := none)
+
+      "appearance:auto" `isRenderedFrom` (appearance := auto)
+
+      "appearance:textfield" `isRenderedFrom` (appearance := textfield)
+
+      "appearance:menulist-button"
+        `isRenderedFrom`
+        (appearance := menulistButton)