|
|
## -*- coding: utf-8 -*-
|
|
|
<%inherit file="/debug_style/index.html"/>
|
|
|
|
|
|
<%def name="breadcrumbs_links()">
|
|
|
${h.link_to(_('Style'), h.route_path('debug_style_home'))}
|
|
|
»
|
|
|
${c.active}
|
|
|
</%def>
|
|
|
|
|
|
|
|
|
<%def name="real_main()">
|
|
|
<div class="box">
|
|
|
<div class="title">
|
|
|
${self.breadcrumbs()}
|
|
|
</div>
|
|
|
|
|
|
<div class='sidebar-col-wrapper'>
|
|
|
${self.sidebar()}
|
|
|
|
|
|
<div class="main-content">
|
|
|
|
|
|
<h2>Simple form elements (Depreciated)</h2>
|
|
|
|
|
|
<p>The wrapping <code>.field</code> also gets the class
|
|
|
<code>.field-sm</code>.</p>
|
|
|
|
|
|
<p>Buttons get additional the class <code>.btn-sm</code>.</p>
|
|
|
|
|
|
|
|
|
<div class="bs-example">
|
|
|
<form method='post' action='none'>
|
|
|
<div class='form'>
|
|
|
<div class='fields'>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_input'>Example input label:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="example_input" type="text" placeholder="Example input">
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_input_ro'>Example input readonly:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="example_input_ro" type="text" readonly="readonly" placeholder="Example input">
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_select'>Example select input:</label>
|
|
|
</div>
|
|
|
<div class="select">
|
|
|
<select id="example_select" >
|
|
|
<option value="#">${_('Templates...')}</option>
|
|
|
<option value="ga">Google Analytics</option>
|
|
|
<option value="clicky">Clicky</option>
|
|
|
<option value="server_announce">${_('Server Announcement')}</option>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<script>
|
|
|
$(document).ready(function() {
|
|
|
$('#example_select').select2({
|
|
|
containerCssClass: 'drop-menu',
|
|
|
dropdownCssClass: 'drop-menu-dropdown',
|
|
|
dropdownAutoWidth: true,
|
|
|
minimumResultsForSearch: -1
|
|
|
});
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_checkbox'>Example checkbox:</label>
|
|
|
</div>
|
|
|
<div class="checkboxes">
|
|
|
<div class="checkbox">
|
|
|
<input id="example_checkbox" type="checkbox">
|
|
|
<label for="example_checkbox">Label of the checkbox</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_checkboxes'>Example multiple checkboxes:</label>
|
|
|
</div>
|
|
|
<div class="checkboxes">
|
|
|
<div class="checkbox">
|
|
|
<input id="example_checkboxes_01" type="checkbox">
|
|
|
<label for="example_checkboxes_01">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
<div class="checkbox">
|
|
|
<input id="example_checkboxes_02" type="checkbox">
|
|
|
<label for="example_checkboxes_02">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
<div class="checkbox">
|
|
|
<input id="example_checkboxes_03" type="checkbox">
|
|
|
<label for="example_checkboxes_03">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='example_checkboxes'>Example multiple checkboxes:</label>
|
|
|
</div>
|
|
|
## TODO: johbo: This is off compared to the checkboxes
|
|
|
<div class="radios">
|
|
|
<label><input type="radio" checked="checked" value="hg.create.repository" name="default_repo_create" id="default_repo_create_hgcreaterepository">Enabled</label>
|
|
|
<label><input type="radio" value="hg.create.none" name="default_repo_create" id="default_repo_create_hgcreatenone">Disabled</label>
|
|
|
<span class="help-block">
|
|
|
Permission to allow repository creation. This includes ability to create
|
|
|
repositories in root level. If this option is disabled admin of
|
|
|
repository group can still create repositories inside that
|
|
|
repository group.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="buttons">
|
|
|
<input type="submit" value="Save" id="example_save" class="btn btn-sm">
|
|
|
<input type="reset" value="Reset" id="example_reset" class="btn btn-sm">
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h2>Help text in form elements</h2>
|
|
|
|
|
|
<div class="bs-example">
|
|
|
<form method='post' action=''>
|
|
|
<div class='form'>
|
|
|
<div class='fields'>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='02_example_input'>Example input label:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="02_example_input" type="text" placeholder="Placeholder text">
|
|
|
<span class="help-block">
|
|
|
Example help text for this input element. This help text
|
|
|
will be shown under the input element itself. It can be
|
|
|
so long that it will span multiple lines.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='02_example_checkbox'>Example checkbox with help block:</label>
|
|
|
</div>
|
|
|
<div class="checkboxes">
|
|
|
<div class="checkbox">
|
|
|
<input id="02_example_checkbox" type="checkbox">
|
|
|
<label for="02_example_checkbox">Label of the checkbox</label>
|
|
|
</div>
|
|
|
<span class="help-block">
|
|
|
Example help text for this checkbox element. This help text
|
|
|
will be shown under the checkbox element itself. It can be
|
|
|
so long that it will span multiple lines.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label>Multiple checkboxes:</label>
|
|
|
</div>
|
|
|
<div class="checkboxes">
|
|
|
<div class="checkbox">
|
|
|
<input id="02_example_checkboxes_01" type="checkbox">
|
|
|
<label for="02_example_checkboxes_01">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
<div class="checkbox">
|
|
|
<input id="02_example_checkboxes_02" type="checkbox">
|
|
|
<label for="02_example_checkboxes_02">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
<div class="checkbox">
|
|
|
<input id="02_example_checkboxes_03" type="checkbox">
|
|
|
<label for="02_example_checkboxes_03">Label of the first checkbox</label>
|
|
|
</div>
|
|
|
<span class="help-block">
|
|
|
Example help text for this checkbox element. This help text
|
|
|
will be shown under the checkbox element itself. It can be
|
|
|
so long that it will span multiple lines.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<h2>Error messages</h2>
|
|
|
|
|
|
<div class="bs-example">
|
|
|
<form method='post' action=''>
|
|
|
<div class='form'>
|
|
|
<div class='fields'>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='04_example_input'>Example input label:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="04_example_input" type="text" placeholder="Example input"/>
|
|
|
<span class="error-message">
|
|
|
If form validation fails, some input fields can show an
|
|
|
error message close to the field.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<h2>Fields with buttons</h2>
|
|
|
|
|
|
<div class="bs-example">
|
|
|
<form method='post' action=''>
|
|
|
<div class='form'>
|
|
|
<div class='fields'>
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='05_example_input'>Example input label:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="05_example_input" type="text" readonly="readonly" placeholder="Example input">
|
|
|
<span class="btn action_button btn-x">
|
|
|
<i class="icon-remove"></i>
|
|
|
delete
|
|
|
</span>
|
|
|
<span class="help-block">
|
|
|
Used if there is a list of values and the user can remove
|
|
|
single entries.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<div class='field field-sm'>
|
|
|
<div class='label'>
|
|
|
<label for='05_example_input'>Example input label:</label>
|
|
|
</div>
|
|
|
<div class='input'>
|
|
|
<input id="05_example_input" type="text" readonly="readonly" placeholder="Example input">
|
|
|
<span title="Click to unlock. You must restart RhodeCode in order to make this setting take effect."
|
|
|
class="tooltip" id="path_unlock"
|
|
|
tt_title="Click to unlock. You must restart RhodeCode in order to make this setting take effect.">
|
|
|
<div class="btn btn-default">
|
|
|
<span><i class="icon-lock" id="path_unlock_icon"></i></span>
|
|
|
</div>
|
|
|
</span>
|
|
|
<span class="help-block">
|
|
|
Used together with locked fields, the user has to first
|
|
|
unlock and afterwards it is possible to change the value.
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</div> <!-- .main-content -->
|
|
|
</div> <!-- .box -->
|
|
|
</%def>
|
|
|
|
