extern/egroupware
1
0
Fork 1
mirror of https://github.com/EGroupware/egroupware.git synced 2025-01-26 07:49:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

WIP of modern login page

Browse Source
This commit is contained in:
Hadi Nategh 2017-02-03 16:25:39 +01:00
parent 70d803249d
commit 0d8d5db8ee
7 changed files with 263 additions and 329 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

148
pixelegg/css/mobile.css
View File

@ -1346,9 +1346,6 @@ span.ui-icon-search {
} }
/*###########################################*/ /*###########################################*/
/*Dialog: calendar edit series*/ /*Dialog: calendar edit series*/
.ui-dialog-buttonpane {
background-color: #679FD2;
}
.ui-dialog-buttonset button.ui-button-text-only { .ui-dialog-buttonset button.ui-button-text-only {
background-color: #CDCDCD; background-color: #CDCDCD;
background: inherit; background: inherit;
@ -1655,9 +1652,6 @@ body {
*/ */
#socialMedia { #socialMedia {
position: relative; position: relative;
bottom: 20px;
float: right;
right: -10px;
} }
#socialMedia a { #socialMedia a {
margin-left: 10px; margin-left: 10px;
@ -1672,13 +1666,21 @@ body {
border: none; border: none;
margin: 0; margin: 0;
background-color: white; background-color: white;
background-image: url(../images/login/fullscreen.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
} }
#loginMainDiv #divAppIconBar { #loginMainDiv #divAppIconBar {
margin-left: auto; display: inline-block;
margin-right: auto; position: absolute;
left: 50%;
top: 20%;
transform: translate(-50%, -50%);
background: transparent; background: transparent;
width: 100%; width: 100%;
text-align: center; text-align: center;
max-width: 250px;
} }
#loginMainDiv #divAppIconBar #divLogo { #loginMainDiv #divAppIconBar #divLogo {
position: relative; position: relative;
@ -1689,32 +1691,41 @@ body {
max-width: 400px; max-width: 400px;
} }
#loginMainDiv #divAppIconBar #divLogo img[src$="svg"] { #loginMainDiv #divAppIconBar #divLogo img[src$="svg"] {
width: 70%; width: 150px;
max-width: 2560px; max-width: 150px;
}
#loginMainDiv #loginScreenMessage {
margin: 1em;
color: #0a5ca5;
font-size: 12pt;
}
#loginMainDiv div#login_footer {
position: absolute;
bottom: 0;
display: inline-block;
left: 0;
width: 100%;
}
#loginMainDiv div#login_footer a.logo_footer {
float: right;
margin: 10px;
}
#loginMainDiv div#login_footer a.logo_footer img {
height: 40px;
width: 40px;
} }
#loginMainDiv div#centerBox { #loginMainDiv div#centerBox {
margin: 0% auto; display: inline-block;
width: 57em; position: absolute;
background-color: #CDCDCD; left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background-color: white;
border: none; border: none;
z-index: 100; z-index: 100;
padding: 25px 10px 10px; padding: 0;
-webkit-border-top-right-radius: 5px; border-radius: 5px;
-webkit-border-bottom-right-radius: 5px; opacity: 0.94;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-top-left-radius: 50px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-topleft: 50px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 50px;
/*.background-clip(padding-box);*/
}
#loginMainDiv div#centerBox #loginScreenMessage {
margin: 1em;
} }
#loginMainDiv div#centerBox #loginCdMessage { #loginMainDiv div#centerBox #loginCdMessage {
margin: 1em; margin: 1em;
@ -1724,9 +1735,8 @@ body {
-moz-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px;
border-radius: 3px; border-radius: 3px;
border-top-left-radius: 10px; border-top-left-radius: 10px;
color: red; color: #0a5ca5;
text-align: center; text-align: center;
padding: 1em;
white-space: pre-wrap; white-space: pre-wrap;
} }
#loginMainDiv div#centerBox #loginCdMessage.error { #loginMainDiv div#centerBox #loginCdMessage.error {
@ -1735,6 +1745,9 @@ body {
#loginMainDiv div#centerBox form { #loginMainDiv div#centerBox form {
margin: 1em; margin: 1em;
} }
#loginMainDiv div#centerBox form .hiddenCredential {
display: none;
}
#loginMainDiv div#centerBox form table.divLoginbox { #loginMainDiv div#centerBox form table.divLoginbox {
background-color: transparent; background-color: transparent;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
@ -1774,76 +1787,33 @@ body {
height: 40px; height: 40px;
} }
#loginMainDiv div#centerBox form table.divLoginbox td { #loginMainDiv div#centerBox form table.divLoginbox td {
padding: 0.5em; font-size: 12pt;
font-weight: bold;
color: #26537C;
} }
#loginMainDiv div#centerBox form table.divLoginbox select { #loginMainDiv div#centerBox form table.divLoginbox select {
/*.box_shadow_standard_light;*/
width: auto;
padding: 3px;
outline: none;
display: inline-block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
margin: 5px 0em 5px 0px;
padding-left: 5px; padding-left: 5px;
width: 100%; width: 100%;
} height: 42px;
#loginMainDiv div#centerBox form table.divLoginbox select:hover { border: none;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
} }
#loginMainDiv div#centerBox form table.divLoginbox input { #loginMainDiv div#centerBox form table.divLoginbox input {
border: 1px solid rgba(0, 0, 0, 0.15);
border-color: #B4B4B4;
-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
width: auto;
/*margin: 0.5em 0em 0.5em 0;*/
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: calc(250px - 8px); width: calc(250px - 8px);
} height: 40px;
#loginMainDiv div#centerBox form table.divLoginbox input:hover { padding: 0;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); margin: 0;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border: none;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
padding-left: 5px;
} }
#loginMainDiv div#centerBox form table.divLoginbox input:focus { #loginMainDiv div#centerBox form table.divLoginbox input:focus {
outline: 0; outline: none;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] { #loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
background-color: #ffc200; background-color: #0a5ca5;
color: #000000; color: #ffffff;
font-size: 20px; font-size: 20px;
width: 250px; width: 250px;
} margin-top: 25px;
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:hover {
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
background-color: #189800 !important;
}
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:focus {
outline: 0;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#wrap { #wrap {
/* float: left; /* float: left;

145
pixelegg/css/pixelegg.css
View File

@ -1641,9 +1641,6 @@ body {
*/ */
#socialMedia { #socialMedia {
position: relative; position: relative;
bottom: 20px;
float: right;
right: -10px;
} }
#socialMedia a { #socialMedia a {
margin-left: 10px; margin-left: 10px;
@ -1658,13 +1655,21 @@ body {
border: none; border: none;
margin: 0; margin: 0;
background-color: white; background-color: white;
background-image: url(../images/login/fullscreen.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
} }
#loginMainDiv #divAppIconBar { #loginMainDiv #divAppIconBar {
margin-left: auto; display: inline-block;
margin-right: auto; position: absolute;
left: 50%;
top: 20%;
transform: translate(-50%, -50%);
background: transparent; background: transparent;
width: 100%; width: 100%;
text-align: center; text-align: center;
max-width: 250px;
} }
#loginMainDiv #divAppIconBar #divLogo { #loginMainDiv #divAppIconBar #divLogo {
position: relative; position: relative;
@ -1675,32 +1680,41 @@ body {
max-width: 400px; max-width: 400px;
} }
#loginMainDiv #divAppIconBar #divLogo img[src$="svg"] { #loginMainDiv #divAppIconBar #divLogo img[src$="svg"] {
width: 70%; width: 150px;
max-width: 2560px; max-width: 150px;
}
#loginMainDiv #loginScreenMessage {
margin: 1em;
color: #0a5ca5;
font-size: 12pt;
}
#loginMainDiv div#login_footer {
position: absolute;
bottom: 0;
display: inline-block;
left: 0;
width: 100%;
}
#loginMainDiv div#login_footer a.logo_footer {
float: right;
margin: 10px;
}
#loginMainDiv div#login_footer a.logo_footer img {
height: 40px;
width: 40px;
} }
#loginMainDiv div#centerBox { #loginMainDiv div#centerBox {
margin: 0% auto; display: inline-block;
width: 57em; position: absolute;
background-color: #CDCDCD; left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background-color: white;
border: none; border: none;
z-index: 100; z-index: 100;
padding: 25px 10px 10px; padding: 0;
-webkit-border-top-right-radius: 5px; border-radius: 5px;
-webkit-border-bottom-right-radius: 5px; opacity: 0.94;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-top-left-radius: 50px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-topleft: 50px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 50px;
/*.background-clip(padding-box);*/
}
#loginMainDiv div#centerBox #loginScreenMessage {
margin: 1em;
} }
#loginMainDiv div#centerBox #loginCdMessage { #loginMainDiv div#centerBox #loginCdMessage {
margin: 1em; margin: 1em;
@ -1710,9 +1724,8 @@ body {
-moz-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px;
border-radius: 3px; border-radius: 3px;
border-top-left-radius: 10px; border-top-left-radius: 10px;
color: red; color: #0a5ca5;
text-align: center; text-align: center;
padding: 1em;
white-space: pre-wrap; white-space: pre-wrap;
} }
#loginMainDiv div#centerBox #loginCdMessage.error { #loginMainDiv div#centerBox #loginCdMessage.error {
@ -1721,6 +1734,9 @@ body {
#loginMainDiv div#centerBox form { #loginMainDiv div#centerBox form {
margin: 1em; margin: 1em;
} }
#loginMainDiv div#centerBox form .hiddenCredential {
display: none;
}
#loginMainDiv div#centerBox form table.divLoginbox { #loginMainDiv div#centerBox form table.divLoginbox {
background-color: transparent; background-color: transparent;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
@ -1760,76 +1776,33 @@ body {
height: 40px; height: 40px;
} }
#loginMainDiv div#centerBox form table.divLoginbox td { #loginMainDiv div#centerBox form table.divLoginbox td {
padding: 0.5em; font-size: 12pt;
font-weight: bold;
color: #26537C;
} }
#loginMainDiv div#centerBox form table.divLoginbox select { #loginMainDiv div#centerBox form table.divLoginbox select {
/*.box_shadow_standard_light;*/
width: auto;
padding: 3px;
outline: none;
display: inline-block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
margin: 5px 0em 5px 0px;
padding-left: 5px; padding-left: 5px;
width: 100%; width: 100%;
} height: 42px;
#loginMainDiv div#centerBox form table.divLoginbox select:hover { border: none;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
} }
#loginMainDiv div#centerBox form table.divLoginbox input { #loginMainDiv div#centerBox form table.divLoginbox input {
border: 1px solid rgba(0, 0, 0, 0.15);
border-color: #B4B4B4;
-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
width: auto;
/*margin: 0.5em 0em 0.5em 0;*/
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: calc(250px - 8px); width: calc(250px - 8px);
} height: 40px;
#loginMainDiv div#centerBox form table.divLoginbox input:hover { padding: 0;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); margin: 0;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border: none;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
padding-left: 5px;
} }
#loginMainDiv div#centerBox form table.divLoginbox input:focus { #loginMainDiv div#centerBox form table.divLoginbox input:focus {
outline: 0; outline: none;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] { #loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
background-color: #ffc200; background-color: #0a5ca5;
color: #000000; color: #ffffff;
font-size: 20px; font-size: 20px;
width: 250px; width: 250px;
} margin-top: 25px;
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:hover {
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
background-color: #189800 !important;
}
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:focus {
outline: 0;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#wrap { #wrap {
/* float: left; /* float: left;

BIN
pixelegg/images/login/fullscreen.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 116 KiB

BIN
pixelegg/images/login/logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 39 KiB

97
pixelegg/less/layout_loginPage.less
View File

@ -19,9 +19,6 @@
#socialMedia { #socialMedia {
position: relative; position: relative;
bottom: 20px;
float: right;
right: -10px;
} }
#socialMedia a { #socialMedia a {
margin-left: 10px; margin-left: 10px;
@ -38,15 +35,21 @@
border: none; border: none;
margin: 0; margin: 0;
background-color: white; background-color: white;
background-image: url(../images/login/fullscreen.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
// Logo Leiste // Logo Leiste
#divAppIconBar{ #divAppIconBar{
margin-left:auto; display: inline-block;
margin-right:auto; position: absolute;
left: 50%;
top: 20%;
transform: translate(-50%, -50%);
background: transparent; background: transparent;
width: 100%; width: 100%;
text-align: center; text-align: center;
max-width:250px;
#divLogo { #divLogo {
position: relative; position: relative;
@ -59,35 +62,54 @@
img[src$="svg"]{ img[src$="svg"]{
width: 70%; width: 150px;
max-width: 2560px; max-width: 150px;
} }
} }
} }
// Meldung
#loginScreenMessage{
margin: 1em;
color: #0a5ca5;
font-size: 12pt;
}
div#login_footer {
position: absolute;
bottom: 0;
display: inline-block;
left: 0;
width: 100%;
a.logo_footer {
float:right;
margin: 10px;
img {
height: 40px;
width: 40px;
}
}
}
// Anmeldefenster / Box mit Mesaage + Form // Anmeldefenster / Box mit Mesaage + Form
div#centerBox{ div#centerBox{
margin: 0% auto; display: inline-block;
width: 57em; position: absolute;
background-color: @gray_20; left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background-color: white;
border: none; border: none;
z-index: 100; z-index: 100;
padding: 25px 10px 10px; padding: 0;
.border_radius (5px, 5px, 5px, 50px); border-radius:5px;
opacity:0.94;
// Meldung
#loginScreenMessage{
margin: 1em;
}
// Message // Message
#loginCdMessage{ #loginCdMessage{
margin: 1em; margin: 1em;
.border_radius_button_lefttop; .border_radius_button_lefttop;
color: red; color: #0a5ca5;
text-align: center; text-align: center;
padding: 1em;
white-space: pre-wrap; white-space: pre-wrap;
} }
#loginCdMessage.error { #loginCdMessage.error {
@ -97,7 +119,7 @@
// Formular // Formular
form{ form{
margin: 1em; margin: 1em;
.hiddenCredential {display: none;}
// Table // Table
table.divLoginbox { table.divLoginbox {
@ -126,42 +148,47 @@
} }
td { td {
padding: 0.5em; font-size: 12pt;
font-weight: bold;
color: @egw_color_2_b;
} }
select { select {
.Complete_Button_select;
margin: 5px 0em 5px 0px;
padding-left: 5px; padding-left: 5px;
width:100%; width:100%;
height: 42px;
border: none;
border-bottom: 1px solid silver;
} }
select:hover { select:hover {
.Complete_Button_select_hover;
} }
input { input {
.Complete_Button_input;
width: ~"calc(250px - 8px)"; width: ~"calc(250px - 8px)";
height: 40px;
padding: 0;
margin: 0;
border: none;
border-bottom: 1px solid silver;
padding-left: 5px;
} }
input:hover{ input:hover{
.Complete_Button_input_hover;
} }
input:focus{ input:focus{
.Complete_Button_input_focus; outline: none;
} }
input[type="submit"] { input[type="submit"] {
.background_color_egw_normal; // Orange background-color: #0a5ca5;
// Hintergrund in EGW Farbe // Hintergrund in EGW Farbe
.color_100_gray; .color_0_gray;
.fontsize_xxl; .fontsize_xxl;
width: 250px; width: 250px;
&:hover{.Complete_Button_select_hover; background-color: @color_positive_action !important;} &:hover{}
&:focus {.Complete_Button_input_focus;} &:focus {}
margin-top: 25px;
} }
} }

53
pixelegg/login.tpl
View File

@ -2,13 +2,13 @@
<div id="loginMainDiv"> <div id="loginMainDiv">
<div id="divAppIconBar" style="position:relative;"> <div id="divAppIconBar" style="position:relative;">
<div id="divLogo"><a href="{logo_url}" target="_blank"><img src="{logo_file}" border="0" alt="{logo_title}" title="{logo_title}" /></a></div> <div id="divLogo">
<a href="{logo_url}" target="_blank"><img src="{logo_file}" border="0" alt="{logo_title}" title="{logo_title}" /></a>
<div id="loginScreenMessage">{lang_message}</div>
</div>
</div> </div>
<div id="centerBox"> <div id="centerBox">
<div id="loginScreenMessage">{lang_message}</div>
<div id="loginCdMessage" class="{cd_class}">{cd}</div>
<form name="login_form" method="post" action="{login_url}"> <form name="login_form" method="post" action="{login_url}">
<table class="divLoginbox divSideboxEntry" cellspacing="0" cellpadding="2" border="0" align="center"> <table class="divLoginbox divSideboxEntry" cellspacing="0" cellpadding="2" border="0" align="center">
<tr class="divLoginboxHeader"> <tr class="divLoginboxHeader">
@ -19,48 +19,37 @@
<input type="hidden" name="passwd_type" value="text" /> <input type="hidden" name="passwd_type" value="text" />
<input type="hidden" name="account_type" value="u" /> <input type="hidden" name="account_type" value="u" />
</td> </td>
<td rowspan="6">
<img src="{template_set}/images/password.svg" class="passwordImage" />
</td>
</tr> </tr>
<!-- BEGIN language_select -->
<tr> <tr>
<td align="right">{lang_language}:&nbsp;</td> <td><input name="login" tabindex="4" value="{login}" size="30" placeholder="{lang_username}" {autofocus_login}/></td>
</tr>
<tr>
<td><input name="passwd" tabindex="5" value="{passwd}" type="password" size="30" placeholder="{lang_password}"/></td>
</tr>
<!-- BEGIN remember_me_selection -->
<tr>
<td>{select_remember_me}</td>
</tr>
<!-- END remember_me_selection -->
<!-- BEGIN language_select -->
<tr>
<td>{select_language}</td> <td>{select_language}</td>
</tr> </tr>
<!-- END language_select --> <!-- END language_select -->
<!-- BEGIN domain_selection --> <!-- BEGIN domain_selection -->
<tr> <tr>
<td align="right">{lang_domain}:&nbsp;</td>
<td>{select_domain}</td> <td>{select_domain}</td>
</tr> </tr>
<!-- END domain_selection --> <!-- END domain_selection -->
<!-- BEGIN remember_me_selection -->
<tr>
<td align="right">{lang_remember_me}:&nbsp;</td>
<td>{select_remember_me}</td>
</tr>
<!-- END remember_me_selection -->
<tr>
<td align="right">{lang_username}:&nbsp;</td>
<td><input name="login" tabindex="4" value="{login}" size="30" {autofocus_login}/></td>
</tr>
<tr>
<td align="right">{lang_password}:&nbsp;</td>
<td><input name="passwd" tabindex="5" value="{passwd}" type="password" size="30" /></td>
</tr>
<!-- BEGIN change_password --> <!-- BEGIN change_password -->
<tr> <tr>
<td align="right">{lang_new_password}:&nbsp;</td> <td><input name="new_passwd" tabindex="6" type="password" size="30" placeholder="{lang_new_password}" {autofocus_new_passwd}/></td>
<td><input name="new_passwd" tabindex="6" type="password" size="30" {autofocus_new_passwd}/></td>
</tr> </tr>
<tr> <tr>
<td align="right">{lang_repeat_password}:&nbsp;</td> <td><input name="new_passwd2" tabindex="7" type="password" plcaseholder="{lang_repeat_password}" size="30" /></td>
<td><input name="new_passwd2" tabindex="7" type="password" size="30" /></td>
</tr> </tr>
<!-- END change_password --> <!-- END change_password -->
<tr> <tr>
<td>&nbsp;</td>
<td> <td>
<input tabindex="8" type="submit" value=" {lang_login} " name="submitit" /> <input tabindex="8" type="submit" value=" {lang_login} " name="submitit" />
</td> </td>
@ -75,6 +64,12 @@
</tr> </tr>
<!-- END registration --> <!-- END registration -->
</table> </table>
<div id="loginCdMessage" class="{cd_class}">{cd}</div>
</form> </form>
</div> </div>
<div id="login_footer">
<a href="http://www.egroupware.org" class="logo_footer">
<img src="pixelegg/images/login/logo.png">
</a>
</div>
</div> </div>

149
pixelegg/mobile/fw_mobile.css
View File

@ -1357,9 +1357,6 @@ span.ui-icon-search {
} }
/*###########################################*/ /*###########################################*/
/*Dialog: calendar edit series*/ /*Dialog: calendar edit series*/
.ui-dialog-buttonpane {
background-color: #679FD2;
}
.ui-dialog-buttonset button.ui-button-text-only { .ui-dialog-buttonset button.ui-button-text-only {
background-color: #CDCDCD; background-color: #CDCDCD;
background: inherit; background: inherit;
@ -1666,9 +1663,6 @@ body {
*/ */
#socialMedia { #socialMedia {
position: relative; position: relative;
bottom: 20px;
float: right;
right: -10px;
} }
#socialMedia a { #socialMedia a {
margin-left: 10px; margin-left: 10px;
@ -1683,13 +1677,21 @@ body {
border: none; border: none;
margin: 0; margin: 0;
background-color: white; background-color: white;
background-image: url(../images/login/fullscreen.jpg);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: cover;
} }
#loginMainDiv #divAppIconBar { #loginMainDiv #divAppIconBar {
margin-left: auto; display: inline-block;
margin-right: auto; position: absolute;
left: 50%;
top: 20%;
transform: translate(-50%, -50%);
background: transparent; background: transparent;
width: 100%; width: 100%;
text-align: center; text-align: center;
max-width: 250px;
} }
#loginMainDiv #divAppIconBar #divLogo { #loginMainDiv #divAppIconBar #divLogo {
position: relative; position: relative;
@ -1700,32 +1702,41 @@ body {
max-width: 400px; max-width: 400px;
} }
#loginMainDiv #divAppIconBar #divLogo img[src$="svg"] { #loginMainDiv #divAppIconBar #divLogo img[src$="svg"] {
width: 70%; width: 150px;
max-width: 2560px; max-width: 150px;
}
#loginMainDiv #loginScreenMessage {
margin: 1em;
color: #0a5ca5;
font-size: 12pt;
}
#loginMainDiv div#login_footer {
position: absolute;
bottom: 0;
display: inline-block;
left: 0;
width: 100%;
}
#loginMainDiv div#login_footer a.logo_footer {
float: right;
margin: 10px;
}
#loginMainDiv div#login_footer a.logo_footer img {
height: 40px;
width: 40px;
} }
#loginMainDiv div#centerBox { #loginMainDiv div#centerBox {
margin: 0% auto; display: inline-block;
width: 57em; position: absolute;
background-color: #CDCDCD; left: 50%;
top: 50%;
transform: translate(-50%, -50%);
background-color: white;
border: none; border: none;
z-index: 100; z-index: 100;
padding: 25px 10px 10px; padding: 0;
-webkit-border-top-right-radius: 5px; border-radius: 5px;
-webkit-border-bottom-right-radius: 5px; opacity: 0.94;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-top-left-radius: 50px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-topleft: 50px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 50px;
/*.background-clip(padding-box);*/
}
#loginMainDiv div#centerBox #loginScreenMessage {
margin: 1em;
} }
#loginMainDiv div#centerBox #loginCdMessage { #loginMainDiv div#centerBox #loginCdMessage {
margin: 1em; margin: 1em;
@ -1735,9 +1746,8 @@ body {
-moz-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px;
border-radius: 3px; border-radius: 3px;
border-top-left-radius: 10px; border-top-left-radius: 10px;
color: red; color: #0a5ca5;
text-align: center; text-align: center;
padding: 1em;
white-space: pre-wrap; white-space: pre-wrap;
} }
#loginMainDiv div#centerBox #loginCdMessage.error { #loginMainDiv div#centerBox #loginCdMessage.error {
@ -1746,6 +1756,9 @@ body {
#loginMainDiv div#centerBox form { #loginMainDiv div#centerBox form {
margin: 1em; margin: 1em;
} }
#loginMainDiv div#centerBox form .hiddenCredential {
display: none;
}
#loginMainDiv div#centerBox form table.divLoginbox { #loginMainDiv div#centerBox form table.divLoginbox {
background-color: transparent; background-color: transparent;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
@ -1785,76 +1798,33 @@ body {
height: 40px; height: 40px;
} }
#loginMainDiv div#centerBox form table.divLoginbox td { #loginMainDiv div#centerBox form table.divLoginbox td {
padding: 0.5em; font-size: 12pt;
font-weight: bold;
color: #26537C;
} }
#loginMainDiv div#centerBox form table.divLoginbox select { #loginMainDiv div#centerBox form table.divLoginbox select {
/*.box_shadow_standard_light;*/
width: auto;
padding: 3px;
outline: none;
display: inline-block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
margin: 5px 0em 5px 0px;
padding-left: 5px; padding-left: 5px;
width: 100%; width: 100%;
} height: 42px;
#loginMainDiv div#centerBox form table.divLoginbox select:hover { border: none;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
} }
#loginMainDiv div#centerBox form table.divLoginbox input { #loginMainDiv div#centerBox form table.divLoginbox input {
border: 1px solid rgba(0, 0, 0, 0.15);
border-color: #B4B4B4;
-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
width: auto;
/*margin: 0.5em 0em 0.5em 0;*/
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
width: calc(250px - 8px); width: calc(250px - 8px);
} height: 40px;
#loginMainDiv div#centerBox form table.divLoginbox input:hover { padding: 0;
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); margin: 0;
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border: none;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); border-bottom: 1px solid silver;
padding-left: 5px;
} }
#loginMainDiv div#centerBox form table.divLoginbox input:focus { #loginMainDiv div#centerBox form table.divLoginbox input:focus {
outline: 0; outline: none;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] { #loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
background-color: #ffc200; background-color: #0a5ca5;
color: #000000; color: #ffffff;
font-size: 20px; font-size: 20px;
width: 250px; width: 250px;
} margin-top: 25px;
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:hover {
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
background-color: #189800 !important;
}
#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"]:focus {
outline: 0;
border-width: 1px;
border-style: solid;
border-color: #B4B4B4;
-webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.1);
} }
#wrap { #wrap {
/* float: left; /* float: left;
@ -2164,7 +2134,6 @@ button[id="calendar-edit_button[delete]"]:hover,
button[id="timesheet-edit_button[delete]"]:hover, button[id="timesheet-edit_button[delete]"]:hover,
button[id="displayToolbar-delete"]:hover, button[id="displayToolbar-delete"]:hover,
button.et2_button_delete:hover { button.et2_button_delete:hover {
background-image: url('../images/delete-hover.png') !important;
background-color: #b81f00 !important; background-color: #b81f00 !important;
/*.border_normal;*/ /*.border_normal;*/
/*.box_shadow_standard_light;*/ /*.box_shadow_standard_light;*/