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.
Adds a New Recovery Method dialog which is shown when key backup fails because
of a version mismatch / version not found error.
The set up button in the dialog currently only marks a device as verified (via a
verification prompt) instead of the eventual restore and cross-sign flow, since
those pieces don't exist yet.
Signed-off-by: J. Ryan Stinnett <jryans@gmail.com>
make mx_fadable not do anything anymore, and make room settings
full size.
Room settings haven't been designed yet, so all of this will
have a full pass when we have a go at it.
text inputs are now styled at every occurence in the app,
style input by default, and provide a .mx_textinput class
if buttons need to appear inside the input styling.
Before this was partially done in _common.scss, but as it's
highly theme-dependent, makes more sense to do it in the theme.
This moves the padding styles for dialog content to the .mx_Dialog rule. In
addition, it fixesvector-im/riot-web#7548 where the DevTools buttons had double
padding.
Signed-off-by: J. Ryan Stinnett <jryans@gmail.com>
Fixes https://github.com/vector-im/riot-web/issues/5689
Some dialogs had their own CSS that prevented the buttons from being placed in the right spot. This has been fixed by using a generic standard for the buttons. The only strange dialog that needed more CSS was the devtools dialog due to the header.
Not all dialogs have been checked - I spot-checked about half of them and verified the CSS manually on an established account. It's hard to get at all the dialogs without convoluted testing.
* Make the 'delete my data' button not the default
* Make it red
* Give it a confirmation dialog
* Remove the 'cancel' button: what does it mean to cancel an error?
In this case, it tried again and almost certainly got the same error.
* Remove the top-right 'x' and don't cancel on esc for the same reason.
* Move 'send bug report' to a button rather than a 'click here' link
* Add a 'refresh' button which, even if it's no more likely to work,
will at least look like it's doing something (it's mostly so if you
don't have a bug report endpoint, there's still a button other
than the one that deletes all your data).
David Baker