From 85a0844b5e7f31cb1b731096f056c5adcf7992da Mon Sep 17 00:00:00 2001
From: Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
Date: Fri, 25 Jul 2014 13:35:57 +0000
Subject: [PATCH] pixelegg / app

Login Screen:

new svg - password.svg
class in login.tpl
css
---
 pixelegg/css/pixelegg.css             | 29 +++++++++++++++++++++++++
 pixelegg/images/password.svg          | 20 ++++++++---------
 pixelegg/images/password_old.svg      | 15 +++++++++++++
 pixelegg/less/layout_loginPage.less   | 31 +++++++++++++++++++++++----
 pixelegg/templates/pixelegg/login.tpl |  4 ++--
 5 files changed, 82 insertions(+), 17 deletions(-)
 create mode 100755 pixelegg/images/password_old.svg

diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css
index f4700728b4..9b0da68717 100644
--- a/pixelegg/css/pixelegg.css
+++ b/pixelegg/css/pixelegg.css
@@ -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;
diff --git a/pixelegg/images/password.svg b/pixelegg/images/password.svg
index b186b09b0b..e6392f9ff1 100755
--- a/pixelegg/images/password.svg
+++ b/pixelegg/images/password.svg
@@ -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>
diff --git a/pixelegg/images/password_old.svg b/pixelegg/images/password_old.svg
new file mode 100755
index 0000000000..b186b09b0b
--- /dev/null
+++ b/pixelegg/images/password_old.svg
@@ -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>
diff --git a/pixelegg/less/layout_loginPage.less b/pixelegg/less/layout_loginPage.less
index 1b0df11a1e..410531ccc2 100644
--- a/pixelegg/less/layout_loginPage.less
+++ b/pixelegg/less/layout_loginPage.less
@@ -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 {
diff --git a/pixelegg/templates/pixelegg/login.tpl b/pixelegg/templates/pixelegg/login.tpl
index 8b51ba8c2b..5d6e81cc07 100644
--- a/pixelegg/templates/pixelegg/login.tpl
+++ b/pixelegg/templates/pixelegg/login.tpl
@@ -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 -->