@phun-ky/speccer 4.0.0 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +9 -0
- package/package.json +39 -20
- package/speccer.css +189 -201
- package/speccer.js +261 -228
- package/speccer.min.css +1 -1
- package/src/dissect.js +2 -2
- package/src/lib/resize.js +2 -2
- package/src/measure.js +1 -1
- package/src/spec.js +41 -41
- package/src/{anatomy.styl → styles/anatomy.styl} +59 -73
- package/src/styles/index.styl +26 -0
- package/src/styles/measure.styl +85 -0
- package/src/styles/spacing.styl +142 -0
- package/src/{typography.styl → styles/typography.styl} +1 -1
- package/src/typography.js +2 -2
- package/.eslintignore +0 -1
- package/dev/index.html +0 -472
- package/scripts/watcher.js +0 -125
- package/src/index.styl +0 -2
- package/src/speccer.styl +0 -162
package/scripts/watcher.js
DELETED
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
#!/usr/bin/env node
|
|
2
|
-
/* eslint no-console: 0 */
|
|
3
|
-
|
|
4
|
-
var path = require('path');
|
|
5
|
-
var express = require('express');
|
|
6
|
-
var bodyParser = require('body-parser');
|
|
7
|
-
var http = require('http');
|
|
8
|
-
var net = require('net');
|
|
9
|
-
var reload = require('reload');
|
|
10
|
-
var open = require('open');
|
|
11
|
-
|
|
12
|
-
const async = require('async');
|
|
13
|
-
const { spawn } = require('child_process');
|
|
14
|
-
|
|
15
|
-
var app = express();
|
|
16
|
-
|
|
17
|
-
const __www = path.join(__dirname, '../dev');
|
|
18
|
-
const __www_assets = path.join(__dirname, '../');
|
|
19
|
-
const src = path.join(__dirname, '../src');
|
|
20
|
-
|
|
21
|
-
app.use(
|
|
22
|
-
bodyParser.json({
|
|
23
|
-
type: ['application/manifest+json', 'application/json']
|
|
24
|
-
})
|
|
25
|
-
);
|
|
26
|
-
app.use(express.static(__www));
|
|
27
|
-
app.use('/assets', express.static(__www_assets));
|
|
28
|
-
const server = http.createServer(app);
|
|
29
|
-
|
|
30
|
-
var watcher = require('node-watch')(
|
|
31
|
-
[src, __www],
|
|
32
|
-
{ filter: f => !/node_modules/.test(f), recursive: true },
|
|
33
|
-
function () {}
|
|
34
|
-
);
|
|
35
|
-
|
|
36
|
-
watcher.on('ready', function () {
|
|
37
|
-
console.log('Ready to listen for changes');
|
|
38
|
-
});
|
|
39
|
-
|
|
40
|
-
var portrange = process.env.port || 45032;
|
|
41
|
-
|
|
42
|
-
function getPort(cb) {
|
|
43
|
-
var port = portrange;
|
|
44
|
-
portrange += 1;
|
|
45
|
-
|
|
46
|
-
var server = net.createServer();
|
|
47
|
-
server.listen(port, function () {
|
|
48
|
-
server.once('close', function () {
|
|
49
|
-
cb(port);
|
|
50
|
-
});
|
|
51
|
-
server.close();
|
|
52
|
-
});
|
|
53
|
-
server.on('error', function () {
|
|
54
|
-
getPort(cb);
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
// Reload code here
|
|
59
|
-
|
|
60
|
-
const reloadDev = port => {
|
|
61
|
-
reload(app, { port })
|
|
62
|
-
.then(function (reloadReturned) {
|
|
63
|
-
// reloadReturned is documented in the returns API in the README
|
|
64
|
-
|
|
65
|
-
getPort(startServer);
|
|
66
|
-
|
|
67
|
-
watcher.on('change', function (evt, name) {
|
|
68
|
-
console.log('Changed: ' + name);
|
|
69
|
-
|
|
70
|
-
async.series(
|
|
71
|
-
[
|
|
72
|
-
function (callback) {
|
|
73
|
-
spawn('npm', ['run', 'build'], { stdio: 'inherit' }).on('exit', function (error) {
|
|
74
|
-
if (error) {
|
|
75
|
-
console.error(error);
|
|
76
|
-
}
|
|
77
|
-
callback(null, 'one');
|
|
78
|
-
});
|
|
79
|
-
}
|
|
80
|
-
],
|
|
81
|
-
function (err) {
|
|
82
|
-
if (err) {
|
|
83
|
-
console.log(err);
|
|
84
|
-
}
|
|
85
|
-
reloadReturned.reload();
|
|
86
|
-
}
|
|
87
|
-
);
|
|
88
|
-
});
|
|
89
|
-
})
|
|
90
|
-
.catch(function (err) {
|
|
91
|
-
console.error('Reload could not start, could not start server/sample app', err);
|
|
92
|
-
});
|
|
93
|
-
};
|
|
94
|
-
|
|
95
|
-
getPort(reloadDev);
|
|
96
|
-
|
|
97
|
-
const startServer = function (port) {
|
|
98
|
-
port = process.env.port || port;
|
|
99
|
-
server
|
|
100
|
-
.listen(port, err => {
|
|
101
|
-
if (err) {
|
|
102
|
-
console.error(`Error: ${JSON.stringify(err)}`);
|
|
103
|
-
}
|
|
104
|
-
console.log(`🌎 Open http://localhost:${port} in a browser to view the app.`);
|
|
105
|
-
open(`http://localhost:${port}`);
|
|
106
|
-
})
|
|
107
|
-
.on('error', err => {
|
|
108
|
-
if (err.errno === 'EADDRINUSE') {
|
|
109
|
-
console.error(`Port already in use! Please use another port. Error: ${JSON.stringify(err)}`);
|
|
110
|
-
} else {
|
|
111
|
-
console.error(`Error: ${JSON.stringify(err)}`);
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
process.exit(0);
|
|
115
|
-
});
|
|
116
|
-
};
|
|
117
|
-
|
|
118
|
-
process.on('SIGINT', function () {
|
|
119
|
-
watcher.close();
|
|
120
|
-
process.exit(1);
|
|
121
|
-
});
|
|
122
|
-
process.on('exit', function () {
|
|
123
|
-
watcher.close();
|
|
124
|
-
process.exit(1);
|
|
125
|
-
});
|
package/src/index.styl
DELETED
package/src/speccer.styl
DELETED
|
@@ -1,162 +0,0 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
.speccer
|
|
4
|
-
font-family "Menlo for Powerline", "Menlo Regular for Powerline", "DejaVu Sans Mono", Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace !important
|
|
5
|
-
justify-content center
|
|
6
|
-
align-items center
|
|
7
|
-
z-index 99999
|
|
8
|
-
position absolute
|
|
9
|
-
display flex
|
|
10
|
-
font-size 12px
|
|
11
|
-
line-height 12px
|
|
12
|
-
box-sizing border-box
|
|
13
|
-
transition all .2s cubic-bezier(.4, 0, .2, 1)
|
|
14
|
-
&:hover
|
|
15
|
-
border 1px solid #333
|
|
16
|
-
&.measure
|
|
17
|
-
&.width
|
|
18
|
-
color red
|
|
19
|
-
border 1px solid red
|
|
20
|
-
border-bottom none
|
|
21
|
-
height 8px
|
|
22
|
-
&:after
|
|
23
|
-
content attr(data-measure)
|
|
24
|
-
position absolute
|
|
25
|
-
top calc(-100% - 10px)
|
|
26
|
-
&.bottom
|
|
27
|
-
color red
|
|
28
|
-
border 1px solid red
|
|
29
|
-
border-top none
|
|
30
|
-
&:after
|
|
31
|
-
content attr(data-measure)
|
|
32
|
-
position absolute
|
|
33
|
-
top calc(100% + 5px)
|
|
34
|
-
&.height
|
|
35
|
-
color red
|
|
36
|
-
border 1px solid red
|
|
37
|
-
border-right none
|
|
38
|
-
width 8px
|
|
39
|
-
&:after
|
|
40
|
-
content attr(data-measure)
|
|
41
|
-
position absolute
|
|
42
|
-
top 50%
|
|
43
|
-
left calc(-100% - 25px)
|
|
44
|
-
transform translateY(-50%) rotate(-90deg)
|
|
45
|
-
&.right
|
|
46
|
-
color red
|
|
47
|
-
border 1px solid red
|
|
48
|
-
border-left none
|
|
49
|
-
&:after
|
|
50
|
-
content attr(data-measure)
|
|
51
|
-
position absolute
|
|
52
|
-
top 50%
|
|
53
|
-
left 100%
|
|
54
|
-
transform translateY(-50%) rotate(90deg)
|
|
55
|
-
|
|
56
|
-
.speccer-isSpecced
|
|
57
|
-
&:hover
|
|
58
|
-
& ~ .speccer
|
|
59
|
-
&.margin
|
|
60
|
-
background-color #fff76f
|
|
61
|
-
&.padding
|
|
62
|
-
background-color #db6fff
|
|
63
|
-
color #fff
|
|
64
|
-
|
|
65
|
-
.speccer.margin,
|
|
66
|
-
.speccer.marginBottom,
|
|
67
|
-
.speccer.marginLeft,
|
|
68
|
-
.speccer.marginRight,
|
|
69
|
-
.speccer.marginTop
|
|
70
|
-
background-color rgba(255, 247, 111, .4)
|
|
71
|
-
color #333
|
|
72
|
-
|
|
73
|
-
.speccer.padding,
|
|
74
|
-
.speccer.paddingBottom,
|
|
75
|
-
.speccer.paddingLeft,
|
|
76
|
-
.speccer.paddingRight,
|
|
77
|
-
.speccer.paddingTop
|
|
78
|
-
background-color rgba(219, 111, 255, .4)
|
|
79
|
-
color #ff3aa8
|
|
80
|
-
|
|
81
|
-
.speccer.marginBottom:after,
|
|
82
|
-
.speccer.marginTop:after
|
|
83
|
-
content ""
|
|
84
|
-
position absolute
|
|
85
|
-
height 100%
|
|
86
|
-
border-top 1px solid #333
|
|
87
|
-
border-bottom 1px solid #333
|
|
88
|
-
width 9px
|
|
89
|
-
left 40%
|
|
90
|
-
|
|
91
|
-
.speccer.marginBottom:before,
|
|
92
|
-
.speccer.marginTop:before
|
|
93
|
-
content ""
|
|
94
|
-
position absolute
|
|
95
|
-
height 100%
|
|
96
|
-
border-left 1px solid #333
|
|
97
|
-
margin-left 4px
|
|
98
|
-
width 0
|
|
99
|
-
left 40%
|
|
100
|
-
|
|
101
|
-
.speccer.marginLeft:after,
|
|
102
|
-
.speccer.marginRight:after
|
|
103
|
-
content ""
|
|
104
|
-
position absolute
|
|
105
|
-
height 9px
|
|
106
|
-
border-right 1px solid #ff3aa8
|
|
107
|
-
border-left 1px solid #ff3aa8
|
|
108
|
-
width 100%
|
|
109
|
-
top 10%
|
|
110
|
-
|
|
111
|
-
.speccer.marginLeft:before,
|
|
112
|
-
.speccer.marginRight:before
|
|
113
|
-
content ""
|
|
114
|
-
position absolute
|
|
115
|
-
height 0
|
|
116
|
-
border-top 1px solid #ff3aa8
|
|
117
|
-
margin-top 4px
|
|
118
|
-
width 100%
|
|
119
|
-
top 10%
|
|
120
|
-
|
|
121
|
-
.speccer.paddingBottom:after,
|
|
122
|
-
.speccer.paddingTop:after
|
|
123
|
-
content ""
|
|
124
|
-
position absolute
|
|
125
|
-
height 100%
|
|
126
|
-
border-top 1px solid #ff3aa8
|
|
127
|
-
border-bottom 1px solid #ff3aa8
|
|
128
|
-
width 9px
|
|
129
|
-
left 40%
|
|
130
|
-
|
|
131
|
-
.speccer.paddingBottom:before,
|
|
132
|
-
.speccer.paddingTop:before
|
|
133
|
-
content ""
|
|
134
|
-
position absolute
|
|
135
|
-
height 100%
|
|
136
|
-
border-left 1px solid #ff3aa8
|
|
137
|
-
margin-left 4px
|
|
138
|
-
width 0
|
|
139
|
-
left 40%
|
|
140
|
-
|
|
141
|
-
.speccer.paddingLeft:after,
|
|
142
|
-
.speccer.paddingRight:after
|
|
143
|
-
content ""
|
|
144
|
-
position absolute
|
|
145
|
-
height 9px
|
|
146
|
-
border-right 1px solid #ff3aa8
|
|
147
|
-
border-left 1px solid #ff3aa8
|
|
148
|
-
width 100%
|
|
149
|
-
top 10%
|
|
150
|
-
|
|
151
|
-
.speccer.paddingLeft:before,
|
|
152
|
-
.speccer.paddingRight:before
|
|
153
|
-
content ""
|
|
154
|
-
position absolute
|
|
155
|
-
height 0
|
|
156
|
-
border-top 1px solid #ff3aa8
|
|
157
|
-
margin-top 4px
|
|
158
|
-
width 100%
|
|
159
|
-
top 10%
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
@require './typography.styl'
|