Skip to content
This repository was archived by the owner on Dec 31, 2023. It is now read-only.

MakeupStudio/CSSKit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Draft readme

CSSKit

CSS DSL written in Swift.

Styles support

For now it has only direct support for styles

Style.display(.flex)
Style.position(.absolute)
// etc.

Almost all keys for styles are already here, but factories for values are still in development, anyway you can use strings for initialization for now

Style.margin("10pt")

Transform functions are implemented btw :)

Style.transform(.translate(x: 10%))

// Or you can create custom ones like so

extension Style.TransformFunction {
    func someNew3DFunction(
        x: Dimension.Length, 
        y: Dimension.Length, 
        z: Dimension.Length
    ) -> Self {
        Style.TransformFunction(
            name: "someNew3DFunction",
            arguments: [
              	x.erased,
                y.erased,
                z.erased
            ]
        )
    }
}

Use StylesCollections for elements

let styles: StylesCollection = [ // the same as `let styles: [Style] = [...`
    .alignSelf(.center),
    .background(Color.brown.hex(uppercase: true, hashTagPrefix: true)),
    .borderRadius(1.in.px.render())
]
styles.render() // "align-self:center;background:#A52A2AFF;border-radius:1.0px;"

Dimensions

Dimensions are present but not integrated in styles factory, so u can render them manually for now

Style.margin(10.in.pt.render())
// the same as
Style.margin(Dimension.Length(value: 10, unit: .pt).render())

Also you can convert some dimensions or replace units

// - Convert
1000.in.ms // 1000 ms
1.in.s.converted(to: .ms) // 1000 ms

1.in.kHz // 1kHz
1000.in.hz.converted(to: .kHz) // 1kHz

// - Replace units
1.in.s.in(.ms) // 1ms
1.in.s.value.in.pt // 1pt

// - Other
10% // Dimension.Length(value: 10, unit: .percent) or 10.in.percent

Corneres & Edges are supported too

Colors

See GenericColor and Palette for more

Fonts

I'm gonna provide a static factory for google fonts later.


Hopefully I'll add more typo-free static factories & extend fonts support a bit next week

Feel free to open issues if you need any functionality