From d5ef92f91ddcbeb4bfc007c7975e6d301a63b46e Mon Sep 17 00:00:00 2001
From: summe <baklazhanchik22@gmail.com>
Date: Tue, 24 Oct 2023 12:47:24 +0300
Subject: [PATCH] 0.0.2 registration page update

---
 templates/widgets/w_authorization.html | 79 +++++++++++++++++++++-----
 1 file changed, 64 insertions(+), 15 deletions(-)
diff --git a/templates/widgets/w_authorization.html b/templates/widgets/w_authorization.html
index b91cac0..0a7a388 100644
--- a/templates/widgets/w_authorization.html
+++ b/templates/widgets/w_authorization.html
@@ -1,28 +1,32 @@
 {% load static %}
 <head>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <style>
+
     .commonmargin {
         margin-top: 193px;
         text-align: center;
-
     }
+    
     .loginbtn {
         position: relative;
-        z-index: 0;
-        background: linear-gradient(135deg, #6BFFFF -30%, rgba(18, 67, 191, 1) 122%);
         padding-top: 25px;
-        padding-bottom: 3px;
         border: 3px solid #FFF ;
-        border-bottom: 0;
 
     }
     .registrbtn {
         padding-top: 25px;
         border: 3px solid #FFF ;
+
+    }
+
+    .chspan {
+        position: relative;
+        z-index: 22;
     }
 
     .chbtn {
-        margin: 0 -29px 0 -29px;
+        margin: 0 -30px 0 -30px;
         width: 370px;
         height: 38px;
         border-radius: 60px 60px 0px 0px;
@@ -37,7 +41,6 @@
         line-height: normal;
         letter-spacing: 1.8px;
         text-decoration: none;
-
     }
 
     .loginpole {
@@ -48,7 +51,6 @@
         border: 3px solid #FFF;
         border-top: none;
         background: linear-gradient(135deg, #6BFFFF -15.56%, rgba(18, 67, 191, 0.92) 40%, rgba(191, 18, 174, 0.92) 95%);
-        box-shadow: 4px 4px 25px 0px #74286C;
         position: relative;
     }
 
@@ -190,11 +192,15 @@
         position: relative;
     }
 
-    .registration:target, .loginpole:target {
+    .registration:target {
         display: block;
     }
 
-    .registration, .loginpole {
+    .loginpole:target {
+        display: block;
+    }
+
+    .registration, .loginpole{
         display: none;
     }
     .registration {
@@ -203,7 +209,6 @@
         border-radius: 60px;
         border: 3px solid #FFF;
         background: linear-gradient(135deg, #6BFFFF -15.56%, rgba(18, 67, 191, 0.92) 40%, rgba(191, 18, 174, 0.92) 95%);
-        box-shadow: 4px 4px 25px 0px #74286C;
         border-top: none;
         border-radius: 0 0 60px 60px;
         margin: auto;
@@ -275,12 +280,27 @@
         width: 370px;
         height: 67px;
         position: absolute;
-        background: linear-gradient(135deg, #6BFFFF -80%, rgba(18, 67, 191, 1) 55%);
+        background: linear-gradient(135deg, #6BFFFF -95%, rgba(18, 67, 191, 1) 50%, rgba(191, 18, 174, 1) 220%);
         top: -70px;
         right: -3px;
         border-radius: 60px 60px 0 0;
         border: 3px solid #fff;
         border-bottom: none;
+        z-index: 1;
+    }
+
+        .loginpole:before {
+        content: "";
+        width: 370px;
+        height: 66px;
+        position: absolute;
+        background: linear-gradient(135deg, #6BFFFF -25%, rgba(18, 67, 191, 1) 122%);
+        top: -69px;
+        right: 318px;
+        border-radius: 60px 60px 0 0;
+        border: 3px solid #fff;
+        border-bottom: none;
+        z-index: 1;
     }
 
 </style>
@@ -288,8 +308,8 @@
 <body>
 <div class="commonmargin">
     <div class="checks">
-        <a href="#1" class="loginbtn chbtn" >вход</a>
-        <a href="#2" class="registrbtn chbtn" >регистрация</a>
+        <a href="#1" id="defaultOpen" class="loginbtn chbtn" ><span class="chspan">вход</span></a>
+        <a href="#2" class="registrbtn chbtn" ><span class="chspan">регистрация</span></a>
     </div>
 <div class="loginpole" id="1">
     <div class="lines">
@@ -299,7 +319,7 @@
         </br>
         <input type="submit" class="login" value="войти">
     </div>
-        <button class="registrate">зарегистрироваться</button>
+        <button id="1" class="registrate">зарегистрироваться</button>
         <div>
             <div class="langchange">
                 <a href="#"><div class="ru">RU</div></a>
@@ -335,4 +355,33 @@
     <input class="registrate2" type="submit" form="reg" value="ЗАРЕГИСТРИРОВАТЬСЯ">
 </div>
 
+<script>
+document.getElementById("defaultOpen").click();
+</script>
+
+<script>
+// Обнаружение ссылки якоря для таба
+let url = location.href.split('#')[1], el = $('#'+url);
+if(el.length > 0 && el.closest('.tabs-block').length > 0) {
+    let parent = el.closest('.tabs-block');
+  //
+  parent.find('.item.--active').removeClass('--active');
+  parent.find('.tabs .item[href="'+url+'"]').addClass('--active');
+  parent.find('.content #'+url).addClass('--active');
+}
+
+// Переключение табов
+$('.tabs-block .tabs').on('click', '.item', function(e){
+    e.preventDefault()
+    if(!$(this).hasClass('--active')) {
+    let parent = $(this).closest('.tabs-block'),
+            id = $(this).attr('href').split('#')[1];
+    //
+    parent.find('.item.--active').removeClass('--active');
+    parent.find('.content #'+id).addClass('--active');
+    $(this).addClass('--active');
+  }
+});
+</script>
+
 </body>
\ No newline at end of file
