From 326b1ce96c625f211428669ec9395728ec726afc Mon Sep 17 00:00:00 2001
From: Max <maksim@good-poduction.ru>
Date: Tue, 2 Jul 2024 05:33:33 +0300
Subject: [PATCH] =?UTF-8?q?GP=20|=20feat:=20=D0=BF=D0=BE=D0=BF=D1=80=D0=B0?=
 =?UTF-8?q?=D0=B2=D0=B8=D0=BB=20=D0=BF=D0=BE=D0=B4=D0=BA=D0=BB=D1=8E=D1=87?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=B8=D0=B5=20=D1=81=D1=82=D0=B8=D0=BB=D0=B5=D0=B9?=
 =?UTF-8?q?=20+=20=D0=B4=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20=D0=BE?=
 =?UTF-8?q?=D0=B1=D1=80=D0=B0=D0=B1=D0=BE=D1=82=D1=87=D0=B8=D0=BA=20=D0=B4?=
 =?UTF-8?q?=D0=BB=D1=8F=20=D0=BE=D1=82=D0=BF=D1=80=D0=B0=D0=B2=D0=BA=D0=B8?=
 =?UTF-8?q?=20=D1=84=D0=BE=D1=80=D0=BC=20=D0=B2=20=D0=A2=D0=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 README.md                       |  9 +++---
 assets/css/gp-style-core.css    |  5 +++
 assets/css/gp-style-desktop.css | 20 ++++++++++--
 index.html                      | 54 ++++++++++++++++++++++++++++++---
 send-telegram.php               | 38 +++++++++++++++++++++++
 5 files changed, 114 insertions(+), 12 deletions(-)
 create mode 100644 send-telegram.php

diff --git a/README.md b/README.md
index cc36099..11598d9 100644
--- a/README.md
+++ b/README.md
@@ -24,10 +24,11 @@
 
 
 ## Оптимальный порядок действий
-1. Сначала определить CSS-переменные для основных цветов/градиентов, начертаний шрифтов (толщина, размер, модификация, межтрочный интервал) и занести в специально подгтовленный CSS-файл style-core.css 
-2. Все шрифты выкачать и сохранить локально в директорию /assets/fonts/ и подключить их в файле style-core.css
-3. Далее начинать стоит с верстки UI kit (должен быть предоставлен в макете дизайнером), для того чтобы переиспользовать готовые элементы по ходу верстки макетов. Для удобства подготовлен файл "ui_kit.html" 
-3. Как UI kit будет готов, можно смело переходить к верстке основных листов макета "*.html" и просто использовать готовые классы из style-core.css
+1. Сначала определить CSS-переменные для основных цветов/градиентов, начертаний шрифтов (толщина, размер, модификация, межтрочный интервал) и занести в специально подгтовленный CSS-файл `style-core.css` 
+2. Все шрифты выкачать и сохранить локально в директорию `/assets/fonts/` и подключить их в файле `style-core.css`
+3. Далее начинать стоит с верстки UI kit (должен быть предоставлен в макете дизайнером), для того чтобы переиспользовать готовые элементы по ходу верстки макетов. Стили для UI kit писать так же в файл `style-core.css`. 
+Саму HTML-верстку для UI kit делать в файле `ui_kit.html` 
+3. Как UI kit будет готов, можно смело переходить к верстке основных листов макета "*.html" и просто использовать готовые классы из `style-core.css`
 
 
 ### Примечания
diff --git a/assets/css/gp-style-core.css b/assets/css/gp-style-core.css
index 17b7034..5f160ef 100644
--- a/assets/css/gp-style-core.css
+++ b/assets/css/gp-style-core.css
@@ -1,3 +1,8 @@
+/* Переменные, шрифты, UI kit */
+
+
+
+
 /* 
 
 ШАБЛОН использования глобальных переменных:
diff --git a/assets/css/gp-style-desktop.css b/assets/css/gp-style-desktop.css
index ac7de8a..631a1a2 100644
--- a/assets/css/gp-style-desktop.css
+++ b/assets/css/gp-style-desktop.css
@@ -1,4 +1,18 @@
-/* Стили для лептопов  */
-@media only screen and (min-width: 992px) and (max-width: 1400px) {
+/* Основные стили для компьютера */
 
-}
\ No newline at end of file
+
+
+/* писать сюда... */
+
+
+
+
+
+
+
+
+
+/* Стили для лептопов  */
+/* @media only screen and (min-width: 992px) and (max-width: 1400px) {
+
+} */
\ No newline at end of file
diff --git a/index.html b/index.html
index 76a7d79..d2b4a80 100644
--- a/index.html
+++ b/index.html
@@ -8,15 +8,59 @@
         <meta name="description" content="SEO Description">
         <link rel="shortcut icon" href="/assets/img/favicon.ico?v=1.0">
 
+        <!-- Базовые стили -->
         <link rel="stylesheet" href="/assets/css/gp-style-core.css?v=1.0">
-        <link rel="stylesheet" media="screen and (min-width: 1720px)" href="/assets/css/gp-style-ultra.css?v=1.0">
-        <link rel="stylesheet" media="screen and (max-width: 1720px)" href="/assets/css/gp-style-desktop.css?v=1.0">
-        <link rel="stylesheet" media="screen and (max-width: 1024px)" href="/assets/css/gp-style-tablet.css?v=1.0">
-        <link rel="stylesheet" media="screen and (max-width: 480px)" href="/assets/css/gp-style-mobile.css?v=1.0">
+        <link rel="stylesheet" href="/assets/css/gp-style-desktop.css?v=1.0">
+        <!-- Адаптив -->
+        <link rel="stylesheet" media="screen and (min-width: 1400px)" href="/assets/css/gp-style-ultra.css?v=1.0">
+        <link rel="stylesheet" media="screen and (max-width: 992px)" href="/assets/css/gp-style-tablet.css?v=1.0">
+        <link rel="stylesheet" media="screen and (max-width: 576px)" href="/assets/css/gp-style-mobile.css?v=1.0">
+    
+
+        <!-- Яндекс.Вебмастер + Google Search Console -->
+        <meta name="yandex-verification" content="XXXXXXXXXXXXXXXXX" />
+        <meta name="google-site-verification" content="XXXXXXXXXXXXXXXXX" />
+        <!-- /Яндекс.Вебмастер + Google Search Console -->
+
+        <!-- Yandex.Metrika counter -->
+        <script type="text/javascript">
+            (function (m, e, t, r, i, k, a) {
+                m[i] = m[i] || function () { (m[i].a = m[i].a || []).push(arguments) };
+                m[i].l = 1 * new Date();
+                for (var j = 0; j < document.scripts.length; j++) { if (document.scripts[j].src === r) { return; } }
+                k = e.createElement(t), a = e.getElementsByTagName(t)[0], k.async = 1, k.src = r, a.parentNode.insertBefore(k, a)
+            })
+                (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
+
+            ym(XXXXXX, "init", { // XXXXXX - счетчик
+                clickmap: true,
+                trackLinks: true,
+                accurateTrackBounce: true,
+                webvisor: true,
+                ecommerce: "dataLayer"
+            });
+        </script>
+        <noscript>
+            <div><img src="https://mc.yandex.ru/watch/85828806" style="position:absolute; left:-9999px;" alt="" /></div>
+        </noscript>
+        <!-- /Yandex.Metrika counter -->
+    
+    
     </head>
     <body>
 
-        
+        <!-- Пример формы для отправки в Телеграмм (обработчик send-telegram.php) -->
+        <form class="form" method="post" action="/send-telegram.php">
+            <div class="form__item">
+                <input class="form__input" type="text" name="name" required>
+                <label class="form__label">Ваше имя</label>
+            </div>
+            <div class="form__item">
+                <input class="form__input" type="text" name="phone" required>
+                <label class="form__label">Номер телефона</label>
+            </div>
+            <input class="form__input btn" type="submit" value="Отправить">
+        </form>
 
         <script src="/assets/js/gp-main.js"></script>
     </body>
diff --git a/send-telegram.php b/send-telegram.php
new file mode 100644
index 0000000..285ed9a
--- /dev/null
+++ b/send-telegram.php
@@ -0,0 +1,38 @@
+<?php
+/* Пример из: https://vc.ru/dev/158136-kak-otpravlyat-zayavki-s-lendinga-pryamo-v-telegram */
+
+
+//В переменную $token нужно вставить токен, который нам прислал @botFather
+$token = "1094153697:AAFiLXXXXXLl0hRDsxBij1lddKydKxSSsOg04";
+
+//Сюда вставляем chat_id
+$chat_id = "-40XXXX740";
+
+//Определяем переменные для передачи данных из нашей формы
+if ($_POST['phone'] !== '') {
+    $name = ($_POST['name']);
+    $phone = ($_POST['phone']);
+
+    //Собираем в массив то, что будет передаваться боту
+    $arr = array(
+        'Имя:' => $name,
+        'Телефон:' => $phone
+    );
+
+    //Настраиваем внешний вид сообщения в телеграме
+    foreach($arr as $key => $value) {
+        $txt .= "<b>".$key."</b> ".$value."%0A";
+    };
+
+    //Передаем данные боту
+    $sendToTelegram = fopen("https://api.telegram.org/bot{$token}/sendMessage?chat_id={$chat_id}&parse_mode=html&text={$txt}","r");
+
+    //Выводим сообщение об успешной отправке
+    if ($sendToTelegram) {
+        echo 'Спасибо! Ваша заявка принята. Мы свяжемся с вами в ближайшее время.';
+    }else{
+        echo 'Что-то пошло не так. Попробуйте отправить форму ещё раз.';
+    }
+}
+
+?>
\ No newline at end of file