Part 1 of https://github.com/vector-im/riot-web/issues/11262
This is all the visual changes - the actual wiring of the UI to the right places is for another PR (though this PR still works independently).
The help icon is known to be weird here - it's a bug in the svg we have. The tooltip also goes right instead of up because making the tooltip go up is not easy work for this PR - maybe a future one if we *really* want it to go up.
This allows those who previously disconnected from an IS to either choose the
default IS or a custom one from Settings via the address picker dialog.
Part of https://github.com/vector-im/riot-web/issues/10619
Fixes https://github.com/vector-im/riot-web/issues/10554
Issues fixed:
* Fields were not ~30px from the avatar (too much right margin)
* Tooltips overflowed the dialog on some resolutions
* SetIdServer didn't have an error state for making the field red
* Spacing between sections in Discovery was wrong (fixed by just removing the problematic n+2 selector - it didn't help anything)
and make that width narrower so we can fit a tooltip in the left
hand side (they were a little too wide anyway for the kind of data
being entered, even on a narrow window).
We use tabIndex to make elements selectable and therefore focused by screen readers. Doing this draws a blue border (in chrome at least) around the element - in some cases, we don't want this.
In Firefox, the default <b> style is such that it doesn't appear bold with our
current selection of specific font weights. This specifically sets a working
font weight.
Move the max-width to the fixedWidth div rather than the dialog,
otherwise the fixedWidth keeps getting bigger with bigger windows
but the dialog doesn't so it scrolls.
Little bit of a mix of things in this one:
* Support variable-width dialogs. Default is fixed-width as before,
only UploadConformDialog is variable-width. Controlled by a prop
to BaseDialog.
* Fixes to the cancel 'x' - scale the mask image, tweak size & colour
* Colour & boldness of dialog titles
* Align the dialog title & cancel 'x'
* Remove gap between dialog buttons & right hand side of dialog(!)
* Round corners on dialogs
* Add grey border on image preview in upload confirm dialog
* and, squeezing in slightly randomly, finish the partially renamed
ChatInviteDialog to AddressPickerDialog.
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.
This takes out the old user and room settings, replacing the paths with the new dialog editions. The labs setting has been removed in order to support this change.
In addition to removing the old components outright, some older components which were only used by the settings pages have been removed. The exception is the ColorSettings component as it has a high chance of sticking around in the future.
Styles that were shared by the settings components have been broken out to dedicated sections, making it easier to remove the old styles entirely.
Some stability testing of the app has been performed to ensure the app still works, however given the scope of this change there is a possibility of some broken functionality.
Damir Jelić