harmonize 3 form views (register, slice request, and support) in terms of style, and avoid blinking hints as far as possible
slice_name = forms.CharField(
widget=forms.TextInput(attrs={'class':'form-control'}),
- help_text="Enter a name for the slice you wish to create")
+ help_text="The name for the slice you wish to create")
authority_hrn = forms.ChoiceField(
widget = forms.Select(attrs={'class':'form-control'}),
choices = [],
- help_text = "Please select an authority responsible for vetting your slice")
+ help_text = "An authority responsible for vetting your slice")
number_of_nodes = forms.DecimalField(
widget = forms.TextInput(attrs={'class':'form-control'}),
- help_text = "Enter the number of nodes you expect to request (informative only)")
+ help_text = "The number of nodes you expect to request (informative)")
type_of_nodes = forms.CharField(
widget = forms.TextInput(attrs={'class':'form-control'}),
- help_text = "Enter the type of nodes you expect to request (informative only)")
+ help_text = "The type of nodes you expect to request (informative)")
purpose = forms.CharField(
widget = forms.Textarea(attrs={'class':'form-control'}),
- help_text = "Enter the purpose of your experiment (informative only)")
+ help_text = "The purpose of your experiment (informative)")
email = forms.EmailField(
widget = forms.TextInput(attrs={'class':'form-control'}),
- help_text = "Enter your email address")
+ help_text = "Your email address")
cc_myself = forms.BooleanField(
widget = forms.CheckboxInput(attrs={'class':'form-control'}),
required = False,
- help_text = "Please indicate whether you would like to be CC'ed to the request email")
+ help_text = "If you'd like to be cc'ed on the request email")
def __init__(self, *args, **kwargs):
initial = kwargs.get('initial', {})
self.fields['authority_hrn'] = forms.ChoiceField(
widget = forms.Select(attrs={'class':'form-control'}),
choices = authority_hrn,
- help_text = "Please select an authority responsible for vetting your slice")
+ help_text = "An authority responsible for vetting your slice")
-webkit-border-radius: 7px;
border-radius: 7px;
}
+
+/* avoid blinking effect with the rhs hints */
+select#auth_list {
+ height: 34px;
+}
or <a href="http://trac.myslice.info/" >visit us</a></h4>
</div>
+<!-- no hint for this form, moreover we need more space to write stuff down
+ so we use a 3-6-3 layout -->
<div class='well'>
<form class="cmxform form-horizontal" id="commentForm" action="#" method="post" role="form">{% csrf_token %}
<fieldset>
{% for field in form %}
<div class="form-group">
- <label for="{{ field.html_name }}" class="col-xs-4 control-label">{{ field.label }}</label>
- <div class="col-xs-4"> {{ field.errors }} {{ field }} <p class="form-hint">{{ field.help_text }}</p> </div>
+ <label for="{{ field.html_name }}" class="col-xs-3 control-label">{{ field.label }}</label>
+ <div class="col-xs-6"> {{ field.errors }} {{ field }} <p class="form-hint">{{ field.help_text }}</p> </div>
</div>
{% endfor %}
- <button class="submit btn btn-default col-md-offset-4 col-xs-4" type="submit">Send to Support</button>
+ <button class="submit btn btn-default col-xs-12" type="submit">Send to Support</button>
</fieldset>
</form>
</div>
<fieldset>
{% csrf_token %}
<div class="form-group">
- <label for="firstname" class="col-xs-4 control-label">First Name</label>
+ <label for="firstname" class="col-xs-2 control-label">First Name</label>
<div class="col-xs-4">
<input type="text" name="firstname" class="form-control" minlength="2" value="{{ firstname }}" placeholder="First Name" required />
</div>
- <div class="col-xs-4"> <p class="form-hint">Enter your first name</p> </div>
+ <div class="col-xs-6"> <p class="form-hint">Enter your first name</p> </div>
</div>
<div class="form-group">
- <label for="lastname" class="col-xs-4 control-label">Last Name</label>
+ <label for="lastname" class="col-xs-2 control-label">Last Name</label>
<div class="col-xs-4">
<input type="text" name="lastname" size="25" class="form-control" minlength="2" value="{{ lastname }}" placeholder="Last Name" required />
</div>
- <div class="col-xs-4"><p class="form-hint">Enter your last name</p></div>
+ <div class="col-xs-6"><p class="form-hint">Enter your last name</p></div>
</div>
<div class="form-group">
- <label for="auth_list" class="col-xs-4 control-label">Authority</label>
+ <label for="auth_list" class="col-xs-2 control-label">Authority</label>
<div class="col-xs-4">
<select id="auth_list" name="authority_hrn" size="1" class="form-control" required>
{% if authorities %}
{% endif %}
</select>
</div>
- <div class="col-xs-4"><p class="form-hint">Please select an authority responsible for vetting your account</p></div>
+ <div class="col-xs-6"><p class="form-hint">An authority responsible for vetting your account</p></div>
</div>
<!-- LOGIN
user.
-->
<div class="form-group">
- <label for="login" class="col-xs-4 control-label">Login</label>
+ <label for="login" class="col-xs-2 control-label">Login</label>
<div class="col-xs-4">
<input type="text" name="login" size="25" class="form-control" minlength="2" value="{{ login }}" placeholder="Login" required />
</div>
- <div class="col-xs-4"><p class="form-hint">Enter your login</p></div>
+ <div class="col-xs-6"><p class="form-hint">Enter your login</p></div>
</div>
<div class="form-group">
- <label for="email" class="col-xs-4 control-label">Email</label>
+ <label for="email" class="col-xs-2 control-label">Email</label>
<div class="col-xs-4">
<input type="email" name="email" size="25" class="form-control" value="{{ email }}" required/>
</div>
- <div class="col-xs-4"><p class="form-hint">Enter a valid email address</p></div>
+ <div class="col-xs-6"><p class="form-hint">Enter a valid email address</p></div>
</div>
<div class="form-group">
- <label for="password" class="col-xs-4 control-label">Password</label>
+ <label for="password" class="col-xs-2 control-label">Password</label>
<div class="col-xs-4">
<input type="password" id="password" name="password" class="form-control" minlength="4" value="{{ password }}" required/>
</div>
- <div class="col-xs-4"><p class="form-hint">Enter password</p></div>
+ <div class="col-xs-6"><p class="form-hint">Enter password</p></div>
</div>
<div class="form-group">
- <label for="password" class="col-xs-4 control-label">Confirm Password</label>
+ <label for="password" class="col-xs-2 control-label">Confirm Password</label>
<div class="col-xs-4">
<input type="password" id="confirmpassword" name="confirmpassword" minlength="4" class="form-control"
value="" placeholder="Confirm Password" required/>
</div>
- <div class="col-xs-4"><p class="form-hint">Retype the password</p></div>
+ <div class="col-xs-6"><p class="form-hint">Retype the password</p></div>
</div>
<div class="form-group">
- <label for="question" class="col-xs-4 control-label">My Keys</label>
+ <label for="question" class="col-xs-2 control-label">My Keys</label>
<div class="col-xs-4">
<select name="question" class="form-control" id="key-policy" required>
<option value="generate">Generate key pairs for me </option>
<option value="upload">Upload my public key </option>
</select>
</div>
- <div class="col-xs-4"><p class="form-hint">Genkey: Account Delegation Automatic (Recommended)</p> </div>
+ <div class="col-xs-6"><p class="form-hint">Genkey: Account Delegation Automatic (Recommended)</p> </div>
</div>
<div class="form-group" style="display:none;" id="upload_key">
- <label for="file" class="col-xs-4 control-label">Upload public key</label>
+ <label for="file" class="col-xs-2 control-label">Upload public key</label>
<div class="col-xs-4">
<input type="file" name="user_public_key" class="form-control" id="user_public_key" required/>
<p class="warning" id="pkey_del_msg">Once your account is validated, you will have to delegate your credentials manually using SFA [Advanced users only]</p>
</div>
- <div class="col-xs-4"><p class="form-hint">Account Delegation: Manual (Advanced Users)</p></div>
+ <div class="col-xs-6"><p class="form-hint">Account Delegation: Manual (Advanced Users)</p></div>
</div>
<div class="form-group" id="register">
- <button class="submit btn btn-default col-md-offset-4 col-xs-4" type="submit">Register</button>
+ <button class="submit btn btn-default col-xs-12" type="submit">Register</button>
</div>
</div>
</fieldset>
<fieldset>
{% for field in form %}
<div class="form-group">
- <label for="{{ field.html_name }}" class="col-xs-4 control-label">{{ field.label }}</label>
+ <label for="{{ field.html_name }}" class="col-xs-2 control-label">{{ field.label }}</label>
<div class="col-xs-4"> {{ field.errors }} {{ field }} </div>
- <div class="col-xs-4"> <p class="form-hint">{{ field.help_text }}</p> </div>
+ <div class="col-xs-6"> <p class="form-hint">{{ field.help_text }}</p> </div>
</div>
{% endfor %}
- <button class="submit btn btn-default col-md-offset-4 col-xs-4" type="submit">Request Slice</button>
+ <button class="submit btn btn-default col-xs-12" type="submit">Request Slice</button>
</fieldset>
</form>
</div>
{{ header_prelude }}
{% block head %} {% endblock head %}
</head>{# let's add these ones no matter what #}
-{% insert_str prelude "css/layout-unfold2.css" %}
{% insert_str prelude "js/jquery.min.js" %}
{% insert_str prelude "js/jquery.html5storage.min.js" %}
{% insert_str prelude "js/messages-runtime.js" %}
{% insert_str prelude "js/plugin.js" %}
{% insert_str prelude "js/manifold.js" %}
{% insert_str prelude "js/topmenu.js" %}
+{% insert_str prelude "css/layout-unfold2.css" %}
{% insert_str prelude "css/manifold.css" %}
+{% insert_str prelude "css/plugin.css" %}
+{% insert_str prelude "css/onelab_marko.css" %}
<body>
{% block container %}
{% block topmenu %}
# queue of queries with maybe a domid, see enqueue_query
self._queue=[]
# global prelude object
- self.prelude=Prelude(css_files=[
- 'css/plugin.css','css/onelab_marko.css',])
+# self.prelude=Prelude(css_files=['css/plugin.css','css/onelab_marko.css',])
+ self.prelude=Prelude()
# record known plugins hashed on their domid
def record_plugin (self, plugin):
.container {
padding: 0 !important;
- color: #fff;
+/* color: #fff; */
}
.container h1 {