Commit 848a06fd authored by Naomi Guyer's avatar Naomi Guyer Committed by Aaron Wells

Form fixes (bootstrap)

Bug 1465107: Use Bootstrap CSS Framework

Change-Id: I353a0945dfea3df6f6f9331dc38b33b85ca789b7
parent c788fbb8
......@@ -152,7 +152,7 @@ class PluginBlocktypeBlog extends PluginBlocktype {
$elements[] = array(
'type' => 'html',
'name' => 'notice',
'value' => '<div class="message">' . get_string('blogcopiedfromanotherview', 'artefact.blog', get_string('blog', 'artefact.blog')) . '</div>',
'value' => '<div class="metadata">' . get_string('blogcopiedfromanotherview', 'artefact.blog', get_string('blog', 'artefact.blog')) . '</div>',
);
}
return $elements;
......
......@@ -133,7 +133,7 @@ class PluginBlocktypeBlogpost extends PluginBlocktype {
$elements[] = array(
'type' => 'html',
'name' => 'notice',
'value' => '<div class="message">' . get_string('blogcopiedfromanotherview', 'artefact.blog', get_string('blogpost', 'artefact.blog')) . '</div>',
'value' => '<div class="metadata">' . get_string('blogcopiedfromanotherview', 'artefact.blog', get_string('blogpost', 'artefact.blog')) . '</div>',
);
}
return $elements;
......
......@@ -56,7 +56,7 @@ $elements = array(
),
'includefeedback' => array(
'type' => 'checkbox',
'class' => 'checkbox',
'class' => 'checkbox last',
'title' => get_string('includefeedback', 'export'),
'description' => get_string('includefeedbackdescription', 'export'),
'separator' => '</div><div>',
......
......@@ -89,6 +89,7 @@ function print_upload_form() {
'elements' => array(
'leap2afile' => array(
'type' => 'file',
'class' => 'last',
'title' => get_string('uploadleap2afile', 'admin'),
'rules' => array(
'required' => true
......
......@@ -65,7 +65,7 @@ function pieform_element_expiry(Pieform $form, $element) {/*{{{*/
// @todo probably create with an actual input element, as tabindex doesn't work here for one thing
// Same with the select. And do the events using mochikit signal instead of dom events
$numberinput = '<input';
$numberinput = '<input class="form-control"';
$numberinput .= ($values['units'] == 'noenddate' && empty($element['rules']['required'])) ? ' disabled="disabled"' : '';
$numberinput .= ' type="text" size="4" name="' . $name . '"';
$numberinput .= ' id="' . $formname . '_' . $name . '" value="' . Pieform::hsc($values['number']) . '" tabindex="' . Pieform::hsc($element['tabindex']) . '"';
......@@ -74,7 +74,7 @@ function pieform_element_expiry(Pieform $form, $element) {/*{{{*/
}
$numberinput .= (isset($element['error']) ? ' class="error"' : '') . ">\n";
$uselect = '<label for="' . $formname . '_' . $name . '_units" class="accessible-hidden sr-only">' . get_string('units', 'mahara') . '</label>';
$uselect .= '<select onchange="' . $name . '_change()" ';
$uselect .= '<select class="form-control" onchange="' . $name . '_change()" ';
$uselect .= 'name="' . $name . '_units" id="' . $formname . '_' . $name . '_units"' . ' tabindex="' . Pieform::hsc($element['tabindex']) . '"';
if (isset($element['description'])) {
$uselect .= ' aria-describedby="' . $form->element_descriptors($element) . '"';
......
......@@ -98,7 +98,7 @@ function pieform_element_select(Pieform $form, $element) {
return $result;
}
$result = '<select'
$result = '<span class="picker"><select'
. $form->element_attributes($element)
. (!empty($element['multiple']) ? ' multiple="multiple"' : '')
. (!empty($element['allowother']) ? ' onChange="pieform_select_other(this);"' : '')
......@@ -106,7 +106,7 @@ function pieform_element_select(Pieform $form, $element) {
. (!empty($element['height']) ? ' height: ' . $element['height'] . 'px;"' : '"')
. ">\n";
if (!$optionsavailable) {
$result .= "\t<option></option>\n</select>";
$result .= "\t<option></option>\n</select></span>";
return $result;
}
......@@ -140,7 +140,7 @@ function pieform_element_select(Pieform $form, $element) {
Pieform::info('Invalid value for select "' . $element['name'] .'"');
}
$result .= '</select>';
$result .= '</select></span>';
if (!empty($element['allowother'])) {
$other_attrib = array(
......
......@@ -3818,7 +3818,9 @@ function build_pagination($params) {
$output .= '">';
// Output the count of results
$resultsstr = ($params['count'] == 1) ? $params['resultcounttextsingular'] : $params['resultcounttextplural'];
$output .= '<div class="results pull-right">' . $params['count'] . ' ' . $resultsstr . '</div>';
if($params['count'] > 0){
$output .= '<div class="lead text-small results pull-right">' . $params['count'] . ' ' . $resultsstr . '</div>';
}
$output .= '<nav><ul class="pagination pagination-xs">';
......
......@@ -9,6 +9,8 @@ css_dir = "style"
sass_dir = "sass"
images_dir = "images"
add_import_path "../../raw"
# You can select your preferred output style here (can be overridden via the command line) :nested or :expanded or :compact or :compressed:
output_style = :expanded
......
// Custom component variables (non-bootstrap components)
//Arrow compoanent variables
$arrow-color: lighten(desaturate($brand-primary, 22%), 43%);
$arrow-color: lighten(desaturate($brand-primary, 22%), 73%);
$arrow-text-color: $text-color;
$arrow-link-color: $link-color;
$arrow-link-hover-color: $text-color;
......
......@@ -11074,11 +11074,6 @@ table.table tr .with-checkbox input {
}
/* line 35, ../../../raw/static/sass/typography/_text.scss */
.text-thin {
font-weight: 300;
}
/* line 39, ../../../raw/static/sass/typography/_text.scss */
.text-inline {
display: inline-block;
}
......@@ -12907,7 +12902,7 @@ label .col-collapse,
/* line 79, ../../../raw/static/sass/form/_form.scss */
.no-radio {
margin-left: 19px;
margin-left: 16px;
}
/* line 84, ../../../raw/static/sass/form/_form.scss */
......@@ -12966,11 +12961,10 @@ label .col-collapse,
padding: 0;
border: 0;
}
/* line 25, ../../../raw/static/sass/form/_form-group.scss */
/* line 26, ../../../raw/static/sass/form/_form-group.scss */
.form-group .message {
font-size: 0.9em;
color: #555555;
margin-left: 20px;
}
/* line 31, ../../../raw/static/sass/form/_form-group.scss */
.form-inline .form-group {
......@@ -13000,32 +12994,32 @@ label .col-collapse,
.form-group.last {
border: 0;
}
/* line 53, ../../../raw/static/sass/form/_form-group.scss */
.form-notifications .form-group .select {
width: 250px;
}
/* line 60, ../../../raw/static/sass/form/_form-group.scss */
/* line 55, ../../../raw/static/sass/form/_form-group.scss */
.form-group.login input[type=text], .form-group.login input[type=password] {
max-width: 100%;
}
/* line 67, ../../../raw/static/sass/form/_form-group.scss */
/* line 62, ../../../raw/static/sass/form/_form-group.scss */
.form-group.input-small, .form-group.input-group, .form-group:last-child {
border: 0;
}
/* line 73, ../../../raw/static/sass/form/_form-group.scss */
/* line 68, ../../../raw/static/sass/form/_form-group.scss */
.form-group.tab-pane, .form-group.collapsible-group {
border: 0;
padding: 0;
}
/* line 80, ../../../raw/static/sass/form/_form-group.scss */
/* line 75, ../../../raw/static/sass/form/_form-group.scss */
.form-group.checkboxes .btn-group {
margin: 10px 0;
display: block;
}
/* line 84, ../../../raw/static/sass/form/_form-group.scss */
/* line 79, ../../../raw/static/sass/form/_form-group.scss */
.form-group.checkboxes input[type=checkbox] {
margin-left: 0;
}
/* line 83, ../../../raw/static/sass/form/_form-group.scss */
.form-group.checkboxes.stacked .checkboxes-option {
margin-left: 0;
}
/* line 87, ../../../raw/static/sass/form/_form-group.scss */
.form-group.checkboxes .checkboxes-option {
margin-left: 265px;
......@@ -13623,6 +13617,44 @@ label .col-collapse,
min-width: 0;
}
/* line 73, ../../../raw/static/sass/form/_dropdown-group.scss */
.picker {
position: relative;
background: #fff;
display: inline-block;
width: 230px;
}
/* line 78, ../../../raw/static/sass/form/_dropdown-group.scss */
.picker:before {
content: "\25BE";
font-family: "FontAwesome";
margin-top: 9px;
position: absolute;
right: 0%;
top: 0;
z-index: 0;
height: 17px;
padding-left: 10px;
padding-right: 10px;
line-height: 16px;
z-index: 2;
}
/* line 92, ../../../raw/static/sass/form/_dropdown-group.scss */
.picker select {
-webkit-appearance: none;
background: transparent;
height: 35px;
left: 0;
margin: 0;
outline: none;
padding-right: 50px;
cursor: pointer;
top: 0;
width: 100%;
max-width: 100%;
z-index: 5;
}
/* line 1, ../../../raw/static/sass/components/_arrow-bar.scss */
.arrow-bar {
-moz-border-radius: 3px;
......@@ -13635,7 +13667,7 @@ label .col-collapse,
color: #fff;
display: block;
width: 100%;
background-color: #adadad;
background-color: #fafafa;
}
/* line 12, ../../../raw/static/sass/components/_arrow-bar.scss */
.arrow-bar .right-text,
......@@ -13661,7 +13693,7 @@ label .col-collapse,
float: left;
position: relative;
display: block;
background-color: #a1a1a1;
background-color: #ededed;
width: 25%;
}
@media (max-width: 992px) {
......@@ -13673,7 +13705,7 @@ label .col-collapse,
/* line 43, ../../../raw/static/sass/components/_arrow-bar.scss */
.arrow-bar .arrow:after {
border-bottom: 29px solid transparent;
border-left: 14px solid #a1a1a1;
border-left: 14px solid #ededed;
border-top: 30px solid transparent;
content: "";
height: 40px;
......@@ -14961,36 +14993,31 @@ h4.list-group-item-heading {
}
/* line 2, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .results {
font-weight: 300;
font-size: 12px;
}
/* line 6, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .pagination {
margin: 0 0 10px 0;
padding-left: 0;
}
@media (max-width: 768px) {
/* line 6, ../../../raw/static/sass/components/_pagination.scss */
/* line 2, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .pagination {
padding-top: 10px;
}
/* line 11, ../../../raw/static/sass/components/_pagination.scss */
/* line 7, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .pagination .hidden-xs {
display: none;
}
}
@media (max-width: 992px) {
/* line 6, ../../../raw/static/sass/components/_pagination.scss */
/* line 2, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .pagination {
max-width: 500px;
}
}
/* line 19, ../../../raw/static/sass/components/_pagination.scss */
/* line 15, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .form-pagination {
font-size: 12px;
}
/* line 21, ../../../raw/static/sass/components/_pagination.scss */
/* line 17, ../../../raw/static/sass/components/_pagination.scss */
.pagination-wrapper .form-pagination label {
min-width: inherit;
}
......
......@@ -33,7 +33,7 @@
{literal}}{/literal});
</script>
{else}
<div class="message">
<div class="metadata">
{str tag=nopostsyet section=artefact.blog} {if !$blog->get('locked')}<a href="{$WWWROOT}artefact/blog/post.php?blog={$blog->get('id')}">{str tag=addone section=mahara}</a>{/if}
</div>
{/if}
......
......@@ -67,15 +67,16 @@
{if $options.viewid && ($post->commentcount || $post->commentcount === 0)}
<div class="comments clearfix ptm mts">
{if $post->commentcount > 0}
<a id="block_0{$post->id}{$options.blockid}" class="commentlink text-thin pull-left" href="{$WWWROOT}artefact/artefact.php?artefact={$post->id}&view={$options.viewid}">{str tag=Comments section=artefact.comment} ({$post->commentcount})</a>
<a id="block_0{$post->id}{$options.blockid}" class="commentlink text-small lead pull-left" href="{$WWWROOT}artefact/artefact.php?artefact={$post->id}&view={$options.viewid}">{str tag=Comments section=artefact.comment} ({$post->commentcount})</a>
{else}
{if $allowcomments}
<span class="nocomments text-thin pull-left">{str tag=Comments section=artefact.comment} ({$post->commentcount})</span>
<span class="nocomments text-small lead pull-left">{str tag=Comments section=artefact.comment} ({$post->commentcount})</span>
{/if}
{if $post->allowcomments}
<p class="text-right">
<a class="addcomment text-thin" href="{$WWWROOT}artefact/artefact.php?artefact={$post->id}&view={$options.viewid}">
<span class="fa fa-lg fa-plus text-success prs"></span>
<a class="addcomment text-small lead" href="{$WWWROOT}artefact/artefact.php?artefact={$post->id}&view={$options.viewid}">
<span class="icon icon-lg icon-plus text-success prs"></span>
{str tag=addcomment section=artefact.comment}
</a>
</p>
......
......@@ -59,7 +59,7 @@
</a>
{/if}
{else}
<span class="text-thin">
<span class="lead text-small">
{str tag=emptyfolder section=artefact.file}
</span>
{/if}
......
......@@ -14,7 +14,7 @@
{/if}
{if !$tasks.data}
<div>{$planstasksdescription}</div>
<div class="message">{$strnotasksaddone|safe}</div>
<div class="metadata">{$strnotasksaddone|safe}</div>
{else}
<div class="table-responsive">
<table id="taskslist" class="listing table table-striped text-small">
......
......@@ -4,7 +4,7 @@
<a class="btn btn-success" href="{$WWWROOT}artefact/plans/new/task.php">{str section="artefact.plans" tag="newtask"}</a>
</div>
{if !$tasks.data}
<div class="message">{$strnotasksaddone|safe}</div>
<div class="metadata">{$strnotasksaddone|safe}</div>
{else}
<table id="planslist">
<thead>
......
......@@ -12,7 +12,7 @@
{/if}
{if $item.tags}
<div class="tags">
<span class="text-thin">{str tag=tags}:</span>
<span class="lead text-small">{str tag=tags}:</span>
{list_tags owner=$item.owner tags=$item.tags}
</div>
{/if}
......@@ -20,6 +20,8 @@
{/foreach}
</div>
{else}
{str tag='noviewstosee' section='group'}
<div class="panel-body">
<p class="lead text-small">{str tag='noviewstosee' section='group'}</p>
</div>
{/if}
......@@ -60,6 +60,6 @@
</div>
{else}
<div class="panel-body">
<p class="text-thin text-small">{str tag=noviews section=view}</p>
<p class="lead text-small">{str tag=noviews section=view}</p>
</div>
{/if}
......@@ -102,7 +102,7 @@
</table>
</div>
{else}
<div class="message">
<div class="">
{str tag=noforums section=interaction.forum}
</div>
{/if}
......
......@@ -32,7 +32,7 @@
<hr class="mbxl" />
{if $topic->closed}
<div class="message closed">
<div class=" closed">
{str tag=topicisclosed section=interaction.forum}
</div>
......
......@@ -27,7 +27,7 @@ EOF;
echo $form_tag;
echo '<h2 class="mtxl ptxl">' . get_string('chooseanexportformat', 'export') . '</h2>';
echo '<h2 class="ptm">' . get_string('chooseanexportformat', 'export') . '</h2>';
echo '<div class="element form-group" id="exportformat-buttons">';
echo '<div>' . $elements['format']['html'] . '</div>';
echo '</div>';
......@@ -116,7 +116,7 @@ if ($body) {
echo '</fieldset></div>';
}
echo '<div id="includefeedback" class="form-group checkbox">';
echo '<div id="includefeedback" class="form-group checkbox last">';
echo $elements['includefeedback']['html'] . ' <span class="">' . $elements['includefeedback']['labelhtml'] .'</span>';
echo '<div class="description">' . $elements['includefeedback']['description'] . '</div>';
echo '</div>';
......
<div class="message">
<div class="alert alert-default">
{if $header}<h3>{$header}</h3>{/if}
<p>{$notice|safe}</p>
</div>
\ No newline at end of file
......@@ -46,7 +46,7 @@
{/foreach}
{elseif $query}
<div class="emptyresults">
<div class="message">{str tag=nosearchresultsfound section=group}</div>
<div class="lead text-small">{str tag=nosearchresultsfound section=group}</div>
</div>
{/if}
</div>
......
.pagination-wrapper {
.results {
font-weight: 300;
font-size: $font-size-small;
}
.pagination {
margin: 0 0 10px 0;
padding-left: 0;
......
......@@ -69,3 +69,38 @@ $height: 35px;
}
}
.picker {
position: relative;
background: #fff;
display: inline-block;
width: 230px;
&:before {
content: "\25BE";
font-family: "FontAwesome";
margin-top: 9px;
position: absolute;
right: 0%;
top: 0;
z-index: 0;
height: 17px;
padding-left: 10px;
padding-right: 10px;
line-height: 16px;
z-index: 2;
}
select {
-webkit-appearance: none;
background: transparent;
height: $height;
left: 0;
margin: 0;
outline: none;
padding-right: 50px;
cursor: pointer;
top: 0;
width: 100%;
max-width: 100%;
z-index: 5;
}
}
\ No newline at end of file
......@@ -22,10 +22,10 @@
padding: 0;
border: 0;
}
//used when adding email addresses to profiles (anywhere else?)
.message {
font-size: 0.9em;
color: $gray;
margin-left: 20px;
}
.form-inline & {
......@@ -49,11 +49,6 @@
&.last {
border:0;
}
.form-notifications & {
.select {
width: 250px;
}
}
&.login {
input {
......@@ -84,6 +79,11 @@
input[type=checkbox] {
margin-left: 0;
}
&.stacked {
.checkboxes-option {
margin-left: 0;
}
}
.checkboxes-option {
margin-left: 265px;
display: inline-block;
......
......@@ -77,7 +77,7 @@ label,
display: inline-block;
}
.no-radio {
margin-left: 19px;
margin-left: 16px;
}
......
......@@ -32,10 +32,6 @@
font-size: $font-size-base;
}
.text-thin {
font-weight: 300;
}
.text-inline {
display: inline-block;
}
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
......@@ -17,7 +17,7 @@ GNU General Public License for more details.</p>
along with this program. If not, see <a href="http://www.gnu.org/licenses/gpl.html">http://www.gnu.org/licenses/</a>.
</div>
<div class="message">Before you install Mahara, you may want to check out the <a href="http://wiki.mahara.org/Release_Notes{if substr($releaseargs[0], -3) != 'dev'}/{$releaseargs[0]}{/if}" target="_blank">release notes</a> for this release.</div>
<div class="alert alert-info">Before you install Mahara, you may want to check out the <a href="http://wiki.mahara.org/Release_Notes{if substr($releaseargs[0], -3) != 'dev'}/{$releaseargs[0]}{/if}" target="_blank">release notes</a> for this release.</div>
<form action="{$WWWROOT}admin/upgrade.php" method="post" class="center"><input class="submit btn btn-success" type="submit" value="{str tag=installmahara section=admin}"></form>
......
......@@ -8,7 +8,7 @@
{$delete_form|safe}
{elseif $institution_form}
{if $suspended}
<div class="message">
<div class="">
<h3 class="title">{$suspended}</h2>
<div class="detail">
{if $USER->get('admin')}
......
......@@ -24,5 +24,5 @@
</tr>
{/foreach}
{else}
<tr><td><div class="message">{str tag=nopendingregistrations section=admin}</div></td></tr>
<tr><td><div class="lead text-small">{str tag=nopendingregistrations section=admin}</div></td></tr>
{/if}
{if $allowcomments}
<div class="comments mbl ptm pbl">
<a class="commentlink text-thin pull-left" id="block_{$blockid}" href="{$artefacturl}">
<a class="commentlink text-small lead pull-left" id="block_{$blockid}" href="{$artefacturl}">
{str tag=Comments section=artefact.comment} ({$commentcount})
</a>
</div>
......
{include file="header.tpl"}
{if !$form}
<div class="message">{$strnoviews|safe}</div>
<div class="lead text-small">{$strnoviews|safe}</div>
{else}
<fieldset>
<legend>{str tag=overrideaccess section=collection}</legend>
......
{include file="header.tpl"}
<div class="message delete ">
<div class=" delete ">
<p class="lead">{$message}</p>
{$form|safe}
</div>
......
......@@ -22,7 +22,7 @@
</div>
{$viewsform|safe}
{else}
<div class="message">{str tag=noviewsavailable section=collection}</div>
<div class="lead text-small">{str tag=noviewsavailable section=collection}</div>
{/if}
</div>