diff --git a/.gitignore b/.gitignore index 2932423..95c7ff9 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ /ansible/galaxy.roles/ /output_* +/node_modules/ /vendor/ diff --git a/Makefile b/Makefile index b6c7d7a..9b5eb26 100644 --- a/Makefile +++ b/Makefile @@ -1,6 +1,13 @@ +build: + rm -rf output_dev/* + vendor/bin/sculpin generate --env=dev --no-interaction + BUILD_ENV=dev node_modules/.bin/gulp build + deploy: - vendor/bin/sculpin generate --env=prod - ansible-playbook --inventory "ansible/hosts_prod" --user=deployer ansible/deploy.yml + rm -rf output_prod/* + vendor/bin/sculpin generate --env=prod --no-interaction + BUILD_ENV=prod node_modules/.bin/gulp build + # ansible-playbook --inventory "ansible/hosts_prod" --user=deployer ansible/deploy.yml rollback: ansible-playbook --inventory "ansible/hosts_prod" --user=deployer ansible/rollback.yml diff --git a/app/config/sculpin_kernel.yml b/app/config/sculpin_kernel.yml new file mode 100644 index 0000000..757e09b --- /dev/null +++ b/app/config/sculpin_kernel.yml @@ -0,0 +1,3 @@ +sculpin: + ignore: + - _assets/ diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..47f6595 --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,31 @@ +const gulp = require('gulp'); +const concat = require('gulp-concat'); +const sass = require('gulp-sass'); +const autoprefixer = require('gulp-autoprefixer'); + +const ENV = process.env.BUILD_ENV || 'dev'; + +const SASS_SOURCE_PATH = './source/_assets/**/*.scss'; +const SASS_DEST_PATH = `./output_${ENV}`; +const SASS_FILE_NAME = 'app.css'; + +const SASS_OPTIONS = { + outputStyle: ENV === 'prod' ? 'compressed' : 'expanded', +}; + +const AUTOPREFIX_OPTIONS = { + browsers: ['last 2 versions'], +}; + +gulp.task('build', function () { + gulp.src(SASS_SOURCE_PATH) + .pipe(sass(SASS_OPTIONS).on('error', sass.logError)) + .pipe(autoprefixer(AUTOPREFIX_OPTIONS)) + .pipe(concat(SASS_FILE_NAME)) + .pipe(gulp.dest(SASS_DEST_PATH)) + ; +}); + +// gulp.task('build:watch', function () { +// gulp.watch(SASS_SOURCE_PATH, ['build']); +// }); diff --git a/package.json b/package.json new file mode 100644 index 0000000..97f5eed --- /dev/null +++ b/package.json @@ -0,0 +1,13 @@ +{ + "name": "homepage", + "author": "Anton Vakhrushev", + "license": "MIT", + "version": "1.0.0", + "description": "Homepage", + "devDependencies": { + "gulp": "^3.9.1", + "gulp-autoprefixer": "^3.1.1", + "gulp-concat": "^2.6.1", + "gulp-sass": "^3.1.0" + } +} diff --git a/source/_assets/about-me.scss b/source/_assets/about-me.scss new file mode 100644 index 0000000..ab8897d --- /dev/null +++ b/source/_assets/about-me.scss @@ -0,0 +1,29 @@ +.about-me { + display: flex; + align-items: center; + justify-content: center; + height: 100vh; + + + &__note { + text-align: center; + font-size: 120%; + max-width: 400px; + min-height: 3em; + } + + &__links { + padding: 0; + margin-top: 4em; + list-style: none; + text-align: center; + } + + &__link { + display: inline-block; + } + + &__link + &__link { + margin-left: 1em; + } +} diff --git a/source/styles/app.css b/source/_assets/app.scss similarity index 100% rename from source/styles/app.css rename to source/_assets/app.scss diff --git a/source/_layouts/default.html.twig b/source/_layouts/default.html.twig index 54748c7..3bd53fd 100644 --- a/source/_layouts/default.html.twig +++ b/source/_layouts/default.html.twig @@ -4,8 +4,7 @@ - - + {% if page.title is defined %} {{ page.title }} - {{ site.title }} @@ -19,5 +18,6 @@ {% block content %}{% endblock %} </main> {% include 'counters.twig' %} + <script src="/static/app.js?v={{ date().timestamp }}"></script> </body> </html> diff --git a/source/styles/about-me.css b/source/styles/about-me.css deleted file mode 100644 index cf827ab..0000000 --- a/source/styles/about-me.css +++ /dev/null @@ -1,28 +0,0 @@ -.about-me { - display: flex; - align-items: center; - justify-content: center; - height: 100vh; -} - -.about-me__note { - text-align: center; - font-size: 120%; - max-width: 400px; - min-height: 3em; -} - -.about-me__links { - padding: 0; - margin-top: 4em; - list-style: none; - text-align: center; -} - -.about-me__link { - display: inline-block; -} - -.about-me__link + .about-me__link { - margin-left: 1em; -}