https://github.com/kujirahand/mkcss.php
CSS Generator (altCSS) for PHP
https://github.com/kujirahand/mkcss.php
css-generator php
Last synced: 11 months ago
JSON representation
CSS Generator (altCSS) for PHP
- Host: GitHub
- URL: https://github.com/kujirahand/mkcss.php
- Owner: kujirahand
- License: mit
- Created: 2015-10-28T15:05:13.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2020-03-22T12:32:40.000Z (over 6 years ago)
- Last Synced: 2025-03-25T21:47:45.715Z (about 1 year ago)
- Topics: css-generator, php
- Language: PHP
- Homepage:
- Size: 10.7 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# mkcss.php
CSS generator (altCSS / CSS Preprocessor / CSS Compiler).
Easy way to generate CSS. The format is tab indent data, like YAML.
## Required
PHP 5.3 (tested by PHP 5.5)
# How to use
When you use command line:
```
$ php mkcss.php test.mkcss
```
When you use browser:
```
http://example.com/mkcss.php?f=test
```
HTML:
```
...
...
```
# examples
## Simple example
Simple example source:
```
// simple example
body:
background-color: black
color: white
#hoge:
background-color: white
color: red
#fuga:
background-color: blue
color: white
```
Simple example generated:
```
body { background-color: black; color: white; }
#hoge { background-color: white; color: red; }
#fuga { background-color: blue; color: white; }
```
## Variable
source:
```
$main_color = #ff0000
$sub_color = #ff00ff
$back_color = black
#head:
background-color: $back_color
color: $main_color
```
generated:
```
#head { background-color: black; color: #ff0000; }
```
## Calc parameters
source:
```
body:
font-size: 1 + 2 * 3 + 4px
```
generated:
```
body { font-size: 11px; }
```
## Mixin
- define: @mixin name(v1:default1, v2:default2, ...)
- include: @include name(v1, v2, ...)
source:
```
// mixin sample
@mixin set_basic($front:white, $back:black):
background-color: $front
color: $back
body:
@include set_basic(black, white)
#hoge:
@include set_basic()
```
generated:
```
body { background-color: black; color: white; }
#hoge { background-color: white; color: black; }
```
## Nested style
source:
```
table:
border: 1px solid black
th:
font-size: 14px
font-weight: bold
td:
font-size: 12px
background-color: white
```
generated:
```
table { border: 1px solid black; }
table th { font-size: 14px; font-weight: bold; }
table td { font-size: 12px; background-color: white; }
```