add offers block
This commit is contained in:
parent
ac773af87c
commit
15312b210a
58
gulpfile.js
58
gulpfile.js
@ -1,4 +1,4 @@
|
||||
const {src, dest, parallel, watch} = require('gulp');
|
||||
const {task, src, dest, parallel, watch} = require('gulp');
|
||||
const sass = require('gulp-sass');
|
||||
const autoprefixer = require('gulp-autoprefixer');
|
||||
const browser = require('browser-sync');
|
||||
@ -14,20 +14,28 @@ const uglify = require('gulp-uglify-es').default;
|
||||
const del = require('del');
|
||||
const header = require('gulp-header');
|
||||
|
||||
function getCss() {
|
||||
|
||||
const getCss = async (mode = 'develop') => {
|
||||
|
||||
if (mode == 'build') {
|
||||
return src('src/sass/**/*.sass', {ignore: 'src/sass/parts/**'})
|
||||
.pipe(sass())
|
||||
.pipe(cleanCSS({compatibility: 'ie8'}))
|
||||
.pipe(autoprefixer())
|
||||
.pipe(dest('assets/css'))
|
||||
}
|
||||
|
||||
return src('src/sass/**/*.sass')
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(newer('*'))
|
||||
.pipe(sass())
|
||||
.pipe(autoprefixer())
|
||||
// .pipe(concat('main.css'))
|
||||
.pipe(cleanCSS({
|
||||
compatibility: 'ie8'
|
||||
}))
|
||||
.pipe(sourcemaps.write('./'))
|
||||
.pipe(dest('assets/css'))
|
||||
.pipe(browser.stream());
|
||||
// .pipe(sourcemaps.init())
|
||||
// .pipe(newer('*'))
|
||||
.pipe(sass())
|
||||
.pipe(autoprefixer())
|
||||
// .pipe(sourcemaps.write('./maps'))
|
||||
.pipe(dest('assets/css'))
|
||||
// .pipe(browser.stream({match: '**/*.css'}));
|
||||
.pipe(browser.reload({stream: true}));
|
||||
}
|
||||
|
||||
function getJs() {
|
||||
return src('src/js/**/*.js')
|
||||
.pipe(sourcemaps.init())
|
||||
@ -35,8 +43,9 @@ function getJs() {
|
||||
.pipe(sourcemaps.write('./'))
|
||||
.pipe(dest('./assets/js'))
|
||||
}
|
||||
|
||||
function check() {
|
||||
watch('src/sass/**/*.sass', getCss).on('change', browser.reload);
|
||||
watch('src/sass/**/*.sass', getCss.bind(null, 'develop')).on('change', browser.reload.bind(null, {stream: true}));
|
||||
watch('src/js/**/*.js', getJs).on('change', browser.reload);
|
||||
watch('src/img/*', compressImages).on('change', browser.reload);
|
||||
|
||||
@ -44,15 +53,13 @@ function check() {
|
||||
watch('templates/*.php').on('add', checkNewTemplates);
|
||||
}
|
||||
|
||||
function build() {
|
||||
clean('assets/css');
|
||||
return src('src/sass/**/*.sass', {ignore: 'src/sass/parts/**'})
|
||||
.pipe(sass())
|
||||
.pipe(cleanCSS({
|
||||
compatibility: 'ie8'
|
||||
}))
|
||||
.pipe(autoprefixer())
|
||||
.pipe(dest('assets/css'))
|
||||
const build = async () => {
|
||||
console.log('\x1b[32m*** START BUILD ***');
|
||||
|
||||
clean('assets/css');
|
||||
await getCss('build')
|
||||
|
||||
console.log('\x1b[33m*** END BUILD ***\x1b[37m');
|
||||
}
|
||||
|
||||
function clean(path) {
|
||||
@ -126,7 +133,4 @@ exports.getcss = getCss;
|
||||
exports.getjs = getJs;
|
||||
exports.check = check;
|
||||
exports.build = build;
|
||||
exports.start = parallel(check, startServer);
|
||||
|
||||
// exports.makepages = makePages;
|
||||
|
||||
exports.start = parallel(check, startServer);
|
||||
1821
package-lock.json
generated
1821
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -6,6 +6,7 @@
|
||||
"devDependencies": {
|
||||
"browser-sync": "^2.26.14",
|
||||
"del": "^6.0.0",
|
||||
"gulp": "^4.0.2",
|
||||
"gulp-autoprefixer": "^7.0.1",
|
||||
"gulp-clean-css": "^4.3.0",
|
||||
"gulp-header": "^2.0.9",
|
||||
@ -14,11 +15,11 @@
|
||||
"gulp-sass": "^4.1.0",
|
||||
"gulp-sourcemaps": "^3.0.0",
|
||||
"gulp-uglify-es": "^2.0.0",
|
||||
"gulp": "^4.0.2",
|
||||
"imagemin-giflossy": "^5.1.10",
|
||||
"imagemin-mozjpeg": "^9.0.0",
|
||||
"imagemin-pngquant": "^9.0.2",
|
||||
"imagemin-zopfli": "^7.0.0",
|
||||
"module-alias": "^2.2.2",
|
||||
"node-sass": "^5.0.0"
|
||||
},
|
||||
"scripts": {
|
||||
|
||||
18
parts/landings/graduation/offer-packet.php
Normal file
18
parts/landings/graduation/offer-packet.php
Normal file
@ -0,0 +1,18 @@
|
||||
<div class="graduation__packet">
|
||||
<div class="text">
|
||||
<h3><?php echo $args[title] ?></h2>
|
||||
<p><span><?php echo $args[price] ?></span> ₽ / <span>человек</span></p>
|
||||
</div>
|
||||
<div class="packet_description">
|
||||
<ul>
|
||||
<?php
|
||||
foreach ($args[description] as &$point) {
|
||||
?>
|
||||
<li><?php echo $point; ?></li>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
</div>
|
||||
<button class="graduation-btn">Заказать</button>
|
||||
</div>
|
||||
33
parts/landings/graduation/offers.php
Normal file
33
parts/landings/graduation/offers.php
Normal file
@ -0,0 +1,33 @@
|
||||
<section class="graduation__block offers">
|
||||
<div class="content">
|
||||
<div class="headers">
|
||||
<h2>Предложения</h2>
|
||||
<p>Мы делаем все, чтобы у ваших детей был незабываемый выпускной вечер</p>
|
||||
</div>
|
||||
|
||||
<div class="row packets center">
|
||||
<div class="col-4 packet">
|
||||
<?php get_template_part('parts/landings/graduation/offer-packet', null, array(
|
||||
title => 'Базовый',
|
||||
price => 900,
|
||||
description => ['1 квест', '3 часа лофта', 'Украшение шарами', 'Аниматор', 'Диплом выпускника']
|
||||
)); ?>
|
||||
</div>
|
||||
<div class="col-4 packet">
|
||||
<?php get_template_part('parts/landings/graduation/offer-packet', null, array(
|
||||
title => 'Стандарт',
|
||||
price => 1390,
|
||||
description => ['2 квест', '3 часа лофта', 'Украшение шарами', 'Аниматор', 'Диплом выпускника']
|
||||
)); ?>
|
||||
</div>
|
||||
<div class="col-4 packet">
|
||||
|
||||
<?php get_template_part('parts/landings/graduation/offer-packet', null, array(
|
||||
title => 'VIP',
|
||||
price => 2490,
|
||||
description => ['2 квест', '3 часа лофта', 'Украшение шарами', 'Аниматор', 'Диплом выпускника']
|
||||
)); ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@ -3,24 +3,43 @@ $main-color: #dc3545
|
||||
@font-face
|
||||
font-family: 'Museo Thin' // Имя шрифта
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl.otf) //Путь к файлу со шрифтом
|
||||
|
||||
@font-face
|
||||
font-family: 'Museo Light' // Имя шрифта
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl_0.otf) //Путь к файлу со шрифтом
|
||||
|
||||
@font-face
|
||||
font-family: 'Museo Regular' // Имя шрифта
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl_1.otf) //Путь к файлу со шрифтом
|
||||
|
||||
@font-face
|
||||
font-family: 'Museo Bold' // Имя шрифта
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl_2.otf) //Путь к файлу со шрифтом
|
||||
|
||||
@font-face
|
||||
font-family: 'Museo Black' // Имя шрифта
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl_3.otf) //Путь к файлу со шрифтом
|
||||
src: url(../../fonts/Museo-Sans-Cyr/MuseoSansCyrl_2.otf) //Путь к файлу со шрифтом
|
||||
|
||||
@font-face
|
||||
font-family: 'Shadow Regular'
|
||||
src: url('../fonts/Shadow/Shadow-Regular.ttf') format('truetype')
|
||||
font-style: normal
|
||||
font-weight: normal
|
||||
|
||||
@font-face
|
||||
font-family: 'Montserrat'
|
||||
src: url('../fonts/Montserrat/Montserrat-Regular.ttf') format('truetype')
|
||||
src: url('../fonts/Montserrat/Montserrat-Regular.ttf') format('truetype')
|
||||
@font-face
|
||||
font-family: 'Montserrat'
|
||||
src: url('../fonts/Montserrat/Montserrat-Medium.ttf') format('truetype')
|
||||
font-weight: 500
|
||||
|
||||
@font-face
|
||||
font-family: 'Roboto'
|
||||
src: url('../fonts/Roboto/Roboto-Regular.ttf') format('truetype')
|
||||
font-weight: 400
|
||||
@font-face
|
||||
font-family: 'Roboto'
|
||||
src: url('../fonts/Roboto/Roboto-Medium.ttf') format('truetype')
|
||||
font-weight: 500
|
||||
@ -1,4 +1,5 @@
|
||||
@import '../fonts'
|
||||
// @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
|
||||
|
||||
$title-color: #732B3C
|
||||
$text-color: #5A5A5A
|
||||
@ -12,6 +13,7 @@ body
|
||||
font-family: 'Montserrat'
|
||||
|
||||
.graduation-btn
|
||||
display: block
|
||||
padding: 35px 65px
|
||||
background: $btn-color
|
||||
outline: none
|
||||
@ -80,3 +82,88 @@ main
|
||||
margin: 0 auto
|
||||
max-width: 1028px
|
||||
padding: 97px 90px 87px
|
||||
|
||||
.graduation__block
|
||||
padding: 120px 100px
|
||||
|
||||
.content
|
||||
margin: 0 auto
|
||||
|
||||
.headers
|
||||
margin: 0 auto
|
||||
max-width: 710px
|
||||
margin-bottom: 80px
|
||||
|
||||
h2
|
||||
text-align: center
|
||||
font-size: 40px
|
||||
|
||||
p
|
||||
padding: 0 50px
|
||||
font-family: Montserrat;
|
||||
font-style: normal
|
||||
font-weight: 500
|
||||
text-align: center
|
||||
|
||||
&.offers
|
||||
background: url('../../img/graduation/offers_bg.png') center no-repeat
|
||||
background-size: cover
|
||||
|
||||
.packets
|
||||
margin: 0 auto
|
||||
|
||||
.packet
|
||||
&:nth-child(2)
|
||||
margin-top: 70px
|
||||
&:nth-child(3)
|
||||
margin-top: 140px
|
||||
|
||||
.graduation__packet
|
||||
padding: 40px 60px
|
||||
background: #fff
|
||||
max-width: 392px
|
||||
box-shadow: 8px 8px 14px #EBC8AE
|
||||
border-radius: 2px
|
||||
|
||||
|
||||
.graduation-btn
|
||||
padding: 26px 50px
|
||||
margin: 0 auto
|
||||
|
||||
.text
|
||||
width: 263.01px
|
||||
height: 248.68px
|
||||
background: url('../../img/graduation/offer-packet/text_bg.png') center no-repeat
|
||||
padding: 89px 0 80px 0
|
||||
|
||||
h3
|
||||
text-align: center
|
||||
font-family: 'Shadow'
|
||||
font-size: 40px
|
||||
color: #444444
|
||||
|
||||
p
|
||||
font-family: 'Roboto'
|
||||
font-weight: 500
|
||||
font-size: 24px
|
||||
color: #323232
|
||||
text-align: center
|
||||
|
||||
span
|
||||
&:last-child
|
||||
font-size: 16px
|
||||
|
||||
.packet_description
|
||||
margin-bottom: 40px
|
||||
|
||||
ul
|
||||
list-style: none
|
||||
list-style-image: url('../../img/graduation/list_before.png')
|
||||
|
||||
li
|
||||
padding-left: 30px
|
||||
font-family: Montserrat
|
||||
font-style: normal
|
||||
font-weight: 600
|
||||
font-size: 18px
|
||||
margin-bottom: 14px
|
||||
@ -8,5 +8,6 @@
|
||||
get_template_part('parts/landings/graduation/header');
|
||||
get_template_part('parts/landings/graduation/main');
|
||||
get_template_part('parts/landings/graduation/description');
|
||||
get_template_part('parts/landings/graduation/offers');
|
||||
get_template_part('parts/landings/graduation/footer');
|
||||
?>
|
||||
Loading…
x
Reference in New Issue
Block a user