添加钉钉官方logo到登录按钮:使用钉钉官方logo图片替换通用图标
This commit is contained in:
parent
2f73a15694
commit
02cab58447
@ -194,11 +194,17 @@
|
||||
<a-button
|
||||
v-if="dingTalkLoginEnabled"
|
||||
block
|
||||
class="alt-login-button"
|
||||
class="alt-login-button dingtalk-login-button"
|
||||
@click="handleDingTalkLogin"
|
||||
:loading="dingTalkLoginLoading"
|
||||
>
|
||||
<Icon name="share" size="sm" style="margin-right: 8px;" />
|
||||
<img
|
||||
src="https://img.alicdn.com/imgextra/i1/O1CN01CHK9VA1YTzZJxXGf7_!!6000000003022-2-tps-400-400.png"
|
||||
alt="钉钉"
|
||||
class="dingtalk-logo"
|
||||
onerror="this.style.display='none'; this.nextSibling.style.display='inline-block';"
|
||||
/>
|
||||
<span class="dingtalk-logo-text" style="display: none;">D</span>
|
||||
钉钉登录
|
||||
</a-button>
|
||||
</div>
|
||||
@ -884,6 +890,9 @@ onUnmounted(() => {
|
||||
color: $text-white;
|
||||
font-size: $font-size-base;
|
||||
transition: all 0.2s ease;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: $bg-tertiary;
|
||||
@ -892,6 +901,24 @@ onUnmounted(() => {
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.dingtalk-login-button {
|
||||
background: #0070f3;
|
||||
border-color: #0070f3;
|
||||
color: #ffffff;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #0051cc;
|
||||
border-color: #0051cc;
|
||||
}
|
||||
|
||||
.dingtalk-logo {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 8px;
|
||||
vertical-align: middle;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user