Skip to content
This repository was archived by the owner on Oct 14, 2026. It is now read-only.

Commit 84f4cf5

Browse files
author
James Kolce
committed
[ref: #10] Delete Sass and add variables
1 parent 80cbb26 commit 84f4cf5

13 files changed

Lines changed: 302 additions & 47 deletions

File tree

‎index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ cliparse.parse(cliparse.cli({
1313
commands: [
1414
cliparse.command(
1515
'compile', {
16-
description: 'Compile code from Concise Framework',
16+
description: 'Compile ConciseCSS files to CSS',
1717
args: [
1818
cliparse.argument('input', { description: 'File to compile' }),
1919
cliparse.argument('output', { description: 'Output CSS file' })

‎lib/compile.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
const sass = require('node-sass');
21
const postcss = require('postcss');
2+
const fs = require("fs");
33

44
module.exports = (file) => {
5-
var compiledSass = sass.renderSync({
6-
file: file
7-
}).css;
5+
var source = fs.readFileSync(file, 'utf8');
86

97
return postcss([
108
require('postcss-lh'),
119
require('postcss-custom-media'),
1210
require('postcss-media-minmax'),
11+
require('postcss-advanced-variables'),
12+
require('postcss-nested'),
1313
require('autoprefixer')
14-
]).process(compiledSass).css;
14+
]).process(source).css;
1515
};

‎package.json‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"description": "Command-line Interface for Concise Framework",
55
"main": "index.js",
66
"scripts": {
7-
"test": "tape test"
7+
"test": "tape test/tests.js"
88
},
99
"bin": {
1010
"concisecss": "index.js"
@@ -16,10 +16,12 @@
1616
"cliparse": "^0.2.5",
1717
"node-sass": "^3.7.0",
1818
"postcss": "^5.0.21",
19+
"postcss-advanced-variables": "^1.2.2",
1920
"postcss-custom-media": "^5.0.1",
2021
"postcss-import": "^8.1.2",
2122
"postcss-lh": "^1.1.0",
22-
"postcss-media-minmax": "^2.1.2"
23+
"postcss-media-minmax": "^2.1.2",
24+
"postcss-nested": "^1.0.0"
2325
},
2426
"devDependencies": {
2527
"tape": "^4.5.1"
Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
.color {
2+
color: green;
3+
}
4+
5+
@media (min-width: 600px), handheld and (orientation: landscape) {
6+
.color {
7+
color: green;
8+
}
9+
}
10+
11+
.is-1-equal-to-1 {
12+
color: green;
13+
}
14+
15+
.not-is-1-equal-to-2 {
16+
color: green;
17+
}
18+
19+
.not-number-equal-to-1 {
20+
color: green;
21+
}
22+
23+
.is-number-equal-to-5 {
24+
color: green;
25+
}
26+
27+
.is-1-not-equal-to-2 {
28+
color: green;
29+
}
30+
31+
.is-1-less-than-2 {
32+
color: green;
33+
}
34+
35+
.is-1-greater-than-0 {
36+
color: green;
37+
}
38+
39+
.is-1-less-than-or-equal-to-1 {
40+
color: green;
41+
}
42+
43+
.is-1-less-than-or-equal-to-2 {
44+
color: green;
45+
}
46+
47+
.is-1-less-than-or-equal-to-0 {
48+
color: green;
49+
}
50+
51+
.is-1-less-than-or-equal-to-1 {
52+
color: green;
53+
}
54+
55+
.for-1 {
56+
width: 1px;
57+
}
58+
59+
.for-3 {
60+
width: 3px;
61+
}
62+
63+
.for-5 {
64+
width: 5px;
65+
}
66+
67+
.for-6 {
68+
height: 6px;
69+
}
70+
71+
.for-4 {
72+
height: 4px;
73+
}
74+
75+
.for-2 {
76+
height: 2px;
77+
}
78+
79+
.test-foo {
80+
color: green;
81+
}
82+
83+
.test-bar {
84+
color: green;
85+
}
86+
87+
.test-baz {
88+
color: green;
89+
}
Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
$pass: green !default;
2+
$fail: red;
3+
$width: 600px;
4+
$number: 5;
5+
6+
.color {
7+
color: $pass;
8+
}
9+
10+
$orientation: landscape;
11+
12+
@media (min-width: $width), handheld and (orientation: $orientation) {
13+
$pass: white !default;
14+
15+
.color {
16+
color: $pass;
17+
}
18+
}
19+
20+
@if 1 == 1 {
21+
.is-1-equal-to-1 {
22+
color: $pass;
23+
}
24+
} @else {
25+
.not-is-1-equal-to-1 {
26+
color: $fail;
27+
}
28+
}
29+
30+
@if 1 == 2 {
31+
.is-1-equal-to-2 {
32+
color: $fail;
33+
}
34+
} @else {
35+
.not-is-1-equal-to-2 {
36+
color: $pass;
37+
}
38+
}
39+
40+
@if $number == 1 {
41+
.is-number-equal-to-1 {
42+
color: $fail;
43+
}
44+
} @else {
45+
.not-number-equal-to-1 {
46+
color: $pass;
47+
}
48+
}
49+
50+
@if $number == 5 {
51+
.is-number-equal-to-5 {
52+
color: $pass;
53+
}
54+
} @else {
55+
.not-number-equal-to-5 {
56+
color: $fail;
57+
}
58+
}
59+
60+
@if 1 != 1 {
61+
.is-1-not-equal-to-1 {
62+
color: $fail;
63+
}
64+
}
65+
66+
@if 1 != 2 {
67+
.is-1-not-equal-to-2 {
68+
color: $pass;
69+
}
70+
}
71+
72+
@if 1 < 0 {
73+
.is-1-less-than-0 {
74+
color: $fail;
75+
}
76+
}
77+
78+
@if 1 < 1 {
79+
.is-1-less-than-1 {
80+
color: $fail;
81+
}
82+
}
83+
84+
@if 1 < 2 {
85+
.is-1-less-than-2 {
86+
color: $pass;
87+
}
88+
}
89+
90+
@if 1 > 0 {
91+
.is-1-greater-than-0 {
92+
color: $pass;
93+
}
94+
}
95+
96+
@if 1 > 1 {
97+
.is-1-greater-than-1 {
98+
color: $fail;
99+
}
100+
}
101+
102+
@if 1 > 2 {
103+
.is-1-greater-than-2 {
104+
color: $fail;
105+
}
106+
}
107+
108+
@if 1 <= 0 {
109+
.is-1-less-than-or-equal-to-0 {
110+
color: $fail;
111+
}
112+
}
113+
114+
@if 1 <= 1 {
115+
.is-1-less-than-or-equal-to-1 {
116+
color: $pass;
117+
}
118+
}
119+
120+
@if 1 <= 2 {
121+
.is-1-less-than-or-equal-to-2 {
122+
color: $pass;
123+
}
124+
}
125+
126+
@if 1 >= 0 {
127+
.is-1-less-than-or-equal-to-0 {
128+
color: $pass;
129+
}
130+
}
131+
132+
@if 1 >= 1 {
133+
.is-1-less-than-or-equal-to-1 {
134+
color: $pass;
135+
}
136+
}
137+
138+
@if 1 >= 2 {
139+
.is-1-less-than-or-equal-to-2 {
140+
color: $fail;
141+
}
142+
}
143+
144+
@for $i from 1 to 5 by 2 {
145+
.for-$i {
146+
width: $(i)px;
147+
}
148+
}
149+
150+
@for $i from 6 to 1 by 2 {
151+
.for-$i {
152+
height: $(i)px;
153+
}
154+
}
155+
156+
@each $i in (foo, bar, baz) {
157+
.test-$i {
158+
color: $pass;
159+
}
160+
}
File renamed without changes.
File renamed without changes.
File renamed without changes.

0 commit comments

Comments
 (0)