Merge branch 'feature/new-main-page' of gitlab.com:lilschool/site into feature/packages-page-1-08-19

remotes/origin/feature/packages-page-1-08-19
gzbender 7 years ago
commit 976c1d7e2c
  1. 3
      apps/user/admin.py
  2. 22
      project/templates/blocks/about.html
  3. 6
      project/templates/blocks/counters.html
  4. 16
      project/templates/blocks/footer.html
  5. 5
      project/templates/blocks/header.html
  6. 19
      project/templates/blocks/online_school.html
  7. 2
      project/templates/blocks/partners.html
  8. 12
      project/templates/blocks/reviews.html
  9. 32
      project/templates/blocks/students.html
  10. 72
      project/templates/blocks/teachers.html
  11. 27
      project/templates/blocks/video.html
  12. 4
      project/templates/lilcity/home.html
  13. 2
      project/templates/lilcity/layer.html
  14. 12
      project/views.py
  15. 17
      web/src/img/bubble-icon.svg
  16. BIN
      web/src/img/emoji-cat.png
  17. BIN
      web/src/img/emoji-holiday.png
  18. BIN
      web/src/img/emoji-present.png
  19. BIN
      web/src/img/emoji-students.png
  20. BIN
      web/src/img/emoji-winners.png
  21. BIN
      web/src/img/girl-umbrela.png
  22. BIN
      web/src/img/zlata.png
  23. 336
      web/src/sass/_common.sass

@ -12,7 +12,8 @@ User = get_user_model()
class UserAdmin(BaseUserAdmin):
fieldsets = (
(None, {'fields': ('username', 'password')}),
(_('Personal info'), {'fields': ('first_name', 'last_name', 'email', 'gender', 'about', 'photo')}),
(_('Personal info'), {'fields': ('first_name', 'last_name', 'email', 'gender', 'about', 'photo',)}),
('Teacher', {'fields': ('show_in_mainpage', 'trial_lesson', 'instagram_hashtag',)}),
('Facebook Auth data', {'fields': ('fb_id', 'fb_data', 'is_email_proved')}),
(_('Permissions'), {'fields': ('role', 'is_active', 'is_staff', 'is_superuser',
'groups', 'user_permissions', 'show_in_mainpage')}),

@ -1,12 +1,26 @@
{% load static %}
<div class="anchor" id="about"></div>
<div class="section section_school">
<div class="section section_main section_flex section_about">
<div class="section__center center">
<div class="text text_lg">
<div class="section__column section__column_img">
</div>
<div class="section__column section__column_text">
<div class="title">Для кого?<img class="emoji" src="{% static 'img/emoji-students.png' %}" /></div>
<div class="text text_left">
<p>Вы житель мегаполиса и&nbsp;у&nbsp;вас нет времени дополнительно развивать своего ребенка?
Или&nbsp;вы&nbsp;живете в&nbsp;маленьком городе,
где&nbsp;нет&nbsp;качественных школ и&nbsp;секций для&nbsp;детей?</p>
<p><b>Lil School</b>&nbsp;это решение для&nbsp;тех&nbsp;родителей, кто&nbsp;стремится дать лучшее своему ребенку.
Учитесь не&nbsp;выходя из&nbsp;дома!</p>
<p><b>Lil-School</b>&nbsp;это решение для&nbsp;тех&nbsp;родителей, кто&nbsp;стремится дать лучшее своему ребенку.
Учитесь, не&nbsp;выходя из&nbsp;дома!</p>
</div>
<div class="section__buttons">
<a class="btn" style="width: auto;"
data-popup=".js-popup-buy"
class="main__btn btn"
data-is-camp="1"
href="#">Узнать стоимость</a>
<a href="{% url 'gift-certificates' %}" class="btn btn_gray">Подарить другу</a>
</div>
</div>
</div>
</div>

@ -1,11 +1,10 @@
{% load static %}
{% load ruplural from plural %}
<div class="section section_school">
<div class="section section_main section_gray section_counters">
<div class="section__center center">
<div class="text text_only_curve">
<img class="text__curve text__curve_five" src="{% static 'img/curve-2.svg' %}" width="210">
<div class="title">Lil School в цифрах</div>
<img class="text__curve text__curve_six" src="{% static 'img/curve-2.svg' %}" width="210">
</div>
<div class="school school_main">
<div class="school__col">
@ -32,6 +31,5 @@
<div class="school__text">со&nbsp;всего мира со&nbsp;счастливыми учениками Lil&nbsp;School</div>
</div>
</div>
<div style="margin: 50px 0; text-align: center;"><a class="btn" href="/faq">Часто задаваемые вопросы</a></div>
</div>
</div>

@ -1,7 +1,17 @@
{% load static %}
<footer class="footer">
<div class="footer__center center">
<div class="footer__row footer__row_first">
<div class="footer__row footer__row_subscr mobile-show">
<div class="footer__col footer__col_md">
<div>Подписаться на&nbsp;самую интересную рассылку на&nbsp;планете</div>
<form class="subscribe" method="post" action="{% url 'subscribe' %}">
{% csrf_token %}
<input class="subscribe__input" name="email" placeholder="Email">
<button class="subscribe__btn btn btn_light">ПОДПИСАТЬСЯ</button>
</form>
</div>
</div>
<div class="footer__row">
<div class="footer__col footer__col_md">
<a class="footer__logo logo" href="/"></a>
<div class="footer__content">Lil School – первая образовательная онлайн-платформа креативного мышления
@ -57,15 +67,17 @@
</nav>
</div>
</div>
<div class="footer__row footer__row_second">
<div class="footer__row footer__row_subscr">
<div class="footer__col footer__col_md mobile-hide"></div>
<div class="footer__col footer__col_md">
<div class="mobile-hide">
<div>Подписаться на&nbsp;самую интересную рассылку на&nbsp;планете</div>
<form class="subscribe" method="post" action="{% url 'subscribe' %}">
{% csrf_token %}
<input class="subscribe__input" name="email" placeholder="Email">
<button class="subscribe__btn btn btn_light">ПОДПИСАТЬСЯ</button>
</form>
</div>
<div class="footer__copyright">
Все права защищены ©&nbsp;Lil&nbsp;City,&nbsp;UAB. Все&nbsp;материалы принадлежат компании Lil&nbsp;City,&nbsp;UAB.<br>
Никакая из&nbsp;частей этого сайта, текстов или&nbsp;изображений, не&nbsp;может быть&nbsp;скопирована, использована или&nbsp;передана

@ -25,6 +25,11 @@
</form>
</div>
<nav class="header__nav">
<div class="header__group mobile-show">
<a class="header__section {% active_link 'index' %}" href="{% url 'index' %}">
ГЛАВНАЯ
</a>
</div>
<!-- <div class="header__group">
<a class="header__section {% active_link 'school:school' %}" href="{% url 'school:school' %}">
ОНЛАЙН-ШКОЛА {% if online or livelesson.is_online %}

@ -1,21 +1,14 @@
<div class="section section_school">
{% load static %}
<div class="section section_main section_school">
<div class="section__center center">
<div class="title title_center">Процесс</div>
<div class="text">
Онлайн-образование &mdash; это очень удобно! Можете учиться в&nbsp;пижаме, без&nbsp;макияжа
и&nbsp;с&nbsp;огурцами на&nbsp;лице!)
</div>
<div class="school school_main">
<div class="school school_main school_three-col">
<div class="school__col">
<div class="school__preview">Видеоуроки</div>
<div class="school__text">Каждый день!</div>
</div>
<div class="school__col">
<div class="school__preview">В 17:00</div>
<div class="school__text">По московскому времени</div>
</div>
<div class="school__col">
<div class="school__preview">7 дисциплин</div>
<div class="school__preview">5 дисциплин</div>
<div class="school__text">В разных техниках</div>
</div>
<div class="school__col">
@ -23,6 +16,8 @@
<div class="school__text">Хранится 7 дней</div>
</div>
</div>
<div class="letsgo"></div>
<div style="margin: 50px 0px 15px; text-align: center;">
<a class="btn btn_white" href="/faq">Часто задаваемые вопросы</a>
</div>
</div>
</div>

@ -1,5 +1,5 @@
{% load static %}
<div class="section" id="partners">
<div class="section section_main section_partners" id="partners">
<div class="section__center center">
<a name="partners">
<div class="title title_center">Наши партнеры</div>

@ -1,14 +1,18 @@
{% load static %}
<div class="section reviews-section">
<div class="section section_main reviews-section">
<div class="reviews-section__center section__center center center_md">
<div class="reviews-section__title">
<a id="reviews" name="reviews">
<div class="title title_left">Отзывы о Lil School</div>
<div class="title">Отзывы о Lil School<img class="emoji" src="{% static 'img/emoji-holiday.png' %}" /></div>
</a>
<div class="text">Тёплых отзывов настолько много, что потребуется несколько суток, чтобы их просмотреть
<div class="text text_left">
<p>Тёплых отзывов настолько много, что потребуется несколько суток, чтобы их просмотреть
и несколько месяцев чтобы прочитать.<br>
P.S.: Но мы читаем их все!)
P.S.: Но мы читаем их все!)</p>
</div>
{% if not request.user.is_authenticated and not request.user_agent.is_mobile %}
<a class="btn btn_pink-blue" href="#" data-popup=".js-popup-auth">Присоединиться к Lil School</a>
{% endif %}
</div>
<div class="reviews-section__reviews reviews" data-review-images="{{ review_images|join:',' }}">
<div class="reviews__wrap">

@ -0,0 +1,32 @@
{% load static %}
<div class="anchor" id="students"></div>
<div class="section section_main section_flex section_students">
<div class="section__center center">
<div class="section__column section__column_text">
<div class="title">Наши ученики – многократные призеры международных конкурсов!
<img class="emoji" src="{% static 'img/emoji-winners.png' %}" /></div>
</div>
<div class="section__column section__column_text">
<div class="text text_left">
<p>Креативное мышление необходимо всем: дизайнерам, математикам, инженерам, предпринимателям и врачам.</p>
</div>
</div>
</div>
<div class="section__center center">
<div class="section__column section__column_img">
</div>
<div class="section__column section__column_text">
<div class="section__quote">
<div class="section__quote-text">
Лил Скул для меня это место, где Солнце может быть синего цвета.
</div>
<div class="section__quote-name">Злата Пыльцина, 7 лет. Город Волгоград.</div>
</div>
<div class="section__buttons">
<a class="btn js-video-modal" style="width: auto;"
data-video-url="https://www.youtube.com/watch?v=QrlR5sL_eGI"
href="#">Видео отзыв</a>
</div>
</div>
</div>
</div>

@ -1,33 +1,34 @@
{% load static %}
<div id="teachers" class="anchor"></div>
<div class="section">
<div class="section__center center center_md">
<div class="title title_center">Преподаватели</div>
<div class="text">
<p>Преподаватели Lil School имеют большой опыт, поэтому с первых минут детям будет интересно с нами.</p>
<img class="text__curve text__curve_three" src="{% static 'img/curve-3.svg' %}">
<div class="section section_main section_flex">
<div class="section__center center">
<div class="section__column section__column_text">
<div class="title">Преподаватели</div>
<div class="text text_left text_only_curve mobile-show"><img src="/static/img/curve-3.svg" class="text__curve" style="
right: 0px;
top: -30px;
"></div>
<div class="text text_left">
<p>Преподаватели Lil School имеют большой опыт, поэтому с первых минут детям будет интересно.</p>
</div>
</div>
<div class="section__column mobile-hide" style="padding-left: 100px;">
<div class="text text_left text_only_curve">
<img class="text__curve" src="{% static 'img/curve-3.svg' %}">
</div>
</div>
</div>
<div class="section__center center">
<div class="teachers">
{% for teacher in teachers %}
{% cycle '<div class="teachers__row">' '' %}
<div class="teachers__item">
<div class="teachers__left-column">
<div class="teachers__ava ava">
{% if teacher.photo %}
<img class="ava__pic" src="{{ teacher.photo.url }}"> {% else %}
<img class="ava__pic" src="{% static 'img/user_default.jpg' %}"> {% endif %}
</div>
<div class="teachers__wrap">
<div class="teachers__title">
<div class="teachers__title-name">
<a href="{{ teacher.url }}">{{ teacher.get_full_name }}</a>{% if teacher.instagram_hashtag %},
<a href='https://www.instagram.com/explore/tags/{{ teacher.instagram_hashtag }}/' target="_blank">
{{ teacher.instagram_hashtag }}
</a>
{% endif %}
</div>
{% if teacher.trial_lesson %}
<a data-video-url="{{ teacher.trial_lesson }}" data-trial-lesson="1" href="#" class="btn btn_light js-video-modal">ПРОБНЫЙ УРОК</a>
{% endif %}
</div>
<div class="teachers__social">
{% if teacher.facebook %}
<a class="social__item" href="{{ teacher.facebook }}" target="_blank">
@ -61,15 +62,46 @@
</a>
{% endif %}
</div>
</div>
<div class="teachers__right-column">
<div class="teachers__title">
<a href="{{ teacher.url }}" style="color: black;">{{ teacher.get_full_name }}</a>{% if teacher.instagram_hashtag %}<br>
<a href='https://www.instagram.com/explore/tags/{{ teacher.instagram_hashtag }}/' target="_blank">
#{{ teacher.instagram_hashtag }}
</a>
{% endif %}
</div>
{% if teacher.about %}
<div class="teachers__content">
{{ teacher.about }}
</div>
{% endif %}
{% if teacher.trial_lesson %}
<a data-video-url="{{ teacher.trial_lesson }}" data-trial-lesson="1" href="#" class="btn btn_light js-video-modal">ПРОБНЫЙ УРОК</a>
{% endif %}
</div>
</div>
{% cycle '' '</div>' %}
{% if forloop.last and not forloop.counter|divisibleby:'2' %}
<div class="teachers__item">
<div class="teachers__left-column">
<div class="teachers__ava ava">
<img class="ava__pic" src="{% static 'img/user_default.jpg' %}" syle="margin-top: 10px;">
</div>
</div>
<div class="teachers__right-column">
<div class="teachers__title">
Хотите в команду<br>Lil School?
</div>
<div class="teachers__content">
Любите развивать детей, развиваться сами и хотите зарабатывать на любимом деле?<br><br>
<a href="{% url 'author_request' %}">Оставьте заявку</a>
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
<div class="text text_mb0">Если хотите к нам в команду, то <a href="{% url 'author_request' %}">отправьте</a> нам заявку</div>
</div>
</div>

@ -1,10 +1,25 @@
<div class="section section_video">
<div class="section__center center center_sm" style="text-align: center;">
<div class="title">Пробный урок</div>
{% load static %}
<div class="section section_main section_flex section_video">
<div class="section__center center">
<div class="section__column section__column_text">
<div class="title">Попробуйте бесплатно<img class="emoji" src="{% static 'img/emoji-cat.png' %}" /></div>
<div class="text text_left">
<p>Тысячи видео-уроков на разные темы для развития творческого мышления уже ждут вас. Учитесь, не выходя из дома!</p>
</div>
<div class="section__buttons mobile-hide">
<a href="#" class="btn btn_white js-video-modal" style="width: auto;"
data-video-url="{{ config.MAIN_PAGE_VIDEO_URL|safe }}" data-trial-lesson="1">Смотреть бесплатный урок
<img class="emoji" src="{% static 'img/emoji-present.png' %}" /></a>
</div>
</div>
<div class="section__column section__column_img">
<img class="main-video-preview js-video-modal" data-video-url="{{ config.MAIN_PAGE_VIDEO_URL|safe }}" data-trial-lesson="1"
src="{{ config.MAIN_PAGE_VIDEO_PREVIEW_IMG.url }}"/>
<a href="#" class="btn js-video-modal btn_stroke-black" style="margin: 20px;"
data-video-url="{{ config.MAIN_PAGE_VIDEO_URL|safe }}" data-trial-lesson="1">Смотреть бесплатно</a>
<div>Много развивающих видео на&nbsp;нашем <a href="{{ config.SERVICE_YOUTUBE_URL|safe }}">YouTube&nbsp;канале</a></div>
<div class="section__buttons mobile-show">
<a href="#" class="btn btn_white js-video-modal"
data-video-url="{{ config.MAIN_PAGE_VIDEO_URL|safe }}" data-trial-lesson="1">Смотреть бесплатный урок
<img class="emoji" src="{% static 'img/emoji-present.png' %}" /></a>
</div>
</div>
</div>
</div>

@ -10,12 +10,14 @@
{% endif %}
{% endblock ogdescription %}
{% block title %}School LIL.CITY{% endblock title %}
{% block title %}Lil School{% endblock title %}
{% block body_attr %}class="main-page"{% endblock body_attr %}
{% block content %}
{% include "templates/blocks/messages.html" %}
{% include "templates/blocks/about.html" %}
{% include "templates/blocks/video.html" %}
{% include "templates/blocks/counters.html" %}
{% include "templates/blocks/students.html" %}
{% include "templates/blocks/reviews.html" %}
{% include "templates/blocks/online_school.html" %}
{% include "templates/blocks/teachers.html" %}

@ -51,7 +51,7 @@
{% block layer_head %}{% endblock layer_head %}
</head>
<body>
<body {% block body_attr %}{% endblock body_attr %}>
{% block layer_body %}
{% endblock layer_body %}
<!-- Facebook Pixel Code -->

@ -98,6 +98,9 @@ class IndexView(TemplateView):
review_images = list(map(str, range(1, 107)))
shuffle(review_images)
teachers = User.objects.filter(role=User.TEACHER_ROLE, show_in_mainpage=True)
if teachers.count() % 2 == 0:
teachers = teachers[:teachers.count() - 1]
context.update({
'banners': Banner.get_for_page(Banner.PAGE_INDEX),
@ -112,18 +115,15 @@ class IndexView(TemplateView):
'online_coming_soon': online_coming_soon,
'school_schedule': school_schedule,
'course_items': Course.shuffle(Course.objects.filter(status=Course.PUBLISHED)[:3]),
'is_purchased': camp_payment_exists, # school_payment_exists,
'is_purchased': camp_payment_exists,
'camp_price': DrawingCampPayment.MONTH_PRICE,
'min_school_price': SchoolSchedule.objects.aggregate(Min('month_price'))['month_price__min'],
'school_schedules': SchoolSchedule.objects.filter(weekday__in=DrawingCampPayment.WEEKDAYS, is_camp=True),
'school_schedules_purchased': DrawingCampPayment.WEEKDAYS if camp_payment_exists else [], # set(school_schedules_purchased),
'teachers': User.objects.filter(role=User.TEACHER_ROLE, show_in_mainpage=True),
'school_schedules_purchased': DrawingCampPayment.WEEKDAYS if camp_payment_exists else [],
'teachers': sorted(list(teachers), key=lambda t: 1 if t.email == 'sasha@lil.city' else 0, reverse=True),
'works_count': Payment.objects.filter(status__in=Payment.PW_PAID_STATUSES).count() * 7,
# 'subscription_ends': school_payment.filter(add_days=False).first().date_end if school_payment_exists else None,
# 'subscription_ends_humanize': school_payment.filter(add_days=False).first().date_end_humanize if school_payment_exists else None,
'subscription_ends': camp_payment.latest('date_end').date_end if camp_payment_exists else None,
'subscription_ends_humanize': camp_payment.latest('date_end').date_end_humanize if camp_payment_exists else None,
'school_purchased_future': False,
'is_purchased_future': False,

@ -0,0 +1,17 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="460px" height="200px" viewBox="0 0 460 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 52.6 (67491) - http://www.bohemiancoding.com/sketch -->
<title>Path 4</title>
<desc>Created with Sketch.</desc>
<defs>
<linearGradient x1="0%" y1="0%" x2="100%" y2="100%" id="linearGradient-1">
<stop stop-color="#FFE2EB" offset="0%"></stop>
<stop stop-color="#D8F5F5" offset="100%"></stop>
</linearGradient>
</defs>
<g id="Main" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Main-page" transform="translate(-420.000000, -1872.000000)" fill="url(#linearGradient-1)" fill-rule="nonzero">
<path d="M547.842222,2033.31441 C567.325204,2042.1871 613.935728,2050.03802 666.138581,2053.35195 C721.237058,2056.84969 772.754776,2054.78726 803.076869,2047.09397 C832.820717,2039.54739 854.56339,2019.81542 861.600443,1995.61066 C868.792378,1970.87317 859.821858,1944.76728 834.631473,1924.42417 C808.807191,1903.56913 757.114211,1890.40587 698.058741,1888.29284 C641.152923,1886.25672 587.043875,1894.9449 559.016359,1911.04033 C542.337069,1920.61878 531.361084,1930.16539 524.069314,1940.42993 C518.801278,1947.84568 516.755616,1952.52274 511.608582,1966.97173 C505.968408,1982.80509 501.407986,1990.80823 491.078309,1999.1047 C478.943057,2008.85135 466.577598,2021.24231 454,2036.27877 C491.686444,2023.12812 522.980771,2021.99232 547.842222,2033.31441 Z M480.325244,1986.8614 C487.7323,1980.90638 490.978009,1975.20479 495.688655,1961.96771 C501.336419,1946.0973 503.799979,1940.45918 510.228317,1931.4011 C518.968002,1919.08613 531.737121,1907.96887 550.381854,1897.25108 C581.579142,1879.31754 638.507393,1870.16761 698.211489,1872.30597 C760.504126,1874.53704 815.337821,1888.51394 844.533155,1912.11477 C874.737615,1936.53136 886.031254,1969.43061 876.945509,2000.71312 C868.229112,2030.72396 841.908219,2054.6345 806.703085,2063.57558 C774.365022,2071.78851 721.330659,2073.91377 664.657805,2070.31251 C610.562224,2066.87502 562.393742,2058.75362 540.57419,2048.80696 C514.812424,2037.06322 478.547899,2041.67354 431.702156,2063.49157 C424.041202,2067.05959 416.65058,2058.09752 421.609042,2051.25237 C441.450886,2023.86075 461.003045,2002.39579 480.325244,1986.8614 Z" id="Path-4"></path>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 265 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

@ -884,8 +884,8 @@ a[name]
p
&:not(:last-child)
margin-bottom: 35px
+t
margin: 5px 5px 15px 5px
+m
margin-bottom: 15px
&__curve
position: absolute
pointer-events: none
@ -977,9 +977,49 @@ a[name]
.section
padding: 50px 0
+t
padding: 30px 0
padding: 40px 0
&__column
flex: 50%
&_img
background-position: bottom center
background-size: contain
background-repeat: no-repeat
&_text
padding-right: 20px
& .text
font-size: 20px
&__title
font-size: 30px
margin-bottom: 40px
font-family: 'ProximaNova-Bold', sans-serif
&__buttons
margin-bottom: 45px
+m
padding: 20px 0
text-align: center
margin-bottom: 10px
& .btn
width: 200px
margin-bottom: 15px
margin-right: 10px
& .btn
border-radius: 10px
box-shadow: 0 11px 20px 0 rgba(0, 0, 0, 0.1)
&_main
padding: 80px 0
+m
padding: 50px 0
& .title
font-size: 30px
&_gray
background: $bg
&_pink-light
@ -998,6 +1038,7 @@ a[name]
transform: translateX(-50%)
+t
max-width: calc(100% - 30px)
&_gradient
background-image: linear-gradient(-225deg, $bg 0%, #FFF2F2 100%)
&_tabs
@ -1029,56 +1070,141 @@ a[name]
background: $bg
+t
padding: 80px 0 40px
&_video
padding: 70px 0 70px
&_flex &__center
display: flex
padding: 70px 0
background-image: linear-gradient(345deg, #eeeefa, #dff0ff)
&__column
flex: 50%
+m
padding: 30px 0
&_img
background-position: bottom center
background-size: contain
& .btn.js-video-modal
padding-top: 5px
width: auto
box-shadow: 0 11px 24px 0 rgba(255, 147, 147, 0.3)
&_text
padding-right: 20px
& img
margin-bottom: -11px
&__column .text
font-size: 20px
&_video &__column_img
text-align: center
&__title
font-size: 30px
margin-bottom: 40px
font-family: 'ProximaNova-Bold', sans-serif
&_video &__column_text
flex: 1 0 50%
&__buttons
margin-bottom: 45px
&_video &__center
+m
flex-direction: column
& .btn
border-radius: 10px
box-shadow: 0 11px 20px 0 rgba(0, 0, 0, 0.1)
&_video &__buttons
+m
padding-top: 15px;
&_video &__column_img
text-align: center
&_about
padding-bottom: 0
& img
height: 270px
border-radius: 10px
box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.2)
width: auto
&_about &__center
+m
flex-direction: column-reverse
&_video .btn
box-shadow: 0 11px 24px 0 rgba(255, 147, 147, 0.3)
&_about &__column_img
background-image: url(/static/img/girl-umbrela.png)
background-position: 40% bottom
+m
flex: 0 0 300px
&_flex &__center
display: flex
&_school .title
+m
text-align: left
&_partners
.title
+m
text-align: left
.text
+m
text-align: left
&_counters
background: #eeeefa
&_counters .text_only_curve
margin-bottom: 0
& img
+m
left: -10px
bottom: -125px
&_packages &__center
width: 680px
+m
width: 100%
&_students
padding-bottom: 0
&_students &__column_img
background-image: url(/static/img/zlata.png)
height: 400px
background-position: bottom center
+m
height: auto
&_students &__center:nth-child(1)
+m
flex-direction: column
&_students &__center:nth-child(2)
margin-top: 40px
+m
margin-top: 0
&_students &__center:nth-child(2) &__column_text
+m
padding: 0 0 0 10px
&__quote
font-size: 18px
margin: -50px 0 -50px -100px
position: relative
padding: 50px 0 100px 100px
+m
font-size: 14px
&:before
background-image: url(/static/img/bubble-icon.svg?196dc3af196a)
background-size: contain
background-repeat: no-repeat
position: absolute
width: 100%
height: 80%
content: ' '
left: -2%
top: -3%
z-index: -1
+m
width: 90%;
left: 15%
top: 10%
& &-text
margin-bottom: 20px
& &-name
text-decoration: underline
font-size: 15px
+m
font-size: 13px
.reviews-section
background: linear-gradient(to bottom, rgba(248,248,248,1) 0%, rgba(254,244,244,1) 100%)
@ -1087,7 +1213,6 @@ a[name]
display: flex
height: 650px
+m
padding-bottom: 20px
flex-direction: column
&__title
flex: 0 0 60%;
@ -1096,11 +1221,6 @@ a[name]
+m
padding: 20px 0 0
flex: 0
text-align: center
.text
text-align: left
+m
text-align: center
.ava
display: block
@ -1625,47 +1745,52 @@ a.grey-link
height: 100%
.teachers
margin-bottom: 50px
+t
margin-bottom: 0
&__row
display: flex
+m
flex-direction: column
&__item
display: flex
margin-bottom: 40px
&__ava
height: 140px
margin-right: 25px
flex: 0 0 140px
margin-right: 40px
padding: 30px 35px
border-radius: 10px
box-shadow: 0 10px 25px 0 rgba(33, 74, 211, 0.2)
width: calc(50% - 20px)
+m
width: 100%
margin-bottom: 25px
padding: 20px 15px
&:nth-child(2)
margin-right: 0px
&__left-column
margin-right: 40px
flex: 0 0 80px
+t
height: 100px
margin-right: 20px
flex: 0 0 100px
+m
height: 95px
margin-right: 25px
flex: 0 0 95px
&__ava
height: 80px
&__title
margin-bottom: 5px
display: flex
+fb
font-size: 20px
letter-spacing: 2px
+t
font-size: 12px
letter-spacing: 2px
+m
display: block
&-name
font-family: 'ProximaNova-Regular', sans-serif
letter-spacing: normal
flex: 1
+t
font-size: 18px
&__social
margin-top: 15px
.social__item
margin-right: 3px
font-size: 25px
margin-right: 5px
font-size: 20px
+fb
&__content
font-size: 16px
font-size: 14px
line-height: (22/16)
&__wrap
&__right-column
flex: 1
& .btn
margin-top: 10px
.toggle
font-size: 14px
@ -1917,12 +2042,11 @@ a.grey-link
flex-wrap: wrap
&__item
margin: 0 10px 20px
flex: 0 0 calc(16.66% - 20px)
flex: 0 0 calc(20% - 20px)
text-align: center
height: 160px
height: 170px
+m
margin: 0 5px 10px
flex: 0 0 100px
flex: 0 0 calc(50% - 20px)
& a
height: 120px
display: flex
@ -1934,6 +2058,7 @@ a.grey-link
font-weight: bold;
letter-spacing: 2px;
text-transform: uppercase;
margin-top: 10px
&__pic
max-width: 100%
object-fit: contain
@ -2030,9 +2155,6 @@ a.grey-link
&_lg &__content
padding: 0 0 0 30px
font-size: 16px
&:before,
&:after
.footer
padding: 50px 0 30px
@ -2049,7 +2171,7 @@ a.grey-link
flex: 0 0 25%
+t
margin: 10px
&__row_second &__col:nth-child(2)
&__row_subscr &__col:nth-child(2)
flex: 1
&__nav
+m
@ -2487,10 +2609,14 @@ a.grey-link
.main-video-preview
z-index: 10
position: relative
box-shadow: 0 10px 100px rgba(0,0,0,0.20)
box-shadow: 0 30px 60px 0 rgba(0, 0, 0, 0.2)
cursor: pointer
max-height: 270px
border-radius: 10px
max-width: 100%
+m
width: 100%
height: auto
cursor: pointer
.head
display: flex
@ -3957,16 +4083,6 @@ a.grey-link
&_info
background: $green
.mobile-hide
+m
display: none
.mobile-show
display: none
+m
display: block
.school
display: flex
position: relative
@ -3977,6 +4093,11 @@ a.grey-link
margin-bottom: -40px
+m
margin: 0 -10px -30px
&_three-col
margin-top: 50px
+m
flex-direction: column
margin-top: 40px
&__col
padding: 0 15px
text-align: center
@ -3987,6 +4108,10 @@ a.grey-link
+m
margin-bottom: 30px
padding: 0 10px
&_three-col &__col
flex: 0 0 33%
+t
flex: 0 0 33%
&__preview
margin-bottom: 25px
font-size: 0
@ -4008,11 +4133,6 @@ a.grey-link
text-transform: uppercase
+t
font-size: 10px
&_main &__col
+t
flex: 0 0 25%
+m
flex: 0 0 50%
&_main &__preview
margin-bottom: 10px
font-size: 32px
@ -4463,7 +4583,8 @@ a
padding-top: 0
+m
padding-left: 0
height: 220px
height: 260px
flex-direction: column
&__text
font-size: 30px
text-shadow: none
@ -4473,7 +4594,6 @@ a
+m
font-size: 16px
width: auto
font-weight: bold
&__link
font-size: 15px
color: black
@ -4488,10 +4608,16 @@ a
text-transform: uppercase
font-family: 'ProximaNova-Bold'
box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.05), 0 9px 24px 0 rgba(33, 74, 211, 0.1)
z-index: 1
+m
margin-top: 20px
font-size: 10px
padding: 10px 14px
left: 50%
position: absolute
margin-left: -114px
width: 200px
bottom: 35px
&__link:hover
background: #ddd
&__image-column
@ -4499,6 +4625,8 @@ a
text-align: center
position: relative
padding-right: 20px
+m
flex: 1
& img
position: absolute
bottom: 0
@ -4514,6 +4642,7 @@ a
padding-top: 40px
+m
padding-top: 20px
flex: 0
&__countdown-title
color: black
font-size: 15px
@ -4524,6 +4653,11 @@ a
position: absolute
transform: translateX(-50%)
left: 50%
padding: 5px
background: rgba(255, 255, 255, 0.5)
border-radius: 5px
+m
padding: 5px 20px
&__countdown
display: flex
color: black
@ -4674,6 +4808,9 @@ a
height: 200px
+t
margin-bottom: 10px
+m
margin-left: auto
margin-right: auto
&__cover
object-fit: cover;
width: 100%;
@ -4863,6 +5000,10 @@ a
min-height: 200px
padding-bottom: 60px
.emoji
height: 32px
margin-bottom: -7px
.packages
display: flex
overflow-x: auto
@ -4941,3 +5082,12 @@ a
&__trial-btn img
width: 24px
margin-bottom: -6px
.mobile-hide
+m
display: none
.mobile-show
display: none
+m
display: block

Loading…
Cancel
Save