v5 Form items
Standard
Checkbox
Expanding input
Expanding password input
Switch
Range slider
Text input
Please enter your first name as it appears on official documents, such as your passport, birth certificate, or driving licence.
Select
Please select which country you were born in.
Help for country of birth
Address
Form pair
Container with actions
Filter buttons
Muted
Checkbox
Chic
Search for Courses
Filters bar
Solid
Minimal
Select: inline, compact, icon
Select: inline, compact, icon
These two select elements have been set to resize on load and on change, using UCASDesignFramework.size.resizeElementToContentWidth().
This function takes two arguments: the select element itself and an optional amount of extra padding, in pixels, to be added to the width, to account for things like icons or padding within the select.
var selectElements = document.querySelectorAll('#select-inline-compact-icon select')
selectElements.forEach(function (selectElement) {
UCASDesignFramework.size.resizeElementToContentWidth(selectElement, 32)
selectElement.addEventListener('change', function () {
UCASDesignFramework.size.resizeElementToContentWidth(selectElement, 32)
})
})