Вороз измнений

42568b89 · Iren · a7ecc980 · 42568b89 · 42568b89 · 42568b89
Commit 42568b89 authored Jan 31, 2019 by Iren
Expand all Hide whitespace changes
Inline Side-by-side

Showing with 79 additions and 100 deletions

styles.css css/styles.css +18 -23

styles.css.map css/styles.css.map +0 -0

styles.less css/styles.less +55 -72

index.html index.html +6 -5

No files found.
--- a/css/styles.css
+++ b/css/styles.css
@@ -383,12 +383,12 @@ h1 {
  }
  @media (max-width: 768px) {
    h1 {
-      font-size: 36px;
+ё      font-size: 30px;
    }
  }
  @media (max-width: 576px) {
    h1 {
-      font-size: 36px;
+      font-size: 30px;
    }
  }
 }
@@ -1000,7 +1000,6 @@ video {
  .advertising-img-position {
    width: 50%;
    height: 120%;
-    /*right: 53%;*/
    top: 0;
  }
 }
@@ -1009,7 +1008,6 @@ video {
    width: 50%;
    height: 90%;
    left: 0;
-    /*right: 53%;*/
    top: 0;
  }
 }
@@ -1098,7 +1096,6 @@ video {
  }
 }
 .advertising-text-order h2 {
-  /*.h2-desktop;*/
  font-family: SF-UI-Text-Heavy;
  font-size: 36px;
  color: #303a81;
@@ -1117,7 +1114,7 @@ video {
 @media (max-width: 576px) {
  .advertising-text-order h2 {
    font-size: 22px;
-    width: 320px!important;
+    width: 300px!important;
    font-weight: 700;
    letter-spacing: 0;
    color: #303a81;
@@ -1138,7 +1135,6 @@ video {
  }
 }
 .advertising-text h2 {
-  /*.h2-desktop;*/
  font-family: SF-UI-Text-Heavy;
  font-size: 36px;
  color: #303a81;
@@ -1157,7 +1153,7 @@ video {
 @media (max-width: 576px) {
  .advertising-text h2 {
    font-size: 22px;
-    width: 320px!important;
+    width: 300px!important;
    font-weight: bolder;
    letter-spacing: 0;
    color: #303a81;
@@ -1208,10 +1204,8 @@ video {
    order: 5;
  }
  .advertising-img-order img {
-    /*width: 320px;*/
    min-width: 320px;
    min-height: 183px;
-    margin-left: -25px;
    margin-bottom: 4px;
  }
 }
@@ -1237,10 +1231,8 @@ video {
    margin-top: 0;
  }
  .advertising-img img {
-    /*width: 320px;*/
    min-width: 320px;
    min-height: 183px;
-    margin-left: -25px;
    margin-bottom: 21px;
  }
 }
@@ -1378,7 +1370,6 @@ video {
 .option-card-img-container {
  text-align: center;
  margin: 0 auto;
-  /*max-width: 281px;*/
  max-height: 279px;
 }
 @media (max-width: 768px) {
@@ -1594,6 +1585,11 @@ video {
    margin-bottom: 0px;
  }
 }
+@media (max-width: 576px) {
+  .protection-img img {
+    width: 72px;
+  }
+}
 .protection-text-margin {
  font-family: SFUIDisplay-Light;
  font-size: 18px;
@@ -2171,7 +2167,7 @@ video {
    width: 50px;
  }
 }
-.price-container-active {
+.price-container.active {
  box-shadow: 0 25px 25px #e6effa;
  height: 875px;
  position: relative;
@@ -2183,25 +2179,25 @@ video {
  border-radius: 8px;
 }
 @media (max-width: 1250px) {
-  .price-container-active {
+  .price-container.active {
    width: 288px;
    height: 901px;
  }
 }
 @media (max-width: 992px) {
-  .price-container-active {
+  .price-container.active {
    width: 174px;
    height: 970px;
    padding: 30px 8px 32px 8px;
  }
 }
 @media (max-width: 768px) {
-  .price-container-active {
+  .price-container.active {
    width: 60px;
    height: 476px;
  }
 }
-.price-container-active h6 {
+.price-container.active h6 {
  font-family: AvenirNext-Heavy;
  position: relative;
  z-index: 3;
@@ -2212,7 +2208,7 @@ video {
  letter-spacing: 0.3px;
  color: white;
 }
-.price-container-active img {
+.price-container.active img {
  position: absolute;
  z-index: 2;
  left: 0;
@@ -2221,17 +2217,17 @@ video {
  height: 124px;
 }
 @media (max-width: 1250px) {
-  .price-container-active img {
+  .price-container.active img {
    width: 100%;
  }
 }
 @media (max-width: 992px) {
-  .price-container-active img {
+  .price-container.active img {
    width: 191px;
  }
 }
 @media (max-width: 768px) {
-  .price-container-active img {
+  .price-container.active img {
    width: 50px;
  }
 }
@@ -2313,7 +2309,6 @@ video {
  height: 90px;
 }
 .price .price-p-margin {
-  /*line-height: 110px;*/
  font-size: 28px;
  font-weight: 500;
  text-transform: none;

--- a/css/styles.css.map
+++ b/css/styles.css.map
--- a/css/styles.less
+++ b/css/styles.less
@@ -314,23 +314,19 @@ h1 {
  @media (max-width: 1250px) {
    font-size: 50px;
  }
-
-
  @media (max-width: 992px) {
    font-size: 36px;
    color: white;
  }

  @media (max-width: 768px) {
-    font-size: 36px;
+    font-size: 30px;
  }
-
  @media (max-width: 576px) {
-    font-size: 36px;
+    font-size: 30px;
  }
 }
 }
-
 .header-h1-line{
  position: relative;
  z-index: 3;
@@ -510,7 +506,6 @@ video {
  @media (max-width: 576px) {
    padding-left: 10px;
    padding-right: 10px;
-
  }
 }
 .h2-desktop {
@@ -820,15 +815,12 @@ video {
  @media (max-width: 1120px) {
    width: 50%;
    height: 120%;
-
-    /*right: 53%;*/
    top: 0;
  }
  @media (max-width: 992px) {
    width: 50%;
    height: 90%;
    left: 0;
-    /*right: 53%;*/
    top: 0;
  }
  @media (max-width: 768px) {
@@ -854,42 +846,42 @@ video {
  p {
    width: 100%;
    font-family: SFUIDisplay-Light;
-  font-size: 18px;
-  font-weight: 300;
-  line-height: 24px;
-  letter-spacing: 0.24px;
-  color: #303a81;
-     @media (max-width: 768px) {
-    font-size: 14px;
-    letter-spacing: 0.14px;
-  }
-  @media (max-width: 576px) {
-    font-size: 14px;
-    letter-spacing: 0.14px;
-    line-height: 21px;
-    margin-bottom: 20px;
-  }
+    font-size: 18px;
+    font-weight: 300;
+    line-height: 24px;
+    letter-spacing: 0.24px;
+    color: #303a81;
+    @media (max-width: 768px) {
+      font-size: 14px;
+      letter-spacing: 0.14px;
+    }
+    @media (max-width: 576px) {
+      font-size: 14px;
+      letter-spacing: 0.14px;
+      line-height: 21px;
+      margin-bottom: 20px;
+    }
  }
 }
 .advertising-text-order {
  p {
    width: 100%;
    font-family: SFUIDisplay-Light;
-  font-size: 18px;
-  font-weight: 300;
-  line-height: 24px;
-  letter-spacing: 0.24px;
-  color: #303a81;
-     @media (max-width: 768px) {
-    font-size: 14px;
-    letter-spacing: 0.14px;
-  }
-  @media (max-width: 576px) {
-    font-size: 14px;
-    letter-spacing: 0.14px;
-    line-height: 21px;
-     margin-bottom: 20px;
-  }
+    font-size: 18px;
+    font-weight: 300;
+    line-height: 24px;
+    letter-spacing: 0.24px;
+    color: #303a81;
+    @media (max-width: 768px) {
+      font-size: 14px;
+      letter-spacing: 0.14px;
+    }
+    @media (max-width: 576px) {
+      font-size: 14px;
+      letter-spacing: 0.14px;
+      line-height: 21px;
+      margin-bottom: 20px;
+    }
  }
 }
 .advertising-text-p {
@@ -904,7 +896,6 @@ video {
  }
  width: 110%;
  h2 {
-    /*.h2-desktop;*/
    font-family: SF-UI-Text-Heavy;
    font-size: 36px;
    color: #303a81;
@@ -919,7 +910,7 @@ video {
    }
    @media (max-width: 576px) {
      font-size: 22px;
-      width: 320px!important;
+      width: 300px!important;
      font-weight: 700;
      letter-spacing: 0;
      color: #303a81;
@@ -938,7 +929,6 @@ video {
  }
  width: 110%;
  h2 {
-    /*.h2-desktop;*/
    font-family: SF-UI-Text-Heavy;
    font-size: 36px;
    color: #303a81;
@@ -953,7 +943,7 @@ video {
    }
    @media (max-width: 576px) {
      font-size: 22px;
-      width: 320px!important;
+      width: 300px!important;
      font-weight: bolder;
      letter-spacing: 0;
      color: #303a81;
@@ -996,10 +986,8 @@ video {
    min-width: 300px;
    order: 5;
    img {
-      /*width: 320px;*/
      min-width: 320px;
      min-height: 183px;
-      margin-left: -25px;
      margin-bottom: 4px;
    }
  }
@@ -1021,10 +1009,8 @@ video {
    min-width: 300px;
    margin-top: 0;
    img {
-      /*width: 320px;*/
      min-width: 320px;
      min-height: 183px;
-      margin-left: -25px;
      margin-bottom: 21px;
    }
  }
@@ -1054,7 +1040,6 @@ video {
      margin-bottom: 15px;
      line-height: 24px;
      font-weight: 800;
-
    }
  }
 }
@@ -1135,7 +1120,6 @@ video {
 .option-card-img-container {
  text-align: center;
  margin: 0 auto;
-  /*max-width: 281px;*/
  max-height: 279px;
  @media (max-width: 768px) {
    height: 169px;
@@ -1292,9 +1276,9 @@ video {
 .protection-img {

  width: 100%;
-   @media (min-width: 1150px) {
-      height: 98px;
-    }
+  @media (min-width: 1150px) {
+    height: 98px;
+  }
  @media (max-width: 768px) {
    height: 126px;
    margin-left: -10px;
@@ -1305,10 +1289,12 @@ video {
    margin-left: -10px;
  }
  img {
-     @media(min-width: 1250px){
-    margin-bottom: 0px;
-
-  }
+    @media(min-width: 1250px){
+      margin-bottom: 0px;
+    }
+    @media(max-width: 576px){
+      width: 72px;
+    }
  }
 }
 .protection-text-margin {
@@ -1317,15 +1303,15 @@ video {
  font-weight: 300;
  letter-spacing: 0.24px;
  color: #303a81;
-      line-height: 27px;
-      margin-bottom: 20px;
+  line-height: 27px;
+  margin-bottom: 20px;
  @media(min-width: 1250px){
    p {
      font-family: SFUIDisplay-Light;
-  font-size: 18px;
-  font-weight: 300;
-  letter-spacing: 0.24px;
-  color: #303a81;
+      font-size: 18px;
+      font-weight: 300;
+      letter-spacing: 0.24px;
+      color: #303a81;
      line-height: 27px;
      margin-bottom: 20px;
    }
@@ -1339,10 +1325,10 @@ video {
  }
  @media (max-width: 576px) {
    margin-bottom: 35px;
-     font-size: 14px;
-  font-weight: 300;
-  letter-spacing: 0.14px;
-      line-height: 21px;
+    font-size: 14px;
+    font-weight: 300;
+    letter-spacing: 0.14px;
+    line-height: 21px;
  }
 }
 .protection-text {
@@ -1610,7 +1596,7 @@ video {
  }
 }
 .technology-text {
-   font-family: SFUIDisplay-Light;
+  font-family: SFUIDisplay-Light;
  font-size: 18px;
  font-weight: 300;
  line-height: 27px;
@@ -1761,7 +1747,7 @@ video {
    }
  }
 }
-.price-container-active {
+.price-container.active {
  box-shadow: 0 25px 25px #e6effa;
  height: 875px;
  position: relative;
@@ -1829,7 +1815,6 @@ video {
    }
  }
 }
-
 .price, .price-active {
  width: 100%;
  height: auto;
@@ -1873,7 +1858,6 @@ video {
  height: 90px;
 }
 .price .price-p-margin {
-  /*line-height: 110px;*/
  font-size: 28px;
  font-weight: 500;
  text-transform: none;
@@ -2172,7 +2156,6 @@ footer {
      line-height: 30px;
      letter-spacing: 0.14px;
      color: #315197;
-
    }
  }
 }

--- a/index.html
+++ b/index.html
@@ -277,6 +277,7 @@
        <button type="button" class="main-btn main-btn-margin">Узнать больше</button>
    </div>
 </section>
+
 <section class="advertising-background">
    <div class="advertising main-container">
        <div class="advertising-text">
@@ -439,6 +440,7 @@
        </div>
    </div>
 </section>
+
 <section class="option main-container">
    <h2>Варианты развертывания</h2>
    <div class="main-line">
@@ -474,6 +476,7 @@
        </div>
    </div>
 </section>
+
 <section class="protection-background">
    <div class="main-container">
        <h2 class="h2-desktop">Защита данных в облаке</h2>
@@ -759,7 +762,7 @@
                </li>
                <li class="price-display-none">
                    <p>
-                        Оперативная поддержка<p class="price-info-carry">Только по e-mail</p>
+                        Оперативная поддержка<span class="price-info-carry">Только по e-mail</span>
                    </p>
                    <div class="price-line price-display-none">
                    </div>
@@ -800,7 +803,7 @@
            </ol>
            <button type="button" class="price-btn">Попробовать бесплатно</button>
        </div>
-        <div class="price-container-active">
+        <div class="price-container active">
            <img src="img/price1.png">
            <h6>Standard</h6>
            <div class="price-active">
@@ -1211,7 +1214,7 @@
 <script>
    $(document).ready(function () {
        $.pixlayout({
-            src: "layouts/mobile.jpg",
+            src: "layouts/desktop-cropped.png",
            opacity: 0.8,
            top: 0,
            center: true,
@@ -1223,8 +1226,6 @@

    $('#header-img-navicon').click(function(event) {
        $('#cat').toggleClass('page-header__burger--active');
-
-
    });
 </script>
 </body>