mirror of
https://github.com/zitadel/zitadel.git
synced 2025-12-07 07:16:54 +00:00
feat: port reduction (#323)
* move mgmt pkg * begin package restructure * rename auth package to authz * begin start api * move auth * move admin * fix merge * configs and interceptors * interceptor * revert generate-grpc.sh * some cleanups * console * move console * fix tests and merging * js linting * merge * merging and configs * change k8s base to current ports * fixes * cleanup * regenerate proto * remove unnecessary whitespace * missing param * go mod tidy * fix merging * move login pkg * cleanup * move api pkgs again * fix pkg naming * fix generate-static.sh for login * update workflow * fixes * logging * remove duplicate * comment for optional gateway interfaces * regenerate protos * fix proto imports for grpc web * protos * grpc web generate * grpc web generate * fix changes * add translation interceptor * fix merging * regenerate mgmt proto
This commit is contained in:
Livio Amstutz
159
internal/ui/login/static/i18n/de.yaml
Normal file
159
internal/ui/login/static/i18n/de.yaml
Normal file
@@ -0,0 +1,159 @@
|
||||
Password:
|
||||
Title: Passwort
|
||||
Description: Gib deine Benutzerdaten ein.
|
||||
Password: Passwort
|
||||
|
||||
Login:
|
||||
Title: Anmeldung
|
||||
Description: Gib deine Benutzerdaten ein.
|
||||
Loginname: Loginname
|
||||
LoginnamePlaceHolder: username@domain
|
||||
|
||||
UserSelection:
|
||||
Title: Account auswählen
|
||||
Description: Wähle deinen Account aus.
|
||||
OtherUser: Anderer Benutzer
|
||||
SessionState0: aktiv
|
||||
SessionState1: inaktiv
|
||||
|
||||
MfaVerify:
|
||||
Title: Multifaktor verifizieren
|
||||
Description: Verifiziere deinen Multifaktor
|
||||
OTP: OTP
|
||||
Code: Code
|
||||
|
||||
InitPassword:
|
||||
Title: Passwort setzen
|
||||
Description: Du hast einen Code erhalten, welcher im untenstehenden Formular eingegeben werden muss um ein neues Passwort zu setzen.
|
||||
Code: Code
|
||||
NewPassword: Neues Passwort
|
||||
NewPasswordConfirm: Passwort bestätigen
|
||||
|
||||
InitPasswordDone:
|
||||
Title: Passwort gesetzt
|
||||
Description: Passwort erfolgreich gesetzt
|
||||
|
||||
InitUser:
|
||||
Title: User aktivieren
|
||||
Description: Du hast einen Code erhalten, welcher im untenstehenden Formular eingegeben werden muss um deine EMail zu verifizieren und ein neues Passwort zu setzen.
|
||||
Code: Code
|
||||
NewPassword: Neues Passwort
|
||||
NewPasswordConfirm: Passwort bestätigen
|
||||
|
||||
InitUserDone:
|
||||
Title: User aktiviert
|
||||
Description: EMail verifiziert und Passwort erfolgreich gesetzt
|
||||
|
||||
MfaPrompt:
|
||||
Title: Multifaktor hinzufügen
|
||||
Description: Möchtest du einen Mulitfaktor hinzufügen?
|
||||
Provider0: OTP
|
||||
Provider1: SMS
|
||||
|
||||
MfaInitVerify:
|
||||
Title: Multifaktor Verifizierung
|
||||
Description: Verifiziere deinen Multifaktor
|
||||
OtpDescription: Scanne den Code mit einem Authentifizierungs-App (z.B Google Authentificator) oder kopiere das Secret und gib anschliessend den Code ein.
|
||||
Secret: Secret
|
||||
Code: Code
|
||||
|
||||
MfaInitDone:
|
||||
Title: Multifaktor Verifizierung erstellt
|
||||
Description: Multifikator Verifizierung erfolgreich abgeschlossen. Der Multifaktor muss bei jeder Anmeldung eingegeben werden, dies beinhaltet auch den aktuellen Authentifizierungs Prozess.
|
||||
|
||||
PasswordChange:
|
||||
Title: Passwort ändern
|
||||
Description: Ändere dein Password in dem du dein altes und dann dein neuen Passwort eingibst.
|
||||
OldPassword: Altes Passwort
|
||||
NewPassword: Neues Passwort
|
||||
|
||||
PasswordChangeDone:
|
||||
Title: Passwort ändern
|
||||
Description: Das Passwort wurde erfolgreich geändert.
|
||||
|
||||
PasswordResetDone:
|
||||
Title: Resetlink versendet
|
||||
Description: Prüfe dein E-Mail Postfach, um ein neues Passwort zu setzen.
|
||||
|
||||
PasswordSetDone:
|
||||
Title: Passwort gesetzt
|
||||
Description: Das Passwort wurde erfolgreich gesetzt.
|
||||
|
||||
EmailVerification:
|
||||
Title: E-Mail Verifizierung
|
||||
Description: Du hast ein E-Mail zur Verifizierung deiner E-Mail Adresse bekommen. Gib den Code im untenstehenden Formular ein. Mit erneut versenden, wird dir ein neues E-Mail zugestellt.
|
||||
Code: Code
|
||||
|
||||
EmailVerificationDone:
|
||||
Title: E-Mail Verifizierung
|
||||
Description: Deine E-Mail Adresse wurde erfolgreich verifiziert.
|
||||
|
||||
Registration:
|
||||
Title: Registration
|
||||
Description: Gib deine Benutzerangaben an. Die E-Mail Adresse wird als Benutzernamen verwendet.
|
||||
Email: E-Mail
|
||||
Firstname: Vorname
|
||||
Lastname: Nachname
|
||||
Language: Sprache
|
||||
German: Deutsch
|
||||
English: English
|
||||
Gender: Geschlecht
|
||||
Female: weiblich
|
||||
Male: männlich
|
||||
Diverse: diverse
|
||||
Password: Passwort
|
||||
Password2: Passwort wiederholen
|
||||
|
||||
LogoutDone:
|
||||
Title: Ausgeloggt
|
||||
Description: Du wurdest erfolgreich ausgeloggt.
|
||||
|
||||
Actions:
|
||||
Login: anmelden
|
||||
Next: weiter
|
||||
Back: zurück
|
||||
Resend: erneut senden
|
||||
Skip: überspringen
|
||||
Register: registrieren
|
||||
ForgotPassword: Password zurücksetzen
|
||||
|
||||
Errors:
|
||||
Internal: Es ist ein interner Fehler aufgetreten
|
||||
AuthRequest:
|
||||
NotFound: AuthRequest konnte nicht gefunden werden
|
||||
User:
|
||||
NotFound: Benutzer konnte nicht gefunden werden
|
||||
NotMatchingUserID: User stimm nicht mit User in Auth Request überein
|
||||
UserIDMissing: UserID ist leer
|
||||
Invalid: Userdaten sind ungültig
|
||||
Password:
|
||||
ConfirmationWrong: Passwort Bestätigung stimmt nicht überein
|
||||
Empty: Passwort ist leer
|
||||
Invalid: Passwort ungültig
|
||||
PasswordComplexityPolicy:
|
||||
NotFound: Passwort Policy konnte nicht gefunden werden
|
||||
MinLength: Passwort ist zu kurz
|
||||
HasLower: Passwort beinhaltet keinen klein Buchstaben
|
||||
HasUpper: Passwort beinhaltet keinen gross Buchstaben
|
||||
HasNumber: Passwort beinhaltet keine Nummer
|
||||
HasSymbol: Passwort beinhaltet kein Symbol
|
||||
Code:
|
||||
Expired: Code ist abgelaufen
|
||||
Invalid: Code ist ungültig
|
||||
Empty: Code ist leer
|
||||
CryptoCodeNil: Crypto Code ist nil
|
||||
NotFound: Code konnte nicht gefunden werden
|
||||
GeneratorAlgNotSupported: Generator Algorithums wird nicht unterstützt
|
||||
EmailVerify:
|
||||
UserIDEmpty: UserID ist leer
|
||||
Mfa:
|
||||
NoProviders: Es stehen keine Multifaktorprovider zur Verfügung
|
||||
Otp:
|
||||
AlreadyReady: Multifaktor OTP (OneTimePassword) ist bereits eingerichtet
|
||||
NotExisting: Multifaktor OTP (OneTimePassword) existiert nicht
|
||||
InvalidCode: Code ist ungültig
|
||||
NotReady: Multifaktor OTP (OneTimePassword) ist nicht bereit
|
||||
Locked: Benutzer ist gesperrt
|
||||
NotActive: Benutzer ist nicht aktiv
|
||||
|
||||
optional: (optional)
|
||||
161
internal/ui/login/static/i18n/en.yaml
Normal file
161
internal/ui/login/static/i18n/en.yaml
Normal file
@@ -0,0 +1,161 @@
|
||||
Login:
|
||||
Title: Login
|
||||
Description: Enter your logindata.
|
||||
Loginname: Loginname
|
||||
LoginnamePlaceHolder: username@domain
|
||||
|
||||
UserSelection:
|
||||
Title: Select account
|
||||
Description: Select your account.
|
||||
OtherUser: Other User
|
||||
SessionState0: active
|
||||
SessionState1: inactive
|
||||
|
||||
Password:
|
||||
Title: Password
|
||||
Description: Enter your logindata.
|
||||
Password: Password
|
||||
|
||||
MfaVerify:
|
||||
Title: Verify Multificator
|
||||
Description: Verify your multifactor
|
||||
OTP: OTP
|
||||
Code: Code
|
||||
|
||||
InitPassword:
|
||||
Title: Set Password
|
||||
Description: You have received a code, which you have to enter in the form below, to set your new password.
|
||||
Code: Code
|
||||
NewPassword: New Password
|
||||
NewPasswordConfirm: Confirm Password
|
||||
|
||||
InitPasswordDone:
|
||||
Title: Passwortd set
|
||||
Description: Password successfully set
|
||||
|
||||
InitUser:
|
||||
Title: Activate User
|
||||
Description: You have received a code, which you have to enter in the form below, to verify your email and set your new password.
|
||||
Code: Code
|
||||
NewPassword: New Password
|
||||
NewPasswordConfirm: Confirm Password
|
||||
|
||||
InitUserDone:
|
||||
Title: User activated
|
||||
Description: Email verified and Password successfully set
|
||||
|
||||
MfaPrompt:
|
||||
Title: Multifactor Setup
|
||||
Description: Would you like to setup multifactor authentication?
|
||||
Provider0: OTP
|
||||
Provider1: SMS
|
||||
|
||||
MfaInitVerify:
|
||||
Title: Multifactor Verification
|
||||
Description: Verify your multifactor.
|
||||
OtpDescription: Scan the code with your authenticator app (e.g Google-Authenticator) or copy the secret and insert the generated code below.
|
||||
Secret: Secret
|
||||
Code: Code
|
||||
|
||||
MfaInitDone:
|
||||
Title: Multifcator Verification done
|
||||
Description: Multifactor verification successfully done. The multifactor has to be entered on each login, even in the actual authentification process.
|
||||
|
||||
PasswordChange:
|
||||
Title: Change Password
|
||||
Description: Change your password. Enter your old and new password.
|
||||
OldPassword: Old Password
|
||||
NewPassword: New Password
|
||||
|
||||
PasswordChangeDone:
|
||||
Title: Change Password
|
||||
Description: Your password was changed successfully.
|
||||
|
||||
PasswordResetDone:
|
||||
Title: Reset link set
|
||||
Description: Check your email to to reset your password.
|
||||
|
||||
PasswordSetDone:
|
||||
Title: Password set
|
||||
Description: Your password was set successfully.
|
||||
|
||||
EmailVerification:
|
||||
Title: E-Mail Verification
|
||||
Description: We have sent you an email to verify your address. Please enter the code in the form below.
|
||||
Code: Code
|
||||
|
||||
EmailVerificationDone:
|
||||
Title: E-Mail Verification
|
||||
Description: Your email address has been successfully verified.
|
||||
|
||||
Registration:
|
||||
Title: Registration
|
||||
Description: Enter your Userdata. Your email address will be used as loginname.
|
||||
Email: E-Mail
|
||||
Firstname: Firstname
|
||||
Lastname: Lastname
|
||||
Language: Language
|
||||
German: Deutsch
|
||||
English: English
|
||||
Gender: Gender
|
||||
Female: Female
|
||||
Male: Male
|
||||
Diverse: diverse / X
|
||||
Password: Password
|
||||
Password2: Password confirmation
|
||||
|
||||
LogoutDone:
|
||||
Title: Logged out
|
||||
Description: You have logged out successfully.
|
||||
|
||||
Actions:
|
||||
Login: login
|
||||
Next: next
|
||||
Back: back
|
||||
Resend: resend
|
||||
Skip: skip
|
||||
Register: register
|
||||
ForgotPassword: Reset password
|
||||
|
||||
|
||||
Errors:
|
||||
Internal: An internal error occured
|
||||
AuthRequest:
|
||||
NotFound: Could not find authrequest
|
||||
User:
|
||||
NotFound: User could not be found
|
||||
NotMatchingUserID: User and user in authrequest don't match
|
||||
UserIDMissing: UserID is empty
|
||||
Invalid: Invalid userdata
|
||||
Password:
|
||||
ConfirmationWrong: Passwordconfirmation is wrong
|
||||
Empty: Password is empty
|
||||
Invalid: Passwort is invalid
|
||||
PasswordComplexityPolicy:
|
||||
NotFound: Password policy not found
|
||||
MinLength: Password is to short
|
||||
HasLower: Password must contain lower letter
|
||||
HasUpper: Password must contain upper letter
|
||||
HasNumber: Password must contain number
|
||||
HasSymbol: Password must contain symbol
|
||||
Code:
|
||||
Expired: Code is expired
|
||||
Invalid: Code is invalid
|
||||
Empty: Code is empty
|
||||
CryptoCodeNil: Crypto code is nil
|
||||
NotFound: Could not find code
|
||||
GeneratorAlgNotSupported: Unsupported generator algorithm
|
||||
EmailVerify:
|
||||
UserIDEmpty: UserID is empty
|
||||
Mfa:
|
||||
NoProviders: No available multifactor providers
|
||||
Otp:
|
||||
AlreadyReady: Multifactor OTP (OneTimePassword) is already setup
|
||||
NotExisting: Multifactor OTP (OneTimePassword) doesn't exist
|
||||
InvalidCode: Invalid code
|
||||
NotReady: Multifactor OTP (OneTimePassword) isn't ready
|
||||
Locked: User is locked
|
||||
NotActive: User is not active
|
||||
|
||||
|
||||
optional: (optional)
|
||||
BIN
internal/ui/login/static/resources/fonts/ailerons/ailerons.otf
Normal file
BIN
internal/ui/login/static/resources/fonts/ailerons/ailerons.otf
Normal file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Black.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Black.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-BlackItalic.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-BlackItalic.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Bold.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Bold.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-BoldItalic.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-BoldItalic.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Italic.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Italic.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Light.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Light.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-LightItalic.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-LightItalic.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Regular.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Regular.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Thin.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-Thin.ttf
Executable file
Binary file not shown.
BIN
internal/ui/login/static/resources/fonts/lato/Lato-ThinItalic.ttf
Executable file
BIN
internal/ui/login/static/resources/fonts/lato/Lato-ThinItalic.ttf
Executable file
Binary file not shown.
93
internal/ui/login/static/resources/fonts/lato/OFL.txt
Executable file
93
internal/ui/login/static/resources/fonts/lato/OFL.txt
Executable file
@@ -0,0 +1,93 @@
|
||||
Copyright (c) 2010-2014 by tyPoland Lukasz Dziedzic (team@latofonts.com) with Reserved Font Name "Lato"
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font creation
|
||||
efforts of academic and linguistic communities, and to provide a free and
|
||||
open framework in which fonts may be shared and improved in partnership
|
||||
with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply
|
||||
to any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software components as
|
||||
distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
||||
or substituting -- in part or in whole -- any of the components of the
|
||||
Original Version, by changing formats or by porting the Font Software to a
|
||||
new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
||||
redistribute, and sell modified and unmodified copies of the Font
|
||||
Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components,
|
||||
in Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the corresponding
|
||||
Copyright Holder. This restriction only applies to the primary font name as
|
||||
presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created
|
||||
using the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
7
internal/ui/login/static/resources/generate.go
Normal file
7
internal/ui/login/static/resources/generate.go
Normal file
@@ -0,0 +1,7 @@
|
||||
package resources
|
||||
|
||||
// scss
|
||||
//go:generate sass themes/scss/zitadel/dark.scss themes/zitadel/css/dark.css
|
||||
//go:generate sass themes/scss/zitadel/light.scss themes/zitadel/css/light.css
|
||||
//go:generate sass themes/scss/caos/dark.scss themes/caos/css/dark.css
|
||||
//go:generate sass themes/scss/caos/light.scss themes/caos/css/light.css
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
internal/ui/login/static/resources/images/icon-newuser-dark.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-newuser-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
internal/ui/login/static/resources/images/icon-newuser-light.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-newuser-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
internal/ui/login/static/resources/images/icon-user-dark.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-user-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
BIN
internal/ui/login/static/resources/images/icon-user-dark@2x.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-user-dark@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.6 KiB |
BIN
internal/ui/login/static/resources/images/icon-user-light.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-user-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
BIN
internal/ui/login/static/resources/images/icon-user-light@2x.png
Normal file
BIN
internal/ui/login/static/resources/images/icon-user-light@2x.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
@@ -0,0 +1,6 @@
|
||||
const copyToClipboard = str => {
|
||||
navigator.clipboard.writeText(str);
|
||||
}
|
||||
|
||||
let copyButton = document.getElementsByClassName("copy")[0];
|
||||
copyButton.addEventListener("click", copyToClipboard(copyButton.getAttribute("data-copy")));
|
||||
356
internal/ui/login/static/resources/themes/caos/css/dark.css
Normal file
356
internal/ui/login/static/resources/themes/caos/css/dark.css
Normal file
@@ -0,0 +1,356 @@
|
||||
@font-face {
|
||||
font-family: Aileron;
|
||||
src: url(../../../fonts/ailerons/ailerons.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Thin.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-ThinItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Light.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-LightItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Regular.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Italic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Bold.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BoldItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Black.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BlackItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../../../fonts/material/MaterialIcons-Regular.eot);
|
||||
/* For IE6-8 */
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"), url(../../../fonts/material/MaterialIcons-Regular.woff2) format("woff2"), url(../../../fonts/material/MaterialIcons-Regular.woff) format("woff"), url(../../../fonts/material/MaterialIcons-Regular.ttf) format("truetype");
|
||||
}
|
||||
*, *::before, *::after {
|
||||
box-sizing: border-box;
|
||||
font-family: Lato;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
background-color: #282828;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom right;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: white;
|
||||
font-family: Aileron;
|
||||
font-weight: 300;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 8px;
|
||||
}
|
||||
header .logo {
|
||||
background-image: url("../logo-dark.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 80px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #760038;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
a:hover {
|
||||
color: #f60075;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #282828;
|
||||
color: #760038;
|
||||
border: 2px solid #760038;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 50px;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #f60075;
|
||||
border: 2px solid #f60075;
|
||||
}
|
||||
button.primary {
|
||||
background-color: #760038;
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
color: white;
|
||||
height: 50px;
|
||||
border: 2px solid #505050;
|
||||
border-radius: 5px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
form .field {
|
||||
display: grid;
|
||||
padding: 10px 0;
|
||||
}
|
||||
form .field.radio-button {
|
||||
display: flex;
|
||||
}
|
||||
form .field.radio-button input[type=radio] {
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
form .field.radio-button label {
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
padding: 3px 0 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
form label {
|
||||
color: #898989;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
form label span.optional {
|
||||
font-style: italic;
|
||||
text-transform: none;
|
||||
}
|
||||
form .actions {
|
||||
padding: 20px 0;
|
||||
}
|
||||
form .actions .right {
|
||||
float: right;
|
||||
}
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: white;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #505050;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect.color {
|
||||
fill: white;
|
||||
}
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-image: url("../gradientdeco-full.svg");
|
||||
width: 100%;
|
||||
background-size: cover;
|
||||
height: 44vw;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
/* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Support for IE. */
|
||||
font-feature-settings: "liga";
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=dark.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;;;AAMJ;EACI,OCVQ;EDWR,aCjBS;EDkBT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCvCW;EDwCX;EACA;;AAEA;EACI,OC3CY;;;AD+CpB;EACI,kBCnDc;EDoDd,OClDW;EDmDX;EACA;EACA;EACA;EACA,QEpEU;EFqEV;EACA;EACA;;AACA;EACI,kBC3DY;ED4DZ;;AAGJ;EACI,kBCjEO;EDkEP,OCnEI;EDoEJ;;AACA;EACI,kBCpEQ;;;ADyEpB;EACI,kBEjEmB;EFkEnB,OC7EQ;ED8ER,QE1FU;EF2FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OElGK;EFmGL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCrII;EDsIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBElIW;;AFqIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EE/JV;;AACA;EF4JM;IE3JJ;IACA;;;AFiKQ;EEpKV;;AACA;EFmKU;IElKR;IACA;;;AFsKI;EACI;EACA;EACA;EACA;EACA,cEjKO;EFkKP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OE7LP;;AFoML;EACI;;AAEJ;EACI;EACA;EACA;EACA;EEvNV;;AACA;EFkNM;IEjNJ;IACA;;;AFyNQ;EACI;EACA;EE9Nd;;AACA;EF2NU;IE1NR;IACA;;;AFgOI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MChPI;;ADmPR;EACI,MCrPU;;;AD0Pd;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
440
internal/ui/login/static/resources/themes/caos/css/light.css
Normal file
440
internal/ui/login/static/resources/themes/caos/css/light.css
Normal file
@@ -0,0 +1,440 @@
|
||||
@font-face {
|
||||
font-family: Aileron;
|
||||
src: url(../../../fonts/ailerons/ailerons.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Thin.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-ThinItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Light.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-LightItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Regular.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Italic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Bold.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BoldItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Black.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BlackItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../../../fonts/material/MaterialIcons-Regular.eot);
|
||||
/* For IE6-8 */
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"), url(../../../fonts/material/MaterialIcons-Regular.woff2) format("woff2"), url(../../../fonts/material/MaterialIcons-Regular.woff) format("woff"), url(../../../fonts/material/MaterialIcons-Regular.ttf) format("truetype");
|
||||
}
|
||||
*, *::before, *::after {
|
||||
box-sizing: border-box;
|
||||
font-family: Lato;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
background-color: #282828;
|
||||
color: white;
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom right;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: white;
|
||||
font-family: Aileron;
|
||||
font-weight: 300;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 8px;
|
||||
}
|
||||
header .logo {
|
||||
background-image: url("../logo-dark.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 80px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #760038;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
a:hover {
|
||||
color: #f60075;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #282828;
|
||||
color: #760038;
|
||||
border: 2px solid #760038;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 50px;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #f60075;
|
||||
border: 2px solid #f60075;
|
||||
}
|
||||
button.primary {
|
||||
background-color: #760038;
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
color: white;
|
||||
height: 50px;
|
||||
border: 2px solid #505050;
|
||||
border-radius: 5px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
form .field {
|
||||
display: grid;
|
||||
padding: 10px 0;
|
||||
}
|
||||
form .field.radio-button {
|
||||
display: flex;
|
||||
}
|
||||
form .field.radio-button input[type=radio] {
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
form .field.radio-button label {
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
padding: 3px 0 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
form label {
|
||||
color: #898989;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
form label span.optional {
|
||||
font-style: italic;
|
||||
text-transform: none;
|
||||
}
|
||||
form .actions {
|
||||
padding: 20px 0;
|
||||
}
|
||||
form .actions .right {
|
||||
float: right;
|
||||
}
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: white;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #505050;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect.color {
|
||||
fill: white;
|
||||
}
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-image: url("../gradientdeco-full.svg");
|
||||
width: 100%;
|
||||
background-size: cover;
|
||||
height: 44vw;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
/* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Support for IE. */
|
||||
font-feature-settings: "liga";
|
||||
}
|
||||
|
||||
html {
|
||||
background-color: white;
|
||||
color: #282828;
|
||||
}
|
||||
html header .logo {
|
||||
background-image: url("../logo-light.png");
|
||||
}
|
||||
html h1 {
|
||||
color: #282828;
|
||||
}
|
||||
html button {
|
||||
background-color: white;
|
||||
color: #760038;
|
||||
border: 2px solid #760038;
|
||||
}
|
||||
html button:hover {
|
||||
background-color: #f60075;
|
||||
border: 2px solid #f60075;
|
||||
}
|
||||
html button.primary {
|
||||
background-color: #760038;
|
||||
color: white;
|
||||
border: none;
|
||||
box-shadow: 0px 10px 30px #760038;
|
||||
}
|
||||
html button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
html button.clean {
|
||||
color: #282828;
|
||||
}
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.user-selection:hover {
|
||||
background-color: #252525;
|
||||
}
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html input {
|
||||
background-color: white;
|
||||
color: #282828;
|
||||
}
|
||||
html #qrcode svg rect.color {
|
||||
fill: #282828;
|
||||
}
|
||||
html #qrcode svg rect.bg-color {
|
||||
fill: white;
|
||||
}
|
||||
html footer {
|
||||
background-image: url("../gradientdeco-full.svg");
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=light.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCMW;EDLX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCDc;EDEd,OCDQ;EDER;EACA;;;AAMJ;EACI,OCVQ;EDWR,aCjBS;EDkBT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCvCW;EDwCX;EACA;;AAEA;EACI,OC3CY;;;AD+CpB;EACI,kBCnDc;EDoDd,OClDW;EDmDX;EACA;EACA;EACA;EACA,QEpEU;EFqEV;EACA;EACA;;AACA;EACI,kBC3DY;ED4DZ;;AAGJ;EACI,kBCjEO;EDkEP,OCnEI;EDoEJ;;AACA;EACI,kBCpEQ;;;ADyEpB;EACI,kBEjEmB;EFkEnB,OC7EQ;ED8ER,QE1FU;EF2FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OElGK;EFmGL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCrII;EDsIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBElIW;;AFqIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EE/JV;;AACA;EF4JM;IE3JJ;IACA;;;AFiKQ;EEpKV;;AACA;EFmKU;IElKR;IACA;;;AFsKI;EACI;EACA;EACA;EACA;EACA,cEjKO;EFkKP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OE7LP;;AFoML;EACI;;AAEJ;EACI;EACA;EACA;EACA;EEvNV;;AACA;EFkNM;IEjNJ;IACA;;;AFyNQ;EACI;EACA;EE9Nd;;AACA;EF2NU;IE1NR;IACA;;;AFgOI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MChPI;;ADmPR;EACI,MCrPU;;;AD0Pd;EACI;EACA;;;AAIR;EAEQ;EAEJ;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AGjTJ;EACI,kBFeQ;EEdR,OFac;;AERd;EACI;;AAGJ;EACI,OFGU;;AEAd;EACI;EACA;EACA;;AAEA;EACI,kBFIa;EEHb;;AAGJ;EACI,kBFTG;EEUH,OFXA;EEYA;EACA;;AACA;EACI,kBFbI;;AEiBZ;EACI,OFrBM;;AEyBN;ED3BV;;AACA;EC0BU;IDzBR;IACA;;;AC4BQ;EACI,kBDlBO;;ACoBP;EDlCd;;AACA;ECiCc;IDhCZ;IACA;;;ACsCQ;EDzCV;;AACA;ECwCU;IDvCR;IACA;;;AC2CY;ED9Cd;;AACA;EC6Cc;ID5CZ;IACA;;;ACkDA;EACI,kBFnDI;EEoDJ,OFrDU;;AEyDV;EACI,MF1DM;;AE6DV;EACI,MF7DA;;AEiER;EAEQ","file":"light.css"}
|
||||
BIN
internal/ui/login/static/resources/themes/caos/favicon.ico
Normal file
BIN
internal/ui/login/static/resources/themes/caos/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 361 KiB |
BIN
internal/ui/login/static/resources/themes/caos/logo-dark.png
Normal file
BIN
internal/ui/login/static/resources/themes/caos/logo-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
BIN
internal/ui/login/static/resources/themes/caos/logo-light.png
Normal file
BIN
internal/ui/login/static/resources/themes/caos/logo-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 32 KiB |
@@ -0,0 +1,3 @@
|
||||
@import "../variables";
|
||||
@import "variables";
|
||||
@import "../main";
|
||||
@@ -0,0 +1,4 @@
|
||||
@import "../variables";
|
||||
@import "variables";
|
||||
@import "../main";
|
||||
@import "../light";
|
||||
@@ -0,0 +1,27 @@
|
||||
$logoImgDark: "../logo-dark.png";
|
||||
$logoImgLight: "../logo-light.png";
|
||||
|
||||
$footerimgDark: "../gradientdeco-full.svg";
|
||||
$footerimgLight: "../gradientdeco-full.svg";
|
||||
|
||||
$bodyImgDark: "";
|
||||
$bodyImgLight: "";
|
||||
|
||||
// ----- FONTS ------------
|
||||
$standardFont: Lato;
|
||||
$headerFont: Aileron;
|
||||
|
||||
// ----- COLORS ------------
|
||||
|
||||
// ------ DARK-THEME -------
|
||||
$backgroundColor: #282828;
|
||||
$fontColor: white;
|
||||
$primaryColor: #760038;
|
||||
$primaryColorHover: lighten($primaryColor, 25%);
|
||||
|
||||
|
||||
// ------ LIGHT-THEME -------
|
||||
$backgroundColorLight: $fontColor;
|
||||
$fontColorLight: $backgroundColor;
|
||||
$primaryColorLight: $primaryColor;
|
||||
$primaryColorHoverLight: lighten($primaryColorLight, 25%);
|
||||
84
internal/ui/login/static/resources/themes/scss/fonts.scss
Normal file
84
internal/ui/login/static/resources/themes/scss/fonts.scss
Normal file
@@ -0,0 +1,84 @@
|
||||
//Aileron
|
||||
@font-face {
|
||||
font-family: Aileron;
|
||||
src: url(../../../fonts/ailerons/ailerons.otf ) format('opentype');
|
||||
}
|
||||
|
||||
//Lato
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Thin.ttf ) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-ThinItalic.ttf ) format('truetype');
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Light.ttf ) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-LightItalic.ttf ) format('truetype');
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Regular.ttf ) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Italic.ttf ) format('truetype');
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Bold.ttf ) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BoldItalic.ttf ) format('truetype');
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Black.ttf ) format('truetype');
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BlackItalic.ttf ) format('truetype');
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
//Material Icons
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../../../fonts/material/MaterialIcons-Regular.eot); /* For IE6-8 */
|
||||
src: local('Material Icons'),
|
||||
local('MaterialIcons-Regular'),
|
||||
url(../../../fonts/material/MaterialIcons-Regular.woff2) format('woff2'),
|
||||
url(../../../fonts/material/MaterialIcons-Regular.woff) format('woff'),
|
||||
url(../../../fonts/material/MaterialIcons-Regular.ttf) format('truetype');
|
||||
}
|
||||
88
internal/ui/login/static/resources/themes/scss/light.scss
Normal file
88
internal/ui/login/static/resources/themes/scss/light.scss
Normal file
@@ -0,0 +1,88 @@
|
||||
// ---- LIGHT-THEME-------
|
||||
html {
|
||||
background-color: $backgroundColorLight;
|
||||
color: $fontColorLight;
|
||||
@if($bodyImgLight != "") {
|
||||
background-image: url($bodyImgLight);
|
||||
}
|
||||
|
||||
header .logo {
|
||||
background-image: url($logoImgLight);
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: $fontColorLight;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: $backgroundColorLight;
|
||||
color: $primaryColorLight;
|
||||
border: 2px solid $primaryColorLight;
|
||||
|
||||
&:hover {
|
||||
background-color: $primaryColorHoverLight;
|
||||
border: 2px solid $primaryColorHoverLight;
|
||||
}
|
||||
|
||||
&.primary {
|
||||
background-color: $primaryColor;
|
||||
color: $fontColor;
|
||||
border: none;
|
||||
box-shadow: 0px 10px 30px $primaryColor;
|
||||
&:hover {
|
||||
background-color: $primaryColorHover;
|
||||
}
|
||||
}
|
||||
|
||||
&.clean {
|
||||
color: $fontColorLight;
|
||||
}
|
||||
|
||||
&.user-selection {
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgLight, "png", false, 100px, 100px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $buttonBackgroundColorHover;
|
||||
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgLight, "png", true, 100px, 100px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.other-user {
|
||||
.other-user-image {
|
||||
@include retina-background-image($otherUserImgLight, "png", false, 100px, 75px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.other-user-image {
|
||||
@include retina-background-image($otherUserImgLight, "png", true, 100px, 75px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
background-color: $backgroundColorLight;
|
||||
color: $fontColorLight;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
svg rect.color {
|
||||
fill: $fontColorLight;
|
||||
}
|
||||
|
||||
svg rect.bg-color {
|
||||
fill: $backgroundColorLight;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
@if($footerimgLight != "") {
|
||||
background-image: url($footerimgLight);
|
||||
}
|
||||
}
|
||||
}
|
||||
308
internal/ui/login/static/resources/themes/scss/main.scss
Normal file
308
internal/ui/login/static/resources/themes/scss/main.scss
Normal file
@@ -0,0 +1,308 @@
|
||||
@import "fonts";
|
||||
|
||||
*, *::before, *::after {
|
||||
box-sizing: border-box;
|
||||
font-family: $standardFont;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
background-color: $backgroundColor;
|
||||
color: $fontColor;
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom right;
|
||||
@if($bodyImgDark != "") {
|
||||
background-image: url($bodyImgDark);
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: $fontColor;
|
||||
font-family: $headerFont;
|
||||
font-weight: 300;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 8px;
|
||||
|
||||
.logo {
|
||||
background-image: url($logoImgDark);
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 80px;
|
||||
margin: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $primaryColor;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
|
||||
&:hover {
|
||||
color: $primaryColorHover;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: $backgroundColor;
|
||||
color: $primaryColor;
|
||||
border: 2px solid $primaryColor;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: $inputHeight;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
&:hover {
|
||||
background-color: $primaryColorHover;
|
||||
border: 2px solid $primaryColorHover;
|
||||
}
|
||||
|
||||
&.primary {
|
||||
background-color: $primaryColor;
|
||||
color: $fontColor;
|
||||
border: none;
|
||||
&:hover {
|
||||
background-color: $primaryColorHover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input:not([type='radio']), select {
|
||||
background-color: $inputBackgroundColor;
|
||||
color: $fontColor;
|
||||
height: $inputHeight;
|
||||
border: 2px solid $inputBorderColor;
|
||||
border-radius: 5px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
form {
|
||||
.field {
|
||||
display: grid;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.field.radio-button {
|
||||
display: flex;
|
||||
|
||||
input[type='radio'] {
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
& label {
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
padding: 3px 0 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
color: $labelColor;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 3px;
|
||||
|
||||
span.optional {
|
||||
font-style: italic;
|
||||
text-transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.actions {
|
||||
padding: 20px 0;
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
button, a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: $fontColor;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
|
||||
&:hover {
|
||||
border: none;
|
||||
background-color: $buttonBackgroundColorHover;
|
||||
}
|
||||
|
||||
* {
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
button.user-selection {
|
||||
.profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
@include retina-background-image($profileImgDark, "png", false, 100px, 100px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgDark, "png", true, 100px, 100px);
|
||||
}
|
||||
}
|
||||
|
||||
.sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: $inputBorderColor;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
|
||||
&.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
|
||||
&.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
& > div {
|
||||
position: relative;
|
||||
|
||||
&.names {
|
||||
margin: 15px;
|
||||
|
||||
.displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
.loginname {
|
||||
color: $labelColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button.other-user {
|
||||
.user-selection+&{
|
||||
margin-top: 80px;
|
||||
}
|
||||
.other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
@include retina-background-image($otherUserImgDark, "png", false, 100px, 75px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.other-user-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
@include retina-background-image($otherUserImgDark, "png", true, 100px, 75px);
|
||||
}
|
||||
}
|
||||
|
||||
& > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
|
||||
svg rect.color {
|
||||
fill: $fontColor;
|
||||
}
|
||||
|
||||
svg rect.bg-color {
|
||||
fill: $backgroundColor;
|
||||
}
|
||||
}
|
||||
|
||||
#secret {
|
||||
.copy {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
@if($footerimgDark != "") {
|
||||
background-image: url($footerimgDark);
|
||||
}
|
||||
width: 100%;
|
||||
background-size: cover;
|
||||
height: 44vw;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px; /* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
/* Support for IE. */
|
||||
font-feature-settings: 'liga';
|
||||
}
|
||||
@@ -0,0 +1,42 @@
|
||||
// ----- FONTS ------------
|
||||
$standardFont: Lato;
|
||||
$headerFont: Lato;
|
||||
|
||||
// ----- LAYOUT ------------
|
||||
$inputHeight: 50px;
|
||||
$retina: "only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)";
|
||||
|
||||
@mixin retina-background-image($file, $type, $hover, $width, $height) {
|
||||
$hovername: '';
|
||||
@if $hover {
|
||||
$hovername: '-hover';
|
||||
}
|
||||
$filename :$file + $hovername;
|
||||
background-image: url($filename + '.' + $type);
|
||||
@media #{$retina} {
|
||||
background-image: url($filename + '@2x.' + $type);
|
||||
background-size: $width $height;
|
||||
}
|
||||
}
|
||||
|
||||
// ----- DARK-THEME --------
|
||||
$backgroundColor: #282828;
|
||||
$fontColor: #BBBBC8;
|
||||
$primaryColor: #3574C6;
|
||||
$primaryColorHover: lighten($primaryColor, 10%);
|
||||
$labelColor: #898989;
|
||||
$inputBorderColor: #505050;
|
||||
$inputBackgroundColor: #252525;
|
||||
$buttonBackgroundColorHover: $inputBackgroundColor;
|
||||
$profileImgDark: "/resources/images/icon-user-dark";
|
||||
$otherUserImgDark: "/resources/images/icon-newuser-dark";
|
||||
|
||||
|
||||
// ----- LIGHT-THEME --------
|
||||
$backgroundColorLight: $fontColor;
|
||||
$fontColorLight: $backgroundColor;
|
||||
$primaryColorLight: $primaryColor;
|
||||
$primaryColorHoverLight: lighten($primaryColorLight, 10%);
|
||||
$buttonBackgroundColorHoverLight: #EFEFEF;
|
||||
$profileImgLight: "/resources/images/icon-user-light";
|
||||
$otherUserImgLight: "/resources/images/icon-newuser-light";
|
||||
@@ -0,0 +1,3 @@
|
||||
@import "../variables";
|
||||
@import "variables";
|
||||
@import "../main";
|
||||
@@ -0,0 +1,4 @@
|
||||
@import "../variables";
|
||||
@import "variables";
|
||||
@import "../main";
|
||||
@import "../light";
|
||||
@@ -0,0 +1,8 @@
|
||||
$logoImgDark: "../logo-dark.png";
|
||||
$logoImgLight: "../logo-light.png";
|
||||
|
||||
$footerimgDark: "";
|
||||
$footerimgLight: "";
|
||||
|
||||
$bodyImgDark: "../flavor-spikes01-narrow.png";
|
||||
$bodyImgLight: "../flavor-spikes01-narrow.png";
|
||||
356
internal/ui/login/static/resources/themes/zitadel/css/dark.css
Normal file
356
internal/ui/login/static/resources/themes/zitadel/css/dark.css
Normal file
@@ -0,0 +1,356 @@
|
||||
@font-face {
|
||||
font-family: Aileron;
|
||||
src: url(../../../fonts/ailerons/ailerons.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Thin.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-ThinItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Light.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-LightItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Regular.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Italic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Bold.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BoldItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Black.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BlackItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../../../fonts/material/MaterialIcons-Regular.eot);
|
||||
/* For IE6-8 */
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"), url(../../../fonts/material/MaterialIcons-Regular.woff2) format("woff2"), url(../../../fonts/material/MaterialIcons-Regular.woff) format("woff"), url(../../../fonts/material/MaterialIcons-Regular.ttf) format("truetype");
|
||||
}
|
||||
*, *::before, *::after {
|
||||
box-sizing: border-box;
|
||||
font-family: Lato;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
background-color: #282828;
|
||||
color: #BBBBC8;
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom right;
|
||||
background-image: url("../flavor-spikes01-narrow.png");
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #BBBBC8;
|
||||
font-family: Lato;
|
||||
font-weight: 300;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 8px;
|
||||
}
|
||||
header .logo {
|
||||
background-image: url("../logo-dark.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 80px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #3574C6;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
a:hover {
|
||||
color: #5b8fd3;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #282828;
|
||||
color: #3574C6;
|
||||
border: 2px solid #3574C6;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 50px;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #5b8fd3;
|
||||
border: 2px solid #5b8fd3;
|
||||
}
|
||||
button.primary {
|
||||
background-color: #3574C6;
|
||||
color: #BBBBC8;
|
||||
border: none;
|
||||
}
|
||||
button.primary:hover {
|
||||
background-color: #5b8fd3;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
color: #BBBBC8;
|
||||
height: 50px;
|
||||
border: 2px solid #505050;
|
||||
border-radius: 5px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
form .field {
|
||||
display: grid;
|
||||
padding: 10px 0;
|
||||
}
|
||||
form .field.radio-button {
|
||||
display: flex;
|
||||
}
|
||||
form .field.radio-button input[type=radio] {
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
form .field.radio-button label {
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
padding: 3px 0 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
form label {
|
||||
color: #898989;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
form label span.optional {
|
||||
font-style: italic;
|
||||
text-transform: none;
|
||||
}
|
||||
form .actions {
|
||||
padding: 20px 0;
|
||||
}
|
||||
form .actions .right {
|
||||
float: right;
|
||||
}
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: #BBBBC8;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #505050;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect.color {
|
||||
fill: #BBBBC8;
|
||||
}
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
footer {
|
||||
width: 100%;
|
||||
background-size: cover;
|
||||
height: 44vw;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
/* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Support for IE. */
|
||||
font-feature-settings: "liga";
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=dark.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCKc;EDJd,OCKQ;EDJR;EACA;EAEI;;;AAIR;EACI,OCJQ;EDKR,aC1BS;ED2BT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCjCW;EDkCX;EACA;;AAEA;EACI,OCrCY;;;ADyCpB;EACI,kBC7Cc;ED8Cd,OC5CW;ED6CX;EACA;EACA;EACA;EACA,QCpEU;EDqEV;EACA;EACA;;AACA;EACI,kBCrDY;EDsDZ;;AAGJ;EACI,kBC3DO;ED4DP,OC7DI;ED8DJ;;AACA;EACI,kBC9DQ;;;ADmEpB;EACI,kBCjEmB;EDkEnB,OCvEQ;EDwER,QC1FU;ED2FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OClGK;EDmGL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC/HI;EDgIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBClIW;;ADqIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EC/JV;;AACA;ED4JM;IC3JJ;IACA;;;ADiKQ;ECpKV;;AACA;EDmKU;IClKR;IACA;;;ADsKI;EACI;EACA;EACA;EACA;EACA,cCjKO;EDkKP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OC7LP;;ADoML;EACI;;AAEJ;EACI;EACA;EACA;EACA;ECvNV;;AACA;EDkNM;ICjNJ;IACA;;;ADyNQ;EACI;EACA;EC9Nd;;AACA;ED2NU;IC1NR;IACA;;;ADgOI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1OI;;AD6OR;EACI,MC/OU;;;ADoPd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
438
internal/ui/login/static/resources/themes/zitadel/css/light.css
Normal file
438
internal/ui/login/static/resources/themes/zitadel/css/light.css
Normal file
@@ -0,0 +1,438 @@
|
||||
@font-face {
|
||||
font-family: Aileron;
|
||||
src: url(../../../fonts/ailerons/ailerons.otf) format("opentype");
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Thin.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-ThinItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Light.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-LightItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 200;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Regular.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Italic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 400;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Bold.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BoldItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-Black.ttf) format("truetype");
|
||||
font-style: normal;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: Lato;
|
||||
src: url(../../../fonts/lato/Lato-BlackItalic.ttf) format("truetype");
|
||||
font-style: italic;
|
||||
font-weight: 800;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(../../../fonts/material/MaterialIcons-Regular.eot);
|
||||
/* For IE6-8 */
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"), url(../../../fonts/material/MaterialIcons-Regular.woff2) format("woff2"), url(../../../fonts/material/MaterialIcons-Regular.woff) format("woff"), url(../../../fonts/material/MaterialIcons-Regular.ttf) format("truetype");
|
||||
}
|
||||
*, *::before, *::after {
|
||||
box-sizing: border-box;
|
||||
font-family: Lato;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
font-weight: 300;
|
||||
background-color: #282828;
|
||||
color: #BBBBC8;
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom right;
|
||||
background-image: url("../flavor-spikes01-narrow.png");
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #BBBBC8;
|
||||
font-family: Lato;
|
||||
font-weight: 300;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 8px;
|
||||
}
|
||||
header .logo {
|
||||
background-image: url("../logo-dark.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 80px;
|
||||
margin: 30px;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: auto;
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #3574C6;
|
||||
text-decoration: none;
|
||||
font-weight: 400;
|
||||
}
|
||||
a:hover {
|
||||
color: #5b8fd3;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #282828;
|
||||
color: #3574C6;
|
||||
border: 2px solid #3574C6;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 50px;
|
||||
transition: all 0.3s ease 0s;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #5b8fd3;
|
||||
border: 2px solid #5b8fd3;
|
||||
}
|
||||
button.primary {
|
||||
background-color: #3574C6;
|
||||
color: #BBBBC8;
|
||||
border: none;
|
||||
}
|
||||
button.primary:hover {
|
||||
background-color: #5b8fd3;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
color: #BBBBC8;
|
||||
height: 50px;
|
||||
border: 2px solid #505050;
|
||||
border-radius: 5px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
|
||||
form .field {
|
||||
display: grid;
|
||||
padding: 10px 0;
|
||||
}
|
||||
form .field.radio-button {
|
||||
display: flex;
|
||||
}
|
||||
form .field.radio-button input[type=radio] {
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
form .field.radio-button label {
|
||||
height: 20px;
|
||||
display: inline-block;
|
||||
padding: 3px 0 0 15px;
|
||||
width: 100%;
|
||||
}
|
||||
form label {
|
||||
color: #898989;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
form label span.optional {
|
||||
font-style: italic;
|
||||
text-transform: none;
|
||||
}
|
||||
form .actions {
|
||||
padding: 20px 0;
|
||||
}
|
||||
form .actions .right {
|
||||
float: right;
|
||||
}
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: #BBBBC8;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #505050;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect.color {
|
||||
fill: #BBBBC8;
|
||||
}
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
footer {
|
||||
width: 100%;
|
||||
background-size: cover;
|
||||
height: 44vw;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
/* Preferred icon size */
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Support for IE. */
|
||||
font-feature-settings: "liga";
|
||||
}
|
||||
|
||||
html {
|
||||
background-color: #BBBBC8;
|
||||
color: #282828;
|
||||
background-image: url("../flavor-spikes01-narrow.png");
|
||||
}
|
||||
html header .logo {
|
||||
background-image: url("../logo-light.png");
|
||||
}
|
||||
html h1 {
|
||||
color: #282828;
|
||||
}
|
||||
html button {
|
||||
background-color: #BBBBC8;
|
||||
color: #3574C6;
|
||||
border: 2px solid #3574C6;
|
||||
}
|
||||
html button:hover {
|
||||
background-color: #5b8fd3;
|
||||
border: 2px solid #5b8fd3;
|
||||
}
|
||||
html button.primary {
|
||||
background-color: #3574C6;
|
||||
color: #BBBBC8;
|
||||
border: none;
|
||||
box-shadow: 0px 10px 30px #3574C6;
|
||||
}
|
||||
html button.primary:hover {
|
||||
background-color: #5b8fd3;
|
||||
}
|
||||
html button.clean {
|
||||
color: #282828;
|
||||
}
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.user-selection:hover {
|
||||
background-color: #252525;
|
||||
}
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html input {
|
||||
background-color: #BBBBC8;
|
||||
color: #282828;
|
||||
}
|
||||
html #qrcode svg rect.color {
|
||||
fill: #282828;
|
||||
}
|
||||
html #qrcode svg rect.bg-color {
|
||||
fill: #BBBBC8;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=light.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI;EACA;EACA;EACA,kBCKc;EDJd,OCKQ;EDJR;EACA;EAEI;;;AAIR;EACI,OCJQ;EDKR,aC1BS;ED2BT;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCjCW;EDkCX;EACA;;AAEA;EACI,OCrCY;;;ADyCpB;EACI,kBC7Cc;ED8Cd,OC5CW;ED6CX;EACA;EACA;EACA;EACA,QCpEU;EDqEV;EACA;EACA;;AACA;EACI,kBCrDY;EDsDZ;;AAGJ;EACI,kBC3DO;ED4DP,OC7DI;ED8DJ;;AACA;EACI,kBC9DQ;;;ADmEpB;EACI,kBCjEmB;EDkEnB,OCvEQ;EDwER,QC1FU;ED2FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OClGK;EDmGL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC/HI;EDgIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBClIW;;ADqIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EC/JV;;AACA;ED4JM;IC3JJ;IACA;;;ADiKQ;ECpKV;;AACA;EDmKU;IClKR;IACA;;;ADsKI;EACI;EACA;EACA;EACA;EACA,cCjKO;EDkKP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OC7LP;;ADoML;EACI;;AAEJ;EACI;EACA;EACA;EACA;ECvNV;;AACA;EDkNM;ICjNJ;IACA;;;ADyNQ;EACI;EACA;EC9Nd;;AACA;ED2NU;IC1NR;IACA;;;ADgOI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1OI;;AD6OR;EACI,MC/OU;;;ADoPd;EACI;EACA;;;AAIR;EAII;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AEjTJ;EACI,kBDqBQ;ECpBR,ODmBc;ECjBV;;AAGJ;EACI;;AAGJ;EACI,ODSU;;ACNd;EACI,kBDMI;ECLJ,ODMO;ECLP;;AAEA;EACI,kBDgBa;ECfb;;AAGJ;EACI,kBDHG;ECIH,ODLA;ECMA;EACA;;AACA;EACI,kBDPI;;ACWZ;EACI,ODfM;;ACmBN;ED3BV;;AACA;EC0BU;IDzBR;IACA;;;AC4BQ;EACI,kBDlBO;;ACoBP;EDlCd;;AACA;ECiCc;IDhCZ;IACA;;;ACsCQ;EDzCV;;AACA;ECwCU;IDvCR;IACA;;;AC2CY;ED9Cd;;AACA;EC6Cc;ID5CZ;IACA;;;ACkDA;EACI,kBD7CI;EC8CJ,OD/CU;;ACmDV;EACI,MDpDM;;ACuDV;EACI,MDvDA","file":"light.css"}
|
||||
BIN
internal/ui/login/static/resources/themes/zitadel/favicon.ico
Normal file
BIN
internal/ui/login/static/resources/themes/zitadel/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 361 KiB |
BIN
internal/ui/login/static/resources/themes/zitadel/logo-dark.png
Normal file
BIN
internal/ui/login/static/resources/themes/zitadel/logo-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
BIN
internal/ui/login/static/resources/themes/zitadel/logo-light.png
Normal file
BIN
internal/ui/login/static/resources/themes/zitadel/logo-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
34
internal/ui/login/static/templates/change_password.html
Normal file
34
internal/ui/login/static/templates/change_password.html
Normal file
@@ -0,0 +1,34 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "PasswordChange.Title"}}</h1>
|
||||
<p>{{t "PasswordChange.Description"}}</p>
|
||||
|
||||
<form action="{{ changePasswordUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="old_password">{{t "PasswordChange.OldPassword"}}</label>
|
||||
<input class="input" type="password" id="old_password" name="old_password" autocomplete="current-password" autofocus required>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label" for="new_password">{{t "PasswordChange.NewPassword"}}</label>
|
||||
<input class="input" type="password" id="new-password" name="new_password" autocomplete="new-password" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" name="resend" value="false" class="primary right" >{{t "Actions.Next"}}</buttontype="submit">
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
21
internal/ui/login/static/templates/change_password_done.html
Normal file
21
internal/ui/login/static/templates/change_password_done.html
Normal file
@@ -0,0 +1,21 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "PasswordChangeDone.Title"}}</h1>
|
||||
<p>{{t "PasswordChangeDone.Description"}}</p>
|
||||
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
9
internal/ui/login/static/templates/error-message.html
Normal file
9
internal/ui/login/static/templates/error-message.html
Normal file
@@ -0,0 +1,9 @@
|
||||
{{ define "error-message" }}
|
||||
{{if .ErrMessage }}
|
||||
<div class="field">
|
||||
<div class="error">
|
||||
{{ if .ErrType }}{{ .ErrType }} - {{end}}{{ .ErrMessage }}
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{ end }}
|
||||
9
internal/ui/login/static/templates/error.html
Normal file
9
internal/ui/login/static/templates/error.html
Normal file
@@ -0,0 +1,9 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
<div>
|
||||
{{ .ErrType }}
|
||||
{{ .ErrMessage }}
|
||||
</div>
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
3
internal/ui/login/static/templates/footer.html
Normal file
3
internal/ui/login/static/templates/footer.html
Normal file
@@ -0,0 +1,3 @@
|
||||
{{define "footer"}}
|
||||
|
||||
{{end}}
|
||||
3
internal/ui/login/static/templates/header.html
Normal file
3
internal/ui/login/static/templates/header.html
Normal file
@@ -0,0 +1,3 @@
|
||||
{{define "header"}}
|
||||
<div class="logo"></div>
|
||||
{{end}}selec
|
||||
39
internal/ui/login/static/templates/init_password.html
Normal file
39
internal/ui/login/static/templates/init_password.html
Normal file
@@ -0,0 +1,39 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "InitPassword.Title" }}</h1>
|
||||
<p>{{t "InitPassword.Description" }}</p>
|
||||
|
||||
<form action="{{ initPasswordUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="userID" value="{{ .UserID }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="code">{{t "InitPassword.Code"}}</label>
|
||||
<input class="input" type="text" id="code" name="code" value="{{.Code}}" autocomplete="off" autofocus required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="password">{{t "InitPassword.NewPassword"}}</label>
|
||||
<input class="input" type="password" id="password" name="password" autocomplete="new-password" autofocus required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="passwordconfirm">{{t "InitPassword.NewPasswordConfirm"}}</label>
|
||||
<input class="input" type="password" id="passwordconfirm" name="passwordconfirm" autocomplete="new-password" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" name="resend" value="false" class="primary right" >{{t "Actions.Next"}}</buttontype="submit">
|
||||
<button type="submit" name="resend" value="true" class="secondary right" formnovalidate>{{t "Actions.Resend" }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
19
internal/ui/login/static/templates/init_password_done.html
Normal file
19
internal/ui/login/static/templates/init_password_done.html
Normal file
@@ -0,0 +1,19 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "PasswordSetDone.Title"}}</h1>
|
||||
<p>{{t "PasswordSetDone.Description"}}</p>
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
42
internal/ui/login/static/templates/init_user.html
Normal file
42
internal/ui/login/static/templates/init_user.html
Normal file
@@ -0,0 +1,42 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "InitUser.Title" }}</h1>
|
||||
<p>{{t "InitUser.Description" }}</p>
|
||||
|
||||
<form action="{{ initUserUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="userID" value="{{ .UserID }}" />
|
||||
<input type="hidden" name="passwordSet" value="{{ .PasswordSet }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="code">{{t "InitUser.Code"}}</label>
|
||||
<input class="input" type="text" id="code" name="code" value="{{.Code}}" autocomplete="off" autofocus required>
|
||||
</div>
|
||||
{{ if not .PasswordSet }}
|
||||
<div class="field">
|
||||
<label class="label" for="password">{{t "InitUser.NewPassword"}}</label>
|
||||
<input class="input" type="password" id="password" name="password" autocomplete="new-password" autofocus required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="passwordconfirm">{{t "InitUser.NewPasswordConfirm"}}</label>
|
||||
<input class="input" type="password" id="passwordconfirm" name="passwordconfirm" autocomplete="new-password" autofocus required>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" name="resend" value="false" class="primary right" >{{t "Actions.Next"}}</button>
|
||||
<button type="submit" name="resend" value="true" class="secondary right" formnovalidate>{{t "Actions.Resend" }}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
19
internal/ui/login/static/templates/init_user_done.html
Normal file
19
internal/ui/login/static/templates/init_user_done.html
Normal file
@@ -0,0 +1,19 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "InitUserDone.Title"}}</h1>
|
||||
<p>{{t "InitUserDone.Description"}}</p>
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
30
internal/ui/login/static/templates/login.html
Normal file
30
internal/ui/login/static/templates/login.html
Normal file
@@ -0,0 +1,30 @@
|
||||
|
||||
{{template "main-top" .}}
|
||||
|
||||
<h1>{{t "Login.Title"}}</h1>
|
||||
<p>{{t "Login.Description"}}</p>
|
||||
|
||||
<form action="{{ loginNameUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="loginName">{{t "Login.Loginname"}}</label>
|
||||
<input class="input" type="text" id="loginName" name="loginName" placeholder="{{t "Login.LoginnamePlaceHolder"}}" value="{{ .LoginName }}" autocomplete="username" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
<a class="default right" href="{{ registerUrl .AuthReqID }}" >{{t "Actions.Register"}}</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
17
internal/ui/login/static/templates/logout_done.html
Normal file
17
internal/ui/login/static/templates/logout_done.html
Normal file
@@ -0,0 +1,17 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "LogoutDone.Title"}}</h1>
|
||||
<p>{{t "LogoutDone.Description"}}</p>
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Login"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
33
internal/ui/login/static/templates/mail_verification.html
Normal file
33
internal/ui/login/static/templates/mail_verification.html
Normal file
@@ -0,0 +1,33 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "EmailVerification.Title"}}</h1>
|
||||
<p>{{t "EmailVerification.Description"}}</p>
|
||||
|
||||
<form action="{{ mailVerificationUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="userID" value="{{ .UserID }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="code">{{t "EmailVerification.Code"}}</label>
|
||||
<input class="input" type="text" id="code" name="code" autocomplete="off" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button type="submit" name="resend" value="false" class="primary right" >{{t "Actions.Next"}}</buttontype="submit">
|
||||
{{ if .UserID }}
|
||||
<button type="submit" name="resend" value="true" class="secondary right" formnovalidate>{{t "Actions.Resend"}}</button>
|
||||
{{ end }}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
21
internal/ui/login/static/templates/mail_verified.html
Normal file
21
internal/ui/login/static/templates/mail_verified.html
Normal file
@@ -0,0 +1,21 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "EmailVerificationDone.Title"}}</h1>
|
||||
<p>{{t "EmailVerificationDone.Description"}}</p>
|
||||
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{if .AuthReqID }}{{t "Actions.Next"}}{{else}}{{t "Actions.Login"}}{{end}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
34
internal/ui/login/static/templates/main.html
Normal file
34
internal/ui/login/static/templates/main.html
Normal file
@@ -0,0 +1,34 @@
|
||||
{{define "main-top"}}
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ .Lang }}" class="{{.ThemeMode}}">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
|
||||
{{if .ThemeMode}}
|
||||
<link rel="stylesheet" href="{{ resourceThemeUrl (printf "css/%s.css" .ThemeMode) .Theme }}" type="text/css" media="all">
|
||||
{{else}}
|
||||
<link rel="stylesheet" href="{{ resourceThemeUrl "css/dark.css" .Theme }}" type="text/css" media="(prefers-color-scheme: dark), (prefers-color-scheme: no-preference)">
|
||||
<link rel="stylesheet" href="{{ resourceThemeUrl "css/light.css" .Theme }}" type="text/css" media="(prefers-color-scheme: light)">
|
||||
{{end}}
|
||||
<link rel="icon" type="image/x-icon" href="{{ resourceThemeUrl "favicon.ico" .Theme }}">
|
||||
|
||||
<title>{{ .Title }}</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
{{template "header" .}}
|
||||
</header>
|
||||
<div class="content">
|
||||
{{end}}
|
||||
|
||||
<!-- here goes the content -->
|
||||
|
||||
{{define "main-bottom"}}
|
||||
</div>
|
||||
</body>
|
||||
<footer>
|
||||
{{template "footer" .}}
|
||||
</footer>
|
||||
{{end}}
|
||||
21
internal/ui/login/static/templates/mfa_init_done.html
Normal file
21
internal/ui/login/static/templates/mfa_init_done.html
Normal file
@@ -0,0 +1,21 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "MfaInitDone.Title"}}</h1>
|
||||
<p>{{t "MfaInitDone.Description"}}</p>
|
||||
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="mfaType" value="{{ .MfaType }}" />
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
44
internal/ui/login/static/templates/mfa_init_verify.html
Normal file
44
internal/ui/login/static/templates/mfa_init_verify.html
Normal file
@@ -0,0 +1,44 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "MfaInitVerify.Title"}}</h1>
|
||||
<p>{{t "MfaInitVerify.Description"}}</p>
|
||||
|
||||
<form action="{{ mfaInitVerifyUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="mfaType" value="{{ .MfaType }}" />
|
||||
<input type="hidden" name="url" value="{{ .Url }}" />
|
||||
<input type="hidden" name="secret" value="{{ .Secret }}" />
|
||||
|
||||
{{if (eq .MfaType 0) }}
|
||||
<p>{{t "MfaInitVerify.OtpDescription"}}</p>
|
||||
<div id="qrcode">
|
||||
{{.QrCode}}
|
||||
</div>
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<span class="label" for="secret">{{t "MfaInitVerify.Secret"}}</span>
|
||||
<span class="input" id="secret">
|
||||
{{.Secret}}
|
||||
<span class="copy material-icons" data-copy="{{ .Secret }}" >content_copy</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="code">{{t "MfaInitVerify.Code"}}</label>
|
||||
<input class="input" type="text" id="code" name="code" autocomplete="off" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<script src="{{ resourceUrl "scripts/copy_to_clipboard.js" }}"></script>
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
32
internal/ui/login/static/templates/mfa_prompt.html
Normal file
32
internal/ui/login/static/templates/mfa_prompt.html
Normal file
@@ -0,0 +1,32 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "MfaPrompt.Title"}}</h1>
|
||||
|
||||
<form action="{{ mfaPromptUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="fields">
|
||||
{{ range $provider := .MfaProviders}}
|
||||
{{ $providerName := (t (printf "MfaPrompt.Provider%v" $provider)) }}
|
||||
<div class="field radio-button">
|
||||
<input id="{{ $provider }}" type="radio" name="provider" value="{{ $provider }}">
|
||||
<label for="{{ $provider }}">{{ $providerName }}</label>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
{{if not .MfaRequired}}
|
||||
<button class="default right" name="skip" value="true" type="submit" formnovalidate>{{t "Actions.Skip"}}</button>
|
||||
{{end}}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
30
internal/ui/login/static/templates/mfa_verify.html
Normal file
30
internal/ui/login/static/templates/mfa_verify.html
Normal file
@@ -0,0 +1,30 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "MfaVerify.Title"}}</h1>
|
||||
<p>{{t "MfaVerify.Description"}}</p>
|
||||
|
||||
<form action="{{ mfaVerifyUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="mfaType" value="{{ .SelectedMfaProvider }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="code">{{t "MfaVerify.Code"}}</label>
|
||||
<input class="input" type="text" id="code" name="code" autocomplete="off" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{ template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
35
internal/ui/login/static/templates/password.html
Normal file
35
internal/ui/login/static/templates/password.html
Normal file
@@ -0,0 +1,35 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "Password.Title"}}</h1>
|
||||
|
||||
<form action="{{ passwordUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
<input type="hidden" name="loginName" value="{{ .LoginName }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="password">{{t "Password.Password"}}</label>
|
||||
<input class="input" type="password" id="password" name="password" autocomplete="current-password" autofocus required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
<a href="{{ loginNameChangeUrl .AuthReqID }}">
|
||||
<button class="secondary" type="button">{{t "Actions.Back"}}</button>
|
||||
</a>
|
||||
<a href="{{ passwordResetUrl .AuthReqID }}">
|
||||
<button class="secondary" type="button">{{t "Actions.ForgotPassword"}}</button>
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
19
internal/ui/login/static/templates/password_reset_done.html
Normal file
19
internal/ui/login/static/templates/password_reset_done.html
Normal file
@@ -0,0 +1,19 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "PasswordResetDone.Title"}}</h1>
|
||||
<p>{{t "PasswordResetDone.Description"}}</p>
|
||||
<form action="{{ loginUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
63
internal/ui/login/static/templates/register.html
Normal file
63
internal/ui/login/static/templates/register.html
Normal file
@@ -0,0 +1,63 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
<h1>{{t "Registration.Title"}}</h1>
|
||||
<p>{{t "Registration.Description"}}</p>
|
||||
|
||||
<form action="{{ registrationUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
<label class="label" for="email">{{t "Registration.Email"}}</label>
|
||||
<input class="input" type="text" id="email" name="email" autocomplete="email" value="{{ .Email }}" autofocus required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="firstname">{{t "Registration.Firstname"}}</label>
|
||||
<input class="input" type="text" id="firstname" name="firstname" autocomplete="given-name" value="{{ .Firstname }}" required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="lastname">{{t "Registration.Lastname"}}</label>
|
||||
<input class="input" type="text" id="lastname" name="lastname" autocomplete="family-name" value="{{ .Lastname }}" required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="languages">{{t "Registration.Language"}}</label>
|
||||
<select id="languages" name="language">
|
||||
<option value=""></option>
|
||||
<option value="de" id="de" {{if (selectedLanguage "de")}} selected {{end}}>{{t "Registration.German"}}</option>
|
||||
<option value="en" id="en" {{if (selectedLanguage "en")}} selected {{end}}>{{t "Registration.English"}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="genders">
|
||||
{{t "Registration.Gender"}}
|
||||
<span class="optional">{{t "optional"}}</span>
|
||||
</label>
|
||||
<select id="genders" name="gender">
|
||||
<option value=""></option>
|
||||
<option value="1" id="female" {{if (selectedGender 1)}} selected {{end}}>{{t "Registration.Female"}}</option>
|
||||
<option value="2" id="male" {{if (selectedGender 2)}} selected {{end}}>{{t "Registration.Male"}}</option>
|
||||
<option value="3" id="diverse" {{if (selectedGender 3)}} selected {{end}}>{{t "Registration.Diverse"}}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="password">{{t "Registration.Password"}}</label>
|
||||
<input class="input" type="password" id="password" name="password" autocomplete="new-password" required>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label" for="password2">{{t "Registration.Password2"}}</label>
|
||||
<input class="input" type="password" id="password2" name="password2" autocomplete="new-password" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{template "error-message" .}}
|
||||
|
||||
<div class="actions">
|
||||
<button class="primary right" type="submit">{{t "Actions.Next"}}</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
40
internal/ui/login/static/templates/select_user.html
Normal file
40
internal/ui/login/static/templates/select_user.html
Normal file
@@ -0,0 +1,40 @@
|
||||
{{template "main-top" .}}
|
||||
|
||||
|
||||
<h1>{{t "UserSelection.Title"}}</h1>
|
||||
<p>{{t "UserSelection.Description"}}</p>
|
||||
|
||||
<form action="{{ userSelectionUrl }}" method="POST">
|
||||
|
||||
{{ .CSRF }}
|
||||
|
||||
<input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
|
||||
|
||||
<div class="actions">
|
||||
{{ if .Users }}
|
||||
<div class="user-selection-list">
|
||||
{{ range $user := .Users }}
|
||||
{{ $sessionState := (printf "sessionstate-%v" $user.UserSessionState) }}
|
||||
<button type="submit" name="userID" value="{{$user.UserID}}" class="clean user-selection">
|
||||
<div>
|
||||
<div class="profile-image"></div>
|
||||
<div class="sessionstate {{$sessionState}}"></div>
|
||||
</div>
|
||||
<div class="names">
|
||||
<div class="displayname">{{$user.DisplayName}}</div>
|
||||
<div class="loginname">{{$user.LoginName}}</div>
|
||||
</div>
|
||||
</button>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
<button type="submit" name="userID" value="0" class="clean other-user">
|
||||
<div class="other-user-image"></div>
|
||||
<div>{{t "UserSelection.OtherUser"}}</div>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{{template "main-bottom" .}}
|
||||
|
||||
Reference in New Issue
Block a user