Modify OAuth login ui and fix display name, iconurl related logic (#25030)
Close #24808 Co-Authour @wxiaoguang @silverwind 1. Most svgs are found from https://worldvectorlogo.com/ , and some are from conversion of png to svg. (facebook and nextcloud). And also changed `templates/user/settings/security/accountlinks.tmpl`. 2. Fixed display name and iconurl related logic # After <img width="1436" alt="Screen Shot 2023-06-05 at 14 09 05" src="a5db39d8
-1ab0-4676-82a4-fba60a1d1f84"> On mobile <img width="378" alt="Screen Shot 2023-06-05 at 14 09 46" src="71d0f51b
-baac-4f48-8ca2-ae0e013bd62e"> user/settings/security/accountlinks (The dropdown might be improved later) <img width="973" alt="Screen Shot 2023-06-01 at 10 01 44" src="27010e7e
-2785-4fc5-8c49-b06621898f37"> --------- Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
parent
9aaaf980f0
commit
63a429581c
44 changed files with 80 additions and 270 deletions
|
@ -53,29 +53,17 @@
|
|||
{{end}}
|
||||
|
||||
{{if and .OrderedOAuth2Names .OAuth2Providers}}
|
||||
<hr class="ui divider"/>
|
||||
<div id="oauth2-login-navigator">
|
||||
<div id="oauth2-login-navigator-inner" class="gt-df gt-jc">
|
||||
<span class="gt-self-center gt-mr-3">{{.locale.Tr "sign_in_with"}}</span>
|
||||
<div class="gt-df gt-fw gt-gap-4">
|
||||
<div class="gt-df gt-fc gt-jc">
|
||||
<div class="ui horizontal divider">
|
||||
{{.locale.Tr "sign_in_or"}}
|
||||
</div>
|
||||
<div id="oauth2-login-navigator-inner" class="gt-df gt-fc gt-fw gt-ac gt-gap-3">
|
||||
{{range $key := .OrderedOAuth2Names}}
|
||||
{{$provider := index $.OAuth2Providers $key}}
|
||||
<a class="{{$provider.Name}} silenced oauth-login-link" href="{{AppSubUrl}}/user/oauth2/{{$key}}" data-tooltip-content="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}">
|
||||
{{if eq $provider.Name "github"}}
|
||||
{{svg "octicon-mark-github" 40}}
|
||||
{{else if eq $provider.Name "gitlab"}}
|
||||
{{svg "gitea-gitlab" 40}}
|
||||
{{else if eq $provider.Name "openidConnect"}}
|
||||
{{svg "gitea-openid" 40}}
|
||||
{{else}}
|
||||
<img
|
||||
class="gt-object-contain"
|
||||
width="40"
|
||||
height="40"
|
||||
alt="{{$provider.DisplayName}}{{if eq $provider.Name "openidConnect"}} ({{$key}}){{end}}"
|
||||
src="{{AppSubUrl}}{{$provider.Image}}"
|
||||
>
|
||||
{{end}}
|
||||
<a class="{{$provider.Name}} ui button gt-df gt-ac gt-jc gt-py-3 oauth-login-link" href="{{AppSubUrl}}/user/oauth2/{{$key}}">
|
||||
<img class="gt-mr-3" width="20" height="20" src="{{$provider.IconURL}}" alt="{{$provider.DisplayName}}">
|
||||
{{$.locale.Tr "sign_in_with_provider" $provider.DisplayName}}
|
||||
</a>
|
||||
{{end}}
|
||||
</div>
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
{{range $key := .OrderedOAuth2Names}}
|
||||
{{$provider := index $.OAuth2Providers $key}}
|
||||
<a class="item" href="{{AppSubUrl}}/user/oauth2/{{$key}}">
|
||||
<img width="20" height="20" src="{{AppSubUrl}}{{$provider.Image}}" alt="{{$provider.DisplayName}}">
|
||||
<img class="gt-mr-3" width="20" height="20" src="{{$provider.IconURL}}" alt="{{$provider.DisplayName}}">
|
||||
{{$provider.DisplayName}}
|
||||
</a>
|
||||
{{end}}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue