framework/sage
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add option to select CSS framework, add Foundation as an option (#1813)

Browse Source 
* Add option to select CSS framework, add Foundation as an option
This commit is contained in:
Ben Word
2017-01-18 09:05:56 -07:00
committed by GitHub
parent 89b4d1c75d
commit 3909bf76f0
4 changed files with 45 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@@ -1,4 +1,5 @@
### 9.0.0-beta.2: TBD
* Add option to select CSS framework, add Foundation as an option ([#1813](https://github.com/roots/sage/pull/1813))
* Add option to add Font Awesome ([#1812](https://github.com/roots/sage/pull/1812))
* Add option to change theme file headers ([#1811](https://github.com/roots/sage/pull/1811))
* Add option to remove Bootstrap ([#1810](https://github.com/roots/sage/pull/1810))

9
README.md
View File

@@ -13,8 +13,12 @@ Sage is a WordPress starter theme with a modern development workflow.
* ES6 for JavaScript
* [Webpack](https://webpack.github.io/) for compiling assets, optimizing images, and concatenating and minifying files
* [Browsersync](http://www.browsersync.io/) for synchronized browser testing
* [Bootstrap 4](http://getbootstrap.com/) for a front-end framework (option to remove during installation)
* [Laravel's Blade](https://laravel.com/docs/5.3/blade) as a templating engine
* CSS framework options:
* [Bootstrap 4](http://getbootstrap.com/)
* [Foundation](http://foundation.zurb.com/)
* None (blank slate)
See a working example at [roots-example-project.com](https://roots-example-project.com/).
@@ -39,7 +43,8 @@ $ composer create-project roots/sage your-theme-name dev-master
During theme installation you will have the options to:
* Update theme headers (theme name, description, author, etc.)
* Remove Bootstrap
* Select a CSS framework (Bootstrap, Foundation, none)
* Add Font Awesome
## Theme structure

2
composer.json
View File

@@ -43,7 +43,7 @@
],
"post-create-project-cmd": [
"Roots\\Sage\\PostCreateProject::updateHeaders",
"Roots\\Sage\\PostCreateProject::removeBootstrap",
"Roots\\Sage\\PostCreateProject::selectFramework",
"Roots\\Sage\\PostCreateProject::addFontAwesome"
]
}

45
src/lib/Sage/PostCreateProject.php
View File

@@ -35,19 +35,46 @@ class PostCreateProject
}
}
public static function removeBootstrap(Event $event)
public static function selectFramework(Event $event)
{
$io = $event->getIO();
$default_framework_pattern = '"bootstrap": ".*"';
$files_to_clear = [
'assets/styles/components/_comments.scss',
'assets/styles/components/_forms.scss',
'assets/styles/components/_wp-classes.scss',
'assets/styles/layouts/_header.scss',
];
if ($io->isInteractive()) {
if ($io->askConfirmation('<info>Remove Bootstrap?</info> [<comment>y,N</comment>]? ', false)) {
file_put_contents('package.json', str_replace(' "bootstrap": "^4.0.0-alpha.6",' . "\n", '', file_get_contents('package.json')));
file_put_contents('assets/styles/main.scss', str_replace('@import "~bootstrap/scss/bootstrap";' . "\n", '', file_get_contents('assets/styles/main.scss')));
file_put_contents('assets/scripts/main.js', str_replace('import \'bootstrap/dist/js/bootstrap\';' . "\n", '', file_get_contents('assets/scripts/main.js')));
file_put_contents('assets/styles/components/_comments.scss', '');
file_put_contents('assets/styles/components/_forms.scss', '');
file_put_contents('assets/styles/components/_wp-classes.scss', '');
file_put_contents('assets/styles/layouts/_header.scss', '');
$frameworks = [
'Bootstrap',
'Foundation',
'None'
];
$framework = $io->select('<info>Select a CSS framework</info> <comment>(Default: Bootstrap)</comment>', $frameworks, 0);
switch($framework) {
case 0:
break;
case 1:
file_put_contents('package.json', preg_replace("/{$default_framework_pattern}/", '"foundation-sites": "6.3.0"', file_get_contents('package.json')));
file_put_contents('assets/styles/main.scss', str_replace('@import "~bootstrap/scss/bootstrap";' . "\n", '@import "~foundation-sites/scss/foundation";' . "\n" . '@include foundation-everything;' . "\n", file_get_contents('assets/styles/main.scss')));
file_put_contents('assets/scripts/main.js', str_replace("import 'bootstrap/dist/js/bootstrap'\n", "import 'foundation-sites/dist/js/foundation';\n", file_get_contents('assets/scripts/main.js')));
foreach($files_to_clear as $file) {
file_put_contents($file, '');
}
break;
case 2:
file_put_contents('package.json', preg_replace("/\s+{$default_framework_pattern},/", '', file_get_contents('package.json')));
file_put_contents('assets/styles/main.scss', str_replace('@import "~bootstrap/scss/bootstrap";' . "\n", '', file_get_contents('assets/styles/main.scss')));
file_put_contents('assets/scripts/main.js', str_replace("import 'bootstrap/dist/js/bootstrap';\n", '', file_get_contents('assets/scripts/main.js')));
foreach($files_to_clear as $file) {
file_put_contents($file, '');
}
break;
}
}
}