Commit c48751e6c18165b012c656c2fa70837273deadea
1 parent
221dd712
header
Showing
3 changed files
with
156 additions
and
56 deletions
Show diff stats
frontend/views/layouts/main.php
| @@ -240,7 +240,26 @@ _________________________________________________________ --> | @@ -240,7 +240,26 @@ _________________________________________________________ --> | ||
| 240 | </div> | 240 | </div> |
| 241 | </div> | 241 | </div> |
| 242 | <!-- *** TOP END *** --> | 242 | <!-- *** TOP END *** --> |
| 243 | - | 243 | + |
| 244 | + <div class="small-logo-center text-center hidden-xs hidden-md hidden-lg"> | ||
| 245 | + <div class="container"> | ||
| 246 | + <div class="cont"> | ||
| 247 | + <a class="home_mob_link" href="<?php echo Url::home(); ?>"> | ||
| 248 | + <?php | ||
| 249 | + /*echo ImageHelper::set($logo) | ||
| 250 | + ->setHeight(42) | ||
| 251 | + ->renderImage( | ||
| 252 | + [ | ||
| 253 | + 'alt' => $settings->name, | ||
| 254 | + ] | ||
| 255 | + )*/ | ||
| 256 | + ?> | ||
| 257 | + <img src="/img/logo_kb.png" alt="<?=$settings->name;?>" class="static_logo_img"> | ||
| 258 | + </a> | ||
| 259 | + <div class="static_logo_about_mob"><?=$settings->about;?></div> | ||
| 260 | + </div> | ||
| 261 | + </div> | ||
| 262 | + </div> | ||
| 244 | <!-- *** NAVBAR *** | 263 | <!-- *** NAVBAR *** |
| 245 | _________________________________________________________ --> | 264 | _________________________________________________________ --> |
| 246 | <div class="navbar-affixed-top" data-spy="affix" data-offset-top="200"> | 265 | <div class="navbar-affixed-top" data-spy="affix" data-offset-top="200"> |
| @@ -458,7 +477,7 @@ _________________________________________________________ --> | @@ -458,7 +477,7 @@ _________________________________________________________ --> | ||
| 458 | 477 | ||
| 459 | <footer id="footer"> | 478 | <footer id="footer"> |
| 460 | <div class="container"> | 479 | <div class="container"> |
| 461 | - <div class="col-md-6 col-sm-12"> | 480 | + <div class="col-md-5 col-sm-12"> |
| 462 | <?php | 481 | <?php |
| 463 | if (!empty($settings->about)) { | 482 | if (!empty($settings->about)) { |
| 464 | ?> | 483 | ?> |
| @@ -470,7 +489,7 @@ _________________________________________________________ --> | @@ -470,7 +489,7 @@ _________________________________________________________ --> | ||
| 470 | <a href="#" class="btn btn-template-transparent-primary" data-toggle="modal" data-target="#feedback-modal"><?php echo \Yii::t('app', 'Contact us'); ?></a> | 489 | <a href="#" class="btn btn-template-transparent-primary" data-toggle="modal" data-target="#feedback-modal"><?php echo \Yii::t('app', 'Contact us'); ?></a> |
| 471 | </div> | 490 | </div> |
| 472 | 491 | ||
| 473 | - <div class="col-md-4 col-sm-12 col-md-offset-2"> | 492 | + <div class="col-md-3 col-sm-12 col-md-offset-1"> |
| 474 | 493 | ||
| 475 | <h4><?php echo \Yii::t('app', 'Contact'); ?></h4> | 494 | <h4><?php echo \Yii::t('app', 'Contact'); ?></h4> |
| 476 | 495 | ||
| @@ -513,6 +532,9 @@ _________________________________________________________ --> | @@ -513,6 +532,9 @@ _________________________________________________________ --> | ||
| 513 | <hr class="hidden-md hidden-lg hidden-sm"> | 532 | <hr class="hidden-md hidden-lg hidden-sm"> |
| 514 | 533 | ||
| 515 | </div> | 534 | </div> |
| 535 | + <div class="col-md-3 col-sm-12"> | ||
| 536 | + <h4><?php echo \Yii::t('app', 'Share'); ?></h4> | ||
| 537 | + </div> | ||
| 516 | 538 | ||
| 517 | <div class="col-md-12"> | 539 | <div class="col-md-12"> |
| 518 | <p class="pull-left">© <?= date('Y') ?>. <?= $settings->name; ?></p> | 540 | <p class="pull-left">© <?= date('Y') ?>. <?= $settings->name; ?></p> |
frontend/views/site/index.php
| @@ -29,33 +29,35 @@ $this->registerJs($js, View::POS_END); | @@ -29,33 +29,35 @@ $this->registerJs($js, View::POS_END); | ||
| 29 | <h2 class="big-text">Почему мы</h2> | 29 | <h2 class="big-text">Почему мы</h2> |
| 30 | </div> | 30 | </div> |
| 31 | <div class="why-us row"> | 31 | <div class="why-us row"> |
| 32 | - <div class="col-xs-12 col-sm-4"> | ||
| 33 | - <div class="box-simple"> | ||
| 34 | - <div class="icon"> | ||
| 35 | - <img src="/img/icon_1.png"> | 32 | + <div class="col-md-12 row"> |
| 33 | + <div class="col-xs-12 col-sm-4"> | ||
| 34 | + <div class="box-simple"> | ||
| 35 | + <div class="icon"> | ||
| 36 | + <img src="/img/icon_1.png"> | ||
| 37 | + </div> | ||
| 38 | + <h3>Мы первые подключили СЭС</h3> | ||
| 39 | + <p>по Зеленому тарифу в Киевской области</p> | ||
| 40 | + <img src="/img/line.png" class="line_why hidden-xs hidden-sm"> | ||
| 36 | </div> | 41 | </div> |
| 37 | - <h3>Мы первые подключили СЭС</h3> | ||
| 38 | - <p>по Зеленому тарифу в Киевской области</p> | ||
| 39 | - <img src="/img/line.png" class="line_why hidden-xs hidden-sm"> | ||
| 40 | </div> | 42 | </div> |
| 41 | - </div> | ||
| 42 | - <div class="col-xs-12 col-sm-4"> | ||
| 43 | - <div class="box-simple"> | ||
| 44 | - <div class="icon"> | ||
| 45 | - <img src="/img/icon_2.png"> | 43 | + <div class="col-xs-12 col-sm-4"> |
| 44 | + <div class="box-simple"> | ||
| 45 | + <div class="icon"> | ||
| 46 | + <img src="/img/icon_2.png"> | ||
| 47 | + </div> | ||
| 48 | + <h3>Более 50 объектов</h3> | ||
| 49 | + <p>по Киевской области</p> | ||
| 50 | + <img src="/img/line.png" class="line_why hidden-xs hidden-sm"> | ||
| 46 | </div> | 51 | </div> |
| 47 | - <h3>Более 50 объектов</h3> | ||
| 48 | - <p>по Киевской области</p> | ||
| 49 | - <img src="/img/line.png" class="line_why hidden-xs hidden-sm"> | ||
| 50 | </div> | 52 | </div> |
| 51 | - </div> | ||
| 52 | - <div class="col-xs-12 col-sm-4"> | ||
| 53 | - <div class="box-simple"> | ||
| 54 | - <div class="icon"> | ||
| 55 | - <img src="/img/icon_3.png"> | 53 | + <div class="col-xs-12 col-sm-4"> |
| 54 | + <div class="box-simple"> | ||
| 55 | + <div class="icon"> | ||
| 56 | + <img src="/img/icon_3.png"> | ||
| 57 | + </div> | ||
| 58 | + <h3>Собственный штат</h3> | ||
| 59 | + <p>инженеров-монтажников</p> | ||
| 56 | </div> | 60 | </div> |
| 57 | - <h3>Собственный штат</h3> | ||
| 58 | - <p>инженеров-монтажников</p> | ||
| 59 | </div> | 61 | </div> |
| 60 | </div> | 62 | </div> |
| 61 | <div class="col-xs-12 col-sm-4 col-md-offset-2 col-sm-offset-2"> | 63 | <div class="col-xs-12 col-sm-4 col-md-offset-2 col-sm-offset-2"> |
frontend/web/css/main.css
| @@ -7,37 +7,6 @@ | @@ -7,37 +7,6 @@ | ||
| 7 | } | 7 | } |
| 8 | #back-to-top:hover {background: #20446d;} | 8 | #back-to-top:hover {background: #20446d;} |
| 9 | #back-to-top:active {background: #1b2e44;padding-top: 6px;} | 9 | #back-to-top:active {background: #1b2e44;padding-top: 6px;} |
| 10 | -.navbar ul.nav > li > a { | ||
| 11 | - font-size: 13px; | ||
| 12 | - letter-spacing: -0.40px; | ||
| 13 | - text-align: center; | ||
| 14 | - padding: 0px 12px 2px; | ||
| 15 | - height: 62px; | ||
| 16 | - line-height: 18px; | ||
| 17 | - display: flex; | ||
| 18 | - justify-content: center; | ||
| 19 | - align-items: center; | ||
| 20 | - text-decoration: none; | ||
| 21 | - position: relative; | ||
| 22 | - overflow: hidden; | ||
| 23 | -} | ||
| 24 | -.navbar ul.nav > li > a:after { | ||
| 25 | - content: ''; | ||
| 26 | - width: calc(100% - 24px); | ||
| 27 | - position: absolute; | ||
| 28 | - bottom: -5px; | ||
| 29 | - background: #ffd800; | ||
| 30 | - height: 3px; | ||
| 31 | - left: 12px; | ||
| 32 | - transition:0.1s; | ||
| 33 | -} | ||
| 34 | -.navbar ul.nav > li > a:hover::after{ | ||
| 35 | - bottom: 15px; | ||
| 36 | -} | ||
| 37 | -.navbar ul.nav > li > a:hover { | ||
| 38 | - border-color:#fff; | ||
| 39 | - background:initial; | ||
| 40 | -} | ||
| 41 | .navbar-brand{display: flex;justify-content: center;align-items: center;} | 10 | .navbar-brand{display: flex;justify-content: center;align-items: center;} |
| 42 | .button1 { | 11 | .button1 { |
| 43 | margin: 0 auto; | 12 | margin: 0 auto; |
| @@ -245,6 +214,7 @@ section.blue-fon {padding-top: 25px;} | @@ -245,6 +214,7 @@ section.blue-fon {padding-top: 25px;} | ||
| 245 | } | 214 | } |
| 246 | .about .smi_right .post { | 215 | .about .smi_right .post { |
| 247 | width: 360px; | 216 | width: 360px; |
| 217 | + max-width: 100%; | ||
| 248 | height: 160px; | 218 | height: 160px; |
| 249 | background-color: black; | 219 | background-color: black; |
| 250 | color: #fff; | 220 | color: #fff; |
| @@ -297,6 +267,36 @@ section.blue-fon {padding-top: 25px;} | @@ -297,6 +267,36 @@ section.blue-fon {padding-top: 25px;} | ||
| 297 | padding: 15px 0; | 267 | padding: 15px 0; |
| 298 | color: #ffffff; | 268 | color: #ffffff; |
| 299 | } | 269 | } |
| 270 | +.why-us{max-width: 100%;} | ||
| 271 | +.home_mob_link{ | ||
| 272 | + max-width: 100px; | ||
| 273 | + display: inline-block; | ||
| 274 | + padding: 10px 15px; | ||
| 275 | +} | ||
| 276 | +.static_logo_about_mob{ | ||
| 277 | + display: inline-block; | ||
| 278 | + font-family: Arial, sans-serif!important; | ||
| 279 | + transition: 0.3s; | ||
| 280 | + width: 135px; | ||
| 281 | + padding: 0; | ||
| 282 | + margin: 0; | ||
| 283 | + font-size: 11px; | ||
| 284 | + text-transform: lowercase; | ||
| 285 | + line-height: 13px; | ||
| 286 | + cursor: default; | ||
| 287 | + text-align: left; | ||
| 288 | + margin-left: 15px; | ||
| 289 | + z-index: 1; | ||
| 290 | +} | ||
| 291 | +.small-logo-center .cont{ | ||
| 292 | + display: flex; | ||
| 293 | + margin: 0 auto; | ||
| 294 | + align-items: center; | ||
| 295 | + justify-content: center; | ||
| 296 | +} | ||
| 297 | +.small-logo-center{ | ||
| 298 | + margin: 10px 0 -10px; | ||
| 299 | +} | ||
| 300 | 300 | ||
| 301 | 301 | ||
| 302 | @media(min-width:992px) and (max-width:1199px){ | 302 | @media(min-width:992px) and (max-width:1199px){ |
| @@ -312,6 +312,17 @@ section.blue-fon {padding-top: 25px;} | @@ -312,6 +312,17 @@ section.blue-fon {padding-top: 25px;} | ||
| 312 | } | 312 | } |
| 313 | .head_video_buttons .button1{margin-bottom: 7px;} | 313 | .head_video_buttons .button1{margin-bottom: 7px;} |
| 314 | .head_video_buttons .button1, .head_video_buttons .button2{float:none!important;display:block!important;} | 314 | .head_video_buttons .button1, .head_video_buttons .button2{float:none!important;display:block!important;} |
| 315 | + .navbar-brand.home{width: 100px;} | ||
| 316 | + .static_logo_img {width: 100%;} | ||
| 317 | + .static_logo_about{display:none;} | ||
| 318 | + .navbar ul.nav > li > a{letter-spacing: -0.5px!important;padding: 0px 8px 2px!important;} | ||
| 319 | + .navbar ul.nav > li > a:after{width: calc(100% - 16px)!important;left: 8px!important;} | ||
| 320 | + .about .smi_right .post{width:100%;} | ||
| 321 | + .smi_right .post .title{ | ||
| 322 | + font-size: 13px; | ||
| 323 | + padding: 30% 21% 13px 11px; | ||
| 324 | + line-height: 16px; | ||
| 325 | + } | ||
| 315 | } | 326 | } |
| 316 | @media(max-width:991px){ | 327 | @media(max-width:991px){ |
| 317 | .background-kben.block-why, .head_video_buttons{margin-top: 30px;} | 328 | .background-kben.block-why, .head_video_buttons{margin-top: 30px;} |
| @@ -355,6 +366,42 @@ section.blue-fon {padding-top: 25px;} | @@ -355,6 +366,42 @@ section.blue-fon {padding-top: 25px;} | ||
| 355 | padding-top: 56.1%; | 366 | padding-top: 56.1%; |
| 356 | } | 367 | } |
| 357 | } | 368 | } |
| 369 | +@media(min-width:768px){ | ||
| 370 | + .navbar ul.nav > li > a { | ||
| 371 | + font-size: 13px; | ||
| 372 | + letter-spacing: -0.40px; | ||
| 373 | + text-align: center; | ||
| 374 | + padding: 0px 12px 2px; | ||
| 375 | + height: 62px; | ||
| 376 | + line-height: 18px; | ||
| 377 | + display: flex; | ||
| 378 | + justify-content: center; | ||
| 379 | + align-items: center; | ||
| 380 | + text-decoration: none; | ||
| 381 | + position: relative; | ||
| 382 | + overflow: hidden; | ||
| 383 | + } | ||
| 384 | + .navbar ul.nav > li > a:after { | ||
| 385 | + content: ''; | ||
| 386 | + width: calc(100% - 24px); | ||
| 387 | + position: absolute; | ||
| 388 | + bottom: -5px; | ||
| 389 | + background: #ffd800; | ||
| 390 | + height: 2px; | ||
| 391 | + left: 12px; | ||
| 392 | + transition:0.1s; | ||
| 393 | + } | ||
| 394 | + .navbar ul.nav > li > a:hover::after, .navbar-default .navbar-nav > li > a:focus::after{ | ||
| 395 | + bottom: 18px; | ||
| 396 | + } | ||
| 397 | + .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{ | ||
| 398 | + background: initial; | ||
| 399 | + } | ||
| 400 | + .navbar ul.nav > li > a:hover { | ||
| 401 | + border-color:#fff; | ||
| 402 | + background:initial; | ||
| 403 | + } | ||
| 404 | +} | ||
| 358 | @media(min-width:768px) and (max-width:991px){ | 405 | @media(min-width:768px) and (max-width:991px){ |
| 359 | .navbar-header{width: 57px;} | 406 | .navbar-header{width: 57px;} |
| 360 | .navbar-brand.home{width:100%;} | 407 | .navbar-brand.home{width:100%;} |
| @@ -362,6 +409,21 @@ section.blue-fon {padding-top: 25px;} | @@ -362,6 +409,21 @@ section.blue-fon {padding-top: 25px;} | ||
| 362 | width: 50px; | 409 | width: 50px; |
| 363 | margin-top: 15px; | 410 | margin-top: 15px; |
| 364 | } | 411 | } |
| 412 | + | ||
| 413 | + .navbar-brand.home, .static_logo_about{display:none;} | ||
| 414 | + .navbar ul.nav > li > a{ | ||
| 415 | + font-size: 11px; | ||
| 416 | + padding: 0px 6px 2px; | ||
| 417 | + } | ||
| 418 | + .navbar ul.nav > li > a:after{ | ||
| 419 | + font-size: 11px; | ||
| 420 | + letter-spacing: -0.40px; | ||
| 421 | + padding: 0px 6px 2px; | ||
| 422 | + } | ||
| 423 | + .navbar ul.nav > li > a:after{ | ||
| 424 | + width: calc(100% - 12px); | ||
| 425 | + left: 6px; | ||
| 426 | + } | ||
| 365 | } | 427 | } |
| 366 | @media(min-width:501px){ | 428 | @media(min-width:501px){ |
| 367 | .bigtext#header3 h2{ | 429 | .bigtext#header3 h2{ |
| @@ -398,6 +460,20 @@ section.blue-fon {padding-top: 25px;} | @@ -398,6 +460,20 @@ section.blue-fon {padding-top: 25px;} | ||
| 398 | line-height: 2.5vh; | 460 | line-height: 2.5vh; |
| 399 | margin-bottom: 50px; | 461 | margin-bottom: 50px; |
| 400 | } | 462 | } |
| 463 | + .smi_right .post .title { | ||
| 464 | + font-size: 4vw; | ||
| 465 | + font-weight: 300; | ||
| 466 | + position: absolute; | ||
| 467 | + bottom: 0; | ||
| 468 | + padding: 30% 24% 10px 10px; | ||
| 469 | + line-height: 2.5vh; | ||
| 470 | + } | ||
| 471 | + .static_logo_about{ | ||
| 472 | + position: absolute; | ||
| 473 | + left: 112px; | ||
| 474 | + font-size: 3vw; | ||
| 475 | + line-height: 2.5vh; | ||
| 476 | + } | ||
| 401 | } | 477 | } |
| 402 | @media(max-width:280px) { | 478 | @media(max-width:280px) { |
| 403 | .pr_cover { | 479 | .pr_cover { |