This allows Fields to have an optional prefix component which is placed inside
the border of the Field and to the left of the input. Since this label animation
would be complex to get right for this case, it is instead fixed to the top left
if there is a prefix component.
This canonical example of this today would be a phone number field which
includes a country dropdown.
By placing the Field's border on the Field component root instead of the input,
it's easier to wrap it around additional elements that we'll soon stuff inside
the field.
This converts most fields in the registration form to use the Field component,
except for the phone number, which is a left as a separate task because of the
country dropdown menu.
This adds a comment to explain the `max-width` and also fixes it actually use
the right value. (I had grabbed the wrong part of `margin` the first time.)
This avoids awkward wrapping if the label is longer than the input. This will
show an ellipsis to suggest there's more text in the label than can be shown.
When the `label` element is displayed on top of the input (`label` is set and
there is no `placeholder`), it would block clicks from reaching the input. This
allows them to get through, but then also restores `label`'s events once it
moves out of the way.
Fixes https://github.com/vector-im/riot-web/issues/8469
These icons are based on Feather as the original source, but they have various
tweaks applied, such as stroke width, color, etc. Hopefully the tweaked name
makes this more obvious in the future.
Adds a UserView that contains a MainSplit with an empty div
and a RightPanel, preset to the given member.
UserView fetches the profile and creates a fake member, which
it passed on to the RightPanel.
this doesn't use the view_user action on purpose, to avoid any
interference of the UserView when trying to view a room member.
At some point during the riot redesign, the bit of css that lowered the opacity for offline/unavailable contacts
was removed. This makes it impossible to discern presence for a contact unless you hover your cursor over their
avatar.
It's very handy to be able to see presence at a glance without any hovering, so this PR reintroduces the lowered opacity.
I've also slightly decreased the opacity level from 0.66 to 0.5 to make it slightly more noticable.
Tjis is quite confusing as the welcome page is designed for when
you're not logged in, ie. has a sign-in button. There's also no way
to get back into the app so it really looks like it's logged you
out.
Reverts 116367fd69
