Skip to content
This repository was archived by the owner on Jun 19, 2019. It is now read-only.

ClassyKit/Classy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

0ae47bf · Nov 6, 2017
Sep 2, 2015
Oct 18, 2017
Jul 28, 2015
Oct 14, 2017
Oct 18, 2017
Oct 18, 2017
Oct 20, 2013
Jul 29, 2015
Aug 6, 2014
Nov 6, 2017
Nov 8, 2013
Nov 6, 2017
Sep 15, 2013
Oct 18, 2017
Oct 18, 2017

Repository files navigation

Classy Build Status Coverage Status Carthage compatible iOS Level

** Classy is looking for contributors **

Not CSS. Instead of trying to force UIKit to fit CSS syntax, properties, conventions and constructs. Classy is a stylesheet system built from the ground up to work in harmony with UIKit. It borrows the best ideas from CSS and introduces new syntax, conventions and constructs where appropriate.

Plays nice with Interface Builder and views created in code.

For detailed usage see the docs or the wiki.

Supports UIAppearance

Classy supports all UIAppearance properties and methods and much more. But instead of being limited to +appearanceWhenContainedIn: and +appearance, Classy gives you much greater control over which views are styled and with what values.

Example Stylesheets

Classy features a very flexible, nestable syntax. Classy makes { } : ; all optional so you can choose a style that suits you. It also saves you from worrying about small syntax mistakes like accidentally forgetting to end a line with a ;

You can use { } : ; to delimit your stylesheets

@import "other_stylesheet.cas";

$mainColor = #e1e1e1;

// Supports your custom UIView subclasses
MYCustomView {
  background-color: $mainColor;
  title-insets: 5, 10, 5, 10;
  > UIProgressView.tinted {
    progress-tint-color: rgb(200, 155, 110, 0.6);
    track-tint-color: yellow;
  }
}

/*
 * Supports Single or Multi-line comments
 */
^UIButton.warning, UIView.warning ^UIButton {
  title-color[state:highlighted]: #e3e3e3;
}

OR you can use whitespace to delimit your sytlesheets

@import "other_stylesheet.cas"

$mainColor = #e1e1e1

// Supports your custom UIView subclasses
MYCustomView 
  background-color $mainColor
  title-insets 5, 10, 5, 10
  > UIProgressView.tinted 
    progress-tint-color rgb(200, 155, 110, 0.6)
    track-tint-color yellow

/*
 * Supports Single or Multi-line comments
 */
^UIButton.warning, UIView.warning ^UIButton 
  title-color[state:highlighted] #e3e3e3

Live Reload

Live reload can dramatically speed up your development time, with live reload enabled you can instantaneously see your stylesheet changes. Without having to rebuild and navigate back to the same spot within your app.

For more details about these features and more visit the docs or the wiki.

Inspiration