Problem/Motivation
Several places in Claro use the regular size for input fields and take a lot of vertical space.
Proposed resolution
As we have for buttons, we need smaller and more compact input and selects for smaller forms like the content page filter or the people page filter.
Input full specs: https://www.figma.com/file/OqWgzAluHtsOd5uwm1lubFeH/Drupal-Design-system...
Select full specs: https://www.figma.com/file/OqWgzAluHtsOd5uwm1lubFeH/Drupal-Design-system...
Remaining tasks
Create designsCreate specs- Create styles for smaller inputs/selects.
- It should be possible to target a single element by adding a class to that element
- It should also be possible to target all elements within a form by adding a single class to the form. Although button variants already exist, button CSS will need updating to allow variant-styling based on a parent class such as
.form--small
- Implement it on views filters and textarea formatting select.
User interface changes
Some forms will result on taking less space.
Testing instructions
Small size:
- Filters for the following lists:
/admin/content
/admin/people
Extra Small size:
Textarea formatting select
node/add/page