Sarai-WMDE created this task. Sarai-WMDE added a project: Wikidata Design System. Restricted Application added a subscriber: Aklapper. Restricted Application added a project: Wikidata.
TASK DESCRIPTION Build a dropdown component in Vue.js that follows the system's design specs <https://www.figma.com/file/gi3JYwSUQYhKS0mHwK25cQwi/WiKit-%F0%9F%94%A5?node-id=2202%3A338> and that accommodates component-level design tokens <https://docs.google.com/spreadsheets/d/1Od9m25uBMMmbPirazvwYQl8QVyx0FSm0Eo0jIMj4_no/edit#gid=2059244374&range=358:358>. Component sizes: Medium min-height: 32px Large min-height: 40px Small width: 128px Medium (dfault) width: 256px Large width: 384px F31857772: dropdown_sizes.png <https://phabricator.wikimedia.org/F31857772> Component states: - Default - Hover - Focus/active - Disabled F31857776: dropdown_status.png <https://phabricator.wikimedia.org/F31857776> **To be decided**: - For now (and until the size of the base font can be modified to 16px everywhere), the size of the dropdown text and label should remain 14px (with a 20px line-height). We should take advantage of tokens to centralize this change. - Should we include widths as modifiers? And if so, should one of those modifiers be "full-width" (note: full-width is only available for size L components, since this is to adjust them to mobile)? - Should inline validation be part of this story? F31857781: dropdown_error.png <https://phabricator.wikimedia.org/F31857781> TASK DETAIL https://phabricator.wikimedia.org/T254732 WORKBOARD https://phabricator.wikimedia.org/project/board/4521/ EMAIL PREFERENCES https://phabricator.wikimedia.org/settings/panel/emailpreferences/ To: Sarai-WMDE Cc: Aklapper, Sarai-WMDE, darthmon_wmde, Nandana, Lahi, Gq86, GoranSMilovanovic, QZanden, LawExplorer, _jensen, rosalieper, Scott_WUaS, Volker_E, Wikidata-bugs, aude, Mbch331
_______________________________________________ Wikidata-bugs mailing list Wikidata-bugs@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/wikidata-bugs
