main page + carousel + contacts

Eugeny Galkovskiy
1 parent 502affc2
Showing 5 changed files with 245 additions and 32 deletions Show diff stats
common/models/Carousel.php
frontend/views/layouts/main.php
frontend/views/site/contact.php
frontend/views/site/index.php
frontend/web/css/main.css
+<?php
+/**
+ * @link http://www.yiiframework.com/
+ * @copyright Copyright (c) 2008 Yii Software LLC
+ * @license http://www.yiiframework.com/license/
+ */
+
+namespace common\models;
+
+use yii\base\InvalidConfigException;
+use yii\helpers\ArrayHelper;
+
+/**
+ * Carousel renders a carousel bootstrap javascript component.
+ *
+ * For example:
+ *
+ * ```php
+ * echo Carousel::widget([
+ *     'items' => [
+ *         // the item contains only the image
+ *         '<img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-01.jpg"/>',
+ *         // equivalent to the above
+ *         ['content' => '<img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-02.jpg"/>'],
+ *         // the item contains both the image and the caption
+ *         [
+ *             'content' => '<img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-03.jpg"/>',
+ *             'caption' => '<h4>This is title</h4><p>This is the caption text</p>',
+ *             'options' => [...],
+ *         ],
+ *     ]
+ * ]);
+ * ```
+ *
+ * @see http://getbootstrap.com/javascript/#carousel
+ * @author Antonio Ramirez <amigo.cobos@gmail.com>
+ * @since 2.0
+ */
+class Carousel extends \yii\bootstrap\Widget
+{
+    /**
+     * @var array|boolean the labels for the previous and the next control buttons.
+     * If false, it means the previous and the next control buttons should not be displayed.
+     */
+    public $controls = ['<i class="fa fa-angle-left" aria-hidden="true"></i>', '<i class="fa fa-angle-right" aria-hidden="true"></i>'];
+    /**
+     * @var boolean
+     * If false carousel indicators (<ol> tag with anchors to items) should not be displayed.
+     */
+    public $showIndicators = false;
+    /**
+     * @var array list of slides in the carousel. Each array element represents a single
+     * slide with the following structure:
+     *
+     * ```php
+     * [
+     *     // required, slide content (HTML), such as an image tag
+     *     'content' => '<img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-01.jpg"/>',
+     *     // optional, the caption (HTML) of the slide
+     *     'caption' => '<h4>This is title</h4><p>This is the caption text</p>',
+     *     // optional the HTML attributes of the slide container
+     *     'options' => [],
+     * ]
+     * ```
+     */
+    public $items = [];
+
+
+    /**
+     * Initializes the widget.
+     */
+    public function init()
+    {
+        parent::init();
+        \yii\bootstrap\Html::addCssClass($this->options, ['widget' => 'carousel']);
+    }
+
+    /**
+     * Renders the widget.
+     */
+    public function run()
+    {
+        $this->registerPlugin('carousel');
+        return implode("\n", [
+                \yii\bootstrap\Html::beginTag('div', $this->options),
+                $this->renderIndicators(),
+                $this->renderItems(),
+                $this->renderControls(),
+                \yii\bootstrap\Html::endTag('div')
+            ]) . "\n";
+    }
+
+    /**
+     * Renders carousel indicators.
+     * @return string the rendering result
+     */
+    public function renderIndicators()
+    {
+        if ($this->showIndicators === false) {
+            return '';
+        }
+        $indicators = [];
+        for ($i = 0, $count = count($this->items); $i < $count; $i++) {
+            $options = ['data-target' => '#' . $this->options['id'], 'data-slide-to' => $i];
+            if ($i === 0) {
+                \yii\bootstrap\Html::addCssClass($options, 'active');
+            }
+            $indicators[] = Html::tag('li', '', $options);
+        }
+
+        return \yii\bootstrap\Html::tag('ol', implode("\n", $indicators), ['class' => 'carousel-indicators']);
+    }
+
+    /**
+     * Renders carousel items as specified on [[items]].
+     * @return string the rendering result
+     */
+    public function renderItems()
+    {
+        $items = [];
+        for ($i = 0, $count = count($this->items); $i < $count; $i++) {
+            $items[] = $this->renderItem($this->items[$i], $i);
+        }
+
+        return \yii\bootstrap\Html::tag('div', implode("\n", $items), ['class' => 'carousel-inner']);
+    }
+
+    /**
+     * Renders a single carousel item
+     * @param string|array $item a single item from [[items]]
+     * @param int $index the item index as the first item should be set to `active`
+     * @return string the rendering result
+     * @throws InvalidConfigException if the item is invalid
+     */
+    public function renderItem($item, $index)
+    {
+        if (is_string($item)) {
+            $content = $item;
+            $caption = null;
+            $options = [];
+        } elseif (isset($item['content'])) {
+            $content = $item['content'];
+            $caption = ArrayHelper::getValue($item, 'caption');
+            if ($caption !== null) {
+                $caption = \yii\bootstrap\Html::tag('div', $caption, ['class' => 'carousel-caption']);
+            }
+            $options = ArrayHelper::getValue($item, 'options', []);
+        } else {
+            throw new InvalidConfigException('The "content" option is required.');
+        }
+
+        \yii\bootstrap\Html::addCssClass($options, ['widget' => 'item']);
+        if ($index === 0) {
+            \yii\bootstrap\Html::addCssClass($options, 'active');
+        }
+
+        return \yii\bootstrap\Html::tag('div', $content . "\n" . $caption, $options);
+    }
+
+    /**
+     * Renders previous and next control buttons.
+     * @throws InvalidConfigException if [[controls]] is invalid.
+     */
+    public function renderControls()
+    {
+        if (isset($this->controls[0], $this->controls[1])) {
+            return \yii\bootstrap\Html::a($this->controls[0], '#' . $this->options['id'], [
+                    'class' => 'left carousel-control',
+                    'data-slide' => 'prev',
+                ]) . "\n"
+                . \yii\bootstrap\Html::a($this->controls[1], '#' . $this->options['id'], [
+                    'class' => 'right carousel-control',
+                    'data-slide' => 'next',
+                ]);
+        } elseif ($this->controls === false) {
+            return '';
+        } else {
+            throw new InvalidConfigException('The "controls" property must be either false or an array of two elements.');
+        }
+    }
+}
@@ -453,7 +453,7 @@ _________________________________________________________ --&gt;
         <footer id="footer">
           <div class="container">
-            <div class="col-md-4 col-sm-12">
+            <div class="col-md-5 col-sm-12">
                 <?php
                     if (!empty($settings->about)) {
                         ?>
@@ -463,9 +463,13 @@ _________________________________________________________ --&gt;
                     }
                 ?>
               <a href="#" class="btn btn-template-transparent-primary" data-toggle="modal" data-target="#feedback-modal"><?php echo \Yii::t('app', 'Contact us'); ?></a>
+                <div class="bottom-text-in hidden-sm hidden-xs">
+                    <p class="pull-left">&copy; <?= date('Y') ?>. <?= $settings->name; ?>. Все права защищены.<br />
+                        Использование материалов сайта возможно только со ссылкой на источник.</p>
+                </div>
             </div>
-            <div class="col-md-5 col-sm-12">
+            <div class="col-md-4 col-sm-12">
               <h4><?php echo \Yii::t('app', 'Contact'); ?></h4>
@@ -523,7 +527,7 @@ _________________________________________________________ --&gt;
               </div>
-            <div class="col-md-12 bottom-text">
+            <div class="col-md-12 bottom-text hidden-md hidden-lg">
               <p class="pull-left">&copy; <?= date('Y') ?>. <?= $settings->name; ?>. Все права защищены.<br />
                   Использование материалов сайта возможно только со ссылкой на источник.</p>
             </div>
@@ -35,12 +35,10 @@ JS;
                 <div class="col-md-12">
                     <section>
                         <div class="heading">
-                            <h2>We are here to help you</h2>
+                            <h2>Как нас найти</h2>
                         </div>
-                        <p class="lead">Are you curious about something? Do you have some kind of problem with our products? As am hastily invited settled at limited civilly fortune me. Really spring in extent an by. Judge but built gay party world. Of so am
-                            he remember although required. Bachelor unpacked be advanced at. Confined in declared marianne is vicinity.</p>
-                        <p>Please feel free to contact us, our customer service center is working for you 24/7.</p>
+                        <p class="lead">Наш офис находится в Дарницком районе, по ул. Н. Бажана 1-М. По всем возникшим вопросам обращайтесь по телефону,  даже в таком режиме наш разговор будет намного продуктивнее чем просто письма.</p>
                     </section>
                 </div>
             </div>
@@ -54,7 +52,7 @@ JS;
                         <div class="icon">
                             <i class="fa fa-map-marker"></i>
                         </div>
-                        <h3>Address</h3>
+                        <h3>Адрес</h3>
                         <p>
                             <?php
                                 if (!empty( $settings->street )) {
@@ -85,8 +83,8 @@ JS;
                                 <div class="icon">
                                     <i class="fa fa-phone"></i>
                                 </div>
-                                <h3> Call center </h3>
-                                <p class="text-muted"> This number is toll free if calling from Great Britain otherwise we advise you to use the electronic form of communication .</p>
+                                <h3> Телефон </h3>
+                                <p class="text-muted"> Контактный телефон</p>
                                 <p>
                                     <?php
                                         echo Html::a(Html::tag('strong', $settings->phone), 'tel:' . $settings->phone);
@@ -108,8 +106,7 @@ JS;
                                 <div class="icon">
                                     <i class="fa fa-envelope"></i>
                                 </div>
-                                <h3> Electronic support </h3>
-                                <p class="text-muted"> Please feel free to write an email to us or to use our electronic ticketing system .</p>
+                                <h3> Электронная почта </h3>
                                 <ul class="list-style-none">
                                     <li>
                                         <?php
@@ -136,7 +133,7 @@ JS;
                 <div class="col-md-12">
                     <div class="heading">
-                        <h2> Contact form </h2>
+                        <h2> Связаться с нами </h2>
                     </div>
                 </div>
@@ -151,16 +148,16 @@ JS;
                     <div class="row">
                         <div class="col-sm-12">
                             <?= $form->field($contact, 'name')
-                                     ->textInput(); ?>
+                                     ->textInput()->label('Имя'); ?>
                         </div>
                         <div class="col-sm-6">
                             <?= $form->field($contact, 'email')
-                                     ->textInput(); ?>
+                                     ->textInput()->label('Email'); ?>
                         </div>
                         <div class="col-sm-6">
                             <?= $form->field($contact, 'phone')
-                                     ->textInput(); ?>
+                                     ->textInput()->label('Тема'); ?>
                         </div>
                         <div class="col-sm-12">
                             <?= $form->field($contact, 'message')
@@ -168,12 +165,12 @@ JS;
                                          [
                                              'rows' => 3,
                                          ]
-                                     ); ?>
+                                     )->label('Сообщение'); ?>
                         </div>
                         <div class="col-sm-12 text-center">
                             <?= Html::submitButton(
-                                '<i class="fa fa-envelope-o"></i> Send message',
+                                '<i class="fa fa-envelope-o"></i> Отправить сообщение',
                                 [
                                     'class' => 'btn btn-template-main',
                                 ]
@@ -194,7 +191,16 @@ JS;
     <!-- /#contact.container -->
 </div>
 <!-- /#content -->
-
+<div id="get-it">
+    <div class="container">
+        <div class="col-md-8 col-sm-12">
+            <h3>ХОТИТЕ ЗАКАЗАТЬ ОБРАТНЫЙ ЗВОНОК?</h3>
+        </div>
+        <div class="col-md-4 col-sm-12">
+            <a href="#" class="btn btn-template-transparent-primary" data-toggle="modal" data-target="#feedback-modal">Позвоните мне</a>
+        </div>
+    </div>
+</div>
 <div id="map">
 </div>
 \ No newline at end of file
@@ -31,21 +31,24 @@ $this-&gt;registerJs($js, View::POS_END);
                     $slideItems[] = $slide->lang->image->getImg();
                 }
             }
-            echo \yii\bootstrap\Carousel::widget(
+            echo \common\models\Carousel::widget(
                 [
                     'items' => $slideItems
                 ]
             );
         ?>
+        <div class="box-simple">
+            <a href="#" class="btn button1 icon_phone modaled init-button-consultation" data-title="Заказать консультацию" data-toggle="modal" data-target="#feedback-modal">Получить <span>консультацию специалиста</span></a>
+        </div>
         <!-- тут место для слайдера -->
     </section>
     <section class="blue-fon why-us-wr no-mg">
         <div class="container">
-            <div class="heading text-left">
+            <div class="heading text-center">
                 <h2 class="big-text">Почему мы</h2>
             </div>
-            <div class="why-us row">
+            <div class="why-us container">
                 <div class="col-md-12 row">
                     <div class="col-xs-12 col-sm-4">
                         <div class="box-simple">
@@ -109,7 +112,7 @@ $this-&gt;registerJs($js, View::POS_END);
     <section class="bar background-white objects-main-wr">
         <div class="container">
             <div class="col-md-12">
-                <div class="heading text-left">
+                <div class="heading text-center">
                     <h2>Наши объекты</h2>
                 </div>
@@ -219,7 +222,7 @@ $this-&gt;registerJs($js, View::POS_END);
     </section>
     <section class="blue-fon no-mg economy-wr">
         <div class="container">
-            <div class="heading text-left">
+            <div class="heading text-center">
                 <h2 class="big-text">Как заказать электростанцию <br/>и начать экономить уже сегодня?</h2>
             </div>
             <div class="row">
@@ -285,7 +288,7 @@ $this-&gt;registerJs($js, View::POS_END);
     </section>
     <section class="bar background-white no-mg">
         <div class="container">
-            <div class="heading text-left">
+            <div class="heading text-center">
                 <h2>СМИ о нас</h2>
             </div>
             <div class="about row">
@@ -368,17 +368,15 @@ footer .social-logos a:hover {
     position: relative;
     height: 100%;
 }
-.carousel-control{
+.carousel-control {
     display: flex;
     justify-content: center;
     align-items: center;
-    font-size: 11.5vw;
-}
-.economy-wr h2.big-text{
-    text-align: center;
-    width: 100%;
-    border: none;
+    font-size: 7.5vw;
+    width:20%;
 }
+#get-it {padding: 30px 0 10px;}
+#main-page .blue-fon .heading h2{border:none;}
 .main-slider .carousel-inner, .main-slider .carousel-inner > .item {height:100%;width:100%;position:relative;}
 .main-slider .img-responsive, .thumbnail > img, .main-slider .thumbnail a > img, .carousel-inner > .item > img, .main-slider .carousel-inner > .item > a > img {
     width: 100%;
@@ -391,10 +389,31 @@ footer .social-logos a:hover {
     font-size: 12px;
     padding-bottom: 0;
 }
+.bottom-text-in{
+    font-size: 12px;
+    position: absolute;
+    bottom: -72px;
+}
 #map {
     height: 560px;
     background-image: url(../img/map.jpg);
 }
+.main-slider .carousel-control{
+    background:none!important;
+}
+#main-page .main-slider .box-simple{
+    position:  absolute;
+    width: 100%;
+    bottom: 0;
+}
+#main-page .main-slider .box-simple .button1{
+    width: 235px;
+    padding: 8px 0;
+    padding-top: 10px;
+    font-size: 13px;
+    background-size: 9%;
+    padding-left: 30px;
+}
 @media(min-width:992px) and (max-width:1199px){
     .pr_cover {