UX: Improve layout of poll builder modal
This commit is contained in:
parent
24877a7b8c
commit
78500fb770
|
@ -19,13 +19,13 @@
|
||||||
|
|
||||||
{{#if showMinMax}}
|
{{#if showMinMax}}
|
||||||
<div class="input-group poll-number">
|
<div class="input-group poll-number">
|
||||||
{{input-tip validation=minMaxValueValidation}}
|
|
||||||
<label class="input-group-label">{{i18n 'poll.ui_builder.poll_config.min'}}</label>
|
<label class="input-group-label">{{i18n 'poll.ui_builder.poll_config.min'}}</label>
|
||||||
{{input type='number'
|
{{input type='number'
|
||||||
value=pollMin
|
value=pollMin
|
||||||
valueAttribute="value"
|
valueAttribute="value"
|
||||||
class="poll-options-min"}}
|
class="poll-options-min"}}
|
||||||
</div>
|
</div>
|
||||||
|
{{input-tip validation=minMaxValueValidation}}
|
||||||
|
|
||||||
|
|
||||||
<div class="input-group poll-number">
|
<div class="input-group poll-number">
|
||||||
|
@ -44,8 +44,8 @@
|
||||||
valueAttribute="value"
|
valueAttribute="value"
|
||||||
min="1"
|
min="1"
|
||||||
class="poll-options-step"}}
|
class="poll-options-step"}}
|
||||||
{{input-tip validation=minStepValueValidation}}
|
|
||||||
</div>
|
</div>
|
||||||
|
{{input-tip validation=minStepValueValidation}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
{{/if}}
|
{{/if}}
|
||||||
|
|
||||||
|
@ -53,8 +53,8 @@
|
||||||
<div class="input-group poll-textarea">
|
<div class="input-group poll-textarea">
|
||||||
<label>{{i18n 'poll.ui_builder.poll_options.label'}}</label>
|
<label>{{i18n 'poll.ui_builder.poll_options.label'}}</label>
|
||||||
{{textarea value=pollOptions autocomplete="discourse"}}
|
{{textarea value=pollOptions autocomplete="discourse"}}
|
||||||
{{input-tip validation=minNumOfOptionsValidation}}
|
|
||||||
</div>
|
</div>
|
||||||
|
{{input-tip validation=minNumOfOptionsValidation}}
|
||||||
{{/unless}}
|
{{/unless}}
|
||||||
|
|
||||||
<div class="input-group poll-checkbox">
|
<div class="input-group poll-checkbox">
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
|
$poll-margin: 10px;
|
||||||
|
|
||||||
.poll-ui-builder-form {
|
.poll-ui-builder-form {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
||||||
|
@ -8,31 +10,29 @@
|
||||||
|
|
||||||
.tip {
|
.tip {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
margin-bottom: $poll-margin * 1.5;
|
||||||
|
margin-top: $poll-margin / 2;
|
||||||
.input-group-label {
|
font-size: $font-down-1;
|
||||||
display: inline-block;
|
|
||||||
min-width: 55px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.poll-select {
|
.poll-select {
|
||||||
line-height: 3em;
|
margin-bottom: $poll-margin;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group-label {
|
||||||
|
min-width: 85px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.poll-number {
|
.poll-number {
|
||||||
margin: 8px 0;
|
margin: $poll-margin 0;
|
||||||
|
display: flex;
|
||||||
.tip {
|
align-items: center;
|
||||||
margin-bottom: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
input {
|
||||||
width: 70px;
|
width: 70px;
|
||||||
}
|
}
|
||||||
|
|
||||||
input + .tip {
|
|
||||||
margin-top: 4px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.poll-textarea textarea {
|
.poll-textarea textarea {
|
||||||
|
@ -42,10 +42,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.poll-select + .poll-textarea {
|
.poll-select + .poll-textarea {
|
||||||
margin-top: 12px;
|
margin-top: $poll-margin;
|
||||||
}
|
}
|
||||||
|
|
||||||
.poll-checkbox {
|
.poll-checkbox {
|
||||||
margin-top: 4px;
|
margin-top: $poll-margin / 2;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue