one header styles
This commit is contained in:
parent
3e687e19e7
commit
d3dc2e8ae0
@ -2,6 +2,7 @@
|
||||
import gulp from 'gulp';
|
||||
import gulpif from 'gulp-if';
|
||||
import sass from 'gulp-sass';
|
||||
// import sass from 'gulp-ruby-sass';
|
||||
import cleanCSS from 'gulp-clean-css';
|
||||
import newer from 'gulp-newer';
|
||||
import autoprefixer from 'gulp-autoprefixer';
|
||||
@ -9,22 +10,42 @@ import sourcemaps from 'gulp-sourcemaps';
|
||||
import browser from 'browser-sync';
|
||||
import pathConfig from '../paths.js'
|
||||
import gcmq from 'gulp-group-css-media-queries';
|
||||
import concat from 'gulp-concat';
|
||||
import minifyCss from 'gulp-minify-css';
|
||||
|
||||
// export const stylesBuild = () => {
|
||||
// return gulp.src(`${pathConfig.src.sass}/**/*.scss`, {
|
||||
// ignore: pathConfig.isProd && [`${pathConfig.src.sass}/parts/*.scss`]
|
||||
// })
|
||||
|
||||
// .pipe(newer('*'))
|
||||
// .pipe(gulpif(pathConfig.isDevelop, sourcemaps.init()))
|
||||
// .pipe(sass.sync().on('error', sass.logError))
|
||||
// .pipe(gulpif(pathConfig.isProd, gcmq()))
|
||||
// .pipe(gulpif(pathConfig.isProd, autoprefixer()))
|
||||
// .pipe(gulpif(pathConfig.isProd, cleanCSS({ level: 2 })))
|
||||
// .pipe(gulpif(pathConfig.isDevelop, sourcemaps.write('./')))
|
||||
// .pipe(gulp.dest(pathConfig.assets.css))
|
||||
|
||||
// .pipe(browser.reload({stream: true}));
|
||||
// }
|
||||
|
||||
export const stylesBuild = () => {
|
||||
return gulp.src(`${pathConfig.src.sass}/**/*.scss`, {
|
||||
ignore: pathConfig.isProd && [`${pathConfig.src.sass}/parts/*.scss`]
|
||||
})
|
||||
|
||||
.pipe(newer('*'))
|
||||
return gulp.src(`${pathConfig.src.sass}/**/*.scss`)
|
||||
.pipe(gulpif(pathConfig.isDevelop, sourcemaps.init()))
|
||||
.pipe(sass.sync().on('error', sass.logError))
|
||||
.pipe(gulpif(pathConfig.isProd, gcmq()))
|
||||
.pipe(gulpif(pathConfig.isProd, autoprefixer()))
|
||||
.pipe(gulpif(pathConfig.isProd, cleanCSS({ level: 2 })))
|
||||
.pipe(concat("bundle.css"))
|
||||
.pipe(gulpif(pathConfig.isDevelop, sourcemaps.write('./')))
|
||||
.pipe(gulp.dest(pathConfig.assets.css))
|
||||
|
||||
.pipe(browser.reload({stream: true}));
|
||||
// return sass(`${pathConfig.src.sass}/**/*.scss`)
|
||||
// .pipe(sourcemaps.write())
|
||||
// .pipe(sourcemaps.init({loadMaps: true}))
|
||||
// .pipe(minifyCss({}))
|
||||
// .pipe(sourcemaps.init({loadMaps: true}))
|
||||
// .pipe(concat("app.min.css"))
|
||||
// .pipe(sourcemaps.write())
|
||||
// .pipe(gulp.dest( './build' ));
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -30,11 +30,11 @@
|
||||
</div>
|
||||
|
||||
<div class="col-4 col-sm-2 col-lg" style="justify-content: center; border-right: 1px solid #fff; height: 100%; display: flex; align-items: center">
|
||||
<a href="<?php echo get_home_url()?>/form" class=""><button class="order-call btn btn-danger">Заказать звонок</button></a>
|
||||
<a href="<?php echo get_home_url()?>/form" class=""><button class="header_order-call btn btn-danger">Заказать звонок</button></a>
|
||||
</div>
|
||||
|
||||
<div class="col-4 col-sm-2 col-lg" style="border-right: 1px solid #fff; height: 100%; display: flex; align-items: center; justify-content: center">
|
||||
<a href="<?php echo get_home_url()?>/form"><button class="order-holiday btn btn-danger">Заказать праздник</button></a>
|
||||
<a href="<?php echo get_home_url()?>/form"><button class="header_order-holiday btn btn-danger">Заказать праздник</button></a>
|
||||
</div>
|
||||
|
||||
<div class="col-4 col-sm-1 col-lg header-info__btns_right">
|
||||
|
||||
1228
package-lock.json
generated
1228
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -17,12 +17,16 @@
|
||||
"gulp-browserify": "^0.5.1",
|
||||
"gulp-changed": "^4.0.2",
|
||||
"gulp-clean-css": "^4.3.0",
|
||||
"gulp-concat": "^2.6.1",
|
||||
"gulp-concat-css": "^3.1.0",
|
||||
"gulp-group-css-media-queries": "^1.2.2",
|
||||
"gulp-header": "^2.0.9",
|
||||
"gulp-if": "^3.0.0",
|
||||
"gulp-imagemin": "^7.1.0",
|
||||
"gulp-minify-css": "^1.2.4",
|
||||
"gulp-newer": "^1.4.0",
|
||||
"gulp-rename": "^1.4.0",
|
||||
"gulp-ruby-sass": "^4.0.0",
|
||||
"gulp-sass": "^4.1.0",
|
||||
"gulp-sourcemaps": "^3.0.0",
|
||||
"gulp-uglify": "^3.0.2",
|
||||
|
||||
@ -1,29 +1,4 @@
|
||||
<div class="main">
|
||||
<div class="slider-desktop"><?php echo do_shortcode('[smartslider3 slider="3"]') ?></div>
|
||||
<div class="slider-mobile"><?php echo do_shortcode('[smartslider3 slider="4"]') ?></div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.main{
|
||||
height: 325px
|
||||
}
|
||||
|
||||
#carousel {
|
||||
max-height: 325px;
|
||||
}
|
||||
|
||||
#carousel img {
|
||||
max-height: 325px
|
||||
}
|
||||
|
||||
@media screen and (max-width: 425px){
|
||||
.main{
|
||||
height: 180px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#carousel{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
@ -12,6 +12,7 @@
|
||||
|
||||
// Common styles
|
||||
wp_enqueue_style('armanty_style', $css . '/style.css', array(), $styleVersion);
|
||||
wp_enqueue_style('bundle', $css . '/bundle.css', array(), $styleVersion);
|
||||
|
||||
// Pages styles
|
||||
if (is_page_template('templates/about.php')) wp_enqueue_style('armanty_about', $pagesStyle . '/about.css', array(), $styleVersion);
|
||||
|
||||
@ -19,7 +19,7 @@ $(document).ready(function(){
|
||||
const orderEmail = document.getElementById('orderEmail');
|
||||
const orderOthers = document.getElementById('orderOthers');
|
||||
|
||||
const callBackBtn = document.querySelector('.order-call');
|
||||
const callBackBtn = document.querySelector('.header_order-call');
|
||||
const callBackForm = document.querySelector('.callback-modal form');
|
||||
const callBackModal = document.querySelector('.callback-modal');
|
||||
const callBackLayout = document.querySelector('.callback-modal__layout');
|
||||
|
||||
@ -5,9 +5,6 @@
|
||||
@import '../../libs/bootstrap_datetimepicker/css/bootstrap.min.css';
|
||||
@import '../../libs/bootstrap-select/bootstrap-select.min.css';
|
||||
|
||||
.btn, body {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.form-block {
|
||||
h1 {
|
||||
|
||||
@ -70,7 +70,7 @@
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.order-holiday {
|
||||
.header_order-holiday {
|
||||
&:hover {
|
||||
background-color: #ffffff;
|
||||
color: $main-color;
|
||||
@ -254,15 +254,10 @@
|
||||
|
||||
button {
|
||||
padding: 3px 10px;
|
||||
font-size: 18px !important;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.popover {
|
||||
z-index: 999999;
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
|
||||
.header-navmenu__container {
|
||||
overflow: visible !important;
|
||||
padding: 15px 350px;
|
||||
@ -282,6 +277,11 @@
|
||||
transition: 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.popover {
|
||||
z-index: 999999;
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
.header-navmenu__item {
|
||||
background: none;
|
||||
@ -337,11 +337,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
.header-navmenu__item a, .header-info__city span, .header button.order-holiday {
|
||||
.header-navmenu__item a, .header-info__city span, .header button.header_header_order-holiday {
|
||||
font-size: 12px !important;
|
||||
}
|
||||
|
||||
.header button.order-holiday {
|
||||
.header button.header_order-holiday {
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
@ -477,7 +477,7 @@
|
||||
transform: translateY(-60px);
|
||||
}
|
||||
|
||||
button.order-holiday {
|
||||
button.header_order-holiday {
|
||||
width: 125px;
|
||||
margin-right: 0 !important;
|
||||
transform: translateX(-10px);
|
||||
@ -566,3 +566,72 @@
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 576px) and (max-width: 1700px) {
|
||||
.header-info__logo img {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.header-container {
|
||||
padding: 0 50px;
|
||||
}
|
||||
|
||||
.header-navmenu__container {
|
||||
padding: 15px 50px;
|
||||
}
|
||||
|
||||
.header-phone-number-block {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 576px) {
|
||||
.header-navmenu__item {
|
||||
&:first-child {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.header_order-call {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.header_order-holiday {
|
||||
width: 118px;
|
||||
height: 30px !important;
|
||||
margin: 0;
|
||||
padding: 5px !important;
|
||||
border-radius: 10px;
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.header_order-call {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.header_order-call {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.header_order-holiday {
|
||||
height: 34px !important;
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
button.btn.holiday-header-btn {
|
||||
z-index: 2 !important;
|
||||
margin-top: 10px !important;
|
||||
padding: 5px 10px !important;
|
||||
font-size: 15px !important;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
@ -1,154 +1,32 @@
|
||||
@import '../constansts';
|
||||
|
||||
.header-number {
|
||||
color: #ffffff;
|
||||
|
||||
&:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.main {
|
||||
height: 325px;
|
||||
}
|
||||
|
||||
.header {
|
||||
&-navmenu {
|
||||
.sub-menu {
|
||||
li {
|
||||
margin: 0 0 10px;
|
||||
padding: 5px 10px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
|
||||
background: #f2f2f2;
|
||||
color: #606266;
|
||||
list-style: none;
|
||||
font-weight: 400;
|
||||
|
||||
&:hover {
|
||||
background: $main-color;
|
||||
|
||||
a {
|
||||
color: #f2f2f2 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
width: 100%;
|
||||
color: #606266;
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 3px 10px;
|
||||
font-size: 18px !important;
|
||||
}
|
||||
.main {
|
||||
margin-top: 35px;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
.popover {
|
||||
z-index: 999999;
|
||||
margin-top: 20px !important;
|
||||
.main .slider-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.header-navmenu__item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 16.6%;
|
||||
border-right: 2px solid #ffffff;
|
||||
background: #f2f2f2;
|
||||
color: $main-color;
|
||||
transition: 0.2s;
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: 12px;
|
||||
border-bottom-left-radius: 12px;
|
||||
@media screen and (max-width: 425px) {
|
||||
.main {
|
||||
height: 180px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
width: calc(100% - 16.6%*5);
|
||||
border-right: 0;
|
||||
border-top-right-radius: 12px;
|
||||
border-bottom-right-radius: 12px;
|
||||
}
|
||||
|
||||
&.current-menu-item {
|
||||
background: #f2f2f2;
|
||||
|
||||
a {
|
||||
color: $main-color;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
width: 100%;
|
||||
padding: 15px;
|
||||
color: $main-color;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-bottom-right-radius: 0;
|
||||
background: $main-color;
|
||||
|
||||
a {
|
||||
color: #f2f2f2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header-navmenu__list {
|
||||
margin-bottom: 0;
|
||||
|
||||
&::before {
|
||||
display: none !important;
|
||||
@media screen and (max-width: 576px) {
|
||||
.main .slider-mobile {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&::after {
|
||||
display: none !important;
|
||||
.main .slider-desktop{
|
||||
display:none;
|
||||
}
|
||||
}
|
||||
|
||||
.header-navmenu__container {
|
||||
overflow: visible !important;
|
||||
padding: 15px 350px;
|
||||
background: #ffffff;
|
||||
|
||||
.header-navmenu {
|
||||
box-shadow: 0 2px 12px 0 rgba(153, 153, 153, 0.33);
|
||||
}
|
||||
}
|
||||
|
||||
.header-wrapper {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
z-index: 99;
|
||||
transition: 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
.header-navmenu__item {
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 576px) and (max-width: 1700px) {
|
||||
.header-info__logo img {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.header-container {
|
||||
padding: 0 50px;
|
||||
}
|
||||
|
||||
.header-navmenu__container {
|
||||
padding: 15px 50px;
|
||||
}
|
||||
|
||||
.header-phone-number-block {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -126,11 +126,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.order-call {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.order {
|
||||
@ -180,11 +175,6 @@
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.order-holiday {
|
||||
height: 34px !important;
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
@ -225,15 +215,6 @@
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
&-holiday {
|
||||
width: 118px;
|
||||
height: 30px !important;
|
||||
margin: 0;
|
||||
padding: 5px !important;
|
||||
border-radius: 10px;
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.order-modal {
|
||||
@ -245,8 +226,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-call {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@ -126,11 +126,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1200px) {
|
||||
.order-call {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.order {
|
||||
@ -180,11 +176,6 @@
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.order-holiday {
|
||||
height: 34px !important;
|
||||
padding: 0 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
@ -225,15 +216,6 @@
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
&-holiday {
|
||||
width: 118px;
|
||||
height: 30px !important;
|
||||
margin: 0;
|
||||
padding: 5px !important;
|
||||
border-radius: 10px;
|
||||
font-size: 12px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.order-modal {
|
||||
@ -245,8 +227,5 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-call {
|
||||
display: block;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -10,6 +10,30 @@ body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: 'Museo Regular', sans-serif;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
.btn {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
|
||||
#carousel {
|
||||
max-height: 325px;
|
||||
}
|
||||
|
||||
#carousel img {
|
||||
max-height: 325px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 425px) {
|
||||
#carousel {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.popover {
|
||||
z-index: 999999;
|
||||
margin-top: 20px !important;
|
||||
}
|
||||
|
||||
.full-page__border {
|
||||
@ -112,10 +136,7 @@ body {
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.main {
|
||||
margin-top: 35px;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
|
||||
|
||||
.contacts-image {
|
||||
transform: translateY(10px);
|
||||
@ -224,12 +245,6 @@ body {
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
.header-navmenu__item {
|
||||
&:first-child {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -436,25 +451,14 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
.main .slider-mobile {
|
||||
display:none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 576px) {
|
||||
.main .slider-mobile {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.main .slider-desktop{
|
||||
display:none;
|
||||
}
|
||||
|
||||
.packages-item {
|
||||
padding: 25px 23px !important;
|
||||
}
|
||||
|
||||
.places .places-description {
|
||||
font-size: 16px!important;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@ -472,10 +476,3 @@ body {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
button.btn.holiday-header-btn {
|
||||
padding: 5px 10px !important;
|
||||
font-size: 15px !important;
|
||||
z-index: 2 !important;
|
||||
margin-top: 10px !important;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user