Skip to content
This repository has been archived by the owner on Jan 23, 2018. It is now read-only.

refactoring to allow partials without css #49

Merged
merged 1 commit into from
Mar 22, 2016
Merged

refactoring to allow partials without css #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 22 additions & 5 deletions scripts/build-scss.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,29 @@ var fs = require(`fs`);
var autoprefixer = require(`autoprefixer`);
var postcss = require(`postcss`);

// Include any template specific CSS
var sourceFiles = shell.ls(`src/templates`).map(name => {
return `templates/${name}`;
return `templates/${name}/style.scss`;
});

// Include any partial specific CSS (TODO: Remove this once partials have no CSS)
sourceFiles = sourceFiles.concat(shell.ls(`src/partials`).map(name => {
return `partials/${name}`;
return `partials/${name}/style.scss`;
}));

// Include CSS for all templates and partials
sourceFiles.push(`main.scss`);

// Filter out any missing SCSS files
var filteredFiles = [];

sourceFiles.forEach((file) => {
if (shell.test(`-e`, `src/${file}`)) {
filteredFiles.push(file);
}
});

// Add vendor prefixes to unprefixed CSS
var autoprefix = (unprefixedCSS, callback) => {
postcss([autoprefixer]).process(unprefixedCSS).then((prefixedCSS) => {
prefixedCSS.warnings().forEach((warn) => {
Expand All @@ -26,15 +41,17 @@ var autoprefix = (unprefixedCSS, callback) => {

sourceFiles.forEach((template) => {
sass.render({
file: `src/${template}/style.scss`
file: `src/${template}`
}, (error, result) => {
if (!error) {
autoprefix(result.css, (autoprefixed) => {
fs.writeFile(`demo/${template}/style.css`, autoprefixed, (error2) => {
let targetFile = `demo/${template}`.replace(`scss`, `css`);

fs.writeFile(targetFile, autoprefixed, (error2) => {
if (error2) {
console.error(error2);
} else {
console.log(`Generated CSS at: demo/${template}/style.css`);
console.log(`Generated CSS: ${targetFile}`);
}
});
});
Expand Down
7 changes: 7 additions & 0 deletions src/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,14 @@
<html>
<head>
<!-- UI for preview switching -->
<link rel="stylesheet" href="style.css" type="text/css">

<!-- Mozmaker library -->
<link rel="stylesheet" href="mozmaker.css" type="text/css">

<!-- CSS for all templates and partials -->
<link rel="stylesheet" href="main.css" type="text/css">

<link href='https://fonts.googleapis.com/css?family=Fira+Sans:400,300,500' rel='stylesheet' type='text/css'>

<title>Mozmaker Templates</title>
Expand Down