From 359a01e7eaa855d2e2e67cf0a82c6e3a194d4b3c Mon Sep 17 00:00:00 2001
From: Argo-Tianyi <argo@163.com>
Date: Fri, 17 Dec 2021 10:55:12 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E5=85=B6=E4=BB=96=E7=99=BB?=
 =?UTF-8?q?=E5=BD=95=E6=96=B9=E5=BC=8F=E6=94=B9=E7=94=A8=20Divider=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Pages/Account/Login.razor                 | 10 +--
 .../Pages/Account/Login.razor.css             | 71 ++-----------------
 2 files changed, 7 insertions(+), 74 deletions(-)

diff --git a/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor b/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor
index d55ec553..d79785f5 100644
--- a/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor
+++ b/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor
@@ -37,19 +37,15 @@
                         <SwitchButton @bind-ToggleState="UseMobileLogin" OnClick="OnClickSwitchButton" OffText="短信验证登录" OnText="用户密码登录" />
                     </Block>
                 </div>
-                <Button class="btn-login mt-3" ButtonType="ButtonType.Submit" Size="Size.Large" IsBlock="true" Color="Color.Danger" Text="登 录">
+                <Button class="btn-login mt-3" ButtonType="ButtonType.Submit" Size="Size.Large" IsBlock="true" Color="Color.None" Text="登 录">
                     <Tooltip Placement="Placement.Top" Title="不填写密码默认使用 Gitee 认证" />
                 </Button>
-                <div class="d-flex justify-content-between">
+                <div class="d-flex justify-content-between mt-3">
                     <LinkButton Text="申请账号" OnClick="OnSignUp" />
                     <LinkButton Text="忘记密码" OnClick="OnForgotPassword" />
                 </div>
                 <Block Condition="AllowOAuth">
-                    <div class="login-other">
-                        <span class="text-muted">
-                            其他方式登录
-                        </span>
-                    </div>
+                    <Divider Text="其他方式登录" />
                     <div class="login-list">
                         <LinkButton Url="Account/Gitee" Title="使用 Gitee 帐号登录" Img="images/gitee.svg" />
                         <LinkButton Url="Account/Gitee" Title="使用 GitHub 帐号登录" Img="images/git.svg" />
diff --git a/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor.css b/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor.css
index b27e07aa..c847fb98 100644
--- a/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor.css
+++ b/src/blazor/admin/BootstrapAdmin.Web/Pages/Account/Login.razor.css
@@ -33,9 +33,6 @@
     font-weight: 300;
     font-family: 'Open Sans', sans-serif;
     box-shadow: 0 4px #e56b60;
-    margin-bottom: 0.75rem;
-    outline: none !important;
-    margin-top: -0.25rem;
     line-height: 1;
 }
 
@@ -56,74 +53,14 @@
     border-color: #1ca0e9 !important;
 }
 
-.slidercaptcha {
-    display: none;
-    background-color: #00adec;
-    border-radius: 4px;
-    box-shadow: 0 0 10px #fff;
-    height: 274px;
-    width: 286px;
-    z-index: 1080;
-    position: absolute;
+::deep .divider-wrap {
+    background-color: #7c86bb;
 }
 
-    .slidercaptcha canvas:first-child {
-        border-radius: 4px;
-        border: solid 1px #0076c9;
-    }
-
-    .slidercaptcha .close {
-        color: #fff;
-        margin-top: -2px;
-    }
-
-    .slidercaptcha.oauth {
-        height: 210px;
-    }
-
-    .slidercaptcha.card .card-body {
-        padding: 0.75rem 0 0 0;
-    }
-
-    .slidercaptcha.card .card-header {
-        background-image: none;
-        background-color: rgba(0, 0, 0, 0.03);
-        color: #fff;
-    }
-
-        .slidercaptcha.card .card-header .close:hover {
-            color: #fff;
-        }
-
-    .slidercaptcha.forgot, .slidercaptcha.reg {
-        bottom: 52px;
-    }
-
-.login-other {
-    display: table;
-    text-align: center;
-    white-space: nowrap;
-    margin: 0.25rem 0 0.625rem 0;
+::deep .divider-text {
+    background-color: #a7daf9;
 }
 
-    .login-other:before, .login-other:after {
-        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC");
-        content: '';
-        display: table-cell;
-        position: relative;
-        top: 50%;
-        width: 50%;
-        background-repeat: no-repeat;
-    }
-
-    .login-other:before {
-        background-position: right 1em top 50%;
-    }
-
-    .login-other:after {
-        background-position: left 1em top 50%;
-    }
-
 .login-list {
     display: flex;
     justify-content: space-between;