CSS fixes

All courses category fix

apps/course/templates/course/_items.html

@@ -8,10 +8,10 @@
     {% if course.is_deferred_start and course.status == 2 %}data-future-course data-future-course-time={{ course.deferred_start_at.timestamp }}{% endif %}
 >
 <a class="courses__preview" href="{% if course.status == 0 %}{% url 'course_edit' course.id %}{% else %}{% url 'course' course.id %}?next={{ request.get_full_path }}{% endif %}">
-  {% thumbnail course.cover.image "300x170" crop="center" as im %}
-  <img class="courses__pic" src="{{ im.url }}" width="{{ im.width }}" height="{{ im.height }}"/>
+  {% thumbnail course.cover.image "300x200" crop="center" as im %}
+  <img class="courses__pic" src="{{ im.url }}" width="{{ im.width }}" />
   {% empty %}
-  <img class="courses__pic" src="{% static 'img/no_cover.png' %}" width="300px" height="170px"/>
+  <img class="courses__pic" src="{% static 'img/no_cover.png' %}" width="300px" />
   {% endthumbnail %}
   <div class="courses__view">Подробнее</div>
   {% if course.is_featured %}

apps/course/templates/course/inclusion/category_menu_items.html

@@ -1,7 +1,7 @@
-{% for cat in category_items %}
 <a class="header__link" href="{% url 'courses' %}">
   <div class="header__title">Все курсы</div>
 </a>
+{% for cat in category_items %}
 <a class="header__link{% if category.0 == cat.title %} active{% endif %}" data-category-name="{{ cat.title }}" href="{% url 'courses' %}?category={{ cat.title }}">
   <div class="header__title">{{ cat.title }}</div>
 </a>

apps/school/templates/blocks/promo.html

@@ -53,26 +53,4 @@
       </div>
     </div>
   </div>
-  <div class="main__socials">
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_INSTAGRAM_URL }}">
-      <svg class="icon icon-instagram">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-instagram"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_TWITTER_URL }}">
-      <svg class="icon icon-twitter">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-twitter"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_FB_URL }}">
-      <svg class="icon icon-fb">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-fb"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_YOUTUBE_URL }}">
-      <svg class="icon icon-youtube">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-youtube"></use>
-      </svg>
-    </a>
-  </div>
 </div>

project/templates/blocks/promo.html

@@ -35,26 +35,4 @@
       <a class="main__btn btn btn_white" href="{% url 'school:school' %}">подробнее</a>
     </div>
   </div>
-  <div class="main__socials">
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_INSTAGRAM_URL }}">
-      <svg class="icon icon-instagram">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-instagram"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_TWITTER_URL }}">
-      <svg class="icon icon-twitter">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-twitter"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_FB_URL }}">
-      <svg class="icon icon-fb">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-fb"></use>
-      </svg>
-    </a>
-    <a target="_blank" class="main__social" href="{{ config.SERVICE_YOUTUBE_URL }}">
-      <svg class="icon icon-youtube">
-        <use xlink:href="{% static 'img/sprite.svg' %}#icon-youtube"></use>
-      </svg>
-    </a>
-  </div>
 </div>

project/templates/blocks/video.html

@@ -1,7 +1,7 @@
-<div class="section">
+<div class="section section_video">
   <div class="section__center center center_sm">
     <iframe
-      width="640"
+      width="100%"
       height="360"
       src="https://www.youtube.com/embed/1w3amQGtQyc"
       frameborder="0"

project/templates/lilcity/index.html

@@ -54,6 +54,28 @@
     {% include "templates/blocks/mixpanel.html" %}
   </head>
   <body>
+    <div class="main__socials">
+    <a target="_blank" class="main__social" href="{{ config.SERVICE_INSTAGRAM_URL }}">
+      <svg class="icon icon-instagram">
+        <use xlink:href="{% static 'img/sprite.svg' %}#icon-instagram"></use>
+      </svg>
+    </a>
+    <a target="_blank" class="main__social" href="{{ config.SERVICE_TWITTER_URL }}">
+      <svg class="icon icon-twitter">
+        <use xlink:href="{% static 'img/sprite.svg' %}#icon-twitter"></use>
+      </svg>
+    </a>
+    <a target="_blank" class="main__social" href="{{ config.SERVICE_FB_URL }}">
+      <svg class="icon icon-fb">
+        <use xlink:href="{% static 'img/sprite.svg' %}#icon-fb"></use>
+      </svg>
+    </a>
+    <a target="_blank" class="main__social" href="{{ config.SERVICE_YOUTUBE_URL }}">
+      <svg class="icon icon-youtube">
+        <use xlink:href="{% static 'img/sprite.svg' %}#icon-youtube"></use>
+      </svg>
+    </a>
+    </div>
     {% include "templates/blocks/baner.html" %}
     <div class="outer js-outer">
       {% include "templates/blocks/header.html" %}

web/src/sass/_common.sass

@@ -283,8 +283,8 @@ a.btn
   height: 71px
   background: url(../img/school-lil-city.svg) no-repeat 0 0 / contain
   +t
-    width: 124px
-    height: 40px
+    width: 180px
+    height: 58px
 
 .search
   position: relative
@@ -463,7 +463,7 @@ a.btn
     margin-top: -5px
     background: #EE4630
     border-radius: 50%
-    animation: blinker 2s linear infinite;
+    animation: blinker 2s linear infinite 
     +t
       width: 6px
       height: 6px
@@ -703,7 +703,8 @@ a.btn
       +fb
       color: black
   &__socials
-    position: absolute
+    position: fixed
+    z-index: 500
     top: 50%
     right: 15px
     transform: translateY(-50%)
@@ -942,6 +943,8 @@ a[name]
     background: $bg
     +t
       padding: 80px 0 40px
+  &_video
+  	padding: 0 0 70px
 
 .ava
   display: block
@@ -1319,8 +1322,8 @@ a[name]
     +t
       display: none
   &__item
-    background-position: center center;
-    background-size: cover;
+    background-position: center center 
+    background-size: cover 
     float: left
     width: 140px
     height: 140px
@@ -1594,7 +1597,7 @@ a.grey-link
     color: $cl
     flex: 0 0 calc(33.33% - 20px)
     +t
-      margin-bottom: 40px
+      margin-bottom: 50px !important
     +m
       margin: 0 0 30px
   &__preview
@@ -2154,7 +2157,7 @@ a.grey-link
       height: 50px
       padding: 0 20px
     &__appended
-      flex: 1;
+      flex: 1 
   &__textarea
     display: block
     height: 36px
@@ -2336,7 +2339,7 @@ a.grey-link
   &__right
     flex: 0 0 220px
     +t
-      margin-left: auto
+      margin-left: auto !important
     +m
       margin: 0
     &.hidden
@@ -2534,6 +2537,7 @@ a.grey-link
   &__info
     display: flex
     align-items: center
+    justify-content: space-between
     +m
       display: block
   &__buy
@@ -2737,10 +2741,10 @@ a.grey-link
 
 .questions
   &__anchor
-    display: block;
-    position: relative;
-    top: -110px;
-    visibility: hidden;
+    display: block 
+    position: relative 
+    top: -110px 
+    visibility: hidden 
   &__form,
   &__item
     display: flex
@@ -2838,7 +2842,7 @@ a.grey-link
     .icon
       font-size: 40px
     span:first-child
-      display: none;
+      display: none 
   &_sm &__title
     margin-bottom: 15px
   &_sm &__item
@@ -2989,7 +2993,7 @@ a.grey-link
       top: 0
       right: 0
       +m
-        display: none
+        display: none !important
   &__row
     display: flex
     margin-bottom: 25px
@@ -3038,8 +3042,8 @@ a.grey-link
     height: 56px
     margin-bottom: 40px
     border-bottom: 1px solid $border
-    align-items: center;
-    justify-content: center;
+    align-items: center
+    justify-content: center
     +m
       margin: 0 -15px 30px
   &__btn
@@ -4024,9 +4028,9 @@ a
   text-align: center
   color: #fff
   padding-top: 50px
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: cover;
+  background-repeat: no-repeat
+  background-position: center
+  background-size: cover
   &__text
     font-size: 30px
     text-shadow: 0px 0px 3px rgba(0, 0, 0, 1)
@@ -4052,5 +4056,5 @@ a
       //margin-top: 0px
 
 .anchor
-  padding-top: 100px;
+  padding-top: 100px
   margin-top: -100px