https://github.com/t1amat9409/trojan

JSON-CSS Loader
https://github.com/t1amat9409/trojan

css-in-js cssnext json-css

Last synced: 5 months ago
JSON representation

JSON-CSS Loader

• Host: GitHub
• URL: https://github.com/t1amat9409/trojan
• Owner: t1amat9409
• License: mit
• Created: 2017-05-26T07:09:17.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2018-01-18T06:52:17.000Z (over 8 years ago)
• Last Synced: 2025-02-06T02:48:31.577Z (over 1 year ago)
• Topics: css-in-js, cssnext, json-css
• Homepage:
• Size: 37.1 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Trojan

JSON-CSS Loader

>Nothing new here, just an experimental mini lib I created and turned to be doing the job. No tests have been made yet, but be free to go through the source code and improve it

```Javascript

//Create a new Trojan object

var style = new Trojan.style("styleID") //or

//create a style obj

var styleObj = {

  "*":{...props}

}

//Declare with local object or remote json data

//Local object, which is our styleObj

style.declare(styleObj).run()

//OR via URL (json)

//url can point to any path that returns an application/json content

style.load("test.json")

//Then you are done!!

```

# TEST.JSON

```json

{

		"*" : {},

		"html" : {

			"background":"teal"

		},

		"ul, div[view]" : {

			"background":"white",

			"list-style":"none",

			"padding":"0.3em",

			"border-radius":"5px"

		},

		"a":{

			"color":"brown",

			"text-decoration":"none",

			"outline":"none"

		},

		".link":{

			"display":"flex",

			"display":"-webkit-flex",

			"line-height":"24pt",

			"align-items":"center",

			"-webkit-align-items":"center",

			"justify-content":"center",

			"-webkit-justify-content":"center",

		},

		".link li":{

			"display":"block",

			"flex":"1",

			"-webkit-flex":"1",

			"text-align":"center",

			"background":"#e3e6eb"

		},

		"h1":{

			"border-bottom":"1px solid #e4e6eb",

			"margin":0,

			"padding":"0.2em",

			"font-size":"18pt"

		}

	}

```