[damned-lies] Style the registration form
- From: Tom Tryfonidis <tomtryf src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [damned-lies] Style the registration form
- Date: Wed, 3 Oct 2012 12:55:01 +0000 (UTC)
commit 5ce78a04d63af4deeac869b61ae7cb92db8f3ca1
Author: Tom Tryfonidis <tomtryf gmail com>
Date: Wed Oct 3 15:54:22 2012 +0300
Style the registration form
https://bugzilla.gnome.org/show_bug.cgi?id=685166
common/static/css/login.css | 37 ++++++++++++++++++++++++----
common/static/css/text.css | 12 ++++++++-
templates/registration/register.html | 43 +++++++++++++++++++--------------
3 files changed, 67 insertions(+), 25 deletions(-)
---
diff --git a/common/static/css/login.css b/common/static/css/login.css
index 90e75ef..be125f7 100644
--- a/common/static/css/login.css
+++ b/common/static/css/login.css
@@ -1,8 +1,33 @@
/* LOGIN FORM */
-.login #container { background:white; border:1px solid #ccc; width:28em; min-width:300px; margin-left:auto; margin-right:auto; margin-top:100px; }
-.login #content-main { width:100%; }
-.login form { margin-top:1em; }
-.login .form-row { padding:4px 0; float:left; width:100%; }
-.login .form-row label, .login .submit-row label { float:left; width:11em; padding-right:0.5em; line-height:1.1em; text-align:right; font-size:1em; color:#333; }
-.login .form-row #id_username, .login .form-row #id_password { width:14em; }
+.login{
+ max-width: 890px;
+}
+.login #password{
+ float:left;
+}
+.login #openid{
+ float:right;
+ margin-top:2em;
+}
+.login form {
+ margin-top:1em;
+}
+.login .form-row {
+ padding:4px 0;
+ width:100%;
+}
+.login .form-row label, .login .submit-row label {
+ float:left;
+ width:11em;
+ padding: 0.4em 0.5em 0 0;
+ line-height:1.1em;
+ text-align:right;
+ font-size:1em;
+ color:#333;
+ vertical-align: top;
+}
+.login .form-row #id_username,#id_password, #id_email{
+ width:14em;
+ vertical-align: middle;
+}
diff --git a/common/static/css/text.css b/common/static/css/text.css
index 4c47bd4..a3f809c 100644
--- a/common/static/css/text.css
+++ b/common/static/css/text.css
@@ -70,7 +70,12 @@ code {
}
.main_feature {
- font-size: 16pt;
+ font-size: 21px;
+ line-height: 130%;
+}
+
+.main_register {
+ font-size: 17px;
line-height: 130%;
}
@@ -82,6 +87,11 @@ code {
color: #888a85;
}
+.help{
+ font-size: 12px;
+ color: #888a85;
+}
+
.more {
background: url(../images/more-arrow.png) right 6px no-repeat;
cursor: pointer;
diff --git a/templates/registration/register.html b/templates/registration/register.html
index 8ee96ee..b3bffa6 100644
--- a/templates/registration/register.html
+++ b/templates/registration/register.html
@@ -10,7 +10,7 @@
{% if user.is_authenticated %}
<p>{% blocktrans with user.username as username %}You are already logged in as {{ username }}.{% endblocktrans %}</p>
{% else %}
-<p>{% trans "You can register here for an account on this site. This is only useful if you plan to contribute to GNOME translations." %}</p>
+<p class="main_register">{% trans "You can register here for an account on this site. This is only useful if you plan to contribute to GNOME translations." %}</p>
<p>{% trans "After registration and connection, you will be able to join an existing team from your profile page." %}</p>
<form action="/register/" method="post" id="login-form" class="login">
@@ -23,30 +23,37 @@
{{ form.email.errors }}
<label for="id_email">{{ form.email.label }}</label> {{ form.email }}
</div>
- <table style="clear:both"><tr><td colspan="2">
- <div style="clear:both">{{ form.non_field_errors }}</div>
+
+ <p class="main_register">{% trans "Authenticate via OpenID <strong>or</strong> password:" %}</p>
+ <div style="clear:both">{{ form.non_field_errors }}</div>
+
+<div class="login">
+ <div id="password">
+ <div class="form-row">
+ {{ form.password1.errors }}
+ <label for="id_password">{{ form.password1.label }}</label> {{ form.password1 }} <span class="help">{{ form.password1.help_text }}</span>
+ </div>
+ <div class="form-row">
+ <label for="id_password">{{ form.password2.label }}</label> {{ form.password2 }}
+ </div>
+ <div class="form-row">
+ <label> </label><input type="submit" value="{% trans 'Register with password' %}" />
+ </div>
+</div>
+
{% if openid_path %}
- <p>{% trans "Authenticate via OpenID <strong>or</strong> password:" %}</p></td></tr><tr><td valign="bottom">
- <div>
+<div id="openid">
+ <div class="form-row">
{{ form.openid_url.errors }}
<label for="id_openid"><img src="{{ openid_path }}logo/" alt=""> {{ form.openid_url.label }}</label> {{ form.openid_url }}
</div>
- <div style="text-align:center; padding-top:8px;">
+ <div class="form-row">
<label> </label><input type="submit" value="{% trans 'Register with OpenID' %}" />
</div>
- </td><td valign="bottom">
+</div>
{% endif %}
- <div class="form-row">
- {{ form.password1.errors }}
- <label for="id_password">{{ form.password1.label }}</label> {{ form.password1 }} <span class="help">{{ form.password1.help_text }}</span>
- </div>
- <div class="form-row">
- <label for="id_password">{{ form.password2.label }}</label> {{ form.password2 }}
- </div>
- <div style="text-align:center; padding-top:8px;">
- <label> </label><input type="submit" value="{% trans 'Register with password' %}" />
- </div>
- </td></tr></table>
+
+</div> <!-- ends div.login -->
</form>
<script type="text/javascript">
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]