add some code

templates/pages/p_mover_landing_page.html

@@ -3,9 +3,355 @@
 {% load i18n %}
 
 {% block meta %}
+  <link rel="stylesheet" href="{% static "css/moover.css" %}">
 {% endblock %}
 
 {% block content %}
 
-    
+  <section class="presentation">
+    <div class="presentation__top">
+        <h1 class="presentation__title" >
+          {% blocktrans %}
+            Сервис попутных посылок
+          {% endblocktrans %}
+        </h1>
+        <div class="presentation__subtitle">
+          {% translate "Отправляй посылки с попутчиками в любую точку, быстро и недорого" %}
+        </div>
+        <button class="presentation__btn btn btn--primary">Узнать подробнее</button>
+      <div class="presentation__next">
+        {% translate "Как это работает?" %}
+        <div class="presentation__arrows">
+          <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+            <path d="M26 16L16 26L6 16" stroke="#272424" stroke-opacity="0.6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+            <path d="M26 6L16 16L6 6" stroke="#272424" stroke-opacity="0.6" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </div>
+      </div>
+    </div>
+    <div class="presentation__bottom">
+      <div class="presentation__title">
+        {% translate "Как это работает" %}
+      </div>
+      <p class="presentation__desc">
+        {% translate "Маленькая история о том, как работает наш сервис" %}
+      </p>
+      <div class="presentation__cards cards">
+
+        <div class="cards__list">
+
+          <div class="cards__item">
+            <div class="cards__arrow"></div>
+            <img class="cards__img" src="{% static "img/webp/image1.webp" %}" alt="img1"/>
+            <p class="cards__desc">
+              {% translate "Мария, хочет отправить посылку, но её не устраивает цена доставки почтовых сервисов и она устала искать в чатах тех, кто сможет перевезти посылку." %}
+            </p>
+          </div>
+          <div class="cards__item">
+            <div class="cards__arrow"></div>
+            <img class="cards__img" src="{% static "img/webp/image2.webp" %}" alt="img1"/>
+            <p class="cards__desc">
+              {% translate "Мария, узнаёт о нашем сервисе TripWB.com. Регистрируется и очень быстро размещает объявление." %}
+            </p>
+          </div>
+          <div class="cards__item">
+            <div class="cards__arrow"></div>
+            <img class="cards__img" src="{% static "img/webp/image3.webp" %}" alt="img1"/>
+            <p class="cards__desc">
+              {% translate "Попутчик Егор увидел объявление Марии, нажал откликнуться и получил возможность связаться с ней, удобным для него способом." %}
+            </p>
+          </div>
+          <div class="cards__item">
+            <img class="cards__img" src="{% static "img/webp/image4.webp" %}" alt="img1"/>
+            <p class="cards__desc">
+              {% translate "Мария и Егор обговорили детали доставки и потом встретились в удобном для всех месте. После чего Мария передала посылку Егору и он её доставил." %}
+            </p>
+          </div>
+        </div>
+
+      </div>
+    </div>
+
+
+
+
+
+      {#         <div class="switch">#}
+      {#            <div><a class="active" href="#">Перевозчик</a></div>#}
+      {#            <div><a class="deadctive" href="#">Отправитель</a></div>#}
+      {#          </div>#}
+
+    </div>
+    <div class="presentaition__bottom search_form_main">
+    <div class="cut-width">
+      {% include "blocks/b_find_route_form.html" %}
+    </div>
+  </div>
+  </section>
+
+  <div class="switch">
+    <div class="form_radio_btn">
+      <input onclick="set_right_btn_owner_type(this)" class="btns_owner el_form_find_route" id="radio-1" type="radio"
+             name="owner_type" value="mover" checked>
+      <label for="radio-1">{% translate "Найти перевозчика" %}</label>
+    </div>
+
+    <div class="form_radio_btn">
+      <input onclick="set_right_btn_owner_type(this)" class="btns_owner el_form_find_route" id="radio-2" type="radio"
+             name="owner_type" value="customer">
+      <label for="radio-2">{% translate "Найти отправителя" %}</label>
+    </div>
+  </div>
+
+  <div class="search_form_main">
+    <div class="cut-width">
+      {% include "blocks/b_find_route_form.html" %}
+    </div>
+  </div>
+
+  <div class="mid_block_static">
+
+    <h2 id="title_static">{% translate "О сервисе Trip With Bonus" %}</h2>
+    <span id="sub_title_static">
+                <p>
+                    {% translate "TripWithBonus — это сервис, созданный для того, чтобы отправитель и перевозчик нашли друг-друга!" %}
+                    {% translate "Наш сервис предлагает вам прямые контакты, а не является посредником!" %}
+                </p>
+            </span>
+
+
+    <div class="tabs">
+
+      <div class="wrapper_tab_button">
+        <div
+            class="tab-btn-1 tab-btn-active"
+            onclick="showTabBtn(this)"
+        >
+          {% translate "Как отправить?" %}
+        </div>
+
+        <div
+            class="tab-btn-2"
+            onclick="showTabBtn(this)"
+        >
+          {% translate "Как перевезти?" %}
+        </div>
+
+      </div>
+
+      <div id="content-1" class="show ">
+        <h2 id="title_static">{% translate "Вам нужно отправить посылку быстро и недорого?" %}</h2>
+        <div class="benefit_img">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Find_carrier.svg" alt="">
+            <h3>{% translate "Найдите перевозчика" %}</h3>
+            <span>{% translate "Зайдите на сайт Trip With Bonus и в форме вверху страницы, заполните данные для поиска перевозчика." %}</span>
+          </div>
+
+          <img src="/static/img/svg/Arrow_direction.svg" alt="">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Contact_carrier.svg" alt="">
+            <h3>{% translate "Свяжитесь с перевозчиком" %}</h3>
+            <span>{% translate "Откройте контакты на сайте и договоритесь о месте встречи и условиях перевозки. В случае, если Вы не нашли объявления о перевозчиках по Вашему запросу, Вы можете разместить свое объявление воспользовавшись формой в личном кабинете." %}</span>
+          </div>
+
+          <img src="/static/img/svg/Arrow_direction.svg" alt="">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Pass_package.svg" alt="">
+            <h3>{% translate "Передайте посылку" %}</h3>
+            <span>{% translate "Встречайтесь, знакомьтесь и передавайте посылку" %}</span>
+          </div>
+
+        </div>
+
+        <div class="button_container">
+          <a class="a_btn_standart"
+             href="{% url 'profile_page' 'create_route_for_customer' %}"
+             id="more_button">{% translate "Отправить посылку" %}
+          </a>
+        </div>
+      </div>
+      <div id="content-2">
+        <h2 id="title_static">{% translate "Вы путешествуете и можете взять посылку по-пути?" %}</h2>
+        <div class="benefit_img">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Find_carrier.svg" alt="">
+            <h3>{% translate "Найдите отправителя" %}</h3>
+            <span>{% translate "Зайдите на сайт Trip With Bonus и в форме вверху страницы, заполните данные для поиска отправителя посылки." %}</span>
+
+          </div>
+
+          <img src="/static/img/svg/Arrow_direction.svg" alt="">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Contact_carrier.svg" alt="">
+            <h3>{% translate "Свяжитесь с отправителем" %}</h3>
+            <span>{% translate "Откройте контакты на сайте и договоритесь о месте встречи и условиях перевозки. В случае, если Вы не нашли объявления об отправителях по Вашему запросу, Вы можете разместить свое объявление воспользовавшись формой в личном кабинете." %}</span>
+
+          </div>
+
+          <img src="/static/img/svg/Arrow_direction.svg" alt="">
+
+          <div class="benefit_img_item">
+            <img src="/static/img/svg/Pass_package.svg" alt="">
+            <h3>{% translate "Принимайте посылку" %}</h3>
+            <span>{% translate "Встречайтесь, знакомьтесь и принимайте посылку" %}</span>
+
+          </div>
+
+        </div>
+
+
+        <div class="button_container">
+          <a class="a_btn_standart"
+             href="{% url 'profile_page' 'create_route_for_mover' %}"
+             id="more_button">{% translate "Перевезти посылку" %}
+          </a>
+        </div>
+      </div>
+
+    </div>
+
+
+  </div>
+
+  <div class="pre_bottom_block_static">
+    <h2 id=title_static>{% translate "Trip With Bonus это комфорт и эффективность!" %}</h2>
+
+    <div class="cards_wrapper">
+      <div class="cards_item_1">
+
+        <div class="cards_item_img">
+          <img src="/static/img/png/cards_item_1.png" alt="">
+        </div>
+
+        <div class="cards_item_text">
+          <div class="card_title_1">{% translate "+5%" %}</div>
+          <div class="card_title_2">{% translate "рост путешествий ежегодно" %}</div>
+          <div
+              class="card_title_3">{% translate "В среднем на 5% растёт количество путешествий ежегодно. Просто путешествуй и получай бонусы." %}</div>
+        </div>
+      </div>
+
+      <div class="cards_item_2">
+
+        <div class="cards_item_img">
+          <img src="/static/img/png/cards_item_2.png" alt="">
+        </div>
+
+        <div class="cards_item_text">
+          <div class="card_title_1">{% translate "в 3 раза" %}</div>
+          <div class="card_title_2">{% translate "быстрее других сервисов" %}</div>
+          <div
+              class="card_title_3">{% translate "Почтовые сервисы доставляет посылки в среднем за 10 дней. С нами - быстрее!" %}</div>
+        </div>
+
+
+        {#                    <div class="card_gradient"></div>#}
+      </div>
+      <div class="cards_item_3">
+
+        <div class="cards_item_img">
+          <img src="/static/img/png/cards_item_3.png" alt="">
+        </div>
+
+        <div class="cards_item_text">
+          <div class="card_title_1">{% translate "+142" %}</div>
+          <div class="card_title_2">{% translate "заявки ежедневно" %}</div>
+          <div class="card_title_3">{% translate "На перевозку или отправку посылок в разные уголки мира" %}</div>
+        </div>
+
+
+        {#                <div class="cards_item_3_right">#}
+        {#                     <div class="card_gradient"></div>#}
+        {#                </div>#}
+      </div>
+      <div class="cards_item_4">
+
+        <div class="cards_item_img">
+          <img src="/static/img/png/cards_item_4.png" alt="">
+        </div>
+
+        <div class="cards_item_text">
+          <div class="card_title_1">{% translate "30+" %}</div>
+          <div class="card_title_2">{% translate "стран" %}</div>
+          <div class="card_title_3">{% translate "С TripWB отправляй посылки по всему миру! С нами нет границ!" %}</div>
+        </div>
+
+
+        {#                <div class="cards_item_4_right">#}
+        {#                   <div class="card_gradient_black"></div>#}
+        {#                </div>#}
+      </div>
+    </div>
+
+  </div>
+
+
+  {% if page.get_FAQ_items %}
+    <div class="faq_main_page">
+    <h2 id=title_static>
+      {% if page.FAQ_title %}{{ page.FAQ_title }}{% else %}{% translate "Частые вопросы" %}{% endif %}
+    </h2>
+    {% for faq_item in page.get_FAQ_items %}
+      <details>
+        <summary>{{ faq_item.question }}</summary>
+        <p>{{ faq_item.answer }}</p>
+      </details>
+    {% endfor %}
+  {% endif %}
+
+
+
+</div>
+
+
+
+
+  <div class="news_block_main">
+    <h2 class="ta_center" id=title_static>{% translate "Последние новости" %}</h2>
+    {#        {% for art in articles %}#}
+    {##}
+    {#                <div class="news_item">#}
+    {#                    <div class="news_img"><img src="{{ MEDIA_URL }}{{ art.picture }}" /></div>#}
+    {#                    <div class="news_header">{{ art.name }}</div>#}
+    {#                    <div class="news_description">#}
+    {#                        {{ art.description|truncatechars:100 }}#}
+    {#                        <div class="news_gradient"></div>#}
+    {#                    </div>#}
+    {#                </div>#}
+    {##}
+    {#        {% endfor %}#}
+    {#        <div class="three_pinned_news">#}
+    <div class="news_block">
+      {% for art in articles %}
+        <a class="cont_one_news" href="{% url "article_one" art.url %}">
+          <div class="cont_img_one_news">
+            <img class="img_one_news" src="{{ MEDIA_URL }}{{ art.picture }}">
+          </div>
+          <div class="cont_content_one_news">
+            <div class="container_name_one_news">
+              {{ art.name|truncatechars:100 }}
+            </div>
+            <div class="container_descript_one_news">
+              {{ art.description|truncatechars:100 }}
+            </div>
+          </div>
+        </a>
+      {% endfor %}
+    </div>
+
+
+    {#            {% url "article_one" art.url %}#}
+    {#            {{ MEDIA_URL }}{{ art.picture }}#}
+    {#            {{ art.description|truncatechars:100 }}#}
+
+
+    {#        </div>#}
+  </div>
+
 {% endblock %}