diff --git a/app/assets/css/app.css b/app/assets/css/app.css index 4f9ca5881..f813dbb2c 100644 --- a/app/assets/css/app.css +++ b/app/assets/css/app.css @@ -927,6 +927,27 @@ ul.sidebar .sidebar-list .sidebar-sublist a.active { z-index: 2; } +.striketext:before, +.striketext:after { + background-color: #777777; + content: ''; + display: inline-block; + height: 1px; + position: relative; + vertical-align: middle; + width: 50%; +} + +.striketext:before { + right: 0.5em; + margin-left: -50%; +} + +.striketext:after { + left: 0.5em; + margin-right: -50%; +} + /*bootbox override*/ .modal-open { padding-right: 0 !important; diff --git a/app/portainer/views/auth/auth.html b/app/portainer/views/auth/auth.html index 84c960464..20d81fe0d 100644 --- a/app/portainer/views/auth/auth.html +++ b/app/portainer/views/auth/auth.html @@ -8,41 +8,62 @@ +
- -
- - -
- - -
- - -
- -
-
- -
+
+ +
Login with Microsoft
-
+
Login with Google
-
+ +
+
+
or
+
+
+ + +
+
+
+ Use internal authentication +
+
+
+ + +
+ + +
+ + +
+ + +
+ +
+ +
- - - - {{ ctrl.state.AuthenticationError }} -
- - + + +
+ + {{ ctrl.state.AuthenticationError }} +
+
diff --git a/app/portainer/views/auth/authController.js b/app/portainer/views/auth/authController.js index b5f7a4b0f..f87d2271a 100644 --- a/app/portainer/views/auth/authController.js +++ b/app/portainer/views/auth/authController.js @@ -40,6 +40,8 @@ class AuthenticationController { Password: '', }; this.state = { + showOAuthLogin: false, + showStandardLogin: false, AuthenticationError: '', loginInProgress: true, OAuthProvider: '', @@ -222,12 +224,17 @@ class AuthenticationController { } } + toggleStandardLogin() { + this.state.showStandardLogin = !this.state.showStandardLogin; + } + async onInit() { try { const settings = await this.SettingsService.publicSettings(); - this.AuthenticationMethod = settings.AuthenticationMethod; - this.state.OAuthProvider = this.determineOauthProvider(settings.OAuthLoginURI); + this.state.showOAuthLogin = settings.AuthenticationMethod === 3; + this.state.showStandardLogin = !this.state.showOAuthLogin; this.state.OAuthLoginURI = settings.OAuthLoginURI; + this.state.OAuthProvider = this.determineOauthProvider(settings.OAuthLoginURI); const code = this.URLHelper.getParameter('code'); const state = this.URLHelper.getParameter('state');