holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

pixelegg / app

Browse Source 
Login Screen:

new svg - password.svg
class in login.tpl
css
This commit is contained in:
Stefan Reinhardt 2014-07-25 13:35:57 +00:00
parent 019055a63c
commit 85a0844b5e
5 changed files with 82 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
pixelegg/css/pixelegg.css
View File

@ -2241,6 +2241,35 @@ body {
border-radius: 3px;
border-top-left-radius: 10px;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage {
background-color: #b3ad54;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjZmZjMjAwIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjNDA4ZGQyIiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
background-image: -moz-linear-gradient(top, #ffc200, #408dd2);
background-image: -ms-linear-gradient(top, #ffc200, #408dd2);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffc200), to(#408dd2));
background-image: -webkit-linear-gradient(top, #ffc200, #408dd2);
background-image: -o-linear-gradient(top, #ffc200, #408dd2);
background-image: linear-gradient(top, #ffc200, #408dd2);
background-repeat: repeat-x;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage img.passwordImage {
/*width: 70%;*/
/*margin-left: 15%;*/
margin: 0 auto;
max-width: 400px;
border-top: solid 1px 5px;
border-left: solid 1px #eeeeee;
border-right: solid 1px #eeeeee;
border-bottom: solid 1px #eeeeee;
}
#loginMainDiv div#centerBox form table.divLoginbox div.LoginPasswordImage img.passwordImage[src$="svg"] {
border-top: solid 1px 5px;
border-left: solid 1px #eeeeee;
border-right: solid 1px #eeeeee;
border-bottom: solid 1px #eeeeee;
width: 40px;
height: 40px;
}
#loginMainDiv div#centerBox form table.divLoginbox td {
padding: 0.5em;
font-weight: bold;

20
pixelegg/images/password.svg
View File

@ -1,15 +1,13 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<?xml-stylesheet type="text/css" href="../less/svg.css" ?>
<svg version="1.1" id="pixelegg_password" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="28.347px" height="28.347px" viewBox="0 0 28.347 28.347" enable-background="new 0 0 28.347 28.347" xml:space="preserve">
<g>
<circle fill-rule="evenodd" clip-rule="evenodd" fill="#ECEDED" cx="18.888" cy="9.616" r="1.74"/>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#ECEDED" d="M0,0v28.348h28.346V0H0z M18.255,16.656
c-1.035,0-1.731-0.198-2.309-0.421l-0.731,2.154c-0.09,0.261-0.338,0.435-0.615,0.428l-2.401-0.052l-0.168,2.417
c-0.022,0.323-0.286,0.579-0.61,0.589L8.535,21.86l-0.42,1.893c-0.064,0.291-0.321,0.497-0.618,0.497H4.966
c-0.349,0-0.633-0.284-0.633-0.633v-2.531c0-0.153,0.056-0.302,0.157-0.418l7.658-8.734c-0.096-0.453-0.222-1.151-0.222-1.605
C11.927,6.839,14.766,4,18.255,4s6.328,2.839,6.328,6.328C24.583,13.816,21.744,16.656,18.255,16.656z"/>
</g>
<svg version="1.1" id="pixelegg_password" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
y="0px" width="28.348px" height="28.348px" viewBox="0 0 28.348 28.348" style="enable-background:new 0 0 28.348 28.348;"
xml:space="preserve">
<path style="fill:#ECEDED;" d="M18.255,4c-3.488,0-6.328,2.839-6.329,6.329c0,0.454,0.126,1.152,0.223,1.605L4.49,20.668
c-0.101,0.116-0.157,0.266-0.157,0.418v2.531c0,0.349,0.284,0.633,0.633,0.633h2.531c0.297,0,0.554-0.206,0.618-0.497l0.42-1.893
l2.886-0.089c0.324-0.01,0.588-0.267,0.61-0.589l0.168-2.417l2.401,0.052c0.276,0.007,0.524-0.167,0.614-0.428l0.731-2.154
c0.578,0.223,1.274,0.421,2.309,0.421c3.489,0,6.328-2.84,6.328-6.328C24.583,6.839,21.744,4,18.255,4z M18.888,11.356
c-0.961,0-1.74-0.779-1.74-1.74s0.779-1.74,1.74-1.74s1.739,0.779,1.739,1.74S19.849,11.356,18.888,11.356z"/>
<rect x="0" y="0" style="fill:none;" width="28.347" height="28.349"/>
</svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.2 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

15
pixelegg/images/password_old.svg Executable file
View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<?xml-stylesheet type="text/css" href="../less/svg.css" ?>
<svg version="1.1" id="pixelegg_password" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="28.347px" height="28.347px" viewBox="0 0 28.347 28.347" enable-background="new 0 0 28.347 28.347" xml:space="preserve">
<g>
<circle fill-rule="evenodd" clip-rule="evenodd" fill="#ECEDED" cx="18.888" cy="9.616" r="1.74"/>
<path fill-rule="evenodd" clip-rule="evenodd" fill="#ECEDED" d="M0,0v28.348h28.346V0H0z M18.255,16.656
c-1.035,0-1.731-0.198-2.309-0.421l-0.731,2.154c-0.09,0.261-0.338,0.435-0.615,0.428l-2.401-0.052l-0.168,2.417
c-0.022,0.323-0.286,0.579-0.61,0.589L8.535,21.86l-0.42,1.893c-0.064,0.291-0.321,0.497-0.618,0.497H4.966
c-0.349,0-0.633-0.284-0.633-0.633v-2.531c0-0.153,0.056-0.302,0.157-0.418l7.658-8.734c-0.096-0.453-0.222-1.151-0.222-1.605
C11.927,6.839,14.766,4,18.255,4s6.328,2.839,6.328,6.328C24.583,13.816,21.744,16.656,18.255,16.656z"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

31
pixelegg/less/layout_loginPage.less
View File

@ -66,10 +66,10 @@
img[src$="svg"]{
width: 70%;
max-width: 2560px;
.gradient_vertical (@egw_color_2_d, @egw_color_2_d);
}
width: 70%;
max-width: 2560px;
.gradient_vertical (@egw_color_2_d, @egw_color_2_d);
}
}
}
@ -132,6 +132,29 @@
tr.divLoginboxHeader{}
// Passwort Image
div.LoginPasswordImage{
.gradient_vertical (@egw_color_1_a, @egw_color_2_d);
img.passwordImage {
/*width: 70%;*/
/*margin-left: 15%;*/
margin: 0 auto;
max-width: 400px;
.bordered(5px);
}
img.passwordImage[src$="svg"]{
.bordered(5px);
.dimension_width_height_xl;
}
}
td { padding: 0.5em; font-weight: bold; color: @egw_color_1_a}
select {

4
pixelegg/templates/pixelegg/login.tpl
View File

@ -2,7 +2,7 @@
<div id="loginMainDiv">
<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>
@ -20,7 +20,7 @@
<input type="hidden" name="account_type" value="u" />
</td>
<td rowspan="6">
<img src="{template_set}/images/password.svg" />
<img src="{template_set}/images/password.svg" class="passwordImage" />
</td>
</tr>
<!-- BEGIN language_select -->