* PSFD-423: Permission check for polls dialog
* PSFD-423: Implement compound scrollable dialog and skeleton create poll
* PSFD-325: Ask the question
* PSFD-328: Ask for options
* PSFD-423: Ensure form submission semantics work for dialogs
* PSFD-328: Option semantics
* Can delete all option to end up with zero
* Minimum 2 to submit the form
* PSFD-316: Send poll start event
* Appease the linter
* PSFD-328: Reduce padding between options to account for field size
* Iterate per design
* Fix submission
It's become obvious that these random floating points everywhere
are unwieldy. Now they're all in one place with some fairly logical
variable names which will help out in design->implementation phase.
Font size of the whole app would ideally be controlled by a single
value. This value is currently hard coded using the :root CSS selector.
It is the intention to make this value configurable within riot. In the
interim all font-sizes have been converted to rem by the simple process
of regex. Replacing px values with their equivalent rem values assuming
a font size of 15px and then rounded to three decimal places, which was
the base at the time of this transformation.
I'm expecting another commit cleaning up rem values but I thought it
best to leave that to review.
This commit doesn't address any scaling issues. I thought it better to
land this unwieldy, mechanical, invisible change before the others
otherwise the pr would be impossible to review thoroughly.
* renames RoomTooltip to be a generic Tooltip (which it is)
* hooks it into Field to show validation results
* adds onValidate to Field to let Field instances call an arbitrary validation function
Rebased from @ara4n's https://github.com/matrix-org/matrix-react-sdk/pull/2550
by @jryans. Subsequent commits revise and adapt this work.
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 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.