style user selection by bootstrap

This commit is contained in:
jelhan 2014-05-29 04:23:59 +02:00
parent f0895f94c4
commit 3a09883d5e
2 changed files with 124 additions and 103 deletions

View file

@ -1,3 +1,10 @@
/* bootstrap overwrites */
table tr td .form-group {
/* remove bootstrap default margin-bottom for form elements in table */
margin-bottom: 0;
}
/* elements */
body {
background-color: #D3D3D3;
}
@ -17,29 +24,30 @@ body {
margin-top: 0;
}
.index .start,
.index .have-a-try {
/* page: poll */
#poll .index .start,
#poll .index .have-a-try {
font-size: 150%;
}
.meta-data .description {
#poll .meta-data .description {
white-space: pre-wrap;
}
.meta-data .creationDate {
#poll .meta-data .creationDate {
color: grey;
}
.share-link .link {
#poll .share-link .link {
color: #556B2F;
}
.share-link .notice {
#poll .share-link .notice {
font-size: 90%;
color: grey;
}
.table-scroll {
#poll .table-scroll {
/* übernommen von .table-responsive von bootstrap, aber grundsätzlich */
width: 100%;
margin-bottom: 15px;
@ -50,26 +58,26 @@ body {
-webkit-overflow-scrolling: touch;
}
.evaluation-header {
#poll .evaluation-header {
font-weight: bold;
}
tbody td .yes,
tfoot td option[value="yes"] {
#poll tbody td .yes,
#poll tfoot td option[value="yes"] {
color: green;
}
tbody td .no,
tfoot td option[value="no"]{
#poll tbody td .no,
#poll tfoot td option[value="no"]{
color: red;
}
tbody td .maybe,
tfoot td option[value="maybe"] {
#poll tbody td .maybe,
#poll tfoot td option[value="maybe"] {
color: orange;
}
/* loading page */
/* page: loading */
#loading {
letter-spacing: 5px;
}

View file

@ -115,6 +115,7 @@
<!-- poll template -->
<script type="text/x-handlebars" id="poll">
<div id="poll">
<div class="row">
<div class="col-sm-6 col-lg-5">
<div class="box meta-data">
@ -158,26 +159,37 @@
<tbody>
<tr class='newUser'>
<form role="form">
<td>
{{input value=view.newUserName placeholder="Enter your name..."}}
<div class="form-group">
{{input value=view.newUserName placeholder="Enter your name..." class="form-control"}}
</div>
</td>
{{#each newUserSelection in view.newUserSelections}}
<td>
{{#if isFreeText}}
{{input value=newUserSelection.value}}
<div class="form-group">
{{input value=newUserSelection.value class="form-control"}}
</div>
{{else}}
<div >
{{view Ember.Select
contentBinding="answers"
optionValuePath="content.label"
optionLabelPath="content.label"
prompt="choose an answer"
valueBinding="newUserSelection.value"}}
valueBinding="newUserSelection.value"
class="form-control"}}
</div>
{{/if}}
</td>
{{/each}}
<td>
<button {{action "addNewUser" target="view" class="btn btn-default"}}> save </button>
<div class="form-group">
<button {{action "addNewUser" target="view"}} class="btn btn-default"> save </button>
</div>
</td>
</form>
</tr>
{{#each user in users}}
@ -221,6 +233,7 @@
</table>
</div>
</div>
</div>
</script>
<!-- create templates -->