Merge branch 'dev' into 'master'

Dev

See merge request lilcity/backend!24

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/payment/templates/payment/payment_success.html

@@ -3,7 +3,7 @@
   <div class="section__center center center_xs">
     <div class="done">
       {% if school %}
-      <div class="done__title title">Вы успешно приобрели школу!</div>
+      <div class="done__title title">Вы успешно приобрели доступ к урокам онлайн-школы!</div>
       <div class="done__foot">
         <a class="done__btn btn btn_md btn_stroke" href="{% url 'school:school' %}">ПЕРЕЙТИ К ШКОЛЕ</a>
       </div>

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/gallery.html

@@ -11,43 +11,79 @@
     </div>
     <div class="gallery">
       <div class="gallery__grid">
-        <div class="gallery__item gallery__item_lg">
+        <div
+        class="gallery__item gallery__item_lg"
+        style="background-image: url({% get_media_prefix %}instagram/results/0.jpg);"
+        >
           <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/0.jpg" onerror="this.style.display='none'">
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/1.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/1.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/1.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/2.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/2.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/2.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/3.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/3.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/3.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/4.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/4.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/4.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/5.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/5.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/5.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
       </div>
       <div class="gallery__grid">
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/6.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/6.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/6.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/7.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/7.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/7.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/8.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/8.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/8.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item gallery__item_lg">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/9.jpg" onerror="this.style.display='none'">
+        <div class="gallery__item gallery__item_lg"
+        style="background-image: url({% get_media_prefix %}instagram/results/9.jpg);"
+
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/9.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/10.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/10.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/10.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
-        <div class="gallery__item">
-          <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/11.jpg" onerror="this.style.display='none'">
+        <div
+        class="gallery__item"
+        style="background-image: url({% get_media_prefix %}instagram/results/11.jpg);"
+        >
+          {% comment %} <img class="gallery__pic" src="{% get_media_prefix %}instagram/results/11.jpg" onerror="this.style.display='none'"> {% endcomment %}
         </div>
       </div>
     </div>

project/templates/blocks/game.html

@@ -5,7 +5,7 @@
     <div class="game__wrap">
       <div class="game__theme">LILCITY</div>
       <div class="game__title">Приложения, развивающие игры и интерактивные книги от Lil City.</div>
-      <a class="game__btn btn btn_dark" href="http://lil.city">УЗНАТЬ БОЛЬШЕ</a>
+      <a target="_blank" class="game__btn btn btn_dark" href="http://lil.city">УЗНАТЬ БОЛЬШЕ</a>
     </div>
   </div>
   <div class="game__preview">

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

@@ -0,0 +1,12 @@
+<div class="section section_video">
+  <div class="section__center center center_sm">
+    <iframe
+      width="100%"
+      height="360"
+      src="https://www.youtube.com/embed/1w3amQGtQyc"
+      frameborder="0"
+      allow="autoplay; encrypted-media"
+      allowfullscreen
+    ></iframe>
+  </div>
+</div>

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" %}

project/templates/lilcity/main.html

@@ -5,6 +5,7 @@
   {% include "templates/blocks/promo.html" %}
   {% include "templates/blocks/messages.html" %}
   {% include "templates/blocks/arts.html" %}
+  {% include "templates/blocks/video.html" %}
   {% include "templates/blocks/about.html" %}
   {% include "templates/blocks/last_courses.html" %}
   {% include "templates/blocks/gallery.html" %}

web/src/sass/_common.sass

@@ -47,7 +47,7 @@ $cl: #191919
     background-position: 100% 50%
   100%
     background-position: 0% 50%
-  
+
 body
   min-width: 360px
   +f
@@ -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,16 +1322,22 @@ a[name]
     +t
       display: none
   &__item
+    background-position: center center 
+    background-size: cover 
     float: left
-    width: calc(33.33% - 20px)
+    width: 140px
+    height: 140px
     margin: 0 10px 20px
     +m
-      width: calc(33.33% - 10px)
+      width: 140px
+      height: 140px
       margin: 0 5px 10px
     &_lg
-      width: calc(66.66% - 20px)
+      width: 300px
+      height: 300px
       +m
         width: calc(66.66% - 10px)
+        height: calc(66.66% - 10px)
     &:nth-child(4)
       clear: both
   &__pic
@@ -1588,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
@@ -2148,7 +2157,7 @@ a.grey-link
       height: 50px
       padding: 0 20px
     &__appended
-      flex: 1;
+      flex: 1 
   &__textarea
     display: block
     height: 36px
@@ -2330,7 +2339,7 @@ a.grey-link
   &__right
     flex: 0 0 220px
     +t
-      margin-left: auto
+      margin-left: auto !important
     +m
       margin: 0
     &.hidden
@@ -2528,6 +2537,7 @@ a.grey-link
   &__info
     display: flex
     align-items: center
+    justify-content: space-between
     +m
       display: block
   &__buy
@@ -2731,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
@@ -2832,7 +2842,7 @@ a.grey-link
     .icon
       font-size: 40px
     span:first-child
-      display: none;
+      display: none 
   &_sm &__title
     margin-bottom: 15px
   &_sm &__item
@@ -2983,7 +2993,7 @@ a.grey-link
       top: 0
       right: 0
       +m
-        display: none
+        display: none !important
   &__row
     display: flex
     margin-bottom: 25px
@@ -3032,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
@@ -4018,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)
@@ -4046,5 +4056,5 @@ a
       //margin-top: 0px
 
 .anchor
-  padding-top: 100px;
+  padding-top: 100px
   margin-top: -100px