From 2428170a5257c1dc36e5393ece3447c1db12319b Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Thu, 26 Apr 2018 10:24:37 +0700 Subject: [PATCH 01/11] Border radius properties have been created --- src/Css.elm | 628 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 628 insertions(+) diff --git a/src/Css.elm b/src/Css.elm index 50292d27..7bf0a515 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6448,6 +6448,634 @@ outset = +{- BORDER RADIUS -} + + +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) + +-} +borderRadius : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderRadius (Value radius) = + AppendProperty ("border-radius:" ++ radius) + + +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) + +-} +borderRadius2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = + AppendProperty ("border-radius:" ++ radiusTopLeftAndBottomRight ++ " " ++ radiusTopRightAndBottomLeft) + + +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) + +-} +borderRadius3 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = + AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRightAndBottomLeft ++ " " ++ radiusBottomRight) + + +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) + +-} +borderRadius4 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = + AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) + + +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. + + borderTopLeftRadius (em 4) + borderTopLeftRadius2 (em 4) (px 2) + +-} +borderTopLeftRadius : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderTopLeftRadius (Value radius) = + AppendProperty ("border-top-left-radius:" ++ radius) + + +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. + + borderTopLeftRadius (em 4) + borderTopLeftRadius2 (em 4) (px 2) + +-} +borderTopLeftRadius2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderTopLeftRadius2 (Value horizontal) (Value vertical) = + AppendProperty ("border-top-left-radius:" ++ horizontal ++ " " ++ vertical) + + +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. + + borderTopRightRadius (em 4) + borderTopRightRadius2 (em 4) (px 2) + +-} +borderTopRightRadius : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderTopRightRadius (Value radius) = + AppendProperty ("border-top-right-radius:" ++ radius) + + +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. + + borderTopRightRadius (em 4) + borderTopRightRadius2 (em 4) (px 2) + +-} +borderTopRightRadius2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderTopRightRadius2 (Value horizontal) (Value vertical) = + AppendProperty ("border-top-right-radius:" ++ horizontal ++ " " ++ vertical) + + +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. + + borderBottomRightRadius (em 4) + borderBottomRightRadius2 (em 4) (px 2) + +-} +borderBottomRightRadius : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderBottomRightRadius (Value radius) = + AppendProperty ("border-bottom-right-radius:" ++ radius) + + +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. + + borderBottomRightRadius (em 4) + borderBottomRightRadius2 (em 4) (px 2) + +-} +borderBottomRightRadius2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderBottomRightRadius2 (Value horizontal) (Value vertical) = + AppendProperty ("border-bottom-right-radius:" ++ horizontal ++ " " ++ vertical) + + +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. + + borderBottomLeftRadius (em 4) + borderBottomLeftRadius2 (em 4) (px 2) + +-} +borderBottomLeftRadius : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderBottomLeftRadius (Value radius) = + AppendProperty ("border-bottom-left-radius:" ++ radius) + + +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. + + borderBottomLeftRadius (em 4) + borderBottomLeftRadius2 (em 4) (px 2) + +-} +borderBottomLeftRadius2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , inherit : Supported + , initial : Supported + , unset : Supported + } + -> Style +borderBottomLeftRadius2 (Value horizontal) (Value vertical) = + AppendProperty ("border-bottom-left-radius:" ++ horizontal ++ " " ++ vertical) + + + -- TEXT ORIENTATION -- From 6f54d906b1f048ba05bea341149b0be3131fd14e Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Thu, 26 Apr 2018 10:26:31 +0700 Subject: [PATCH 02/11] Border radius properties have been exposed --- src/Css.elm | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/src/Css.elm b/src/Css.elm index 7bf0a515..10d76d56 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -48,6 +48,10 @@ module Css , borderBottom2 , borderBottom3 , borderBottomColor + , borderBottomLeftRadius + , borderBottomLeftRadius2 + , borderBottomRightRadius + , borderBottomRightRadius2 , borderBottomStyle , borderBottomWidth , borderBox @@ -62,6 +66,10 @@ module Css , borderLeftColor , borderLeftStyle , borderLeftWidth + , borderRadius + , borderRadius2 + , borderRadius3 + , borderRadius4 , borderRight , borderRight2 , borderRight3 @@ -78,6 +86,10 @@ module Css , borderTop2 , borderTop3 , borderTopColor + , borderTopLeftRadius + , borderTopLeftRadius2 + , borderTopRightRadius + , borderTopRightRadius2 , borderTopStyle , borderTopWidth , borderWidth @@ -452,6 +464,11 @@ All CSS properties can have the values `unset`, `initial`, and `inherit`. @docs borderColor, borderColor2, borderColor3, borderColor4, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor +## Border Radius + +@docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 + + ## Display @docs display, displayFlex From 8ca626b90c1114566730d978fc33d06f824fa9c8 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Thu, 26 Apr 2018 10:40:38 +0700 Subject: [PATCH 03/11] Note about elipse shape has been added to each borderRadius* doc --- src/Css.elm | 48 ++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 44 insertions(+), 4 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index 10d76d56..73854c90 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6468,13 +6468,23 @@ outset = {- BORDER RADIUS -} -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. borderRadius (em 4) borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) +**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, +so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` +you should create a batch of `Style`: + + [ borderTopLeftRadius (px 4) (px 2) + , borderTopRightRadius (px 3) (px 4) + , borderBottomRightRadius (px 6) (px 2) + , borderBottomLeftRadius (px 3) (px 4) + ] + -} borderRadius : Value @@ -6503,13 +6513,23 @@ borderRadius (Value radius) = AppendProperty ("border-radius:" ++ radius) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. borderRadius (em 4) borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) +**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, +so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` +you should create a batch of `Style`: + + [ borderTopLeftRadius (px 4) (px 2) + , borderTopRightRadius (px 3) (px 4) + , borderBottomRightRadius (px 6) (px 2) + , borderBottomLeftRadius (px 3) (px 4) + ] + -} borderRadius2 : Value @@ -6560,13 +6580,23 @@ borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottom AppendProperty ("border-radius:" ++ radiusTopLeftAndBottomRight ++ " " ++ radiusTopRightAndBottomLeft) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. borderRadius (em 4) borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) +**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, +so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` +you should create a batch of `Style`: + + [ borderTopLeftRadius (px 4) (px 2) + , borderTopRightRadius (px 3) (px 4) + , borderBottomRightRadius (px 6) (px 2) + , borderBottomLeftRadius (px 3) (px 4) + ] + -} borderRadius3 : Value @@ -6639,13 +6669,23 @@ borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value r AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRightAndBottomLeft ++ " " ++ radiusBottomRight) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. borderRadius (em 4) borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) +**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, +so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` +you should create a batch of `Style`: + + [ borderTopLeftRadius (px 4) (px 2) + , borderTopRightRadius (px 3) (px 4) + , borderBottomRightRadius (px 6) (px 2) + , borderBottomLeftRadius (px 3) (px 4) + ] + -} borderRadius4 : Value From ad9e90a4e962374fa77bd6ed05cd542ec7d1e425 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Thu, 26 Apr 2018 10:45:06 +0700 Subject: [PATCH 04/11] Note about using of inherit in shorthand border-radius has been added --- src/Css.elm | 37 ++++++++++++++++++++----------------- 1 file changed, 20 insertions(+), 17 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index 73854c90..9444ed22 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6530,6 +6530,10 @@ you should create a batch of `Style`: , borderBottomLeftRadius (px 3) (px 4) ] +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderRadius2 : Value @@ -6549,7 +6553,6 @@ borderRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6571,7 +6574,6 @@ borderRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6597,6 +6599,10 @@ you should create a batch of `Style`: , borderBottomLeftRadius (px 3) (px 4) ] +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderRadius3 : Value @@ -6616,7 +6622,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6638,7 +6643,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6660,7 +6664,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6686,6 +6689,10 @@ you should create a batch of `Style`: , borderBottomLeftRadius (px 3) (px 4) ] +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderRadius4 : Value @@ -6705,7 +6712,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6727,7 +6733,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6749,7 +6754,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6771,7 +6775,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6780,7 +6783,7 @@ borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRi AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) -{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) longhand property. borderTopLeftRadius (em 4) borderTopLeftRadius2 (em 4) (px 2) @@ -6813,7 +6816,7 @@ borderTopLeftRadius (Value radius) = AppendProperty ("border-top-left-radius:" ++ radius) -{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) longhand property. borderTopLeftRadius (em 4) borderTopLeftRadius2 (em 4) (px 2) @@ -6868,7 +6871,7 @@ borderTopLeftRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-top-left-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) longhand property. borderTopRightRadius (em 4) borderTopRightRadius2 (em 4) (px 2) @@ -6901,7 +6904,7 @@ borderTopRightRadius (Value radius) = AppendProperty ("border-top-right-radius:" ++ radius) -{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) longhand property. borderTopRightRadius (em 4) borderTopRightRadius2 (em 4) (px 2) @@ -6956,7 +6959,7 @@ borderTopRightRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-top-right-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) longhand property. borderBottomRightRadius (em 4) borderBottomRightRadius2 (em 4) (px 2) @@ -6989,7 +6992,7 @@ borderBottomRightRadius (Value radius) = AppendProperty ("border-bottom-right-radius:" ++ radius) -{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) longhand property. borderBottomRightRadius (em 4) borderBottomRightRadius2 (em 4) (px 2) @@ -7044,7 +7047,7 @@ borderBottomRightRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-bottom-right-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) longhand property. borderBottomLeftRadius (em 4) borderBottomLeftRadius2 (em 4) (px 2) @@ -7077,7 +7080,7 @@ borderBottomLeftRadius (Value radius) = AppendProperty ("border-bottom-left-radius:" ++ radius) -{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) longhand property. borderBottomLeftRadius (em 4) borderBottomLeftRadius2 (em 4) (px 2) From e9c1b7ce6e5d3df1cd1e8a64a7820b70f3512487 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Thu, 26 Apr 2018 11:03:36 +0700 Subject: [PATCH 05/11] Note about using of inherit has been added to each specific border*Radius2 --- src/Css.elm | 54 ++++++++++++++++++++++++++++++----------------------- 1 file changed, 31 insertions(+), 23 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index 9444ed22..737fb6ef 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6468,7 +6468,7 @@ outset = {- BORDER RADIUS -} -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. borderRadius (em 4) borderRadius2 (em 4) (px 2) @@ -6513,7 +6513,7 @@ borderRadius (Value radius) = AppendProperty ("border-radius:" ++ radius) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. borderRadius (em 4) borderRadius2 (em 4) (px 2) @@ -6531,7 +6531,7 @@ you should create a batch of `Style`: ] **Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +such as in `borderRadius2 (px 1) inherit`, which would partially override existing definitions. Instead, the individual longhand properties have to be used. -} @@ -6582,7 +6582,7 @@ borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottom AppendProperty ("border-radius:" ++ radiusTopLeftAndBottomRight ++ " " ++ radiusTopRightAndBottomLeft) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. borderRadius (em 4) borderRadius2 (em 4) (px 2) @@ -6600,7 +6600,7 @@ you should create a batch of `Style`: ] **Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +such as in `borderRadius3 (px 1) zero inherit`, which would partially override existing definitions. Instead, the individual longhand properties have to be used. -} @@ -6672,7 +6672,7 @@ borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value r AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRightAndBottomLeft ++ " " ++ radiusBottomRight) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) shorthand property. +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. borderRadius (em 4) borderRadius2 (em 4) (px 2) @@ -6690,7 +6690,7 @@ you should create a batch of `Style`: ] **Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius: (px 1) zero inherit inherit`, which would partially override existing definitions. +such as in `borderRadius4 (px 1) zero inherit inherit`, which would partially override existing definitions. Instead, the individual longhand properties have to be used. -} @@ -6783,7 +6783,7 @@ borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRi AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) -{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) longhand property. +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. borderTopLeftRadius (em 4) borderTopLeftRadius2 (em 4) (px 2) @@ -6816,11 +6816,15 @@ borderTopLeftRadius (Value radius) = AppendProperty ("border-top-left-radius:" ++ radius) -{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) longhand property. +{-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. borderTopLeftRadius (em 4) borderTopLeftRadius2 (em 4) (px 2) +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderTopLeftRadius2 (px 1) inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderTopLeftRadius2 : Value @@ -6840,7 +6844,6 @@ borderTopLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6862,7 +6865,6 @@ borderTopLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6871,7 +6873,7 @@ borderTopLeftRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-top-left-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) longhand property. +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. borderTopRightRadius (em 4) borderTopRightRadius2 (em 4) (px 2) @@ -6904,11 +6906,15 @@ borderTopRightRadius (Value radius) = AppendProperty ("border-top-right-radius:" ++ radius) -{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) longhand property. +{-| Sets [`border-top-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius) property. borderTopRightRadius (em 4) borderTopRightRadius2 (em 4) (px 2) +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderTopRightRadius2 (px 1) inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderTopRightRadius2 : Value @@ -6928,7 +6934,6 @@ borderTopRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6950,7 +6955,6 @@ borderTopRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -6959,7 +6963,7 @@ borderTopRightRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-top-right-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) longhand property. +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. borderBottomRightRadius (em 4) borderBottomRightRadius2 (em 4) (px 2) @@ -6992,11 +6996,15 @@ borderBottomRightRadius (Value radius) = AppendProperty ("border-bottom-right-radius:" ++ radius) -{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) longhand property. +{-| Sets [`border-bottom-right-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius) property. borderBottomRightRadius (em 4) borderBottomRightRadius2 (em 4) (px 2) +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderBottomRightRadius2 (px 1) inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderBottomRightRadius2 : Value @@ -7016,7 +7024,6 @@ borderBottomRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -7038,7 +7045,6 @@ borderBottomRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -7047,7 +7053,7 @@ borderBottomRightRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-bottom-right-radius:" ++ horizontal ++ " " ++ vertical) -{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) longhand property. +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. borderBottomLeftRadius (em 4) borderBottomLeftRadius2 (em 4) (px 2) @@ -7080,11 +7086,15 @@ borderBottomLeftRadius (Value radius) = AppendProperty ("border-bottom-left-radius:" ++ radius) -{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) longhand property. +{-| Sets [`border-bottom-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius) property. borderBottomLeftRadius (em 4) borderBottomLeftRadius2 (em 4) (px 2) +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderBottomLeftRadius2 (px 1) inherit`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + -} borderBottomLeftRadius2 : Value @@ -7104,7 +7114,6 @@ borderBottomLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } @@ -7126,7 +7135,6 @@ borderBottomLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , inherit : Supported , initial : Supported , unset : Supported } From c75f736ce27b29d2d69e23e33dba0f04032e8ef5 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Fri, 27 Apr 2018 18:18:02 +0700 Subject: [PATCH 06/11] Elliptical values have been created --- src/Css.elm | 441 ++++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 392 insertions(+), 49 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index 737fb6ef..70161450 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -137,6 +137,10 @@ module Css , dotted , double , eResize + , elliptical + , elliptical2 + , elliptical3 + , elliptical4 , em , emptyCells , end @@ -468,6 +472,8 @@ All CSS properties can have the values `unset`, `initial`, and `inherit`. @docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 +@docs elliptical, elliptical2, elliptical3, elliptical4 + ## Display @@ -6471,19 +6477,6 @@ outset = {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. borderRadius (em 4) - borderRadius2 (em 4) (px 2) - borderRadius3 (em 4) (px 2) (pct 5) - borderRadius4 (em 4) (px 2) (pct 5) (px 3) - -**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, -so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` -you should create a batch of `Style`: - - [ borderTopLeftRadius (px 4) (px 2) - , borderTopRightRadius (px 3) (px 4) - , borderBottomRightRadius (px 6) (px 2) - , borderBottomLeftRadius (px 3) (px 4) - ] -} borderRadius : @@ -6515,20 +6508,10 @@ borderRadius (Value radius) = {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - borderRadius (em 4) borderRadius2 (em 4) (px 2) - borderRadius3 (em 4) (px 2) (pct 5) - borderRadius4 (em 4) (px 2) (pct 5) (px 3) + borderRadius2 (em 4) (elliptical (px 6)) -**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, -so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` -you should create a batch of `Style`: - - [ borderTopLeftRadius (px 4) (px 2) - , borderTopRightRadius (px 3) (px 4) - , borderBottomRightRadius (px 6) (px 2) - , borderBottomLeftRadius (px 3) (px 4) - ] +If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. **Note:** As with any shorthand property, individual sub-properties cannot inherit, such as in `borderRadius2 (px 1) inherit`, which would partially override existing definitions. @@ -6576,6 +6559,7 @@ borderRadius2 : , zero : Supported , initial : Supported , unset : Supported + , elliptical : Supported } -> Style borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = @@ -6584,20 +6568,10 @@ borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottom {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - borderRadius (em 4) - borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) - borderRadius4 (em 4) (px 2) (pct 5) (px 3) - -**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, -so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` -you should create a batch of `Style`: + borderRadius3 (em 4) (px 2) (elliptical (px 6)) - [ borderTopLeftRadius (px 4) (px 2) - , borderTopRightRadius (px 3) (px 4) - , borderBottomRightRadius (px 6) (px 2) - , borderBottomLeftRadius (px 3) (px 4) - ] +If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. **Note:** As with any shorthand property, individual sub-properties cannot inherit, such as in `borderRadius3 (px 1) zero inherit`, which would partially override existing definitions. @@ -6666,6 +6640,7 @@ borderRadius3 : , zero : Supported , initial : Supported , unset : Supported + , elliptical : Supported } -> Style borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = @@ -6674,20 +6649,10 @@ borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value r {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - borderRadius (em 4) - borderRadius2 (em 4) (px 2) - borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) + borderRadius4 (em 4) (px 2) (pct 5) (elliptical (px 6)) -**Note:** An implementation of shorthand property with supporting of elipse shape looks ugly, -so if you wanna make somehting like this `border-radius: 4px 3px 6px / 2px 4px` by `elm-css` -you should create a batch of `Style`: - - [ borderTopLeftRadius (px 4) (px 2) - , borderTopRightRadius (px 3) (px 4) - , borderBottomRightRadius (px 6) (px 2) - , borderBottomLeftRadius (px 3) (px 4) - ] +If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. **Note:** As with any shorthand property, individual sub-properties cannot inherit, such as in `borderRadius4 (px 1) zero inherit inherit`, which would partially override existing definitions. @@ -6777,12 +6742,112 @@ borderRadius4 : , zero : Supported , initial : Supported , unset : Supported + , elliptical : Supported } -> Style borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) +{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property with [`elliptical`](#elliptical) corners. + + borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) + +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius5 (px 1) zero inherit inherit (elliptical (px 6))`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + +-} +borderRadius5 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + , elliptical : Supported + } + -> Style +borderRadius5 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = + AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) + + {-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. borderTopLeftRadius (em 4) @@ -7143,6 +7208,284 @@ borderBottomLeftRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-bottom-left-radius:" ++ horizontal ++ " " ++ vertical) +{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius2 (em 4) (elliptical (px 6)) + borderRadius3 (em 4) (px 2) (elliptical (px 6)) + borderRadius4 (em 4) (px 2) (pct 5) (elliptical (px 6)) + borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) + +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius5 (px 1) zero inherit inherit (elliptical (px 6))`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + +-} +elliptical : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> Value { properties | elliptical : Supported } +elliptical (Value radius) = + Value (" / " ++ radius) + + +{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius2 (em 4) (elliptical2 (px 6) (px 7)) + borderRadius3 (em 4) (px 2) (elliptical2 (px 6) (px 7)) + borderRadius4 (em 4) (px 2) (pct 5) (elliptical2 (px 6) (px 7)) + borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical2 (px 6) (px 7)) + +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius5 (px 1) zero inherit inherit (elliptical2 (px 6) (px 7))`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + +-} +elliptical2 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> Value { properties | elliptical : Supported } +elliptical2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = + Value (" / " ++ radiusTopLeftAndBottomRight ++ " " ++ radiusTopRightAndBottomLeft) + + +{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius2 (em 4) (elliptical3 (px 6) (px 7) (pct 10)) + borderRadius3 (em 4) (px 2) (elliptical3 (px 6) (px 7) (pct 10)) + borderRadius4 (em 4) (px 2) (pct 5) (elliptical3 (px 6) (px 7) (pct 10)) + borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical3 (px 6) (px 7) (pct 10)) + +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius5 (px 1) zero inherit inherit (elliptical3 (px 6) (px 7) (pct 10))`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + +-} +elliptical3 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> Value { properties | elliptical : Supported } +elliptical3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = + Value (" / " ++ radiusTopLeft ++ " " ++ radiusTopRightAndBottomLeft ++ " " ++ radiusBottomRight) + + +{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + + borderRadius2 (em 4) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) + borderRadius3 (em 4) (px 2) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) + borderRadius4 (em 4) (px 2) (pct 5) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) + borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) + +**Note:** As with any shorthand property, individual sub-properties cannot inherit, +such as in `borderRadius5 (px 1) zero inherit inherit (elliptical4 (px 6) (px 7) (pct 10) (em 1))`, which would partially override existing definitions. +Instead, the individual longhand properties have to be used. + +-} +elliptical4 : + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> + Value + { ch : Supported + , cm : Supported + , em : Supported + , ex : Supported + , inches : Supported + , mm : Supported + , pc : Supported + , pt : Supported + , pct : Supported + , px : Supported + , rem : Supported + , vh : Supported + , vmax : Supported + , vmin : Supported + , vw : Supported + , zero : Supported + , initial : Supported + , unset : Supported + } + -> Value { properties | elliptical : Supported } +elliptical4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = + Value (" / " ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) + + -- TEXT ORIENTATION -- From c0fcb022491532c90ff090b564de5b51ad074269 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Fri, 27 Apr 2018 18:28:38 +0700 Subject: [PATCH 07/11] BorderRadius5 has been exposed --- src/Css.elm | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/Css.elm b/src/Css.elm index 70161450..1edba107 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -70,6 +70,7 @@ module Css , borderRadius2 , borderRadius3 , borderRadius4 + , borderRadius5 , borderRight , borderRight2 , borderRight3 @@ -470,7 +471,7 @@ All CSS properties can have the values `unset`, `initial`, and `inherit`. ## Border Radius -@docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 +@docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderRadius5, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 @docs elliptical, elliptical2, elliptical3, elliptical4 From af994328f8987df0f71472a61530f75e8ed95710 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Tue, 1 May 2018 21:24:27 +0700 Subject: [PATCH 08/11] Values unset and initial for multiple argument properies has been removed --- src/Css.elm | 62 ----------------------------------------------------- 1 file changed, 62 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index 1edba107..a49a5dee 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6537,8 +6537,6 @@ borderRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6558,8 +6556,6 @@ borderRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported , elliptical : Supported } -> Style @@ -6597,8 +6593,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6618,8 +6612,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6639,8 +6631,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported , elliptical : Supported } -> Style @@ -6678,8 +6668,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6699,8 +6687,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6720,8 +6706,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6741,8 +6725,6 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported , elliptical : Supported } -> Style @@ -6777,8 +6759,6 @@ borderRadius5 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6798,8 +6778,6 @@ borderRadius5 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6819,8 +6797,6 @@ borderRadius5 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6840,8 +6816,6 @@ borderRadius5 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported , elliptical : Supported } -> Style @@ -6910,8 +6884,6 @@ borderTopLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -6931,8 +6903,6 @@ borderTopLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Style borderTopLeftRadius2 (Value horizontal) (Value vertical) = @@ -7000,8 +6970,6 @@ borderTopRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7021,8 +6989,6 @@ borderTopRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Style borderTopRightRadius2 (Value horizontal) (Value vertical) = @@ -7090,8 +7056,6 @@ borderBottomRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7111,8 +7075,6 @@ borderBottomRightRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Style borderBottomRightRadius2 (Value horizontal) (Value vertical) = @@ -7180,8 +7142,6 @@ borderBottomLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7201,8 +7161,6 @@ borderBottomLeftRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Style borderBottomLeftRadius2 (Value horizontal) (Value vertical) = @@ -7239,8 +7197,6 @@ elliptical : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value { properties | elliptical : Supported } elliptical (Value radius) = @@ -7277,8 +7233,6 @@ elliptical2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7298,8 +7252,6 @@ elliptical2 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value { properties | elliptical : Supported } elliptical2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = @@ -7336,8 +7288,6 @@ elliptical3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7357,8 +7307,6 @@ elliptical3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7378,8 +7326,6 @@ elliptical3 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value { properties | elliptical : Supported } elliptical3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = @@ -7416,8 +7362,6 @@ elliptical4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7437,8 +7381,6 @@ elliptical4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7458,8 +7400,6 @@ elliptical4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value @@ -7479,8 +7419,6 @@ elliptical4 : , vmin : Supported , vw : Supported , zero : Supported - , initial : Supported - , unset : Supported } -> Value { properties | elliptical : Supported } elliptical4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = From 873f61a7be4a1d42147d5bebca25512b7c4d456b Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Tue, 1 May 2018 21:58:22 +0700 Subject: [PATCH 09/11] Note about using of inherit has been removed --- src/Css.elm | 48 ------------------------------------------------ 1 file changed, 48 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index a49a5dee..f12b7910 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6514,10 +6514,6 @@ borderRadius (Value radius) = If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius2 (px 1) inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderRadius2 : Value @@ -6570,10 +6566,6 @@ borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottom If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius3 (px 1) zero inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderRadius3 : Value @@ -6645,10 +6637,6 @@ borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value r If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius4 (px 1) zero inherit inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderRadius4 : Value @@ -6736,10 +6724,6 @@ borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRi borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius5 (px 1) zero inherit inherit (elliptical (px 6))`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderRadius5 : Value @@ -6861,10 +6845,6 @@ borderTopLeftRadius (Value radius) = borderTopLeftRadius (em 4) borderTopLeftRadius2 (em 4) (px 2) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderTopLeftRadius2 (px 1) inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderTopLeftRadius2 : Value @@ -6947,10 +6927,6 @@ borderTopRightRadius (Value radius) = borderTopRightRadius (em 4) borderTopRightRadius2 (em 4) (px 2) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderTopRightRadius2 (px 1) inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderTopRightRadius2 : Value @@ -7033,10 +7009,6 @@ borderBottomRightRadius (Value radius) = borderBottomRightRadius (em 4) borderBottomRightRadius2 (em 4) (px 2) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderBottomRightRadius2 (px 1) inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderBottomRightRadius2 : Value @@ -7119,10 +7091,6 @@ borderBottomLeftRadius (Value radius) = borderBottomLeftRadius (em 4) borderBottomLeftRadius2 (em 4) (px 2) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderBottomLeftRadius2 (px 1) inherit`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} borderBottomLeftRadius2 : Value @@ -7174,10 +7142,6 @@ borderBottomLeftRadius2 (Value horizontal) (Value vertical) = borderRadius4 (em 4) (px 2) (pct 5) (elliptical (px 6)) borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius5 (px 1) zero inherit inherit (elliptical (px 6))`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} elliptical : Value @@ -7210,10 +7174,6 @@ elliptical (Value radius) = borderRadius4 (em 4) (px 2) (pct 5) (elliptical2 (px 6) (px 7)) borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical2 (px 6) (px 7)) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius5 (px 1) zero inherit inherit (elliptical2 (px 6) (px 7))`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} elliptical2 : Value @@ -7265,10 +7225,6 @@ elliptical2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLe borderRadius4 (em 4) (px 2) (pct 5) (elliptical3 (px 6) (px 7) (pct 10)) borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical3 (px 6) (px 7) (pct 10)) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius5 (px 1) zero inherit inherit (elliptical3 (px 6) (px 7) (pct 10))`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} elliptical3 : Value @@ -7339,10 +7295,6 @@ elliptical3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value rad borderRadius4 (em 4) (px 2) (pct 5) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) -**Note:** As with any shorthand property, individual sub-properties cannot inherit, -such as in `borderRadius5 (px 1) zero inherit inherit (elliptical4 (px 6) (px 7) (pct 10) (em 1))`, which would partially override existing definitions. -Instead, the individual longhand properties have to be used. - -} elliptical4 : Value From 0029fefec1116e821bea76913da3bca452193e43 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Tue, 1 May 2018 22:04:15 +0700 Subject: [PATCH 10/11] BorderRadius5 has been fixed --- src/Css.elm | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index f12b7910..f714686b 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -6800,11 +6800,11 @@ borderRadius5 : , vmin : Supported , vw : Supported , zero : Supported - , elliptical : Supported } + -> Value { elliptical : Supported } -> Style -borderRadius5 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = - AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) +borderRadius5 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) (Value radiusElliptical) = + AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft ++ " " ++ radiusElliptical) {-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. @@ -7164,7 +7164,7 @@ elliptical : } -> Value { properties | elliptical : Supported } elliptical (Value radius) = - Value (" / " ++ radius) + Value ("/ " ++ radius) {-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. From 10f0282d0e80fdc6ad1b5a68133b17cb6fdf9fe4 Mon Sep 17 00:00:00 2001 From: Anton Ovechkin Date: Wed, 2 May 2018 20:19:06 +0700 Subject: [PATCH 11/11] Elliptical values have been removed --- src/Css.elm | 364 ++-------------------------------------------------- 1 file changed, 14 insertions(+), 350 deletions(-) diff --git a/src/Css.elm b/src/Css.elm index f714686b..9bb34082 100644 --- a/src/Css.elm +++ b/src/Css.elm @@ -70,7 +70,6 @@ module Css , borderRadius2 , borderRadius3 , borderRadius4 - , borderRadius5 , borderRight , borderRight2 , borderRight3 @@ -138,10 +137,6 @@ module Css , dotted , double , eResize - , elliptical - , elliptical2 - , elliptical3 - , elliptical4 , em , emptyCells , end @@ -471,9 +466,7 @@ All CSS properties can have the values `unset`, `initial`, and `inherit`. ## Border Radius -@docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderRadius5, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 - -@docs elliptical, elliptical2, elliptical3, elliptical4 +@docs borderRadius, borderRadius2, borderRadius3, borderRadius4, borderTopLeftRadius, borderTopLeftRadius2, borderTopRightRadius, borderTopRightRadius2, borderBottomRightRadius, borderBottomRightRadius2, borderBottomLeftRadius, borderBottomLeftRadius2 ## Display @@ -6477,7 +6470,10 @@ outset = {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - borderRadius (em 4) + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) -} borderRadius : @@ -6509,10 +6505,10 @@ borderRadius (Value radius) = {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + borderRadius (em 4) borderRadius2 (em 4) (px 2) - borderRadius2 (em 4) (elliptical (px 6)) - -If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. + borderRadius3 (em 4) (px 2) (pct 5) + borderRadius4 (em 4) (px 2) (pct 5) (px 3) -} borderRadius2 : @@ -6552,7 +6548,6 @@ borderRadius2 : , vmin : Supported , vw : Supported , zero : Supported - , elliptical : Supported } -> Style borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = @@ -6561,10 +6556,10 @@ borderRadius2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottom {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + borderRadius (em 4) + borderRadius2 (em 4) (px 2) borderRadius3 (em 4) (px 2) (pct 5) - borderRadius3 (em 4) (px 2) (elliptical (px 6)) - -If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. + borderRadius4 (em 4) (px 2) (pct 5) (px 3) -} borderRadius3 : @@ -6623,7 +6618,6 @@ borderRadius3 : , vmin : Supported , vw : Supported , zero : Supported - , elliptical : Supported } -> Style borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = @@ -6632,10 +6626,10 @@ borderRadius3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value r {-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. + borderRadius (em 4) + borderRadius2 (em 4) (px 2) + borderRadius3 (em 4) (px 2) (pct 5) borderRadius4 (em 4) (px 2) (pct 5) (px 3) - borderRadius4 (em 4) (px 2) (pct 5) (elliptical (px 6)) - -If you wanna describe elliptical border radius see [`elliptical`](#elliptical) value. -} borderRadius4 : @@ -6713,100 +6707,12 @@ borderRadius4 : , vmin : Supported , vw : Supported , zero : Supported - , elliptical : Supported } -> Style borderRadius4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) -{-| Sets [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property with [`elliptical`](#elliptical) corners. - - borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) - --} -borderRadius5 : - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> Value { elliptical : Supported } - -> Style -borderRadius5 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) (Value radiusElliptical) = - AppendProperty ("border-radius:" ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft ++ " " ++ radiusElliptical) - - {-| Sets [`border-top-left-radius`](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius) property. borderTopLeftRadius (em 4) @@ -7135,248 +7041,6 @@ borderBottomLeftRadius2 (Value horizontal) (Value vertical) = AppendProperty ("border-bottom-left-radius:" ++ horizontal ++ " " ++ vertical) -{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - - borderRadius2 (em 4) (elliptical (px 6)) - borderRadius3 (em 4) (px 2) (elliptical (px 6)) - borderRadius4 (em 4) (px 2) (pct 5) (elliptical (px 6)) - borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical (px 6)) - --} -elliptical : - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> Value { properties | elliptical : Supported } -elliptical (Value radius) = - Value ("/ " ++ radius) - - -{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - - borderRadius2 (em 4) (elliptical2 (px 6) (px 7)) - borderRadius3 (em 4) (px 2) (elliptical2 (px 6) (px 7)) - borderRadius4 (em 4) (px 2) (pct 5) (elliptical2 (px 6) (px 7)) - borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical2 (px 6) (px 7)) - --} -elliptical2 : - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> Value { properties | elliptical : Supported } -elliptical2 (Value radiusTopLeftAndBottomRight) (Value radiusTopRightAndBottomLeft) = - Value (" / " ++ radiusTopLeftAndBottomRight ++ " " ++ radiusTopRightAndBottomLeft) - - -{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - - borderRadius2 (em 4) (elliptical3 (px 6) (px 7) (pct 10)) - borderRadius3 (em 4) (px 2) (elliptical3 (px 6) (px 7) (pct 10)) - borderRadius4 (em 4) (px 2) (pct 5) (elliptical3 (px 6) (px 7) (pct 10)) - borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical3 (px 6) (px 7) (pct 10)) - --} -elliptical3 : - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> Value { properties | elliptical : Supported } -elliptical3 (Value radiusTopLeft) (Value radiusTopRightAndBottomLeft) (Value radiusBottomRight) = - Value (" / " ++ radiusTopLeft ++ " " ++ radiusTopRightAndBottomLeft ++ " " ++ radiusBottomRight) - - -{-| The elliptical corners for [`border-radius`](https://css-tricks.com/almanac/properties/b/border-radius/) property. - - borderRadius2 (em 4) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) - borderRadius3 (em 4) (px 2) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) - borderRadius4 (em 4) (px 2) (pct 5) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) - borderRadius5 (em 4) (px 2) (pct 5) (px 3) (elliptical4 (px 6) (px 7) (pct 10) (em 1)) - --} -elliptical4 : - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> - Value - { ch : Supported - , cm : Supported - , em : Supported - , ex : Supported - , inches : Supported - , mm : Supported - , pc : Supported - , pt : Supported - , pct : Supported - , px : Supported - , rem : Supported - , vh : Supported - , vmax : Supported - , vmin : Supported - , vw : Supported - , zero : Supported - } - -> Value { properties | elliptical : Supported } -elliptical4 (Value radiusTopLeft) (Value radiusTopRight) (Value radiusBottomRight) (Value radiusBottomLeft) = - Value (" / " ++ radiusTopLeft ++ " " ++ radiusTopRight ++ " " ++ radiusBottomRight ++ " " ++ radiusBottomLeft) - - -- TEXT ORIENTATION --