diff --git a/.github/workflows/ci-frontend.yml b/.github/workflows/ci-frontend.yml
index 3894a2d469..26940ef530 100644
--- a/.github/workflows/ci-frontend.yml
+++ b/.github/workflows/ci-frontend.yml
@@ -13,7 +13,7 @@ jobs:
- uses: actions/setup-node@v2-beta
with:
- node-version: '12'
+ node-version: '14'
- uses: actions/cache@v2
with:
diff --git a/groundcontrol/tasks/build-gc-skeleton.js b/groundcontrol/tasks/build-gc-skeleton.js
index 7e4db387d0..c540f7c2c0 100644
--- a/groundcontrol/tasks/build-gc-skeleton.js
+++ b/groundcontrol/tasks/build-gc-skeleton.js
@@ -56,8 +56,6 @@ export default function createBuildGroundControlSkeletonTask(skeletonPath, names
fs.writeFileSync(adminJsPath + '/admin-bundle-extra.js', 'console.log(\'Hello world from admin\');\n');
fs.ensureDirSync(scssPath);
fs.writeFileSync(scssPath + '/style.scss', 'body { font-size: 20px; }\n');
- // Style guide
- fs.copySync(skeletonPath + '/../Resources/ui/styleguide', appPath + '/Resources/ui/styleguide');
// Index.html
const html = `
diff --git a/src/Kunstmaan/GeneratorBundle/Command/GenerateDefaultSiteCommand.php b/src/Kunstmaan/GeneratorBundle/Command/GenerateDefaultSiteCommand.php
index 34c9b422ce..429849eb96 100644
--- a/src/Kunstmaan/GeneratorBundle/Command/GenerateDefaultSiteCommand.php
+++ b/src/Kunstmaan/GeneratorBundle/Command/GenerateDefaultSiteCommand.php
@@ -28,6 +28,11 @@ class GenerateDefaultSiteCommand extends KunstmaanGenerateCommand
*/
private $demosite;
+ /**
+ * @var bool
+ */
+ private $webpackEncore;
+
/**
* @see Command
*/
@@ -48,6 +53,7 @@ protected function configure()
->addOption('namespace', '', InputOption::VALUE_OPTIONAL, 'The namespace to generate the default website in')
->addOption('prefix', '', InputOption::VALUE_OPTIONAL, 'The prefix to be used in the table names of the generated entities')
->addOption('demosite', '', InputOption::VALUE_NONE, 'Whether to generate a website with demo contents or a basic website')
+ ->addOption('webpack-encore', '', InputOption::VALUE_NONE, 'Whether to use Webpack Encore or Groundcontrol as FE build tools')
->addOption('browsersync', '', InputOption::VALUE_OPTIONAL, 'The URI that will be used for browsersync to connect')
->addOption('articleoverviewpageparent', '', InputOption::VALUE_OPTIONAL, 'Shortnames of the pages that can have the article overview page as a child (comma separated)')
->setName('kuma:generate:default-site');
@@ -87,12 +93,18 @@ protected function doExecute()
$browserSyncUrl = $this->assistant->getOptionOrDefault('browsersync', null);
+ /*
+ * If we need to generate a full site, or only the basic structure
+ */
+ $this->webpackEncore = $this->assistant->getOption('webpack-encore');
+
// First we generate the layout if it is not yet generated
$command = $this->getApplication()->find('kuma:generate:layout');
$arguments = [
'command' => 'kuma:generate:layout',
'--namespace' => str_replace('\\', '/', $this->bundle->getNamespace()),
'--demosite' => $this->demosite,
+ '--webpack-encore' => $this->webpackEncore,
'--browsersync' => $browserSyncUrl,
'--subcommand' => true,
];
diff --git a/src/Kunstmaan/GeneratorBundle/Command/GenerateLayoutCommand.php b/src/Kunstmaan/GeneratorBundle/Command/GenerateLayoutCommand.php
index 8e3a982693..076143ac28 100644
--- a/src/Kunstmaan/GeneratorBundle/Command/GenerateLayoutCommand.php
+++ b/src/Kunstmaan/GeneratorBundle/Command/GenerateLayoutCommand.php
@@ -37,6 +37,7 @@ protected function configure()
->addOption('namespace', '', InputOption::VALUE_OPTIONAL, 'The namespace of the bundle where we need to create the layout in')
->addOption('subcommand', '', InputOption::VALUE_OPTIONAL, 'Whether the command is called from an other command or not')
->addOption('demosite', '', InputOption::VALUE_NONE, 'Pass this parameter when the demosite styles/javascipt should be generated')
+ ->addOption('webpack-encore', '', InputOption::VALUE_NONE, 'Pass this parameter to use Webpack Encore in favor of Groundcontrol')
->addOption('browsersync', '', InputOption::VALUE_OPTIONAL, 'The URI that will be used for browsersync to connect')
->setName('kuma:generate:layout');
}
@@ -63,7 +64,7 @@ protected function doExecute()
}
$rootDir = $this->getApplication()->getKernel()->getProjectDir() . '/';
- $this->createGenerator()->generate($this->bundle, $rootDir, $this->assistant->getOption('demosite'), $this->browserSyncUrl);
+ $this->createGenerator()->generate($this->bundle, $rootDir, $this->assistant->getOption('demosite'), $this->browserSyncUrl, $this->assistant->getOption('webpack-encore'));
if (!$this->isSubCommand()) {
$this->assistant->writeSection('Layout successfully created', 'bg=green;fg=black');
diff --git a/src/Kunstmaan/GeneratorBundle/Command/InstallCommand.php b/src/Kunstmaan/GeneratorBundle/Command/InstallCommand.php
index c5a30c93f2..aca48dc496 100644
--- a/src/Kunstmaan/GeneratorBundle/Command/InstallCommand.php
+++ b/src/Kunstmaan/GeneratorBundle/Command/InstallCommand.php
@@ -55,6 +55,7 @@ protected function configure()
[
new InputOption('db-installed', '', InputOption::VALUE_NONE, 'Acknowledge that you have setup your database"'),
new InputOption('demosite', '', InputOption::VALUE_REQUIRED, 'Do you want to create a "demosite"'),
+ new InputOption('webpack-encore', '', InputOption::VALUE_REQUIRED, 'Do you want to use Webpack Encore in stead of Groundcontrol'),
new InputOption('create-tests', '', InputOption::VALUE_REQUIRED, 'Do you want to create tests for you pages/pageparts'),
new InputOption('namespace', '', InputOption::VALUE_OPTIONAL, 'The namespace of the bundle to create (only for SF3)'),
new InputOption('dir', '', InputOption::VALUE_OPTIONAL, 'The directory where to create the bundle (only for SF3)'),
@@ -112,6 +113,11 @@ protected function interact(InputInterface $input, OutputInterface $output)
$input->setOption('demosite', $demoSiteOption === true ? 'Yes' : 'No');
}
+ if (null === $input->getOption('webpack-encore')) {
+ $webpackEncoreOption = $this->assistant->askConfirmation('Do you want to use Webpack Encore in stead of Groundcontrol? (y/n)', 'n');
+ $input->setOption('webpack-encore', $webpackEncoreOption === true ? 'Yes' : 'No');
+ }
+
if (null === $input->getOption('create-tests')) {
$createTests = $this->assistant->askConfirmation('Do you want to create tests for you pages/pageparts? (y/n)', 'n', '?', false);
$input->setOption('create-tests', $createTests === true ? 'Yes' : 'No');
@@ -138,6 +144,10 @@ protected function execute(InputInterface $input, OutputInterface $output)
$defaultSiteOptions['--demosite'] = true;
}
+ if ($input->getOption('webpack-encore') === 'Yes') {
+ $defaultSiteOptions['--webpack-encore'] = true;
+ }
+
if (Kernel::VERSION_ID < 40000) {
$defaultSiteOptions = ['--namespace' => $input->getOption('namespace')];
@@ -207,14 +217,14 @@ protected function executeCommand(OutputInterface $output, $command, array $opti
protected function getKunstmaanLogo()
{
return '
- /$$ /$$ /$$ /$$$$$$
- | $$ /$$/ | $$ /$$__ $$
+ /$$ /$$ /$$ /$$$$$$
+ | $$ /$$/ | $$ /$$__ $$
| $$ /$$/ /$$ /$$ /$$$$$$$ /$$$$$$$ /$$$$$$ /$$$$$$/$$$$ /$$$$$$ /$$$$$$ /$$$$$$$ | $$ \__/ /$$$$$$/$$$$ /$$$$$$$
| $$$$$/ | $$ | $$| $$__ $$ /$$_____/|_ $$_/ | $$_ $$_ $$ |____ $$ |____ $$| $$__ $$| $$ | $$_ $$_ $$ /$$_____/
- | $$ $$ | $$ | $$| $$ \ $$| $$$$$$ | $$ | $$ \ $$ \ $$ /$$$$$$$ /$$$$$$$| $$ \ $$| $$ | $$ \ $$ \ $$| $$$$$$
+ | $$ $$ | $$ | $$| $$ \ $$| $$$$$$ | $$ | $$ \ $$ \ $$ /$$$$$$$ /$$$$$$$| $$ \ $$| $$ | $$ \ $$ \ $$| $$$$$$
| $$\ $$ | $$ | $$| $$ | $$ \____ $$ | $$ /$$| $$ | $$ | $$ /$$__ $$ /$$__ $$| $$ | $$| $$ $$| $$ | $$ | $$ \____ $$
| $$ \ $$| $$$$$$/| $$ | $$ /$$$$$$$/ | $$$$/| $$ | $$ | $$| $$$$$$$| $$$$$$$| $$ | $$| $$$$$$/| $$ | $$ | $$ /$$$$$$$/
- |__/ \__/ \______/ |__/ |__/|_______/ \___/ |__/ |__/ |__/ \_______/ \_______/|__/ |__/ \______/ |__/ |__/ |__/|_______/
+ |__/ \__/ \______/ |__/ |__/|_______/ \___/ |__/ |__/ |__/ \_______/ \_______/|__/ |__/ \______/ |__/ |__/ |__/|_______/
';
}
diff --git a/src/Kunstmaan/GeneratorBundle/Generator/DefaultSiteGenerator.php b/src/Kunstmaan/GeneratorBundle/Generator/DefaultSiteGenerator.php
index d35a0bfeac..1341c43a63 100644
--- a/src/Kunstmaan/GeneratorBundle/Generator/DefaultSiteGenerator.php
+++ b/src/Kunstmaan/GeneratorBundle/Generator/DefaultSiteGenerator.php
@@ -31,6 +31,11 @@ class DefaultSiteGenerator extends KunstmaanGenerator
*/
private $demosite;
+ /**
+ * @var bool
+ */
+ private $webpackEncore;
+
/**
* Generate the website.
*
@@ -38,12 +43,13 @@ class DefaultSiteGenerator extends KunstmaanGenerator
* @param string $rootDir
* @param bool $demosite
*/
- public function generate(BundleInterface $bundle, $prefix, $rootDir, $demosite = false)
+ public function generate(BundleInterface $bundle, $prefix, $rootDir, $demosite = false, $webpackEncore = false)
{
$this->bundle = $bundle;
$this->prefix = GeneratorUtils::cleanPrefix($prefix);
$this->rootDir = $rootDir;
$this->demosite = $demosite;
+ $this->webpackEncore = $webpackEncore;
$parameters = [
'namespace' => $this->bundle->getNamespace(),
@@ -53,6 +59,7 @@ public function generate(BundleInterface $bundle, $prefix, $rootDir, $demosite =
'demosite' => $this->demosite,
'multilanguage' => $this->isMultiLangEnvironment(),
'isV4' => $this->isSymfony4(),
+ 'webpackEncore' => $this->webpackEncore,
];
$this->generateControllers($parameters);
diff --git a/src/Kunstmaan/GeneratorBundle/Generator/LayoutGenerator.php b/src/Kunstmaan/GeneratorBundle/Generator/LayoutGenerator.php
index 59288ecaee..05fdd1a58b 100644
--- a/src/Kunstmaan/GeneratorBundle/Generator/LayoutGenerator.php
+++ b/src/Kunstmaan/GeneratorBundle/Generator/LayoutGenerator.php
@@ -34,22 +34,33 @@ class LayoutGenerator extends KunstmaanGenerator
*/
private $browserSyncUrl;
+ /**
+ * @var bool
+ */
+ private $webpackEncore;
+
/**
* Generate the basic layout.
*
* @param BundleInterface $bundle The bundle
* @param string $rootDir The root directory of the application
*/
- public function generate(BundleInterface $bundle, $rootDir, $demosite, $browserSyncUrl)
+ public function generate(BundleInterface $bundle, $rootDir, $demosite, $browserSyncUrl, $webpackEncore)
{
$this->bundle = $bundle;
$this->rootDir = $rootDir;
$this->demosite = $demosite;
$this->browserSyncUrl = $browserSyncUrl;
+ $this->webpackEncore = $webpackEncore;
$this->shortBundleName = '@' . str_replace('Bundle', '', $bundle->getName());
- $this->generateGroundcontrolFiles();
+ $this->generateSharedConfigFiles();
+ if ($webpackEncore) {
+ $this->generateWebpackEncoreFiles();
+ } else {
+ $this->generateGroundcontrolFiles();
+ }
$this->generateAssets();
$this->generateTemplate();
}
@@ -68,53 +79,89 @@ private function generateGroundcontrolFiles()
$this->renderSingleFile(
$this->skeletonDir . '/groundcontrol/',
$this->rootDir,
- '.babelrc',
- ['bundle' => $this->bundle],
+ 'gulpfile.babel.js',
+ ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'isV4' => $this->isSymfony4()],
true
);
$this->renderSingleFile(
$this->skeletonDir . '/groundcontrol/',
$this->rootDir,
- '.eslintrc',
+ 'package.json',
['bundle' => $this->bundle, 'demosite' => $this->demosite],
true
);
+ $this->assistant->writeLine('Generating groundcontrol configuration : OK');
+ }
+
+ /**
+ * Generate the Webpack Encore configuration files.
+ */
+ private function generateWebpackEncoreFiles()
+ {
$this->renderSingleFile(
- $this->skeletonDir . '/groundcontrol/',
+ $this->skeletonDir . '/webpack-encore/',
$this->rootDir,
- '.nvmrc',
- ['bundle' => $this->bundle],
+ 'package.json',
+ ['bundle' => $this->bundle, 'demosite' => $this->demosite],
true
);
$this->renderSingleFile(
- $this->skeletonDir . '/groundcontrol/',
+ $this->skeletonDir . '/webpack-encore/',
$this->rootDir,
- '.stylelintrc',
- ['bundle' => $this->bundle],
+ 'postcss.config.js',
+ [],
true
);
- $this->renderExecutableFile(
- $this->skeletonDir . '/groundcontrol/',
+ $this->renderSingleFile(
+ $this->skeletonDir . '/webpack-encore/',
$this->rootDir,
- 'buildUI.sh',
- ['bundle' => $this->bundle],
+ 'webpack.config.js',
+ ['browserSyncUrl' => $this->browserSyncUrl],
true
);
+ $this->assistant->writeLine('Generating webpack encore configuration : OK');
+ }
+
+ /**
+ * Generate shared (groundcontrol & webpack encore) configuration files.
+ */
+ private function generateSharedConfigFiles()
+ {
$this->renderSingleFile(
- $this->skeletonDir . '/groundcontrol/',
+ $this->skeletonDir . '/frontend-config/',
$this->rootDir,
- 'gulpfile.babel.js',
- ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'isV4' => $this->isSymfony4()],
+ '.babelrc',
+ ['bundle' => $this->bundle],
true
);
$this->renderSingleFile(
- $this->skeletonDir . '/groundcontrol/',
+ $this->skeletonDir . '/frontend-config/',
$this->rootDir,
- 'package.json',
+ '.eslintrc',
['bundle' => $this->bundle, 'demosite' => $this->demosite],
true
);
- $this->assistant->writeLine('Generating groundcontrol configuration : OK');
+ $this->renderSingleFile(
+ $this->skeletonDir . '/frontend-config/',
+ $this->rootDir,
+ '.nvmrc',
+ ['bundle' => $this->bundle],
+ true
+ );
+ $this->renderSingleFile(
+ $this->skeletonDir . '/frontend-config/',
+ $this->rootDir,
+ '.stylelintrc',
+ ['bundle' => $this->bundle],
+ true
+ );
+ $this->renderExecutableFile(
+ $this->skeletonDir . '/frontend-config/',
+ $this->rootDir,
+ 'buildUI.sh',
+ ['bundle' => $this->bundle],
+ true
+ );
}
/**
@@ -129,13 +176,19 @@ private function generateAssets()
$this->renderFiles(
$sourceDir . $relPath . '/js/',
$this->getAssetsDir($this->bundle) . '/ui/js/',
- ['bundle' => $this->bundle, 'demosite' => $this->demosite],
+ ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'webpack' => $this->webpackEncore],
true
);
$this->renderFiles(
$sourceDir . $relPath . '/scss/',
$this->getAssetsDir($this->bundle) . '/ui/scss/',
- ['bundle' => $this->bundle, 'demosite' => $this->demosite],
+ ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'webpack' => $this->webpackEncore],
+ true
+ );
+ $this->renderFiles(
+ $sourceDir . '/Resources/admin/',
+ $this->getAssetsDir($this->bundle) . '/admin/',
+ ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'webpack' => $this->webpackEncore],
true
);
@@ -204,8 +257,16 @@ private function generateAssets()
$this->removeDirectory($this->getAssetsDir($this->bundle) . '/ui/scss/helpers/mixins/');
}
- $relPath = '/Resources/admin/';
- $this->copyFiles($sourceDir . $relPath, $this->getAssetsDir($this->bundle) . '/admin', true);
+ if ($this->webpackEncore) {
+ $this->renderSingleFile(
+ $sourceDir . $relPath . 'js/',
+ $this->getAssetsDir($this->bundle) . '/ui/',
+ 'app.js',
+ ['demosite' => $this->demosite, 'webpack' => $this->webpackEncore],
+ true
+ );
+ $this->removeFile($this->getAssetsDir($this->bundle) . '/ui/js/app.js');
+ }
$this->assistant->writeLine('Generating ui assets : OK');
}
@@ -219,7 +280,13 @@ private function generateTemplate()
$this->renderFiles(
$this->skeletonDir . $relPath,
$this->getTemplateDir($this->bundle),
- ['bundle' => $this->bundle, 'demosite' => $this->demosite, 'shortBundleName' => $this->shortBundleName, 'isV4' => $this->isSymfony4()],
+ [
+ 'bundle' => $this->bundle,
+ 'demosite' => $this->demosite,
+ 'shortBundleName' => $this->shortBundleName,
+ 'isV4' => $this->isSymfony4(),
+ 'webpack' => $this->webpackEncore,
+ ],
true
);
@@ -229,6 +296,12 @@ private function generateTemplate()
$this->removeFile($this->getTemplateDir($this->bundle) . '/Layout/_demositemessage.html.twig');
}
+ if ($this->webpackEncore) {
+ $this->removeFile($this->getTemplateDir($this->bundle) . '/Layout/_js_footer.html.twig');
+ } else {
+ $this->removeFile($this->getTemplateDir($this->bundle) . '/Layout/_js.html.twig');
+ }
+
$this->assistant->writeLine('Generating template files : OK');
}
}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/js/admin-bundle-extra.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-bundle-extra.js
similarity index 53%
rename from src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/js/admin-bundle-extra.js
rename to src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-bundle-extra.js
index ceed9da5de..88a9c62636 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/js/admin-bundle-extra.js
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-bundle-extra.js
@@ -1,8 +1,25 @@
+{% if webpack %}
+/* global $:readonly */
+
+import './admin-style.scss';
+
+document.onreadystatechange = () => {
+ // if you want to use jQuery
+ if (document.readyState === 'complete') {
+ initExtraAdminJs();
+ }
+};
+
+function initExtraAdminJs() {
+ console.log($);
+}
+{% else %}
/**
- *
+ *
* Extra Javascript that needs to be implemented for the KunstmaanBundlesCMS can be written in this file/folder.
*
* The Javascript will be bundled & compiled when the `npm run build` command has run. The compiled JS will be at:
* web/frontend/js/admin-bundle-extra.js and will be included automatically in all of the KunstmaanBundlesCMS layouts.
- *
+ *
*/
+{% endif %}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-style.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-style.scss
new file mode 100644
index 0000000000..0a2e0f4be9
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/admin/admin-style.scss
@@ -0,0 +1,72 @@
+{% set pathPrefix = '../ui/scss/' %}
+{% if webpack -%}
+{% set pathPrefix = '~scssRootDir/' %}
+{% endif %}
+@charset "UTF-8";
+
+/* ==========================================================================
+ Extra Stylesheet for admin
+ ========================================================================== */
+
+/* Config (necessary only)
+ ========================================================================== */
+@import "{{ pathPrefix }}config/general/colors";
+@import "{{ pathPrefix }}config/general/typography/fonts";
+@import "{{ pathPrefix }}config/general/typography/bodycopy";
+@import "{{ pathPrefix }}config/general/sizes";
+@import "{{ pathPrefix }}config/general/paths";
+
+/* Vendors - only vars!
+ ========================================================================== */
+@import "{{ pathPrefix }}config/vendors/bootstrap-vars"{% if demosite %};
+@import "{{ pathPrefix }}config/vendors/cargobay-vars"{% endif %};
+
+/* General
+ ========================================================================== */
+@import "{{ pathPrefix }}general/typography/iconfont";
+
+/* Helpers
+ ========================================================================== */
+@import "{{ pathPrefix }}helpers/helpers";
+
+
+/* Use these styling only in the pagepart previews
+ ========================================================================== */
+.page-template__region .admin-region,
+.pp__view .pp__view__block:first-child {
+
+ /* General
+ ========================================================================== */
+ @import "{{ pathPrefix }}general/typography/bodycopy";
+
+ /* Blocks
+ ========================================================================== */
+ @import "{{ pathPrefix }}components/blocks/img";
+ @import "{{ pathPrefix }}components/blocks/hr";
+ @import "{{ pathPrefix }}components/blocks/lists";
+ @import "{{ pathPrefix }}components/blocks/links";
+ @import "{{ pathPrefix }}components/blocks/buttons";
+ @import "{{ pathPrefix }}components/blocks/tables";
+
+ /* Structures
+ ========================================================================== */
+{% if demosite %}
+ @import "{{ pathPrefix }}components/structures/header-visual";
+ @import "{{ pathPrefix }}components/structures/submenu";
+{% endif %}
+
+ /* Pageparts
+ ========================================================================== */
+ @import "{{ pathPrefix }}components/pageparts/button-pp";
+ @import "{{ pathPrefix }}components/pageparts/download-pp";
+ @import "{{ pathPrefix }}components/pageparts/header-pp";
+ @import "{{ pathPrefix }}components/pageparts/image-pp";
+ @import "{{ pathPrefix }}components/pageparts/introtext-pp";
+ @import "{{ pathPrefix }}components/pageparts/link-pp";
+{% if demosite %}
+ @import "{{ pathPrefix }}components/pageparts/service-pp";
+{% endif %}
+ @import "{{ pathPrefix }}components/pageparts/text-pp";
+ @import "{{ pathPrefix }}components/pageparts/totop-pp";
+ @import "{{ pathPrefix }}components/pageparts/video-pp";
+}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/js/app.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/js/app.js
index 2ff3cc89b4..9d476b200b 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/js/app.js
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/js/app.js
@@ -1,16 +1,26 @@
+{% set pathPrefix = './' %}
+{% if webpack -%}
+{% set pathPrefix = './js/' %}
+{% endif %}
import 'picturefill';
{% if demosite %}
-import velocity from 'velocity-animate'; // eslint-disable-line
+import 'velocity-animate';
import cbScrollToTop from 'cargobay/src/scroll-to-top/js/jquery.scroll-to-top';
import cbSidebarToggle from 'cargobay/src/sidebar-toggle/js/jquery.sidebar-toggle';
import cbToggle from 'cargobay/src/toggle/js/jquery.toggle';
+{% endif %}
+
+{% if webpack %}
+import './scss/style.scss';
-import search from './search';
-import demoMsg from './demoMsg';
{% endif %}
-import cookieConsent from './cookieConsent';
-import videolink from './videolink';
+{% if demosite %}
+import search from '{{ pathPrefix }}search';
+import demoMsg from '{{ pathPrefix }}demoMsg';
+{% endif %}
+import cookieConsent from '{{ pathPrefix }}cookieConsent';
+import videolink from '{{ pathPrefix }}videolink';
{% if demosite %}
$(() => {
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/admin-style.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/admin-style.scss
deleted file mode 100644
index c8a9d5274e..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/admin-style.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-@charset "UTF-8";
-
-/* ==========================================================================
- Extra Stylesheet for admin
- ========================================================================== */
-
-/* Config (necessary only)
- ========================================================================== */
-@import "config/general/colors";
-@import "config/general/typography/fonts";
-@import "config/general/typography/bodycopy";
-@import "config/general/sizes";
-@import "config/general/paths";
-
-/* Vendors - only vars!
- ========================================================================== */
-@import "config/vendors/bootstrap-vars"{% if demosite %};
-@import "config/vendors/cargobay-vars"{% endif %};
-
-/* General
- ========================================================================== */
-@import "general/typography/iconfont";
-
-/* Helpers
- ========================================================================== */
-@import "helpers/helpers";
-
-
-/* Use these styling only in the pagepart previews
- ========================================================================== */
-.page-template__region .admin-region,
-.pp__view .pp__view__block:first-child {
-
- /* General
- ========================================================================== */
- @import "general/typography/bodycopy";
-
- /* Blocks
- ========================================================================== */
- @import "components/blocks/img";
- @import "components/blocks/hr";
- @import "components/blocks/lists";
- @import "components/blocks/links";
- @import "components/blocks/buttons";
- @import "components/blocks/tables";
-
- /* Structures
- ========================================================================== */
-{% if demosite %}
- @import "components/structures/header-visual";
- @import "components/structures/submenu";
-{% endif %}
-
- /* Pageparts
- ========================================================================== */
- @import "components/pageparts/button-pp";
- @import "components/pageparts/download-pp";
- @import "components/pageparts/header-pp";
- @import "components/pageparts/image-pp";
- @import "components/pageparts/introtext-pp";
- @import "components/pageparts/link-pp";
-{% if demosite %}
- @import "components/pageparts/service-pp";
-{% endif %}
- @import "components/pageparts/text-pp";
- @import "components/pageparts/totop-pp";
- @import "components/pageparts/video-pp";
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/components/blocks/_buttons.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/components/blocks/_buttons.scss
index d05640b83b..db8b10b7ff 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/components/blocks/_buttons.scss
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/components/blocks/_buttons.scss
@@ -30,9 +30,9 @@
text-align: center;
text-decoration: none;
vertical-align: middle;
+ white-space: nowrap;
cursor: pointer;
- white-space: nowrap;
user-select: none;
transition: background .3s ease-in-out;
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/_paths.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/_paths.scss
index fa95568ac8..da6b620410 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/_paths.scss
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/_paths.scss
@@ -24,6 +24,10 @@ $general: "#{$root}/img/general";
{% if demosite %}
/* Font folders
========================================================================== */
+{% if webpack %}
+$iconfont-path: "~scssRootDir/../fonts/iconfont/fonts";
+{% else %}
$iconfont-path: "#{$root}/fonts/iconfont/fonts";
+{% endif %}
$webfont-path: "#{$root}/fonts/webfont/fonts";
-{% endif %}
\ No newline at end of file
+{% endif %}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/typography/_fonts.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/typography/_fonts.scss
index 93e4e9cc8b..15d82c9dc3 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/typography/_fonts.scss
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/scss/config/general/typography/_fonts.scss
@@ -8,10 +8,10 @@
/* Webfonts
========================================================================== */
{% if demosite %}
-$primary-font: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
-$secondary-font: Arial, sans-serif;
+$primary-font: "Lato", "Helvetica Neue", helvetica, arial, sans-serif;
+$secondary-font: arial, sans-serif;
{% else %}
-$primary-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
+$primary-font: "Helvetica Neue", helvetica, arial, sans-serif;
$secondary-font: "Times New Roman", serif;
{% endif %}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/MobileNav.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/MobileNav.js
deleted file mode 100644
index cfedaa58eb..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/MobileNav.js
+++ /dev/null
@@ -1,58 +0,0 @@
-import {TweenLite, Power4} from 'gsap/TweenLite';
-import 'gsap/ScrollToPlugin';
-
-export default class MobileNav {
-
- constructor() {
- const CLASSES = {
- button: 'js-mobile-nav-btn',
- mobileSubnav: 'js-mobile-subnav',
- mobileNav: 'js-mobile-nav',
- activeClass: 'mobile-nav-open'
- };
- const scrollOffset = 80;
- const toTopOffset = 150;
-
- const button = document.querySelectorAll(`.${CLASSES.button}`)[0];
- const nav = document.querySelectorAll(`.${CLASSES.mobileNav}`)[0];
- const subnav = document.querySelectorAll(`.${CLASSES.mobileSubnav}`)[0];
-
- this.CLASSES = CLASSES;
- this.scrollOffset = scrollOffset;
- this.toTopOffset = toTopOffset;
- this.button = button;
- this.nav = nav;
- this.subnav = subnav;
-
- button && this._initMobileNav();
- subnav && this._initMobileSubnav();
- }
-
- _initMobileNav() {
- this.button.addEventListener('click', () => {
- if (this.button.classList.contains(this.CLASSES.activeClass)) {
- this.nav.classList.remove(this.CLASSES.activeClass);
- this.button.classList.remove(this.CLASSES.activeClass);
- } else {
- this.nav.classList.add(this.CLASSES.activeClass);
- this.button.classList.add(this.CLASSES.activeClass);
- }
- });
- };
-
- _initMobileSubnav() {
- this.subnav.addEventListener('change', (e) => {
- const target = (e.currentTarget).value;
-
- if (target) {
- TweenLite.to(window, .3, {
- scrollTo: {
- y: `${target}`,
- offsetY: this.scrollOffset
- },
- ease: Power4.easeOut
- });
- }
- }, false);
- };
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Scrollspy.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Scrollspy.js
deleted file mode 100644
index 71289c0831..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Scrollspy.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import 'bootstrap.native/dist/polyfill';
-import bsn from 'bootstrap.native';
-
-export default class Scrollspy {
-
- constructor() {
- // Add scrollspy to subnav
- new bsn.ScrollSpy(document.getElementById('spy-content'), {
- target: document.getElementById('subnav')
- });
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Toggle.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Toggle.js
deleted file mode 100644
index 021c9aeed9..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/Toggle.js
+++ /dev/null
@@ -1,80 +0,0 @@
-import {TweenLite, Power4} from 'gsap/TweenLite';
-import 'gsap/CSSPlugin';
-
-export default class Toggle {
-
- constructor() {
- const CLASSES = {
- trigger: 'js-sg-toggle-trigger',
- content: 'js-sg-toggle-content'
- };
- const defaultDuration = 0.3; // in seconds
-
- Array.prototype.forEach.call(document.querySelectorAll(`.${CLASSES.trigger}`), (el) => {
- const target = document.querySelectorAll(el.getAttribute('data-target'))[0];
-
- this.addMultiEventistener(el, 'click touchstart mousedown', (e) => {
- e.preventDefault();
- });
-
- this.addMultiEventistener(el, 'touchend mouseup', () => {
- const targetContent = target.querySelectorAll(`.${CLASSES.content}`)[0];
- const currentTargetIsOpen = el.getAttribute('aria-expanded') === 'true';
-
- currentTargetIsOpen ? this.hideContent(el, target, targetContent, true) : this.showContent(el, target, targetContent, true);
- });
-
- // Check if hide/show on load
- if (target) {
- const targetContent = target.querySelectorAll(`.${CLASSES.content}`)[0];
-
- if (targetContent && el.getAttribute('aria-expanded') === 'true') {
- this.showContent(el, target, targetContent);
- } else if (targetContent) {
- this.hideContent(el, target, targetContent);
- }
- }
- });
-
- this.defaultDuration = defaultDuration;
- }
-
- hideContent(trigger, target, targetContent, smoothAnimation, animationDuration) {
- trigger.setAttribute('aria-expanded', false);
-
- if (smoothAnimation) {
- TweenLite.to(targetContent, animationDuration || this.defaultDuration, {
- height: 0,
- ease: Power4.easeOut
- });
- } else {
- targetContent.style.height = 0;
- }
- }
-
- showContent(trigger, target, targetContent, smoothAnimation, animationDuration) {
- trigger.setAttribute('aria-expanded', true);
-
- if (smoothAnimation) {
- TweenLite.set(targetContent, {
- height: 'auto',
- ease: Power4.easeOut
- });
- TweenLite.from(targetContent, animationDuration || this.defaultDuration, {
- height: 0,
- ease: Power4.easeOut
- });
- } else {
- targetContent.style.height = 'auto';
- }
- }
-
- // Add multiple listeners
- addMultiEventistener(el, s, fn) {
- const evts = s.split(' ');
-
- for (let i = 0, iLen = evts.length; i < iLen; i += 1) {
- el.addEventListener(evts[i], fn, false);
- }
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/styleguide.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/styleguide.js
deleted file mode 100644
index 2a21bb8051..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/js/styleguide.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import 'prismjs';
-import 'prismjs/components/prism-markup';
-import Clipboard from 'clipboard';
-
-import Scrollspy from './Scrollspy';
-import MobileNav from './MobileNav';
-import Toggle from './Toggle';
-
-document.addEventListener('DOMContentLoaded', () => {
- new Clipboard('.js-clipboard-code');
-
- new Scrollspy();
- new MobileNav();
- new Toggle();
-});
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/_components.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/_components.scss
deleted file mode 100644
index 4a283c5b6e..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/_components.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-/* ==========================================================================
- Components
-
- Never add styles directly to this file - set up imports
- ========================================================================== */
-
-
-/* Blocks
- ========================================================================== */
-@import "blocks/code";
-@import "blocks/img";
-@import "blocks/links";
-
-
-/* Structures
- ========================================================================== */
-@import "structures/cards";
-@import "structures/colors";
-@import "structures/icons";
-@import "structures/sections";
-@import "structures/code-snippet";
-
-
-/* Header
- ========================================================================== */
-@import "header/main-header";
-
-
-/* Content
- ========================================================================== */
-@import "content/main-content";
-
-
-/* Vendors
- ========================================================================== */
-@import "vendors/bootstrap-components/grid";
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_code.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_code.scss
deleted file mode 100644
index 7e72f24e4a..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_code.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-/* ==========================================================================
- Blocks - Code
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-styleguide {
-
- code:not(.sg-code) {
- padding: 1px 3px;
-
- background: $grey--light;
-
- border: 1px solid $grey;
- border-radius: 3px;
-
- color: $red;
- font-family: 'Monaco', 'Menlo', 'Consolas', 'Courier New', 'monospace';
- font-size: 12px;
-
- white-space: nowrap;
- }
-
- pre {
- background: $primary-color--dark;
-
- code:not(.sg-code) {
- }
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_img.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_img.scss
deleted file mode 100644
index 3a10c7c59d..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_img.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-/* ==========================================================================
- Images
- ========================================================================== */
-
-/* Shared
- ========================================================================== */
-img {
- max-width: 100%;
- height: auto;
- max-height: 100%;
-}
-
-figure {
- margin: 0;
-
- img {
- display: block;
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_links.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_links.scss
deleted file mode 100644
index aa1caf3975..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/blocks/_links.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-/* ==========================================================================
- Links
- ========================================================================== */
-
-/* Shared
- ========================================================================== */
-a {
- transition: color .3s ease;
-
- color: $link-color;
- text-decoration: underline;
-
- &:hover {
- text-decoration: none;
- color: $link-color--hover;
- }
-}
\ No newline at end of file
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/content/_main-content.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/content/_main-content.scss
deleted file mode 100644
index 1c4786fb61..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/content/_main-content.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-/* ==========================================================================
- Main content
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-content {
- position: relative;
-
- padding: 100px 20px 50px;
- overflow: hidden;
-
- @media (min-width: $screen-md-min) {
- padding: 20px 50px 20px 410px;
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/header/_main-header.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/header/_main-header.scss
deleted file mode 100644
index cd0cd7b83e..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/header/_main-header.scss
+++ /dev/null
@@ -1,387 +0,0 @@
-/* ==========================================================================
- Header - Main header
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-header {
- position: fixed;
- z-index: 1000;
-
- display: block;
- width: 100%;
- padding: 0 20px;
- margin: 0 0 50px;
-
- background: $white;
- box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .12), 0 2px 10px 0 rgba(0, 0, 0, .08);
-
- border-bottom: 1px solid $grey;
-
- font-family: $primary-font;
-
- @media (min-width: $screen-md-min) {
- position: fixed;
- top: 0;
- bottom: 0;
- left: 0;
-
- display: flex;
- flex-direction: column;
- width: 360px;
- height: 100%;
- padding: 0;
- margin: 0;
- overflow-y: auto;
- }
-}
-
-
-/* Brand
- ========================================================================== */
-.sg-header__brand {
- position: relative;
- z-index: 1;
-
- display: inline-block;
- width: 180px;
- margin-top: 8px;
-
- text-decoration: none;
-
- a {
- display: inline-block;
- padding: 10px 0;
-
- span {
- display: none;
- }
-
- &:hover {
- text-decoration: none;
- }
- }
-
- @media (min-width: $screen-md-min) {
- display: block;
- width: 100%;
-
- a {
- display: block;
- padding: 20px 50px;
-
- text-align: left;
- }
- }
-}
-
-.sg-header__brand__logo {
- display: inline-block;
- width: 100%;
-}
-
-/* Navigation
- ========================================================================== */
-.sg-header__nav {
- max-height: 0;
- overflow: auto;
-
- transition: max-height .3s ease;
-
- &.mobile-nav-open {
- max-height: 500px; // big enough
-
- border-top: 1px solid $grey--light;
- }
-
- @media (min-width: $screen-md-min) {
- max-height: none;
-
- border-top: none;
- }
-}
-
-/* Mobile toggle button
- ========================================================================== */
-.sg-header__nav__btn {
- float: right;
- margin: 10px 0 0;
- padding: 1.25em 1em;
-
- box-shadow: none;
- border: none;
- appearance: none;
- background: none;
-
- font-size: 12px;
- line-height: 1;
- color: $grey;
-
- transition: color .3s ease;
-
- &:focus, &:active {
- color: $grey;
- outline: none;
- }
-
- &:hover {
- color: $white;
- }
-
- @media (min-width: $screen-md-min) {
- display: none;
- }
-}
-
-/* Hamburger
- ========================================================================== */
-.sg-header__nav__btn__icon {
- position: relative;
-
- width: 28px;
- height: 20px;
- padding: 0;
- margin: 0;
- transform: rotate(0deg);
-
- box-shadow: none;
-
- line-height: 1;
-
- transition: .5s ease-in-out;
- cursor: pointer;
-
- span {
- position: absolute;
-
- display: block;
- height: 2px;
- width: 50%;
-
- background: $black;
-
- opacity: 1;
- transform: rotate(0deg);
- transition: .25s ease-in-out;
-
- &:nth-child(even) {
- left: 50%;
-
- border-radius: 0 2px 2px 0;
- }
-
- &:nth-child(odd) {
- left: 0;
-
- border-radius: 2px 0 0 2px;
- }
-
- &:nth-child(1),
- &:nth-child(2) {
- top: 0;
- }
-
- &:nth-child(3),
- &:nth-child(4) {
- top: 8px;
- }
-
- &:nth-child(5),
- &:nth-child(6) {
- top: 16px;
- }
- }
-
- .mobile-nav-open & {
-
- span {
-
- &:nth-child(1),
- &:nth-child(6) {
- transform: rotate(45deg);
- }
-
- &:nth-child(2),
- &:nth-child(5) {
- transform: rotate(-45deg);
- }
-
- &:nth-child(1) {
- left: 3px;
- top: 6px;
- }
-
- &:nth-child(2) {
- left: calc(50% - 3px);
- top: 6px;
- }
-
- &:nth-child(3) {
- left: -50%;
-
- opacity: 0;
- }
-
- &:nth-child(4) {
- left: 100%;
-
- opacity: 0;
- }
-
- &:nth-child(5) {
- top: 14px;
- left: 3px;
- }
-
- &:nth-child(6) {
- top: 14px;
- left: calc(50% - 3px);
- }
- }
- }
-}
-
-
-/* Navigation
- ========================================================================== */
-.sg-header__nav__list {
- margin: 0 0 20px;
-
- text-align: right;
-
- ul, & {
- padding: 0;
- list-style: none;
- }
-
- @media (max-width: $screen-sm-max) {
- ul {
- display: none;
- }
- }
-}
-
-.sg-header__nav__list__item {
- display: block;
- margin: 20px 0 0;
-
- text-align: left;
-
- a {
- display: block;
- padding: 5px 10px;
-
- color: $black;
- font-size: 16px;
- font-weight: bold;
- text-decoration: none;
-
- transition: color .3s ease, border .3s ease;
-
- &:hover {
- border-color: $grey;
-
- color: $black;
- text-decoration: none;
- }
- }
-
- &.active {
- border-bottom: 0;
-
- > ul {
- display: block;
-
- border-top: 1px solid $grey;
- }
-
- > a {
- margin-bottom: -1px;
-
- border-color: $primary-color;
-
- color: $primary-color--dark;
- }
- }
-
- ul {
-
- li {
- position: relative;
-
- &.children {
- > a:before {
- display: block;
- }
- }
-
- a {
- position: relative;
-
- padding: 6px 24px;
-
- border-bottom: 1px solid $grey;
-
- font-weight: normal;
- font-size: 14px;
-
- &:before {
- content: ' ';
-
- position: absolute;
- top: 0;
- bottom: 0;
- left: -5px;
-
- width: 5px;
-
- background: $grey--dark;
-
- transition: transform .25s ease;
- }
-
- &:hover {
-
- &:before {
- transform: translate3d(5px, 0, 0);
- }
- }
- }
-
- &.active {
-
- > a {
- font-weight: bold;
-
- &:before {
- transform: translate3d(5px, 0, 0);
- }
- }
-
- ul {
- display: block;
- }
- }
-
- ul {
- display: none;
-
- background: $grey--light;
-
- li {
-
- a {
- padding: 6px 24px 6px 36px;
-
- &:hover {
-
- &:before {
- display: block;
- }
- }
- }
- }
- }
- }
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_cards.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_cards.scss
deleted file mode 100644
index e2fa0509ce..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_cards.scss
+++ /dev/null
@@ -1,236 +0,0 @@
-/* ==========================================================================
- Structures - Cards
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-card {
- position: relative;
-
- margin: 0 0 15px;
-
- background: $white;
- border: 1px solid $grey;
-
- border-radius: 4px;
-
- & + & {
- margin-top: 30px;
- }
-}
-
-.sg-card__anchor {
- position: relative;
-
- padding: 30px 0 10px;
-}
-
-/* Title
- ========================================================================== */
-.sg-card__heading {
- padding: 10px 15px;
- margin: 0;
-
- border-radius: 4px 4px 0 0;
- border-bottom: 1px solid $grey;
-
- color: $black;
- font-family: $primary-font;
- font-size: 21px;
-
- &:target:before {
- content: ' ';
-
- display: block;
- height: 100px;
- margin: -100px 0 0;
- }
-}
-
-
-/* Body
- ========================================================================== */
-.sg-card__body {
-
- @media (min-width: $screen-sm-min) {
- display: flex;
- width: 100%;
- }
-
- &--full-width {
- display: block;
-
- .sg-card__example,
- .sg-card__description {
- width: 100%;
- }
- }
-}
-
-.sg-card__example {
- flex: 1 1 auto;
- padding: 15px;
- //max-width: 1190px;
-
- small {
- display: block;
- margin: 0 0 5px;
-
- font-size: 12px;
- color: $black;
- }
-
- > p:first-child {
- margin-top: 0;
- }
-
- @media (min-width: $screen-sm-min) {
- width: 60%;
- }
-
- // override the bootstrap container width as this conflicts with the IotaCSS container class
- .container {
- width: auto;
- }
-}
-
-.sg-card__description {
- flex: 1 1 auto;
-
- font-size: 14px;
- line-height: 1.4;
-
- p {
- margin: 1em 0;
-
- + strong {
- display: block;
- margin-top: 2em;
- }
- }
-
- ul {
- padding: 0;
- margin: 0 10px;
-
- list-style: none;
-
- li {
- position: relative;
-
- padding: 0 0 15px 15px;
- margin: 0;
-
- line-height: 1.6;
-
- &:before {
- content: '-';
-
- position: absolute;
- left: 0;
- }
- }
- }
-
- blockquote {
- padding-left: 16px;
- margin: 16px 0 16px 2px;
-
- border-left: 3px solid $grey;
- }
-
- @media (min-width: $screen-sm-min) {
- width: 40%;
- }
-}
-
-.sg-card__description__inner {
- padding: 15px;
-
- > p:first-child + .sg-title {
- margin-top: 0;
- }
-
- pre {
- background: none;
-
- code {
- display: block;
- }
- }
-}
-
-/* Toggle
- ========================================================================== */
-.sg-card__footer {
- background: lighten($grey--light, 2.5);
-
- border-radius: 0 0 4px 4px;
-}
-
-.sg-card__footer__toggle {
- line-height: 1;
-}
-
-.sg-card__footer__toggle__button {
- position: relative;
-
- display: inline-block;
- width: 100%;
- padding: 8px 20px;
- margin: 0;
-
- background: none;
-
- border: none;
- border-top: 1px solid $grey;
- border-bottom: 1px solid $grey;
- border-radius: 0;
- outline: none;
-
- color: $grey--dark;
- font-size: 14px;
- line-height: 1;
- text-align: center;
- text-transform: uppercase;
-
- appearance: none;
- cursor: pointer;
- user-select: none;
- vertical-align: middle;
- white-space: nowrap;
-
- transition: color .3s ease;
-
- &:hover {
- color: $black;
- }
-
- .hide-code {
- display: none;
- }
-
- &.active {
-
- .hide-code {
- display: block;
- }
-
- .show-code {
- display: none;
- }
- }
-}
-
-.sg-card__footer__toggle__content {
- position: relative;
-
- display: block;
- overflow: hidden;
-}
-
-/* Markup
- ========================================================================== */
-.sg-card__footer__toggle__content__code-snippet {
- position: relative;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_code-snippet.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_code-snippet.scss
deleted file mode 100644
index b29b6a2ef0..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_code-snippet.scss
+++ /dev/null
@@ -1,116 +0,0 @@
-$code-block-gutter: 2px;
-
-.code-snippet-container {
- display: flex;
- margin: -#{$code-block-gutter / 2};
-}
-
-.code-snippet {
- position: relative;
-
- display: flex;
- flex: 1 1 0;
- padding: 0 #{$code-block-gutter / 2};
- max-height: 500px;
- min-width: 0;
-}
-
-pre.code-snippet__code-block {
- width: 100%;
- margin: 0;
-
- background: $primary-color--dark;//#192E47;
-
- font-size: 13px;
-}
-
-/* Clipboard
- ========================================================================== */
-.code-snippet__copy {
- position: absolute;
- top: 10px;
- right: 10px;
-
- > button {
- position: relative;
- z-index: 1;
-
- display: inline-block;
- padding: .15em .5em;
-
- background: $primary-color--dark;
-
- border: 0;
- border-radius: 8px;
-
- color: $grey;
- font-size: 14px;
-
- appearance: none;
-
- transition: background-color .3s ease, color .3s ease;
-
- &:hover {
- background: $white;
-
- color: $primary-color--dark;
-
- .tooltip--info {
- transform: translate3d(-50%, 0, 0);
-
- opacity: 1;
- }
- }
-
- &:focus {
- outline: none;
-
- .tooltip--success {
- transform: translate3d(-50%, 0, 0);
-
- opacity: 1;
- }
-
- .tooltip--info {
- opacity: 0;
- }
- }
- }
-
- .tooltip {
- position: absolute;
- bottom: -50px;
- left: 50%;
- z-index: -1;
-
- display: inline-block;
- padding: .5em 1em;
- transform: translate3d(-50%, -20px, 0);
-
- background: $primary-color;
- opacity: 0;
-
- border-radius: 3px;
-
- color: $white;
- font-weight: bold;
- white-space: nowrap;
-
- transition: opacity .2s ease, transform .3s ease;
-
- &:after {
- content: ' ';
-
- position: absolute;
- top: -6px;
- left: calc(50% - 6px);
-
- display: block;
- width: 12px;
- height: 12px;
- transform: rotate3d(0, 0, 1, 45deg);
-
- background: $primary-color;
- }
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_colors.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_colors.scss
deleted file mode 100644
index 144770b1c1..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_colors.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ==========================================================================
- Structures - Color cards
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-color {
- display: inline-block;
- width: calc((100% - 60px) / 3);
- max-width: 140px;
- margin: 10px;
-
- border-radius: 4px;
-
- box-shadow: 0 0 4px 0 rgba(0, 0, 0, .35), 0 3px 2px 0 rgba(0, 0, 0, .18);
-}
-
-
-/* Wrapper
- ========================================================================== */
-.sg-color__wrapper {
- display: flex;
- flex-wrap: wrap;
-}
-
-
-/* Color
- ========================================================================== */
-.sg-color__color {
- display: block;
- height: 100px;
-
- border-radius: 4px 4px 0 0;
- border-bottom: 1px solid $grey;
-
- color: $white;
- vertical-align: middle;
- text-align: center;
-}
-
-.sg-color__color__text {
- position: relative;
- top: 50%;
-
- transform: translateY(-50%);
-}
-
-/* Description
- ========================================================================== */
-.sg-color__description {
- padding: 0 8px 8px;
-}
-
-.sg-color__description__title {
- margin-top: 10px;
-
- color: $black;
- font-size: 14px;
- font-family: $primary-font;
- font-weight: bold;
-}
-
-.sg-color__description__value {
- margin-bottom: 5px;
-
- color: $grey--dark;
- font-size: 15px;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_icons.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_icons.scss
deleted file mode 100644
index 5bd7112626..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_icons.scss
+++ /dev/null
@@ -1,58 +0,0 @@
-/* ==========================================================================
- Structures - Icons
- ========================================================================== */
-
-/* General
- ========================================================================== */
-.sg-icon-wrapper {
- display: flex;
- flex-wrap: wrap;
-}
-
-.sg-icon {
- display: inline-block;
- flex: 0 1 auto;
- width: auto;
- margin: 10px 20px 10px 0;
-
- border-radius: 4px;
-
- box-shadow: 0 0 4px 0 rgba(0, 0, 0, .35), 0 3px 2px 0 rgba(0, 0, 0, .18);
-}
-
-/* Color
- ========================================================================== */
-.sg-icon__icon {
- display: flex;
- align-items: center;
- justify-content: center;
- height: 60px;
-
- border-bottom: 1px solid $grey;
-
- text-align: center;
- vertical-align: middle;
-
- img {
- display: block;
- margin: 20px;
- max-height: 80%;
- }
-}
-
-/* Description
- ========================================================================== */
-.sg-icon__description {
- padding: 10px;
-
- background: rgba($grey--light, .5);
-
- border-radius: 0 0 4px 4px;
-
- color: $red;
- font-family: 'Monaco', 'Menlo', 'Consolas', 'Courier New', 'monospace';
- font-size: 12px;
- text-align: center;
-
- white-space: nowrap;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_sections.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_sections.scss
deleted file mode 100644
index b1d1edaf93..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/structures/_sections.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-/* ==========================================================================
- Structures - Sections
- ========================================================================== */
-
-.section {
-
- & + & {
- margin-top: 50px;
- }
-}
-
-.section__title {
- margin-bottom: 20px;
-
- color: $black;
- font-family: $primary-font;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/vendors/bootstrap-components/_grid.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/vendors/bootstrap-components/_grid.scss
deleted file mode 100644
index d9643b079f..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/components/vendors/bootstrap-components/_grid.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-/* ==========================================================================
- Bootstrap grid adjustments
- ========================================================================== */
-
-
-/* Container
- ========================================================================== */
-.container--styleguide {
- width: 100% !important;
- max-width: 1700px !important;
-}
\ No newline at end of file
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/_config.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/_config.scss
deleted file mode 100644
index 7dcb3e6c16..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/_config.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-/* ==========================================================================
- Config
-
- This file is exclusively intended for setting up imports
- Never add styles directly to this file
- ========================================================================== */
-
-/* General
- ========================================================================== */
-@import "general/colors",
- "general/sizes";
-
-@import "general/typography/fonts",
- "general/typography/bodycopy",
- "general/typography/headings";
-
-
-/* Vendors
- ========================================================================== */
-@import "vendors/bootstrap-vars";
-@import "vendors/bootstrap-imports";
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_colors.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_colors.scss
deleted file mode 100644
index f3a7e0910c..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_colors.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-/* ==========================================================================
- Colors
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- ========================================================================== */
-
-/* Colors
- ========================================================================== */
-$black: #373737;
-$white: #FFFFFF;
-
-$grey--dark: #808080;
-$grey: #D8D8D8;
-$grey--light: #f3f3f3;
-
-$red: #dd1144;
-
-$primary-color--dark: #1D2948;
-$primary-color: #009EE3;
-
-/* Specifics
- ========================================================================== */
-$text-color: $black;
-$link-color: $primary-color;
-$link-color--hover: darken($primary-color, 15%);
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_sizes.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_sizes.scss
deleted file mode 100644
index cc584c09d7..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/_sizes.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-/* ==========================================================================
- Sizes
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- ========================================================================== */
-
-
-/* Margins
- ========================================================================== */
-$default-margin: 15px;
-
-
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_bodycopy.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_bodycopy.scss
deleted file mode 100644
index 372deb428c..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_bodycopy.scss
+++ /dev/null
@@ -1,23 +0,0 @@
-/* ==========================================================================
- Bodycopy
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- ========================================================================== */
-
-/* Line-height
- ========================================================================== */
-$line-height--base: 1.6;
-
-$line-height--small: 1.1;
-$line-height--medium: 1.2;
-
-$line-height--headers: 1;
-
-
-/* Font sizes
- ========================================================================== */
-$font-size--base: 10px;
-$font-size--default: 16px;
-$font-size--small: 12px;
-$font-size--big: 18px;
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_fonts.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_fonts.scss
deleted file mode 100644
index 8ad9d9ef8b..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_fonts.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-/* ==========================================================================
- Fonts
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- ========================================================================== */
-
-/* Webfonts
- ========================================================================== */
-$primary-font: 'Lato', Helvetica, Arial, sans-serif;
-
-
-/* Iconfonts
- ========================================================================== */
-@font-face {
- font-family: 'icomoon';
- src: url("data:application/x-font-ttf;charset=utf-8;base64,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") format('truetype');
- font-weight: normal;
- font-style: normal;
-}
-
-/* Defaults
- ========================================================================== */
-$font-family--base: $primary-font;
-$font-family--headings: $font-family--base;
-$font-family--buttons: $font-family--base;
\ No newline at end of file
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_headings.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_headings.scss
deleted file mode 100644
index 987daeb93a..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/general/typography/_headings.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-/* ==========================================================================
- Headings
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- sizes are defined without unit to enable the use of the rem function
- ========================================================================== */
-
-$line-height--headers: 1.2;
-
-$font-size-h1: 45px;
-$font-size-h1--small: 32px;
-$font-size-h2: 32px;
-$font-size-h3: 23px;
-$font-size-h4: 23px;
-$font-size-h5: 18px;
-$font-size-h6: 14px;
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-imports.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-imports.scss
deleted file mode 100644
index 0fd3fd7638..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-imports.scss
+++ /dev/null
@@ -1,68 +0,0 @@
-/* ==========================================================================
- Imports for Bootstrap
-
- This file is exclusively intended for setting up imports
- Never add styles directly to this file
- ========================================================================== */
-
-/* Vars and mixins
- ========================================================================== */
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables';
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/mixins';
-
-
-/* Reset and dependencies
- ========================================================================== */
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/normalize';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/print';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/glyphicons';
-
-
-/* Core CSS
- ========================================================================== */
-// @import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/scaffolding';
-// @import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/type';
-// @import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/code';
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/grid';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/tables';
-// @import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/forms';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/buttons';
-
-
-/* Components
- ========================================================================== */
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/component-animations';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/dropdowns';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/button-gro ups';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/input-groups';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/navs';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/navbar';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/breadcrumbs';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/pagination';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/pager';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/labels';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/badges';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/jumbotron';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/thumbnails';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/alerts';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/progress-bars';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/media';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/list-group';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/panels';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/responsive-embed';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/wells';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/close';
-
-
-/* Components /w javascript
- ========================================================================== */
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/modals';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/tooltip';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/popovers';
-//@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/carousel';
-
-
-/* Utility classes
- ========================================================================== */
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/utilities';
-@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/responsive-utilities';
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-vars.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-vars.scss
deleted file mode 100644
index 78abb1754e..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/config/vendors/_bootstrap-vars.scss
+++ /dev/null
@@ -1,82 +0,0 @@
-/* ==========================================================================
- Boostrap Variables
-
- This file is exclusively intended for setting up variables
- Never add styles directly to this file
- ========================================================================== */
-
-
-/* Grid
- ========================================================================== */
-//== Media queries breakpoints
-//
-//## Define the breakpoints at which your layout will change, adapting to different screen sizes.
-
-// Extra small screen / phone
-//** Deprecated `$screen-xs` as of v3.0.1
-$screen-xs: 480px;
-//** Deprecated `$screen-xs-min` as of v3.2.0
-$screen-xs-min: $screen-xs;
-//** Deprecated `$screen-phone` as of v3.0.1
-$screen-phone: $screen-xs-min;
-
-// Small screen / tablet
-//** Deprecated `$screen-sm` as of v3.0.1
-$screen-sm: 768px;
-$screen-sm-min: $screen-sm;
-//** Deprecated `$screen-tablet` as of v3.0.1
-$screen-tablet: $screen-sm-min;
-
-// Medium screen / desktop
-//** Deprecated `$screen-md` as of v3.0.1
-$screen-md: 992px;
-$screen-md-min: $screen-md;
-//** Deprecated `$screen-desktop` as of v3.0.1
-$screen-desktop: $screen-md-min;
-
-// Large screen / wide desktop
-//** Deprecated `$screen-lg` as of v3.0.1
-$screen-lg: 1200px;
-$screen-lg-min: $screen-lg;
-//** Deprecated `$screen-lg-desktop` as of v3.0.1
-$screen-lg-desktop: $screen-lg-min;
-
-// So media queries don't overlap when required, provide a maximum
-$screen-xs-max: ($screen-sm-min - 1);
-$screen-sm-max: ($screen-md-min - 1);
-$screen-md-max: ($screen-lg-min - 1);
-
-
-//== Grid system
-//
-//## Define your custom responsive grid.
-
-//** Number of columns in the grid.
-$grid-columns: 12;
-//** Padding between columns. Gets divided in half for the left and right.
-$grid-gutter-width: 30px;
-// Navbar collapse
-//** Point at which the navbar becomes uncollapsed.
-$grid-float-breakpoint: $screen-sm-min;
-//** Point at which the navbar begins collapsing.
-$grid-float-breakpoint-max: ($grid-float-breakpoint - 1);
-
-
-//== Container sizes
-//
-//## Define the maximum width of `.container` for different screen sizes.
-
-// Small screen / tablet
-$container-tablet: ((720px + $grid-gutter-width));
-//** For `$screen-sm-min` and up.
-$container-sm: $container-tablet;
-
-// Medium screen / desktop
-$container-desktop: ((940px + $grid-gutter-width));
-//** For `$screen-md-min` and up.
-$container-md: $container-desktop;
-
-// Large screen / wide desktop
-$container-large-desktop: ((1140px + $grid-gutter-width));
-//** For `$screen-lg-min` and up.
-$container-lg: $container-large-desktop;
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_base.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_base.scss
deleted file mode 100644
index 0482bd3820..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_base.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-/* ==========================================================================
- Base
- ========================================================================== */
-
-/* Box model
- ========================================================================== */
-// Defined in frontend scss which is also included in the styleguide
-
-
-/* Html & body
- ========================================================================== */
-html.sg-styleguide {
-
- body {
- position: relative;
-
- overflow-x: hidden;
-
- background-color: $white;
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_general.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_general.scss
deleted file mode 100644
index 9d63801cc3..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/_general.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-/* ==========================================================================
- General
-
- This file is exclusively intended for setting up imports
- Never add styles directly to this file
- ========================================================================== */
-
-/* Base
- ========================================================================== */
-@import "base";
-
-
-/* Typography
- ========================================================================== */
-@import "typography/headings";
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/typography/_headings.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/typography/_headings.scss
deleted file mode 100644
index 7faa3bac6a..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/general/typography/_headings.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-/* ==========================================================================
- Headings
- ========================================================================== */
-
-/* Shared
- ========================================================================== */
-
-h1, h2, h3, h4, h5, h6 {
-
- &.sg-title {
- font-family: $primary-font;
- }
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/helpers/_helpers.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/helpers/_helpers.scss
deleted file mode 100644
index f8a63b13b1..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/helpers/_helpers.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-/* ==========================================================================
- Helpers
-
- Never add styles directly to this file - set up imports
- ========================================================================== */
-
-
-/* Placeholders
- ========================================================================== */
-// @import "placeholders/..";
-
-
-/* Mixins
- ========================================================================== */
-// @import "";
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/styleguide.scss b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/styleguide.scss
deleted file mode 100644
index 9603d33b17..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/scss/styleguide.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-@charset "UTF-8";
-
-/* ==========================================================================
- Stylesheet for all browsers
-
- Never add styles directly to this file - set up imports
- Style guide: https://github.com/necolas/idiomatic-css
- ========================================================================== */
-
-/* Config
- ========================================================================== */
-@import "config/config";
-
-
-/* Helpers
- ========================================================================== */
-@import "helpers/helpers";
-
-
-/* General
- ========================================================================== */
-@import "general/general";
-
-
-/* Pages
- ========================================================================== */
-@import "components/components";
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/layout.hbs b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/layout.hbs
deleted file mode 100644
index a4a3987cc0..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/layout.hbs
+++ /dev/null
@@ -1,83 +0,0 @@
-
-
-
-
-
-
- Styleguide
-
-
-
-
-
-
-
- {{~> webfonts}}
-
-
-
-
-
- {{#each sections}}
-
- {{ clean name }}
- {{~> section}}
-
- {{#children}}
- {{~> childSection}}
- {{/children}}
-
- {{/each}}
-
-
-
-
-
-
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/childSection.hbs b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/childSection.hbs
deleted file mode 100644
index 5efc92aec7..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/childSection.hbs
+++ /dev/null
@@ -1,40 +0,0 @@
-
- {{#if code }}
-
- {{clean name}}
- {{~> section}}
-
- {{#children}}
- {{~> childSection}}
- {{/children}}
-
- {{else}}
- {{#if description }}
-
- {{clean name}}
- {{~> section}}
-
- {{#children}}
- {{~> childSection}}
- {{/children}}
-
- {{else}}
- {{#if colors }}
-
- {{clean name}}
- {{~> section}}
-
- {{#children}}
- {{~> childSection}}
- {{/children}}
-
- {{else}}
-
{{clean name}}
-
- {{#children}}
- {{~> childSection}}
- {{/children}}
- {{/if}}
- {{/if}}
- {{/if}}
-
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/color.hbs b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/color.hbs
deleted file mode 100644
index b6642ccf43..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/color.hbs
+++ /dev/null
@@ -1,10 +0,0 @@
-
-
-
{{ this.description }}
-
-
-
{{ this.name }}
- HEX {{ this.hex }}
- RGB {{ this.rgb }}
-
-
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/section.hbs b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/section.hbs
deleted file mode 100644
index dd7508900a..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/section.hbs
+++ /dev/null
@@ -1,67 +0,0 @@
-{{#xif depth '==' '1'}}
- {{#xif example '||' description}}
-
-
- {{/xif}}
-{{/xif}}
-
-
- {{#if example}}
-
- {{#if example}}
- {{{ example.description }}}
- {{/if}}
-
- {{/if}}
-
- {{#if colors}}
-
-
- {{#each colors}}
- {{~> color}}
- {{/each}}
-
-
- {{/if}}
-
- {{#if description}}
-
-
- {{{description}}}
-
-
- {{/if}}
-
-
-{{#if code}}
-
-{{/if}}
-
-{{#xif depth '==' '1'}}
- {{#xif example '||' description}}
-
- {{/xif}}
-{{/xif}}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/webfonts.hbs b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/webfonts.hbs
deleted file mode 100644
index b5fb0e9f7c..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/ui/styleguide/templates/partials/webfonts.hbs
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_css.html.twig b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_css.html.twig
index e39a2dde67..28a7fe9e97 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_css.html.twig
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_css.html.twig
@@ -1,3 +1,7 @@
{% block css %}
+<% if webpack %>
+ {{ encore_entry_link_tags('app') }}
+<% else %>
+<% endif %>
{% endblock %}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_js.html.twig b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_js.html.twig
new file mode 100644
index 0000000000..3e7550d2cf
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/_js.html.twig
@@ -0,0 +1,3 @@
+{% block jsBundle %}
+ {{ encore_entry_script_tags('app') }}
+{% endblock %}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/layout.html.twig b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/layout.html.twig
index 955a566e11..a204786417 100755
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/layout.html.twig
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/Resources/views/Layout/layout.html.twig
@@ -38,6 +38,11 @@
{# CSS #}
{% include '<% if not isV4 %><%= shortBundleName %>/<% endif %>Layout/_css.html.twig' %}
+<% if webpack %>
+
+ {# JS #}
+ {% include '<% if not isV4 %><%= shortBundleName %>/<% endif %>Layout/_js.html.twig' %}
+<% endif %>
{% endapply %}
@@ -89,10 +94,12 @@
{% include '<% if not isV4 %><%= shortBundleName %>/<% endif %>Layout/_cookieconsent.html.twig' %}
{% endblock %}
+<% if not webpack %>
{# JS Footer #}
{% block jsBundle %}
{% include '<% if not isV4 %><%= shortBundleName %>/<% endif %>Layout/_js_footer.html.twig' %}
{% endblock %}
+<% endif %>
<% if demosite %>
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.eslintrc b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.eslintrc
similarity index 100%
rename from src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.eslintrc
rename to src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.eslintrc
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.nvmrc b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.nvmrc
new file mode 100755
index 0000000000..958b5a36e1
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.nvmrc
@@ -0,0 +1 @@
+v14
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.stylelintrc b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.stylelintrc
similarity index 100%
rename from src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.stylelintrc
rename to src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/.stylelintrc
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/buildUI.sh b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/buildUI.sh
similarity index 100%
rename from src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/buildUI.sh
rename to src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/frontend-config/buildUI.sh
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.nvmrc b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.nvmrc
deleted file mode 100755
index dae199aecb..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/.nvmrc
+++ /dev/null
@@ -1 +0,0 @@
-v12
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/config/webpack.config.styleguide.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/config/webpack.config.styleguide.js
deleted file mode 100644
index 1d4bbfc757..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/config/webpack.config.styleguide.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import path from 'path';
-import defaultConfig from './webpack.config.default';
-
-export default function webpackConfigStyleguide(speedupLocalDevelopment, optimize = false) {
- const config = defaultConfig(speedupLocalDevelopment, optimize);
-
- config.entry = './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/js/styleguide.js';
- config.output = {
- path: path.resolve(__dirname, '../../{% if isV4 %}public{% else %}web{% endif %}/frontend/styleguide/js'),
- filename: 'styleguide.js',
- };
-
- return config;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/configured-tasks.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/configured-tasks.js
index 670d88a43e..7ea0ca2150 100755
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/configured-tasks.js
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/configured-tasks.js
@@ -10,10 +10,8 @@ import createCopyTask from './tasks/copy';
import { createCssLocalTask, createCssOptimizedTask } from './tasks/css';
import createBundleTask from './tasks/bundle';
import createServerTask from './tasks/server';
-import createStyleguideTask from './tasks/livingcss';
import webpackConfigApp from './config/webpack.config.app';
import webpackConfigAdminExtra from './config/webpack.config.admin-extra';
-import webpackConfigStyleguide from './config/webpack.config.styleguide';
export const images = createImagesTask({
src: './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/img/**',
@@ -75,7 +73,6 @@ export const server = createServerTask({
'{% if isV4 %}public{% else %}web{% endif %}/frontend/css/*.css',
'{% if isV4 %}public{% else %}web{% endif %}/frontend/js/*.js',
'{% if isV4 %}public{% else %}web{% endif %}/frontend/img/**/*',
- '{% if isV4 %}public{% else %}web{% endif %}/frontend/styleguide/*.html',
],
open: false,
reloadOnRestart: true,
@@ -92,37 +89,6 @@ export const server = createServerTask({
},
});
-export const generateStyleguide = createStyleguideTask({
- src: './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/scss/**/*.scss',
- dest: './{% if isV4 %}public{% else %}web{% endif %}/frontend/styleguide',
- template: './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/templates/layout.hbs',
- partials: './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/templates/partials/*.hbs',
- sortOrder: [
- {
- Index: [
- 'Colors',
- 'Typography',
- 'Blocks',
- 'Pageparts',
- ],
- },
- ],
-});
-
-export const copyStyleguide = createCopyTask({
- src: ['./node_modules/prismjs/themes/prism-okaidia.css'],
- dest: './{% if isV4 %}public{% else %}web{% endif %}/frontend/styleguide/css',
-});
-
-export const cssStyleguideOptimized = createCssOptimizedTask({
- src: './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/scss/*.scss',
- dest: './{% if isV4 %}public{% else %}web{% endif %}/frontend/styleguide/css',
-});
-
-export const bundleStyleguideOptimized = createBundleTask({
- config: webpackConfigStyleguide(consoleArguments.speedupLocalDevelopment, true),
-});
-
export function buildOnChange(done) {
gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/js/**/!(*.spec).js', bundleLocal);
gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/admin/js/**/!(*.spec).js', bundleAdminExtraLocal);
@@ -135,10 +101,5 @@ export function testOnChange(done) {
gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/js/**/*.js', eslint);
gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/scss/**/*.scss', stylelint);
gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/scss/**/*.scss', cssLocal);
- gulp.watch([
- './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/scss/**/*.md',
- './{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/**/*.hbs',
- ], generateStyleguide);
- gulp.watch('./{% if isV4 %}assets{% else %}src/{{ bundle.namespace|replace({'\\':'/'}) }}/Resources{% endif %}/ui/styleguide/scss/**/*.scss', cssStyleguideOptimized);
done();
}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/tasks/livingcss.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/tasks/livingcss.js
deleted file mode 100644
index 169581fce5..0000000000
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/bin/tasks/livingcss.js
+++ /dev/null
@@ -1,86 +0,0 @@
-import gulp from 'gulp';
-import livingcss from 'gulp-livingcss';
-import path from 'path';
-
-export default function createStyleguideTask({
- src = undefined,
- dest = undefined,
- template = undefined,
- sortOrder = undefined,
- partials = undefined,
-}) {
- return function styleguide() {
- return gulp.src(src)
- .pipe(livingcss(dest, {
- template,
- sortOrder,
- preprocess(context, tmpl, Handlebars) {
- Handlebars.registerHelper('json', (data) => JSON.stringify(data));
- Handlebars.registerHelper('clean', (data) => data.replace(/(\\|%5[cC])/g, ''));
-
- return livingcss.utils.readFileGlobs(partials, (data, file) => {
- // make the name of the partial the name of the file
- const partialName = path.basename(file, path.extname(file));
- Handlebars.registerPartial(partialName, data);
- Handlebars.registerHelper('xif', (v1, operator, v2, options) => {
- switch (operator) {
- case '==':
- // eslint-disable-next-line eqeqeq
- return (v1 == v2) ? options.fn(this) : options.inverse(this);
- case '===':
- return (v1 === v2) ? options.fn(this) : options.inverse(this);
- case '<':
- return (v1 < v2) ? options.fn(this) : options.inverse(this);
- case '<=':
- return (v1 <= v2) ? options.fn(this) : options.inverse(this);
- case '>':
- return (v1 > v2) ? options.fn(this) : options.inverse(this);
- case '>=':
- return (v1 >= v2) ? options.fn(this) : options.inverse(this);
- case '&&':
- return (v1 && v2) ? options.fn(this) : options.inverse(this);
- case '||':
- return (v1 || v2) ? options.fn(this) : options.inverse(this);
- default:
- return options.inverse(this);
- }
- });
-
- Handlebars.registerHelper('counter', (index) => index + 1);
- Handlebars.registerHelper('version', (filename) => `${filename}?${Date.now()}`);
- });
- },
- tags: {
- color() {
- const matches = (this.tag.description).match(/\[(.*?)\]/);
-
- if (matches) {
- const section = this.sections[matches[1]];
-
- if (section) {
- section.colors = section.colors || [];
- section.colors.push({
- name: this.tag.name,
- hex: this.tag.type,
- rgb: hexToRgb(this.tag.type),
- });
- }
- }
- },
- },
- }))
- .pipe(gulp.dest(dest));
- };
-}
-
-function hexToRgb(hex) {
- const strippedHex = hex.replace(/[^0-9A-F]/gi, '');
- const bigint = parseInt(strippedHex, 16);
- /* eslint-disable no-bitwise */
- const r = (bigint >> 16) & 255;
- const g = (bigint >> 8) & 255;
- const b = bigint & 255;
- /* eslint-enable no-bitwise */
-
- return `${r}, ${g}, ${b}`;
-}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/gulpfile.babel.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/gulpfile.babel.js
index f246d04f0e..8ff8046ce3 100755
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/gulpfile.babel.js
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/gulpfile.babel.js
@@ -12,10 +12,6 @@ import {
bundleOptimized,
bundleAdminExtraLocal,
bundleAdminExtraOptimized,
- generateStyleguide,
- cssStyleguideOptimized,
- bundleStyleguideOptimized,
- copyStyleguide,
server,
buildOnChange,
testOnChange,
@@ -28,13 +24,6 @@ const analyze = gulp.series(
const test = gulp.series(analyze);
-const buildStyleguide = gulp.series(
- cssStyleguideOptimized,
- bundleStyleguideOptimized,
- generateStyleguide,
- copyStyleguide,
-);
-
const buildLocal = gulp.series(
clean,
images,
@@ -42,7 +31,6 @@ const buildLocal = gulp.series(
cssLocal,
bundleLocal,
bundleAdminExtraLocal,
- buildStyleguide,
);
const buildOptimized = gulp.series(
@@ -52,7 +40,6 @@ const buildOptimized = gulp.series(
cssOptimized,
bundleOptimized,
bundleAdminExtraOptimized,
- buildStyleguide,
);
const testAndBuildOptimized = gulp.series(
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/package.json b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/package.json
index f9e6dea5ca..21d10ea5ba 100644
--- a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/package.json
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/groundcontrol/package.json
@@ -39,7 +39,6 @@
"gulp-if": "^2.0.2",
"gulp-imagemin": "^4.1.0",
"gulp-inject": "^4.2.0",
- "gulp-livingcss": "^2.1.0",
"gulp-postcss": "^6.3.0",
"gulp-sass": "^4.0.0",
"gulp-sourcemaps": "^2.4.1",
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/package.json b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/package.json
new file mode 100644
index 0000000000..d03df9d4ee
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/package.json
@@ -0,0 +1,51 @@
+{
+ "author": "Kunstmaan",
+ "license": "ISC",
+ "private": true,
+ "scripts": {
+ "dev": "encore dev",
+ "start": "encore dev --watch",
+ "build": "encore production --progress"
+ },
+ "browserslist": [
+ "> 1%",
+ "last 2 Chrome major versions",
+ "last 2 Firefox major versions",
+ "last 2 Safari major versions",
+ "last 2 Edge major versions",
+ "not dead",
+ "not IE 11"
+ ],
+ "dependencies": {
+ "picturefill": "^3.0.3",
+ "bootstrap-sass": "^3.3.7",
+ "svgxuse": "^1.2.6",
+ "gsap": "^1.19.1"{% if demosite %},
+ "ramda": "^0.23.0",
+ "cargobay": "Kunstmaan/cargobay#0.8.6-support",
+ "jquery": "^3.1.1",
+ "velocity-animate": "1.2.3"{% endif %}
+
+ },
+ "devDependencies": {
+ "@kunstmaan/eslint-config": "^1.1.0",
+ "@kunstmaan/stylelint-config": "^2.0.1",
+ "@symfony/stimulus-bridge": "^2.0.0",
+ "@symfony/webpack-encore": "^1.0.0",
+ "browser-sync": "^2.27.4",
+ "browser-sync-webpack-plugin": "^2.3.0",
+ "core-js": "^3.0.0",
+ "eslint": "^4.19.1",
+ "eslint-loader": "^4.0.2",
+ "file-loader": "^6.2.0",
+ "postcss": "^8.3.7",
+ "postcss-loader": "^6.1.1",
+ "regenerator-runtime": "^0.13.2",
+ "sass": "^1.42.0",
+ "sass-loader": "^12.1.0",
+ "stimulus": "^2.0.0",
+ "stylelint": "^13.13.1",
+ "stylelint-webpack-plugin": "^2.2.2",
+ "webpack-notifier": "^1.6.0"
+ }
+}
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/postcss.config.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/postcss.config.js
new file mode 100644
index 0000000000..a3db8ae972
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/postcss.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+ plugins: {
+ autoprefixer: {},
+ },
+};
diff --git a/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/webpack.config.js b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/webpack.config.js
new file mode 100644
index 0000000000..2f5099fe0c
--- /dev/null
+++ b/src/Kunstmaan/GeneratorBundle/Resources/SensioGeneratorBundle/skeleton/layout/webpack-encore/webpack.config.js
@@ -0,0 +1,114 @@
+const path = require('path');
+const os = require('os');
+
+const Encore = require('@symfony/webpack-encore');
+const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
+const StylelintPlugin = require('stylelint-webpack-plugin');
+
+// Manually configure the runtime environment if not already configured yet by the "encore" command.
+// It's useful when you use tools that rely on webpack.config.js file.
+if (!Encore.isRuntimeEnvironmentConfigured()) {
+ Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
+}
+
+Encore
+ .addAliases({
+ scssRootDir: path.resolve(__dirname, 'assets/ui/scss'),
+ })
+ // directory where compiled assets will be stored
+ .setOutputPath('public/frontend/')
+ // public path used by the web server to access the output path
+ .setPublicPath('/frontend')
+ // only needed for CDN's or sub-directory deploy
+ // .setManifestKeyPrefix('build/')
+
+ /*
+ * ENTRY CONFIG
+ *
+ * Each entry will result in one JavaScript file (e.g. app.js)
+ * and one CSS file (e.g. app.scss) if your JavaScript imports CSS.
+ */
+ .addEntry('app', './assets/ui/app.js')
+ .addEntry('admin', './assets/admin/admin-bundle-extra.js')
+
+ // When enabled, Webpack "splits" your files into smaller pieces for greater optimization.
+ .splitEntryChunks()
+
+ // will require an extra script tag for runtime.js
+ // but, you probably want this, unless you're building a single-page app
+ .enableSingleRuntimeChunk()
+
+ /*
+ * FEATURE CONFIG
+ *
+ * Enable & configure other features below. For a full
+ * list of features, see:
+ * https://symfony.com/doc/current/frontend.html#adding-more-features
+ */
+ .cleanupOutputBeforeBuild()
+ .enableBuildNotifications()
+ .enableSourceMaps(!Encore.isProduction())
+ // enables hashed filenames (e.g. app.abc123.css)
+ .enableVersioning(Encore.isProduction())
+
+ .enableEslintLoader()
+ .addPlugin(new StylelintPlugin({
+ files: ['./assets/**/*.scss'],
+ }))
+
+ .configureBabel((config) => {
+ config.plugins.push('@babel/plugin-proposal-class-properties');
+ })
+
+ // enables @babel/preset-env polyfills
+ .configureBabelPresetEnv((config) => {
+ // eslint-disable-next-line no-param-reassign
+ config.useBuiltIns = 'usage';
+ // eslint-disable-next-line no-param-reassign
+ config.corejs = 3;
+ })
+
+ .enablePostCssLoader()
+
+ // enables Sass/SCSS support
+ .enableSassLoader(() => {}, { resolveUrlLoader: false })
+
+ // Copy static files
+ .copyFiles({
+ from: './assets/ui/img',
+ to: 'img/[path][name].[hash:8].[ext]',
+ })
+
+ // uncomment to get integrity="..." attributes on your script & link tags
+ // requires WebpackEncoreBundle 1.4 or higher
+ // .enableIntegrityHashes(Encore.isProduction())
+
+ .addPlugin(new BrowserSyncPlugin(
+ {
+ open: 'external',
+ https: {
+ key: path.join(os.homedir(), '/.dinghy/certs/dinghy.key'),
+ cert: path.join(os.homedir(), '/.dinghy/certs/dinghy.crt'),
+ },
+ // host: 'kumacmssite.dev.kunstmaan.be',
+ // proxy: 'https://kumacmssite.dev.kunstmaan.be',
+{% if browserSyncUrl %}
+ host: '{{ browserSyncUrl|replace({'https://': '', 'http://': ''}) }}',
+ proxy: '{{ browserSyncUrl }}',
+{% else %}
+ server: {
+ baseDir: '.',
+ },
+{% endif %}
+ files: [
+ 'public/frontend/*.js',
+ 'public/frontend/*.css',
+ ],
+ },
+ {
+ reload: false, // this allow webpack server to take care of instead browser sync
+ name: 'bs-webpack-plugin',
+ },
+ ));
+
+module.exports = Encore.getWebpackConfig();