diff --git a/styles/STYLEMANAGER.md b/styles/STYLEMANAGER.md index b63951a..2d361cf 100644 --- a/styles/STYLEMANAGER.md +++ b/styles/STYLEMANAGER.md @@ -10,6 +10,7 @@ - [Creating a StyleManager](#creating-a-stylemanager) - [Adding Styles](#adding-styles) - [Pseudo-Classes](#pseudo-classes) + - [Pseudo-Elements](#pseudo-elements) - [Animations](#animations) - [Media Queries](#media-queries) - [Features](#features) @@ -102,6 +103,25 @@ link := elem.A( ) ``` +### Pseudo-Elements + +Define styles with pseudo-elements to insert content or style specific parts of an element: + +```go +compositeClassName := styleMgr.AddCompositeStyle(styles.CompositeStyle{ + Default: styles.Props{ + styles.Position: "relative" + }, + PseudoElements: map[string]styles.Props{ + styles.PseudoBefore: { + styles.Content: "'Before Text'" + }, + }, +}) +``` + +In this example, the `::before` pseudo-element will insert the text "Before Text" before the content of the element. + ### Animations Create animations and apply them to styles with the returned animation name: diff --git a/styles/constants.go b/styles/constants.go index c7d3d02..4b1d7f4 100644 --- a/styles/constants.go +++ b/styles/constants.go @@ -214,6 +214,21 @@ const ( PseudoPaused = ":paused" // Content pseudo-elements - PseudoBefore = "::before" - PseudoAfter = "::after" + PseudoBefore = "::before" + PseudoAfter = "::after" + PseudoFirstLine = "::first-line" + PseudoFirstLetter = "::first-letter" + PseudoSelection = "::selection" + PseudoBackdrop = "::backdrop" + PseudoPlaceholder = "::placeholder" + PseudoMarker = "::marker" + PseudoCues = "::cues" + PseudoCueRegion = "::cue-region" + PseudoResizer = "::resizer" + PseudoScrollbar = "::scrollbar" + PseudoScrollbarThumb = "::scrollbar-thumb" + PseudoScrollbarTrack = "::scrollbar-track" + PseudoScrollbarTrackPiece = "::scrollbar-track-piece" + PseudoScrollbarButton = "::scrollbar-button" + PseudoScrollbarCorner = "::scrollbar-corner" )