src/ui/footer

import React from "react"

const productLinks = [
  {
    href: "/templates",
    text: "Дизайны",
    target: "",
    rel: "",
    id: 1,
  },
  {
    href: "/pricing",
    text: "Цены",
    target: "",
    rel: "",
    id: 2,
  },
  {
    href: "/guide",
    text: "Возможности",
    target: "",
    rel: "",
    id: 3,
  },
  {
    href: "https://support.vigbo.com",
    text: "Справочный центр",
    target: "_blank",
    rel: "noopener noreferrer",
    id: 4,
  },
  {
    href: "https://webinars.vigbo.com",
    text: "Вебинары",
    target: "_blank",
    rel: "noopener noreferrer",
    id: 5,
  },
  {
    href: "https://seo.vigbo.com",
    text: "SEO",
    target: "_blank",
    rel: "noopener noreferrer",
    id: 6,
  },
]

const infoLinks = [
  {
    href: "/reviews",
    text: "Отзывы",
    id: 1,
  },
  {
    href: "/clients",
    text: "Клиенты",
    id: 2,
  },
  {
    href: "/faq",
    text: "Вопрос-ответ",
    id: 3,
  },
  {
    href: "https://blog.vigbo.com",
    text: "Блог",
    id: 4,
  },
]

export const Footer = () => {
  return (
    <footer className="footer">
      <div className="footer__up js-scroll-to-top">
        <div className="footer__icon"></div>
      </div>
      <div className="footer__row">
        <div className="footer__top">
          <div className="footer__wrap container-fluid">
            <div className="footer__cont">
              <div className="footer__menu-box">
                <div className="footer__menu">
                  <div className="footer__menu_col">
                    <div className="footer__menu_title footer__title js-footer__toggle-nav">
                      ПРОДУКТ
                    </div>
                    <div className="footer__menu_list js-footer__toggle-cont">
                      <div className="footer__menu_list-box">
                        {productLinks.map(({ id, href, rel, target, text }) => (
                          <a
                            key={id}
                            href={href}
                            rel={rel}
                            target={target}
                            className="footer__menu_href"
                          >
                            {text}
                          </a>
                        ))}
                      </div>
                    </div>
                  </div>
                  <div className="footer__menu_col">
                    <div className="footer__menu_title footer__title js-footer__toggle-nav">
                      ИНФО
                    </div>
                    <div className="footer__menu_list js-footer__toggle-cont">
                      <div className="footer__menu_list-box">
                        {infoLinks.map(({ id, href, text }) => (
                          <a key={id} href={href} className="footer__menu_href">
                            {text}
                          </a>
                        ))}
                      </div>
                    </div>
                  </div>
                  <div className="footer__menu_col">
                    <div className="footer__menu_title footer__title js-footer__toggle-nav">
                      КОМПАНИЯ
                    </div>
                    <div className="footer__menu_list js-footer__toggle-cont">
                      <div className="footer__menu_list-box">
                        <a href="/team" className="footer__menu_href ">
                          Команда
                        </a>
                        <a href="/vacancies" className="footer__menu_href ">
                          Вакансии
                        </a>
                        <a href="/contacts" className="footer__menu_href ">
                          Контакты
                        </a>
                        <a href="/agreement" className="footer__menu_href ">
                          Пользовательское соглашение
                        </a>
                        <a
                          href="/confidential_policy"
                          className="footer__menu_href "
                        >
                          Политика конфиденциальности
                        </a>
                        <a
                          href="/legal-information"
                          className="footer__menu_href "
                        >
                          Реквизиты компании
                        </a>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div className="footer__online-box">
                <div className="footer__online">
                  <div className="footer__online_title footer__title">
                    МЫ В СЕТИ:
                  </div>
                  <div className="footer__online_list">
                    <a
                      href="https://www.facebook.com/vigbo.ru"
                      className="footer__online_el"
                    >
                      <svg
                        xmlns="http://www.w3.org/2000/svg"
                        xmlnsXlink="http://www.w3.org/1999/xlink"
                        width="8px"
                        height="16px"
                      >
                        <path
                          fillRule="evenodd"
                          fill="rgb(0, 0, 0)"
                          d="M5.940,3.000 C5.940,3.000 8.000,3.000 8.000,3.000 C8.000,3.000 8.000,-0.000 8.000,-0.000 C8.000,-0.000 5.580,-0.000 5.580,-0.000 C2.650,0.110 2.050,1.770 2.000,3.500 C2.000,3.500 2.000,5.000 2.000,5.000 C2.000,5.000 -0.000,5.000 -0.000,5.000 C-0.000,5.000 -0.000,8.000 -0.000,8.000 C-0.000,8.000 2.000,8.000 2.000,8.000 C2.000,8.000 2.000,16.000 2.000,16.000 C2.000,16.000 5.000,16.000 5.000,16.000 C5.000,16.000 5.000,8.000 5.000,8.000 C5.000,8.000 7.460,8.000 7.460,8.000 C7.460,8.000 7.930,5.000 7.930,5.000 C7.930,5.000 5.000,5.000 5.000,5.000 C5.000,5.000 5.000,4.100 5.000,4.100 C4.944,3.551 5.344,3.060 5.894,3.003 C5.894,3.003 5.940,3.000 5.940,3.000 Z"
                        ></path>
                      </svg>
                    </a>
                    <a
                      href="https://www.instagram.com/vigbo.ru"
                      className="footer__online_el"
                    >
                      <svg
                        xmlns="http://www.w3.org/2000/svg"
                        xmlnsXlink="http://www.w3.org/1999/xlink"
                        width="16px"
                        height="16px"
                      >
                        <path
                          fillRule="evenodd"
                          fill="rgb(0, 0, 0)"
                          d="M11.590,16.000 C11.590,16.000 4.420,16.000 4.420,16.000 C1.983,16.000 0.005,14.027 -0.000,11.590 C-0.000,11.590 -0.000,4.420 -0.000,4.420 C-0.000,1.979 1.979,-0.000 4.420,-0.000 C4.420,-0.000 11.580,-0.000 11.580,-0.000 C14.021,-0.000 16.000,1.979 16.000,4.420 C16.000,4.420 16.000,11.580 16.000,11.580 C16.000,14.017 14.027,15.994 11.590,16.000 ZM11.590,1.420 C11.590,1.420 4.420,1.420 4.420,1.420 C2.763,1.420 1.420,2.763 1.420,4.420 C1.420,4.420 1.420,11.580 1.420,11.580 C1.420,13.237 2.763,14.580 4.420,14.580 C4.420,14.580 11.580,14.580 11.580,14.580 C13.237,14.580 14.580,13.237 14.580,11.580 C14.580,11.580 14.590,4.420 14.590,4.420 C14.590,2.763 13.247,1.420 11.590,1.420 ZM12.214,4.668 C11.662,4.644 11.234,4.178 11.258,3.626 C11.282,3.074 11.748,2.646 12.300,2.670 C12.300,2.670 12.260,2.700 12.260,2.700 C12.538,2.693 12.806,2.802 13.000,3.000 C13.175,3.195 13.267,3.450 13.256,3.712 C13.232,4.264 12.765,4.692 12.214,4.668 ZM8.000,12.120 C5.725,12.120 3.880,10.275 3.880,8.000 C3.880,5.725 5.725,3.880 8.000,3.880 C10.273,3.885 12.114,5.727 12.120,8.000 C12.120,10.275 10.275,12.120 8.000,12.120 ZM8.000,5.300 C6.509,5.300 5.300,6.509 5.300,8.000 C5.300,9.491 6.509,10.700 8.000,10.700 C9.489,10.694 10.694,9.489 10.700,8.000 C10.700,6.509 9.491,5.300 8.000,5.300 Z"
                        ></path>
                      </svg>
                    </a>
                    <a
                      href="https://vk.com/vigbo"
                      className="footer__online_el"
                    >
                      <svg
                        xmlns="http://www.w3.org/2000/svg"
                        xmlnsXlink="http://www.w3.org/1999/xlink"
                        width="17px"
                        height="10px"
                      >
                        <path
                          fillRule="evenodd"
                          fill="rgb(0, 0, 0)"
                          d="M16.786,8.937 C16.786,8.937 16.736,8.839 16.736,8.839 C16.302,8.164 15.770,7.556 15.155,7.035 C14.803,6.701 14.582,6.479 14.489,6.368 C14.324,6.189 14.278,5.934 14.369,5.711 C14.579,5.330 14.829,4.971 15.115,4.642 C15.115,4.642 15.652,3.946 15.652,3.946 C16.574,2.678 16.985,1.867 16.885,1.514 C16.885,1.514 16.885,1.436 16.885,1.436 C16.817,1.364 16.725,1.316 16.627,1.298 C16.453,1.263 16.274,1.263 16.100,1.298 C16.100,1.298 13.723,1.298 13.723,1.298 C13.723,1.298 13.554,1.298 13.554,1.298 C13.554,1.298 13.445,1.298 13.445,1.298 C13.445,1.298 13.355,1.387 13.355,1.387 C13.355,1.387 13.276,1.534 13.276,1.534 C13.028,2.166 12.733,2.779 12.391,3.367 C12.185,3.707 11.996,3.998 11.824,4.240 C11.696,4.434 11.554,4.618 11.396,4.789 C11.297,4.891 11.190,4.986 11.078,5.073 C11.078,5.073 10.859,5.161 10.859,5.161 C10.859,5.161 10.719,5.161 10.719,5.161 C10.719,5.161 10.531,4.966 10.531,4.966 C10.478,4.868 10.445,4.762 10.431,4.652 C10.431,4.521 10.431,4.410 10.431,4.318 C10.431,4.230 10.431,4.093 10.431,3.926 C10.431,3.760 10.431,3.642 10.431,3.583 C10.431,3.374 10.431,3.148 10.431,2.906 C10.431,2.665 10.431,2.472 10.431,2.328 C10.431,2.184 10.431,2.034 10.431,1.877 C10.444,1.753 10.444,1.628 10.431,1.504 C10.412,1.413 10.381,1.324 10.342,1.239 C10.342,1.239 10.173,1.043 10.173,1.043 C10.086,0.994 9.992,0.957 9.894,0.935 C9.477,0.868 9.053,0.849 8.631,0.877 C7.962,0.820 7.287,0.886 6.642,1.073 C6.522,1.134 6.414,1.218 6.324,1.318 C6.224,1.436 6.224,1.501 6.324,1.514 C6.599,1.530 6.855,1.658 7.030,1.867 C7.030,1.867 7.030,1.965 7.030,1.965 C7.086,2.084 7.126,2.209 7.149,2.338 C7.189,2.535 7.212,2.735 7.219,2.936 C7.245,3.262 7.245,3.590 7.219,3.916 C7.219,4.197 7.192,4.416 7.140,4.574 C7.123,4.706 7.086,4.834 7.030,4.956 C7.030,4.956 6.940,5.172 6.940,5.172 C6.940,5.172 6.722,5.172 6.722,5.172 C6.619,5.160 6.522,5.119 6.443,5.054 C6.318,4.963 6.205,4.857 6.105,4.740 C5.957,4.565 5.824,4.378 5.707,4.181 C5.528,3.998 5.359,3.730 5.200,3.377 C5.200,3.377 5.071,3.181 5.071,3.181 C4.991,3.030 4.879,2.808 4.732,2.514 C4.587,2.220 4.461,1.939 4.355,1.671 C4.314,1.567 4.241,1.478 4.146,1.416 C4.146,1.416 3.957,1.318 3.957,1.318 C3.957,1.318 3.768,1.269 3.768,1.269 C3.768,1.269 1.500,1.269 1.500,1.269 C1.337,1.253 1.174,1.306 1.053,1.416 C1.053,1.416 0.974,1.612 0.974,1.612 C0.974,1.612 0.974,1.828 0.974,1.828 C1.351,2.599 1.732,3.341 2.117,4.054 C2.502,4.766 2.833,5.338 3.112,5.770 C3.397,6.201 3.688,6.610 3.987,6.996 C4.285,7.381 4.481,7.630 4.574,7.741 C4.574,7.741 4.802,7.986 4.802,7.986 C4.802,7.986 5.011,8.182 5.011,8.182 C5.194,8.354 5.390,8.511 5.598,8.652 C5.874,8.847 6.159,9.027 6.453,9.191 C6.794,9.380 7.159,9.526 7.537,9.623 C7.928,9.733 8.335,9.779 8.741,9.760 C8.741,9.760 9.735,9.760 9.735,9.760 C9.898,9.757 10.054,9.694 10.173,9.584 C10.173,9.584 10.232,9.437 10.232,9.437 C10.232,9.437 10.232,9.212 10.232,9.212 C10.224,9.001 10.241,8.790 10.282,8.583 C10.309,8.438 10.356,8.296 10.421,8.162 C10.468,8.072 10.528,7.989 10.600,7.917 C10.600,7.917 10.740,7.799 10.740,7.799 C10.740,7.799 10.809,7.799 10.809,7.799 C10.977,7.765 11.151,7.812 11.277,7.926 C11.465,8.062 11.635,8.220 11.784,8.398 C11.943,8.587 12.131,8.796 12.351,9.025 C12.525,9.216 12.718,9.391 12.927,9.545 C12.927,9.545 13.097,9.642 13.097,9.642 C13.232,9.718 13.375,9.777 13.524,9.820 C13.678,9.859 13.838,9.859 13.991,9.820 C13.991,9.820 16.109,9.820 16.109,9.820 C16.278,9.828 16.446,9.794 16.597,9.721 C16.694,9.676 16.769,9.595 16.806,9.496 C16.826,9.405 16.826,9.311 16.806,9.221 C16.806,9.221 16.747,9.006 16.747,9.006 C16.747,9.006 16.786,8.937 16.786,8.937 Z"
                        ></path>
                      </svg>
                    </a>
                    <a
                      href="https://www.youtube.com/vigbo"
                      className="footer__online_el"
                    >
                      <svg
                        xmlns="http://www.w3.org/2000/svg"
                        xmlnsXlink="http://www.w3.org/1999/xlink"
                        width="16px"
                        height="11px"
                      >
                        <path
                          fillRule="evenodd"
                          fill="rgb(0, 0, 0)"
                          d="M15.200,0.818 C14.772,0.400 14.198,0.163 13.600,0.159 C11.360,-0.001 8.000,-0.001 8.000,-0.001 C8.000,-0.001 4.640,-0.001 2.400,0.159 C1.801,0.164 1.228,0.400 0.800,0.818 C0.458,1.272 0.238,1.805 0.160,2.367 C0.060,3.209 0.007,4.057 -0.000,4.905 C-0.000,4.905 -0.000,6.084 -0.000,6.084 C0.007,6.929 0.061,7.773 0.160,8.612 C0.236,9.178 0.457,9.715 0.800,10.172 C1.290,10.594 1.913,10.831 2.560,10.841 C3.840,10.961 8.000,11.000 8.000,11.000 C8.000,11.000 11.360,11.000 13.600,10.841 C14.198,10.835 14.771,10.599 15.200,10.181 C15.542,9.728 15.762,9.195 15.840,8.633 C15.940,7.787 15.994,6.936 16.000,6.084 C16.000,6.084 16.000,4.905 16.000,4.905 C15.993,4.060 15.939,3.216 15.840,2.377 C15.764,1.811 15.543,1.274 15.200,0.818 ZM6.350,7.673 C6.350,7.673 6.350,3.286 6.350,3.286 C6.350,3.286 10.680,5.485 10.680,5.485 C10.680,5.485 6.350,7.673 6.350,7.673 Z"
                        ></path>
                      </svg>
                    </a>
                  </div>
                  <div className="footer__online-description">
                    <span className="online-description__text">
                      Конструктор сайтов Vigbo
                    </span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </footer>
  )
}