This is an automated email from the ASF dual-hosted git repository.
nmalin pushed a commit to branch trunk
in repository https://gitbox.apache.org/repos/asf/ofbiz-framework.git
The following commit(s) were added to refs/heads/trunk by this push:
new 484063bb1d Improved: Helveticus, improve keyboard navigation on login
page (OFBIZ-12622)
484063bb1d is described below
commit 484063bb1dad9177688a1342e4766791dfe34a9f
Author: Nicolas Malin <[email protected]>
AuthorDate: Fri May 20 17:13:20 2022 +0200
Improved: Helveticus, improve keyboard navigation on login page
(OFBIZ-12622)
A few improvement to put directly the focus on username field when we
arrive on login page for helveticus theme
Thanks to Marine Desmarchelier for this
---
themes/helveticus/template/Login.ftl | 8 +-
.../webapp/helveticus/helveticus-main-theme.less | 99 +++++++++++++++++++++-
2 files changed, 102 insertions(+), 5 deletions(-)
diff --git a/themes/helveticus/template/Login.ftl
b/themes/helveticus/template/Login.ftl
index 667d8cb9b1..331b7b66f4 100644
--- a/themes/helveticus/template/Login.ftl
+++ b/themes/helveticus/template/Login.ftl
@@ -36,15 +36,15 @@ under the License.
<form method="post" action="<@ofbizUrl>login</@ofbizUrl>"
name="loginform">
<label>
${uiLabelMap.CommonUsername}
- <input type="text" name="USERNAME" value="${username}"/>
+ <input type="text" name="USERNAME" value="${username}" tabindex="0"/>
</label>
<label>
<span>
${uiLabelMap.CommonPassword}
- <a
href="<@ofbizUrl>forgotPassword</@ofbizUrl>">${uiLabelMap.CommonForgotYourPassword}</a>
</span>
- <input type="password" name="PASSWORD" autocomplete="off" value=""/>
+ <input type="password" name="PASSWORD" autocomplete="off" value=""
tabindex="0"/>
+ <a
href="<@ofbizUrl>forgotPassword</@ofbizUrl>">${uiLabelMap.CommonForgotYourPassword}</a>
</label>
<#if ("Y" == useMultitenant) >
@@ -58,7 +58,7 @@ under the License.
</#if>
</#if>
- <input type="submit" value="${uiLabelMap.CommonLogin}"/>
+ <input type="submit" value="${uiLabelMap.CommonLogin}" tabindex="0"/>
<input type="hidden" name="JavaScriptEnabled" value="N"/>
</form>
diff --git a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
index b61df5e466..b098be0de7 100644
--- a/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
+++ b/themes/helveticus/webapp/helveticus/helveticus-main-theme.less
@@ -445,6 +445,7 @@ a.buttontext{
border-radius: 4px;
padding:0 2rem;
box-shadow: 0 0 50px 0 @shadow-color;
+ padding:2rem;
z-index: 15;
color: @font-color-for-main;
#user-name {
@@ -1176,7 +1177,7 @@ form .basic-table,
align-items: center;
justify-content: space-between;
font-family: 'Quicksand', sans-serif !important;
- z-index: 10;
+ z-index: 15;
span {
color: white;
padding: 10px;
@@ -1407,3 +1408,99 @@ form .basic-table,
width: auto;
height: auto;
}
+
+#loginBar {
+ width: 30%;
+ margin:0 auto;
+ #company-logo {
+ background: url("images/ofbiz_logo.svg") no-repeat center center / auto
100%;
+ height: 12rem;
+ width: 100%;
+ margin:0.7rem 0 1.2rem 0;
+ }
+}
+
+.login-screenlet{
+ padding:5rem;
+ width: 400px;
+ margin:0 auto;
+ box-shadow: 0 0 15px 15px @shadow-color !important;
+ background-color: white;
+ h3{
+ text-align: center;
+ font-size:2.2rem;
+ font-weight: 600;
+ }
+ p{
+ text-align:center;
+ font-size: 1.5rem;
+ color:@grey;
+ font-weight: 500;
+ }
+ form[name="loginform"], form[name="forgotpassword"]{
+ margin-top:3.5rem;
+ display: flex;
+ flex-direction: column;
+ gap:4rem;
+ label{
+ font-size: 1.5rem;
+ font-weight: 600;
+ display: flex;
+ flex-direction: column;
+ gap:1rem;
+ a{
+ width:100%;
+ display:inline-block;
+ text-align:right;
+ font-size:1rem;
+ }
+ }
+ input[type="text"], input[type="password"]{
+ border:none;
+ background-color:@grey-light;
+ padding:1rem;
+ font-size:1.2rem;
+ opacity: 0.5;
+ outline: none !important;
+ &:focus{
+ opacity: 0.75;
+ border:none;
+ }
+ }
+ input[type="submit"]{
+ font-size:1.5rem;
+ font-family: 'Quicksand', sans-serif;
+ font-weight: 800;
+ padding:1rem;
+ }
+ .button-group{
+ display:flex;
+ justify-content: center;
+ gap:1rem;
+ .buttontext{
+ font-size: 1.5rem;
+ font-family: 'Quicksand', sans-serif;
+ font-weight: 800;
+ padding: 1rem;
+ margin:0;
+ }
+ }
+ .link{
+ background: transparent;
+ padding:0;
+ color:@main-color-theme;
+ &:hover{
+ text-decoration: underline;
+ }
+ }
+ }
+}
+.ui-dialog{
+ left: ~"calc(50% - 320px)" !important;
+ top: 2rem !important;
+ box-shadow: 0 0 15px 15px @shadow-color !important;
+}
+
+.hidden{
+ display: none;
+}
\ No newline at end of file
