mummert/survey-bundle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix survey reader back flow

Browse Source
This commit is contained in:
Jürgen Mummert
2026-06-08 20:14:57 +02:00
parent e3553e1108
commit 79c4402aee
3 changed files with 101 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files
contao/templates/frontend/_survey_assets.html.twig
+77
View File
@@ -466,6 +466,29 @@
align-items: center;
}
.survey-button-row--navigation {
width: 100%;
justify-content: flex-end;
align-items: center;
margin-top: 1rem;
}
.survey-button-row--navigation.has-back {
justify-content: space-between;
}
.survey-navigation-form {
margin: 0;
}
.survey-navigation-form--back {
margin: 0;
}
.survey-navigation-submit {
margin-left: auto;
}
.survey-publish-toggle-form {
margin: 0;
}
@@ -843,6 +866,56 @@
color: var(--survey-green);
}
.survey-range-block {
gap: 1rem;
}
.survey-range-value-card {
display: grid;
place-items: center;
gap: 0.2rem;
width: min(100%, 8.5rem);
min-height: 8.5rem;
margin-inline: auto;
padding: 1rem;
border-radius: 50%;
background: radial-gradient(circle at top left, rgba(0, 100, 173, 0.12), rgba(255, 255, 255, 0.96) 62%, rgba(236, 124, 50, 0.16) 100%);
border: 1px solid rgba(0, 100, 173, 0.16);
box-shadow: 0 10px 24px rgba(34, 34, 34, 0.08);
text-align: center;
}
.survey-range-value-label {
font-size: 0.8rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--survey-gray-dark);
}
.survey-range-scale {
display: flex;
justify-content: space-between;
align-items: center;
gap: 1rem;
width: 100%;
}
.survey-range-boundary {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.75rem;
min-height: 2.75rem;
padding: 0.45rem 0.7rem;
border-radius: 999px;
background: rgba(255, 255, 255, 0.82);
border: 1px solid rgba(0, 100, 173, 0.14);
color: var(--survey-blue);
font-weight: 700;
box-shadow: 0 6px 16px rgba(34, 34, 34, 0.05);
}
@media (min-width: 960px) {
.survey-grid-columns {
grid-template-columns: 0.95fr 1.05fr;
@@ -880,6 +953,10 @@
align-items: flex-start;
}
.survey-button-row--navigation.has-back {
justify-content: space-between;
}
.survey-list-publish-help {
left: 0;
right: auto;
contao/templates/frontend/show_survey.html.twig
+22 -19
View File
@@ -52,20 +52,7 @@
<h3>{{ question.question|striptags|trim }}</h3>
{% if question.description|striptags|trim %}<p>{{ question.description|striptags|trim }}</p>{% endif %}
{% if canGoBack %}
<form method="post" class="survey-button-row survey-button-row--navigation">
<input type="hidden" name="REQUEST_TOKEN" value="{{ contao.request_token }}">
<input type="hidden" name="_survey_navigation" value="back">
<input type="hidden" name="_navigation_token" value="{{ csrf_token((isPreview ? 'survey-preview-back-' : 'survey-back-') ~ survey.id) }}">
{% if isPreview %}
<input type="hidden" name="preview_question" value="{{ question.id }}">
<input type="hidden" name="preview_history" value="{{ historyState }}">
{% endif %}
<button type="submit" class="survey-button secondary">{{ 'survey.survey.back'|trans }}</button>
</form>
{% endif %}
{{ form_start(surveyForm, {attr: {class: 'survey-form-grid'}}) }}
{{ form_start(surveyForm, {attr: {class: 'survey-form-grid', id: 'survey-answer-form-' ~ question.id}}) }}
<input type="hidden" name="REQUEST_TOKEN" value="{{ contao.request_token }}">
{% if isPreview %}
<input type="hidden" name="preview_question" value="{{ question.id }}">
@@ -89,21 +76,37 @@
{% endfor %}
</div>
{% elseif question.type == 'range' %}
<div class="survey-grid">
<div class="survey-card">
<div>{{ 'survey.survey.current_value'|trans }}</div>
<div class="survey-grid survey-range-block">
<div class="survey-range-value-card">
<div class="survey-range-value-label">{{ 'survey.survey.current_value'|trans }}</div>
<div id="survey-range-output-{{ question.id }}" class="survey-range-output">{{ question.rangeMin }}</div>
</div>
{{ form_widget(surveyForm.answer, {attr: {'data-survey-range': '1', 'data-survey-range-target': 'survey-range-output-' ~ question.id}}) }}
<div class="survey-meta"><span>{{ question.rangeMin }}</span><span>{{ question.rangeMax }}</span></div>
<div class="survey-range-scale"><span class="survey-range-boundary">{{ question.rangeMin }}</span><span class="survey-range-boundary">{{ question.rangeMax }}</span></div>
</div>
{% else %}
{{ form_widget(surveyForm.answer) }}
{% endif %}
{{ form_errors(surveyForm.answer) }}
<div class="survey-button-row"><button class="survey-button primary">{{ 'survey.survey.next'|trans }}</button></div>
{{ form_end(surveyForm) }}
<div class="survey-button-row survey-button-row--navigation{{ canGoBack ? ' has-back' : '' }}">
{% if canGoBack %}
<form method="post" class="survey-navigation-form survey-navigation-form--back">
<input type="hidden" name="REQUEST_TOKEN" value="{{ contao.request_token }}">
<input type="hidden" name="_survey_navigation" value="back">
<input type="hidden" name="_navigation_token" value="{{ csrf_token((isPreview ? 'survey-preview-back-' : 'survey-back-') ~ survey.id) }}">
{% if isPreview %}
<input type="hidden" name="preview_question" value="{{ question.id }}">
<input type="hidden" name="preview_history" value="{{ historyState }}">
{% endif %}
<button type="submit" class="survey-button secondary">{{ 'survey.survey.back'|trans }}</button>
</form>
{% endif %}
<button type="submit" form="{{ 'survey-answer-form-' ~ question.id }}" class="survey-button primary survey-navigation-submit">{{ 'survey.survey.next'|trans }}</button>
</div>
</article>
{% endif %}
{% endif %}