Ts filters #624
Ts filters #624
Conversation
There was a problem hiding this comment.
Looks good, everything seems to work fine.
The color bubble around the db size on the db selector used to have a padding that is now gone ( bubble covers exactly the text now). It's just visual and works as expected but maybe looked better before... Tried to change it back but without success!
|
Visually as before now, thanks! |
There was a problem hiding this comment.
Looks good to me.
One thing I noted is that the filters panel is narrower on the structures page. This is not introduced by this PR (already on the live website), but causes longer option labels (e.g. CATH-Gene3D, Cryo-EM) to wrap. Can the panel have a minimum width?
| <label className={css('radio-btn-label', { checked })}> | ||
| <input | ||
| type="radio" | ||
| name="entry_type" | ||
| value={taxId} | ||
| disabled={isStale} | ||
| className={css('radio-btn')} | ||
| onChange={onChange} | ||
| checked={checked} | ||
| style={{ margin: '0.25em' }} | ||
| /> | ||
| {taxId === 'ALL' ? <div>All</div> : title} | ||
| {typeof count === 'undefined' || isNaN(count) ? null : ( | ||
| <NumberComponent | ||
| label | ||
| loading={loading} | ||
| className={css('filter-label')} | ||
| abbr | ||
| > | ||
| {count} | ||
| </NumberComponent> | ||
| )} | ||
| </label> |
There was a problem hiding this comment.
When hovering the options, there is an animation on the counter instead of the label, unlike other filters.
There was a problem hiding this comment.
good catch! The css rule for it requires the text of the option(line 41) to be in a <span> tag.
Fix included in the latest commit
I made the text for the member DB name |
Typescript and Visual framework migration for the browse page filters.
EntryListFilters/*ProteinListFilters/*StructureListFilters/*FiltersPanel/*EntryListFilters/*MemberDBSelector