add OpenID logo and a little styling to the login forms

diff --git a/root/css/auth.css b/root/css/auth.css
index 0717b5f..76e3717 100644 (file)
--- a/root/css/auth.css
+++ b/root/css/auth.css
@@ -6,3 +6,17 @@
 .error {
     color: #d24848;
 }
+.openid_form {
+       margin-top: 20px;
+}
+#openid_input {
+       background: url('../images/openid-16x16.gif');
+       background-color: white;
+       background-position: 0 50%;
+       background-repeat: no-repeat;
+       padding-left: 18px;
+       padding-top: 3px;
+       padding-bottom: 3px;
+       margin-right: 15px;
+       width: 200px;
+}

diff --git a/root/images/openid-16x16.gif b/root/images/openid-16x16.gif
new file mode 100644 (file)
index 0000000..e2d8377
Binary files /dev/null and b/root/images/openid-16x16.gif differ

diff --git a/root/src/auth/login.tt b/root/src/auth/login.tt
index 61575b1..9293df9 100644 (file)
--- a/root/src/auth/login.tt
+++ b/root/src/auth/login.tt
@@ -47,20 +47,20 @@ $(document).ready(function() {
        <h3><a href="#">Sign in with Google</a></h3>
        <div>
                <p>If you have a Google account, you may use it to sign into Stemmaweb.</p>
-               <form method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
+               <form class="openid_form" method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
                        <input type="hidden" name="realm" value="openid"/>
                        <input type="hidden" name="openid_identifier" value="https://www.google.com/accounts/o8/id"/>
-                       <input type="submit" class="login_button" id="#login_google" value="Sign in with Google"></input>
+                       <input type="submit" class="login_button" id="login_google" value="Sign in with Google"></input>
                </form>
        </div>
 
        <h3><a href="#">Sign in with OpenID</a></h3>
        <div>
                <p>If you have an account with an <a href="http://openid.net/get-an-openid/" target="_blank">OpenID provider</a> (e.g. WordPress, Blogger, Flickr, Yahoo), you may use it to sign into Stemmaweb.
-               <form method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
+               <form class="openid_form" method="post" action="[% c.uri_for_action('/users/login') | html %]" autocomplete="off">
                        <input type="hidden" name="realm" value="openid"/>
-                       <input type="text" name="openid_identifier"/>
-                       <input type="submit" class="login_button" id="#login_openid" value="Sign in with OpenID"/>
+                       <input type="text" name="openid_identifier" id="openid_input"/>
+                       <input type="submit" class="login_button" id="login_openid" value="Sign in with OpenID"/>
                </form>
        </div>