Footer feedback from
This component allows the user to give feedback on a page. The form records the page URL when the user clicks the Send button.
<div class="occlss-footer-feedback js-occlss-footer-feedback">
<div class="occlss-wrapper">
<div class="occlss-footer-feedback__controls js-occlss-footer-feedback-controls">
<a href="#" class="occlss-footer-feedback__link js-footer-feedback-open" aria-expanded="false" aria-controls="occlss-footer-feedback-collapsible--1" id="occlss-footer-feedback-label-collapsible--1">Is there anything wrong with this page?</a>
</div>
</div>
<div class="occlss-wrapper occlss-footer-feedback__wrapper">
<div class="occlss-footer-feedback__form-cont" aria-labelledby="occlss-footer-feedback-label-collapsible--1" id="occlss-footer-feedback-collapsible--1">
<div class="occlss-layout occlss-layout--gutter-s occlss-u-bpspace-none">
<div class="occlss-layout__col">
<div class="occlss-footer-feedback__close-cont">
<a href="#" class="js-footer-feedback-close">Close</a>
</div>
<form class="occlss-form">
<fieldset>
<legend class="occlss-form__group-title occlss-form__group-title--large">Help us improve Oxfordshire.gov.uk</legend>
<span class="occlss-form__desc-text">Don’t include any personal or financial information like your National Insurance number or credit card numbers.</span>
<div class="occlss-form-cntrls ">
<label class="occlss-form-cntrls__label " for="what-were-you-doing?">What were you doing?</label>
<input class="occlss-form-cntrls__input occlss-form-cntrls--size-450" id="what-were-you-doing?" name="" type="text">
</div>
<div class="occlss-form-cntrls ">
<label class="occlss-form-cntrls__label " for="what-went-wrong?">What went wrong?</label>
<input class="occlss-form-cntrls__input occlss-form-cntrls--size-450" id="what-went-wrong?" name="" type="text">
</div>
</fieldset>
<nav class="occlss-form__controls occlss-u-bspace-large" role="navigation">
<ul class="occlss-form__listitems">
<li class="occlss-form__controls-list-item">
<button type="submit" class="occlss-button occlss-button--primary">
Send
</button>
</li>
</ul>
</nav>
</form>
</div>
</div>
</div>
</div>
</div>
Changelog
1.0.0
- Component added