-
Notifications
You must be signed in to change notification settings - Fork 197
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Phantom types: More properties, pseudo-stuff and a few fixes #553
base: phantom-types
Are you sure you want to change the base?
Phantom types: More properties, pseudo-stuff and a few fixes #553
Conversation
Implements: - border-start-start-radius - border-start-end-radius - border-end-start-radius - border-end-end-radius In both 1 and 2-argument forms.
Implements the following: - scroll-margin-block - scroll-margin-inline both as 1 and 2 argument versions.
Scroll-margin properties don't accept percentages, only basic lengths. https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-margin - All scroll-margin properties have had their input types changed from LengthSupported { auto : Supported } to Length.
Implements the following: - scroll-margin-block-start - scroll-margin-block-end - scroll-margin-inline-start - scroll-margin-inline-end
- Adds an implementation of the inset property in 1, 2, 3, and 4 argument forms. - Renames the pre-existing 'inset' value to 'inset_', based on current package conventions.
Implements the following: - inset-block - inset-inline as both 1 and 2-argument functions.
Implements the following: - inset-block-start - inset-block-end - inset-inline-start - inset-inline-end Makes the docs for top, bottom, left and right properties flow a bit better with the link use. Changed the links for inset-block and inset-inline functions from MDN to CSS Tricks Almanac.
Implements the following: - scroll-padding-block - scroll-padding-inline Both as 1 and 2-argument functions. - Fixed variable naming in scrollMarginBlock2 and scrollMarginInline2. - Fixed a typo I noticed in scrollPadding's documentation.
Implements the following properties: - scroll-padding-block-start - scroll-padding-block-end - scroll-padding-inline-start - scroll-padding-inline-end
…s-logical-border-radii
Some one-argument functions I wrote didn't use BaseValue when they should have.. This has been fixed.
Implements the following: - block-size - inline-size - max-block-size - max-inline-size - min-block-size - min-inline-size Fixes: - Both the width and height properties can accept, pct, auto, maxContent, minContent and fitContent, so I've changed their type annotations to add them. - Re-arranged existing sizing property and variable functions so they flow better (group functions first and values later). - Made the documentation for minContent, maxContent and fitContent a bit more concise and inclusive to Logical size properties.
Implements the following: - gap - row-gap This commit also groups column-gap with the aforementioned properties since they're related.
Implements the following: - overflow-block - overflow-inline
Implements the following: - overscroll-behavior - overscroll-behavior-x - overscroll-behavior-y - overscroll-behavior-block - overscroll-behavior-inline
- The 'inset_' field for box-shadows has been renamed to 'inset' because they don't interact with the 'inset_' function. - Fixed a typo in the boxShadows documentation where the function examples were called 'boxShadow' instead of 'boxShadows'.
# Conflicts: # src/Css.elm
The contain variable now includes documentation for overscrollBehavior as well as backgroundSize.
- Adds quotes property (in 1, 2 and 4 argument versions) - Moves the string value up to the area with other shared value types
Implements: - text-overflow property (in 1 and 2-argument forms) - ellipsis value (for text-overflow)
Implements the following: - line-break - strict value for line-break - loose value for line-break Adds line-break as a use case the documentation for the other values that it accepts.
Adds preliminary 2 and 3-argument versions of hanging-punctuation. These need more work because the way the arguments work here can enable incorrectly typed CSS.
Implements the following: - resize property - horizontal and vertical values (for resize) Changed the variable names in various functions to eliminate naming conflicts with the new horizontal and vertical values.
Implements the following: - contain property (1, 2, 3 and 4 argument versions) - strict value - size value - layout value - style value - paint value Changes to existing code: - style variables in functions have been renamed to styleVal to avoid clashes with style. - size variables in functions have been renamed to sizeVal to avoid clashes with size. - Renamed contain value to contain_ so as to not clash with contain property. It's unclear how to mark contain4 since having values is redundant but calling it containAll is probably misleading, so it's being called contain4 pending further discussion.
Implements the following: - paint-order property (in 1, 2 and 3-argument forms) - markers value Adjusts the documentation of fill_ and stroke to mention that they work with paintOrder.
- Adds clip value to overflow, overflowX and overflowY.
- Adds perspective property - Renames the pre-existing 'perspective' value to 'perspective_'
- Implements perspective-origin property. - Applies elm-format to the previous few commits that hadn't had it applied.
- Adds scale property (as scale, scale2, and scale3) - Renames scale value to scale_ (to avoid conflicts with scale) - Renames scale2 value to scale2_ (to avoid conflicts with scale2) - Adds rotate property (as rotate and rotate2) - Renames rotate value to rotate_ (to avoid conflicts with rotate) - New value function: z - New value function: vec3 - Changes some variable names in functions to avoid conflicts with new value functions
Adds the folowing pseudo-elements: - ::backdrop - ::cue - ::marker - ::placeholder - ::selection
- Keeps active, disabled and after DRY. - Makes a doc I just made make a little more sense.
Adds the following pseudo-classes: - :checked - :empty - :enabled - :first-child - :first-of-type - :focus - :fullscreen - :hover - :in-range - :indeterminate - :invalid - :last-child - :last-of-type - :link - :only-child - :only-of-type - :out-of-range - :read-only - :read-write - :required - :root - :scope - :target - :valid - :visited
Applies elm-format to recent changes.
- Noted that contain: style; is at-risk of being depreciated.
# Conflicts: # src/Css.elm
There were a series of conflicts and a few duplicate functions from the recent merge. This fixes those issues.
- Added all possible implementations of font-variant-east-asian. - Added all possible values of font-variant-east-asian. - Changed the docs for fullWidth so it includes it's new use with fontVariantEastAsian.
- Added the font-optical-sizing property.
Implements the following: - font-kerning - font-language-override - font-synthesis (1, 2 and 3-argument variants) - font-variant-position Other changes: - made contain4 a normal property because I figured it would be more readable to have explicit CSS values rather than implicit ones.
Cleaning up by moving values shared across different types of properties into the 'Shared Values' section. These values also have updated documentation to these the properties that use them. Moved values: - start - end - left_ - right_ - top_ - bottom_ - baseline - clip - block - inline - ruby Pre-existing values in the shared category have also had updated documentation. Some documentation to other values have had lightly improved grammar.
Bringing more values that should be in the shared section: - stretch (added documentation) - center (added documentation) - content (improved documentation) - normal - text (improved docs) - paddingBox - cover (improved docs) - contain_ Other stuff - Improved documentation for placeholder. - Added links to moved values in the Align Items section of the docs so the user knows that these are other values that can be used. - Simplified the wording in the documentation for repeat values to match the wording in other documentation for values. - Applied elm-format to previous commits.
As I'm working on this file more, I found that a lot of things didn't have clear organisation so I figured it would be good to give them a look over. Moved docs and exposing - Moved the shared values section to a more logical part of the docs and exposing (after the main measurements) - Moved the url variable higher up in the docs and exposing. - Added one line break between the cursor properties and the cursor values since I figured that would separate them a bit more neatly. Edited documentation - Changed the levels of different headers to reflect what level they're actually at in the general categorisation heirarchy. - Fixed a doc typo in contain_ and textOverflow2. - Renamed 'Align Items' section to 'Flex align items' and made it a subheader of the Flexbox module section as there's no other purpose for these particular values.
More shared values have been organised together: - fullWidth - sub - super Misc: - Moved ltr and rtl values to be next to the direction property in the code (since they are the only things that go together)
Grouped what might be the last batch of shared values: - all_ - both - strict - fill_ - stroke - always - x - y - style Misc: - Expanded documentation for slice and clone. - Fixed some documentation typos for shared values - Applied elm-format to Css.elm.
- Rearranged the shared values so values with similar effects and categories are next to each other. - Improved documentation
Forgot to move clip to it's more appropriate place in the shared values.
I hope this wasn't an overreach but while I've been doing these basic additions, I noticed that there were a bunch of value functions that were in weird places and value functions that should probably be in the Shared Values section of the docs but weren't, so I decided to go through the whole Css module and group up all the values that were used in multiple different types of properties and bring them into the shared values section, which ended up being:
I also altered their documentation to make light of the fact that they are used by different kinds of properties if their docs didn't mention it. I moved url() up to be with the other value functions in the docs and the code because it was originally sitting under the SVG section. I also noticed the levels of headings weren't consistent, so I made them consistent. |
I'm gonna mention it in the phantom types thread but I noticed that when it comes to the documentation of CSS values in this module, some docs link to to the values section of the property that uses this value on MDN and use the property's CSS name:
...while others reference the Elm documentation and the Elm function name for that property.
As far as I know there isn't a consistency rule for what it should be? (All the stuff I've written so far use URLs to the Elm functions and use the Elm function naming for properties) |
I want to try to get the phantom-types branch much closer to completion while I have free time ^^
My goal with this PR is simply filling in a lot of relatively simple properties that have not yet been made, don't really do anything new and don't really shake anything up.
New stuff
This PR implements the following:
psuedo-classes
:checked
:empty
:enabled
:first-child
:first-of-type
:focus
:fullscreen
:hover
:in-range
:indeterminate
:invalid
:last-child
:last-of-type
:link
:only-child
:only-of-type
:out-of-range
:read-only
:read-write
:required
:root
:scope
:target
:valid
:visited
pseudo-elements
Logical border radius
border-end-end-radius
border-end-start-radius
border-start-end-radius
border-start-start-radius
Logical snap scrolling metrics
scroll-margin-block
scroll-margin-block-end
scroll-margin-block-start
scroll-margin-inline
scroll-margin-inline-end
scroll-margin-inline-start
scroll-padding-block
scroll-padding-block-end
scroll-padding-block-start
scroll-padding-inline
scroll-padding-inline-end
scroll-padding-inline-start
Overscroll behavior
overscroll-behavior
overscroll-behavior-block
overscroll-behavior-inline
overscroll-behavior-x
overscroll-behavior-y
Inset and logical insets
inset
inset-block
inset-block-end
inset-block-start
inset-inline
inset-inline-end
inset-inline-start
Logical dimensions
block-size
inline-size
max-block-size
max-inline-size
min-block-size
min-inline-size
Logical overflow
overflow-block
overflow-inline
Missing gap properties
row-gap
gap
Typographic properties
quotes
text-overflow
line-break
hanging-punctuation
Missing font properties
font-kerning
font-language-override
font-optical-sizing
font-synthesis
font-variant-east-asian
font-variant-position
transforms
rotate
scale
perspective
perspective
perspective-origin
SVG
paint-order
Misc
resize
contain
Values and types
_
to make way for new properties where conflicts occurred.scroll-margin
properties should only takeLength
s, notLengthSupported {auto : Supported}
, so I changed the code for all the pre-existing ones to make that the case.width
andheight
's type annotations didn't account for the number of values they could actually support, so I changed them.clip
value to theoverflow
properties that support it.Other changes
scroll-padding
functions.gap
properties together because they don't just apply to grid layouts anymore.Things I'm unsure of
rotate
, instead of creating arotate4
with three vector ints and an angle, I decided to create arotate2
that can accept a new value calledvec3
. Once again I'm not sure if this is idiomatic but(vec3 1 1 1)
seemed more elegant and semantic than doing(int 1) (int 1) (int 1)
.I hope this is all okay! Sorry for doing 3 separate PRs for adding all these, this was kind of impromptu and I wasn't sure how many I was gonna do ^^' (I'm pretty new to doing PRs). I also figured that it might be best that I keep adding stuff I was working on into this one until someone takes a look to avoid making lots of PRs and so others wouldn't need to handle the merge conflicts.