open-props

open-props copied to clipboard

Inconsistency in Naming of Custom Media Queries for Size Ranges

1

Hello, I was reviewing the custom media queries defined in the CSS, and I noticed an inconsistency in the naming convention used for the size ranges. Specifically, the naming for...

watarutmnh

`@property` javascript file for typed definitions

2

fixes #410 example output so far: ```js [ {"name":"--ratio-portrait","syntax":"","initialValue":"3/4","inherits":false}, {"name":"--ratio-widescreen","syntax":"","initialValue":"16/9","inherits":false}, {"name":"--ratio-ultrawide","syntax":"","initialValue":"18/5","inherits":false}, {"name":"--ratio-golden","syntax":"","initialValue":"1.6180/1","inherits":false} ].forEach(CSS.registerProperty) ``` I'm not sure what else to add. All the colors and included, `z-index` values are included....

argyleink

argyleink

Add a few new gradients

1

some simplifiable but inspirational gradients found here https://cloudfour.com/thinks/highly-customizable-background-gradients/ add them [here](https://github.com/argyleink/open-props/blob/main/src/props.gradients.js#L44)

argyleink

argyleink

BREAKING: `grape` color is no more

2

Version `1.5.0` renamed the `grape` color to `purple`. This is a breaking change. Please bring back `grape` as a duplicate of `purple` or release version 2 to denote the breaking...

obedm503

new gh action. run when npm publish does

argyleink

there is probably a whole set of segment viewport vars to make: ```css :root { --fold-1: env(viewport-segment-left 1 0); --fold-2: env(viewport-segment-left 0 0); --size-hinge: calc(var(--fold-1) - var(--fold-2)); } .layout {...

argyleink

https://windicss.org/guide/configuration.html#example-configuration

argyleink

argyleink