FazBrowse GitHub Viewer | Trending |
URL:
| Home
Tools: [Download Repo ZIP]   [Original HTTPS Page]

- rollback CSS changes · devhttps/frontend@fe3de36 · GitHub

/ frontend Public
forked from guardian/frontend

Commit fe3de36

Browse files
Regis Kuckaertz
committed
- rollback CSS changes
- use config hook provided by library - boostrap atom environment
1 parent d9d3678 commit fe3de36

8 files changed

Lines changed: 73 additions & 183 deletions

File tree

‎static/src/javascripts/projects/atoms/env.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// @flow
2+
3+
const css = {
4+
variables: {
5+
'--f-serif-text': '"Guardian Text Egyptian Web", Georgia, serif',
6+
'--f-serif-headline': '"Guardian Egyptian Web", Georgia, serif',
7+
'--f-sans-serif-text':
8+
'"Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif',
9+
'--f-sans-serif-headline':
10+
'"Guardian Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif',
11+
},
12+
};
13+
14+
const env = { css };
15+
16+
export { env };

‎tools/__tasks__/compile/css/atoms.js‎

Lines changed: 0 additions & 53 deletions
This file was deleted.

‎tools/__tasks__/compile/css/index.dev.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,5 @@ module.exports = {
55
require('./mkdir'),
66
require('../images'),
77
require('./sass'),
8-
require('./atoms'),
98
],
109
};

‎tools/__tasks__/compile/css/index.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,5 @@ module.exports = {
66
require('../images'),
77
require('./update-caniuse'),
88
require('./sass'),
9-
require('./atoms'),
109
],
1110
};

‎tools/atomVars.js‎

Lines changed: 0 additions & 10 deletions
This file was deleted.

‎tools/compile-css.js‎

Lines changed: 56 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
// 1. glob for files in static/src/stylesheets
55
// 2. options object offering `remify` (boolean) and `browsers` (browserlist)
66

7+
const fs = require('fs');
78
const path = require('path');
89

910
const mkdirp = require('mkdirp');
@@ -12,7 +13,12 @@ const pify = require('pify');
1213

1314
const sass = require('node-sass');
1415

16+
const postcss = require('postcss');
17+
const autoprefixer = require('autoprefixer');
18+
const pxtorem = require('postcss-pxtorem');
19+
1520
const sassRenderP = pify(sass.render);
21+
const writeFileP = pify(fs.writeFile);
1622

1723
const { src, target } = require('./__tasks__/config').paths;
1824

@@ -24,9 +30,35 @@ const SASS_SETTINGS = {
2430
precision: 5,
2531
};
2632

33+
const BROWSERS_LIST = [
34+
'Firefox >= 26',
35+
'Explorer >= 10',
36+
'Safari >= 5',
37+
'Chrome >= 36',
38+
39+
'iOS >= 5',
40+
'Android >= 2',
41+
'BlackBerry >= 6',
42+
'ExplorerMobile >= 7',
43+
44+
'> 2% in US',
45+
'> 2% in AU',
46+
'> 2% in GB',
47+
];
48+
49+
const REMIFICATIONS = {
50+
replace: true,
51+
root_value: 16,
52+
unit_precision: 5,
53+
propList: ['*'],
54+
};
55+
2756
const getFiles = sassGlob => glob.sync(path.resolve(sassDir, sassGlob));
2857

29-
module.exports = sassGlob => {
58+
module.exports = (
59+
sassGlob,
60+
{ remify = true, browsers = BROWSERS_LIST } = {}
61+
) => {
3062
if (typeof sassGlob !== 'string') {
3163
return Promise.reject(new Error('No glob provided.'));
3264
}
@@ -48,12 +80,29 @@ module.exports = sassGlob => {
4880
SASS_SETTINGS
4981
);
5082

83+
const postcssPlugins = [autoprefixer({ browsers })];
84+
if (remify) {
85+
postcssPlugins.push(pxtorem(REMIFICATIONS));
86+
}
87+
5188
mkdirp.sync(path.parse(dest).dir);
52-
return sassRenderP(sassOptions).then(result => ({
53-
content: result,
54-
filePath,
55-
dest,
56-
}));
89+
return sassRenderP(sassOptions)
90+
.then(result =>
91+
postcss(postcssPlugins).process(result.css.toString(), {
92+
from: filePath,
93+
to: dest,
94+
map: {
95+
inline: false,
96+
prev: result.map.toString(),
97+
},
98+
})
99+
)
100+
.then(result =>
101+
Promise.all([
102+
writeFileP(dest, result.css),
103+
writeFileP(`${dest}.map`, result.map),
104+
])
105+
);
57106
})
58107
);
59-
};
108+
};

‎tools/postcss.js‎

Lines changed: 0 additions & 65 deletions
This file was deleted.

‎webpack.config.js‎

Lines changed: 1 addition & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -86,52 +86,7 @@ module.exports = {
8686
exclude: /(node_modules)/,
8787
loader: 'svg-loader',
8888
},
89-
{
90-
test: /\.css$/,
91-
exclude: /(node_modules)/,
92-
use: ['style-loader', 'css-loader', {
93-
loader: 'postcss-loader',
94-
options: {
95-
ident: 'postcss',
96-
plugins: [
97-
require('autoprefixer')({
98-
browsers: [
99-
'Firefox >= 26',
100-
'Explorer >= 10',
101-
'Safari >= 5',
102-
'Chrome >= 36',
103-
104-
'iOS >= 5',
105-
'Android >= 2',
106-
'BlackBerry >= 6',
107-
'ExplorerMobile >= 7',
108-
109-
'> 2% in US',
110-
'> 2% in AU',
111-
'> 2% in GB',
112-
],
113-
}),
114-
require('postcss-pxtorem')({
115-
replace: true,
116-
root_value: 16,
117-
unit_precision: 5,
118-
propList: ['*'],
119-
}),
120-
require('postcss-css-variables')({
121-
variables: {
122-
'--f-serif-text': '"Guardian Text Egyptian Web", Georgia, serif'
123-
'--f-serif-headline': '"Guardian Egyptian Web", Georgia, serif',
124-
'--f-sans-serif-text':
125-
'"Guardian Text Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif',
126-
'--f-sans-serif-headline':
127-
'"Guardian Sans Web", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif',
128-
},
129-
})
130-
]
131-
}
132-
}],
133-
},
134-
...require('@guardian/atom-renderer/webpack-module-rules'),
89+
...require('@guardian/atom-renderer/webpack/frontend'),
13590
],
13691
},
13792
plugins: [

0 commit comments

Comments
 (0)
Back | FazBrowse Home | New Git URL