bigskysoftware / bigskysoftware/_hyperscript

[Feature Request] Extend `*computed-` and `measure` syntax to ALL CSS properties

Offen
#620 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
Vorherrschende Sprache
JavaScript
Sterne
3.8k
Forks
172
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

Right now, the `*computed-` style property syntax, as well as the `measure` command seem to assume we’re only interested in knowing the current position and size of an element. In fact, there are many times when we need to know the current, computed value of other properties, too — eg. colours that may be overriden by locally-scoped custom CSS properties, or by specific user interactions, such as using ‘light’ or ‘dark’ mode toggle.

In essence, it would be wonderful if `*computed-` and `measure` worked as syntactic sugar for:

``` javascript
function getCurrentPropertyValue(element, property) {
const styles = window.getComputedStyle(element);
const property = styles.getPropertyValue(property);
return property;
}
```

That way, we’d be able to do things like:

```
set my *color to contrastColor( my *computed-background-color)
measure my font-size then put it into the next .size-display
```

Beitragsleitfaden

Für dieses Repository ist kein Beitragsleitfaden indexiert

Rechercherichtung

Beginne damit, die Implementierungen der *computed- property syntax und des measure-Befehls zu finden, und vergleiche anschließend ihr aktuelles Verhalten mit dem getComputedStyle-Beispiel des Issues. Erledigt ist die Aufgabe, wenn beide Formen berechnete Werte für beliebige CSS-Eigenschaften abrufen können, einschließlich der gezeigten Beispiele für color und font-size.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
css, javascript
Bereich
frontend
Issue-Typ
Feature
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
42/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.