diff --git a/packages/rocketchat-ui-login/client/login/form.html b/packages/rocketchat-ui-login/client/login/form.html
index a793b3efdadb..bf29397377db 100644
--- a/packages/rocketchat-ui-login/client/login/form.html
+++ b/packages/rocketchat-ui-login/client/login/form.html
@@ -119,33 +119,31 @@
{{{_ "Registration_Succeeded"}}}
{{/if}}
-
-
-
+
{{/if}}
{{/if}}
{{#unless state 'login'}}
-
-
-
+
+
+
{{/unless}}
diff --git a/packages/rocketchat-ui-login/client/username/username.html b/packages/rocketchat-ui-login/client/username/username.html
index 8bb202153936..506a530d4749 100644
--- a/packages/rocketchat-ui-login/client/username/username.html
+++ b/packages/rocketchat-ui-login/client/username/username.html
@@ -35,8 +35,9 @@
{{_ "Username_title"}}
{{#if username.ready}}
-
-
+
+
+
{{/if}}
diff --git a/packages/rocketchat-ui-login/client/username/username.js b/packages/rocketchat-ui-login/client/username/username.js
index 08f185b01647..fe92ced69ee4 100644
--- a/packages/rocketchat-ui-login/client/username/username.js
+++ b/packages/rocketchat-ui-login/client/username/username.js
@@ -41,7 +41,9 @@ Template.username.events({
return $(event.currentTarget).parents('.input-text').removeClass('focus');
}
},
-
+ 'reset #login-card'() {
+ Meteor.logout();
+ },
'submit #login-card'(event, instance) {
event.preventDefault();
diff --git a/packages/rocketchat_theme/client/imports/forms/button.css b/packages/rocketchat_theme/client/imports/forms/button.css
index edaf7d100556..f5c221ecbef9 100644
--- a/packages/rocketchat_theme/client/imports/forms/button.css
+++ b/packages/rocketchat_theme/client/imports/forms/button.css
@@ -6,14 +6,16 @@
&--icon > svg {
margin: 0 5px 0 -5px;
+ font-size: 20px;
+ fill: currentColor;
+
.rtl & {
margin: 0 -5px 0 5px;
}
-
- font-size: 20px;
- fill: currentColor;
}
+ position: relative;
+
display: flex;
min-height: 40px;
@@ -38,6 +40,32 @@
align-items: center;
justify-content: center;
+ &:active,
+ &:focus:hover {
+ outline: none;
+ }
+
+ &:active {
+ transform: translateY(2px);
+
+ opacity: 0.9;
+ }
+
+ &:active::before {
+ top: -2px;
+ }
+
+ &::before {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ content: "";
+ cursor: pointer;
+ }
+
&:disabled {
cursor: default;
@@ -149,6 +177,30 @@
margin: 0 5px;
}
}
+
+ &__group {
+ display: flex;
+
+ flex-direction: row;
+
+ margin: 10px -5px;
+
+ & > .rc-button {
+ margin: 0 5px;
+ }
+
+ &--stretch {
+ justify-content: stretch;
+
+ & > .rc-button {
+ flex: 1 1;
+ }
+ }
+
+ &--vertical {
+ flex-direction: column;
+ }
+ }
}
@media (width < 780px) {
diff --git a/packages/rocketchat_theme/client/imports/general/base_old.css b/packages/rocketchat_theme/client/imports/general/base_old.css
index ec9af47d53fb..354c0ab8c452 100644
--- a/packages/rocketchat_theme/client/imports/general/base_old.css
+++ b/packages/rocketchat_theme/client/imports/general/base_old.css
@@ -4544,17 +4544,6 @@ body:not(.is-cordova) {
font-size: 10px;
}
- & .submit,
- & .register,
- & .forgot-password,
- & .back-to-login {
- margin-top: 12px;
-
- & button {
- margin: 0 auto;
- }
- }
-
& .input-line {
position: relative;
diff --git a/tests/pageobjects/login.page.js b/tests/pageobjects/login.page.js
index cf08dadbea32..c18e974521e6 100644
--- a/tests/pageobjects/login.page.js
+++ b/tests/pageobjects/login.page.js
@@ -3,9 +3,9 @@ import mainContent from './main-content.page';
class LoginPage extends Page {
get registerButton() { return browser.element('button.register'); }
- get forgotPasswordButton() { return browser.element('button.forgot-password'); }
- get backToLoginButton() { return browser.element('button.back-to-login'); }
- get submitButton() { return browser.element('.submit > button'); }
+ get forgotPasswordButton() { return browser.element('.forgot-password'); }
+ get backToLoginButton() { return browser.element('.back-to-login'); }
+ get submitButton() { return browser.element('.login'); }
get emailOrUsernameField() { return browser.element('[name=emailOrUsername]'); }
get nameField() { return browser.element('[name=name]'); }