Commit Graph

483 Commits (909c6a6d4b4fdfc0154aa4aa78c02bd986e9c308)

Author SHA1 Message Date
Bruno Windels 09c3391dd8 replace existing icon in composer with the new one 2019-02-01 13:40:42 +01:00
Bruno Windels f2928c184d create warning/verified icon to use in header/composer/member info 2019-02-01 13:39:56 +01:00
Travis Ralston b12b731781 Minor CSS tweaks 2019-01-31 21:20:30 -07:00
Travis Ralston 4036e52c24 Fixed settings dialog header; Adjust padding on dialog
Some recent changes to dialogs changed how this works and altered the look of the settings dialogs. This fixes that and makes it so that the header and content scroll independently.

Fixes https://github.com/vector-im/riot-web/issues/8329
Fixes https://github.com/vector-im/riot-web/issues/8328
2019-01-31 15:52:22 -07:00
J. Ryan Stinnett 2f006939f2 Use mx_AuthBody prefix for consistency 2019-01-31 10:06:35 -06:00
Bruno Windels f60cfe5cb2
Merge pull request #2545 from matrix-org/bwindels/missingavatarlayout
layout composer independent of avatar being present
2019-01-31 14:41:44 +00:00
Bruno Windels afed1b725d layout composer independent of avatar being present 2019-01-31 15:13:18 +01:00
Matthew Hodgson f658288f2b
Merge pull request #2543 from matrix-org/matthew/cyrillic
Matthew/cyrillic
2019-01-31 13:11:14 +01:00
Matthew Hodgson 47f775f579 apply correct weight on unread roomtiles 2019-01-31 13:10:11 +01:00
Matthew Hodgson ac620c7a05 fix bg color on selects 2019-01-31 13:10:11 +01:00
Bruno Windels 60f28266ae
Merge pull request #2538 from matrix-org/bwindels/community-redesign-cleanup
Redesign: community page cleanup
2019-01-31 12:01:08 +00:00
Matthew Hodgson 2fc6f89953 remove italics CSS skew 2019-01-31 11:51:26 +01:00
J. Ryan Stinnett 6718ae8b7c Set standard font size for fields 2019-01-30 17:52:18 -06:00
J. Ryan Stinnett d6f55a508c Use custom appearance and arrow for select fields 2019-01-30 16:40:53 -06:00
J. Ryan Stinnett b093119d30 Move dropdown arrow to primary element 2019-01-30 16:39:08 -06:00
Bruno Windels c9900deebe center invite button caption 2019-01-30 16:24:25 +01:00
Bruno Windels 3a8e0aec48
Merge pull request #2533 from matrix-org/bwindels/avoidcomposerhscroll
avoid horizontal scrollbar in composer when placeholder doesn't fit
2019-01-30 12:35:10 +00:00
Bruno Windels 13b97ee332 avoid horizontal scrollbar in composer when placeholder doesn't fit 2019-01-30 12:53:15 +01:00
David Baker ae7b89eae9
Merge pull request #2530 from matrix-org/bwindels/minorfixup
Redesign: tiny fix: stretch device label in member info if content doesn't fill it
2019-01-30 11:43:13 +00:00
Bruno Windels 4d2a93eaaf
Merge pull request #2527 from jryans/auth-registration
Style registration flow
2019-01-30 11:27:45 +00:00
Bruno Windels 3f7f984536 also don't stretch buttons when text is larger 2019-01-30 11:23:31 +01:00
Bruno Windels 015c14237d stretch device label in member info if content doesn't fill it 2019-01-30 11:20:20 +01:00
Bruno Windels 6aca7e4515
Merge pull request #2522 from matrix-org/bwindels/memberpanel-tiny-makeover
Redesign: small member info panel makeover
2019-01-30 10:01:33 +00:00
Travis Ralston 68cd87a1c7 Fix indentation on all new settings CSS 2019-01-29 23:11:16 -07:00
Travis Ralston bdf2bb5601
Merge pull request #2526 from matrix-org/travis/settings/fixes-1
Round 1 of misc fixes for settings
2019-01-29 22:59:07 -07:00
Travis Ralston f86e224db6 Merge branch 'experimental' into travis/rsettings/tab/security 2019-01-29 22:15:55 -07:00
Travis Ralston 4d0a246629 Put a little padding between section headings 2019-01-29 19:28:30 -07:00
Travis Ralston f050323f98 Inherit font size from other elements for push notifications table 2019-01-29 19:18:13 -07:00
Travis Ralston 2aee2df6e9 Fix usage of semibold fonts
Fixes https://github.com/vector-im/riot-web/issues/8275
2019-01-29 19:11:04 -07:00
J. Ryan Stinnett 25a2c3fe4d Tweak dropdown font 2019-01-29 17:38:28 -06:00
J. Ryan Stinnett 01d28bc137 Squeeze country dropdowns to match design 2019-01-29 17:38:28 -06:00
J. Ryan Stinnett 16b4f8fb6d Use new arrow for all dropdowns 2019-01-29 17:38:28 -06:00
J. Ryan Stinnett 92394ba601 Change country dropdown to be smaller with arrow on right 2019-01-29 17:38:28 -06:00
J. Ryan Stinnett daee5f0325 Reorganize registration inputs 2019-01-29 17:38:28 -06:00
Travis Ralston 0af419633f Implement the Roles & Permissions tab of new room settings
This is largely copy/paste from the current room settings
2019-01-29 15:54:51 -07:00
Travis Ralston a2f516c461 Implement the Security & Privacy tab of new room settings 2019-01-29 14:31:07 -07:00
Bruno Windels 7d6f551841 small makeover of member info panel
this removes the style sharing between the verify buttons in the memberinfo panel and
and the encrypted event dialog because the diverge too much now.
2019-01-29 21:14:16 +01:00
Bruno Windels 855dbd7d2b Merge branch 'experimental' into bwindels/roomdirectory-makeover 2019-01-29 18:33:03 +01:00
Bruno Windels 15a74cac15 Merge branch 'experimental' into bwindels/redesign-smallfixes 2019-01-29 18:30:08 +01:00
Bruno Windels 1b82ec6e36 make resize handle not overlap with left panel sublist scrollbars 2019-01-29 18:01:29 +01:00
Travis Ralston c090118815
Merge pull request #2516 from matrix-org/travis/rsettings/tab/general
Implement the "general" tab of new room settings
2019-01-29 09:41:32 -07:00
J. Ryan Stinnett 049ad40061 Tweak auth overflow on Windows and Linux 2019-01-29 10:19:16 -06:00
Travis Ralston ad276c1fda Merge branch 'experimental' into travis/rsettings/tab/general 2019-01-29 09:11:21 -07:00
Bruno Windels 6ffc5e093d add icons to top left menu options 2019-01-29 16:56:07 +01:00
Bruno Windels 9f1b4ac4cc room directory makeover 2019-01-29 15:34:58 +01:00
J. Ryan Stinnett 20bf683df8
Merge pull request #2517 from jryans/auth-server-type-selector
Add server type selector and style login flow
2019-01-28 22:11:14 -06:00
Travis Ralston d34390d230
Merge pull request #2512 from matrix-org/travis/usettings/tab/flair
Implement flair tab in user settings
2019-01-28 20:37:22 -07:00
Travis Ralston 70b34aa2c3 Condense CSS rules and use box-sizing instead of math 2019-01-28 20:26:03 -07:00
J. Ryan Stinnett 34e2979f98 Add Modular server config screen 2019-01-28 17:32:56 -06:00
J. Ryan Stinnett d96e814a92 Add link to edit server details 2019-01-28 16:13:19 -06:00
Travis Ralston ea1d6a0146 Minor styling and avatar bug fixing 2019-01-28 13:54:56 -07:00
Travis Ralston 243feb9b13 Early tab structure and profile changes (name/avatar/topic) 2019-01-28 13:54:56 -07:00
Travis Ralston b7d0dd4408 Rename GeneralSettingsTab to GeneralUserSettingsTab 2019-01-28 13:54:56 -07:00
Travis Ralston c204cd7be3
Merge pull request #2502 from matrix-org/travis/settings/disabled-selects
Override UA/OS styles for disabled Field selects
2019-01-28 10:32:37 -07:00
Travis Ralston 3d59cf996f Icon for flair tab 2019-01-28 10:24:18 -07:00
David Baker 2d61a2508d
Merge pull request #2514 from matrix-org/bwindels/roomlistjslayout-bis
Redesign: new roomlist layout fixes
2019-01-28 15:53:28 +00:00
Bruno Windels 79a44b1bfb always hide overflow on RoomList in case Layout screws up 2019-01-28 16:03:49 +01:00
Bruno Windels 55e0838c82
Merge pull request #2507 from matrix-org/bwindels/roomlistjslayout
Redesign: new layout algorithm for room sublists.
2019-01-28 14:55:31 +00:00
J. Ryan Stinnett abe6fd2f60 Rework `ServerConfig` to approach design
The public server search box is left out for now, so this restyles the existing
custom server inputs to more closely approximate the design.
2019-01-28 08:52:20 -06:00
J. Ryan Stinnett 7934a2950c Add 'Your account' header 2019-01-28 08:52:20 -06:00
J. Ryan Stinnett 0bee324e48 Add server type selector component 2019-01-28 08:52:20 -06:00
David Baker b4f02844a8 Merge remote-tracking branch 'origin/experimental' into dbkr/sas 2019-01-28 09:36:39 +00:00
Travis Ralston 57e45e7e7c Proof of concept for a flair tab in user settings 2019-01-25 15:35:32 -07:00
Travis Ralston 535d42684f Initial structure for new room settings 2019-01-25 13:09:44 -07:00
Travis Ralston f7f23e4dea Merge branch 'experimental' into travis/usettings/tab/security 2019-01-25 09:12:07 -07:00
Travis Ralston aeac82209e Improve disabled Field styling 2019-01-25 09:10:16 -07:00
Travis Ralston 949343d7d5
Merge pull request #2505 from matrix-org/travis/settings/animated-toggles
Add simple animations to toggle switches
2019-01-25 07:51:38 -07:00
Travis Ralston 3301c35f7d
Merge pull request #2501 from matrix-org/travis/settings/dialog-size
Have the settings dialog be fixed in size
2019-01-25 07:46:36 -07:00
Travis Ralston 9bbbab9d03 Add simple animations to toggle switches 2019-01-24 21:24:28 -07:00
Travis Ralston 284be2653e Override UA/OS styles for disabled Field selects
Fixes https://github.com/vector-im/riot-web/issues/8249
2019-01-24 19:27:20 -07:00
Travis Ralston 5dc75e2d3c Have the settings dialog be fixed in size
This also brings out some classes that aren't solely applicable to the user settings and will be applicable to the room settings as well.
2019-01-24 19:12:09 -07:00
Travis Ralston 1f10cda5e4 Implement the "Help & About" tab of new user settings 2019-01-24 17:10:35 -07:00
Travis Ralston b0a8cbf75f Implement the "Security & Privacy" tab of new user settings 2019-01-24 15:47:04 -07:00
Travis Ralston 0f89668446 Also the font size 2019-01-24 14:42:30 -07:00
Travis Ralston 87cea5ef09 Fix sizings and margins 2019-01-24 14:41:00 -07:00
Travis Ralston 27ee6625ee Implement the "Voice & Video" tab of new user settings 2019-01-24 13:33:22 -07:00
Travis Ralston 524d2f1e11 Force font family upon Fields 2019-01-24 11:43:03 -07:00
Travis Ralston 5479a4dac5 Implement the "Preferences" tab on new user settings 2019-01-24 10:32:29 -07:00
Travis Ralston f1c1caac62 Implement labs tab in new user settings 2019-01-24 08:52:45 -07:00
Travis Ralston 2a9f6186d7
Merge pull request #2491 from matrix-org/travis/usettings/tab/general
Implement the "General" tab of new user settings
2019-01-24 08:51:11 -07:00
Bruno Windels a5297303b0 remove flexbox layout 2019-01-24 15:44:16 +01:00
Travis Ralston 736aa8297d Minor CSS adjustments 2019-01-23 18:49:27 -07:00
J. Ryan Stinnett 41c79a93c0
Merge pull request #2489 from jryans/auth-text-and-links
Update text and links in authentication flows
2019-01-23 18:40:55 -06:00
Travis Ralston 40f6aeba28 Touchups to toggles in settings 2019-01-23 16:03:56 -07:00
Travis Ralston 3f897468a6 Add a ToggleSwitch and use it for SettingsFlag
Also bring in the compact timeline option.

Without minor CSS changes, the old user settings are completely unusable with this change. As such, minimal effort has been put in to have it be useful. Similarly, the changes drop the use of radio groups and the old theme selector was the only one that used it. See the comments for more details on how/why this was mitigated the way it was.
2019-01-23 15:50:41 -07:00
J. Ryan Stinnett 9f5f552be1 Move LanguageSelector to views
It's too simple to be called a structure.
2019-01-23 16:14:03 -06:00
J. Ryan Stinnett 9b3d674a92 Rename links for changing auth flow 2019-01-23 15:50:44 -06:00
J. Ryan Stinnett e396954a20 Update forgot password link text and style 2019-01-23 15:50:44 -06:00
J. Ryan Stinnett 2f89af4fa0 Update login header text 2019-01-23 15:50:44 -06:00
Travis Ralston 97666d39bc Bring in theme and language options 2019-01-23 14:43:45 -07:00
Travis Ralston d55d145223 Bring over phone number management 2019-01-23 14:16:18 -07:00
David Baker 6a90625d36 Merge remote-tracking branch 'origin/experimental' into dbkr/sas 2019-01-23 17:32:18 +00:00
Travis Ralston aa7afe819f Bring over email address management 2019-01-23 09:28:53 -07:00
Travis Ralston fa1ce61a06 Move profile settings to a dedicated component
The tab component is getting a bit hard to navigate
2019-01-23 09:28:53 -07:00
Travis Ralston 19de6694ca Bring in the change password section
This also changes the layout slightly in the user settings, but nothing detrimental.
2019-01-23 09:28:53 -07:00
Travis Ralston 677b3ca7b5 Bring flair into the new settings
Makes the flair options in old settings look broken (cosmetic issues), but it's fine because we're ripping that out in due time.
2019-01-23 09:27:04 -07:00
Travis Ralston f643d7a143 Finish the box for displayname/avatar changes 2019-01-23 09:27:04 -07:00
J. Ryan Stinnett 05254f0e82 Tweak language selector to match design 2019-01-23 10:18:06 -06:00
Travis Ralston 94b1d739fb
Merge pull request #2476 from matrix-org/travis/modal-tab-settings
Basic structure for tabbed user settings
2019-01-23 07:52:44 -07:00
Travis Ralston 4c12b2c911
Merge pull request #2486 from matrix-org/travis/fix-hover
Fix AuthFooter CSS rules conflicting with anchors all over the app
2019-01-22 21:55:18 -07:00
J. Ryan Stinnett 0f3ee9c786 Extract auth header logo to new component
This will allow `riot-web` to replace only the logo, rather than the whole
header.
2019-01-22 22:41:10 -06:00
Travis Ralston 7ccf64584e Fix AuthFooter CSS rules conflicting with anchors all over the app
Fixes https://github.com/vector-im/riot-web/issues/8227
2019-01-22 21:35:36 -07:00
Travis Ralston b83227c035
Merge pull request #2484 from matrix-org/travis/select-field
Support selects on Field
2019-01-22 20:13:06 -07:00
Travis Ralston 2b3c8c4450 Correctly form a select/input element 2019-01-22 20:03:59 -07:00
J. Ryan Stinnett 575cd1e37b Add modal look to authentication flows
This changes the auth screens to use the modal-like style of the redesign.

This does not attempt to style the actual body content of each screen.  Instead,
it covers the header area with logo, footer links, and overall modal container
only.
2019-01-22 20:44:49 -06:00
J. Ryan Stinnett 9d2bfdc0c0 Fix CSS indentation level 2019-01-22 20:44:49 -06:00
Travis Ralston f0e8182ff3 Support selects on Field
Luckily, the styling is copy/paste capable.
2019-01-22 19:25:09 -07:00
Christopher Medlin be94e1aebc Fix integrations error popup
Signed-off-by: Christopher Medlin <christopherjmedlin@protonmail.com>
2019-01-22 11:44:55 -08:00
Travis Ralston 0deb210fd8 Collapse DOM around tab label icon 2019-01-22 09:54:35 -07:00
Bruno Windels 5dd5f4f1dc add JumpToBottomButtom component 2019-01-22 14:49:04 +01:00
J. Ryan Stinnett 1d01ac398c Rename `mx_Login_box` to `mx_AuthPage_modal` and fold into `AuthPage` 2019-01-21 19:11:43 -06:00
J. Ryan Stinnett 3bd765f63f Rename LoginPage, Header, Footer views to Auth* 2019-01-21 19:11:43 -06:00
J. Ryan Stinnett c7354f483b Rename LoginBox to AuthButtons
This component displays login and register buttons. It's currently used in the
composer when viewing a room as a guest.

The name is confusing because the login flow uses are very similarly named
`mx_Login_box` as a wrapping around forms, which is totally different than these
buttons.

Additionally, the components is moved to `views/auth` since it is very simple
and auth related.
2019-01-21 19:11:43 -06:00
Travis Ralston b678e84272 Remove extraneous TODO comment
The thing it describes actually happened
2019-01-21 17:32:25 -07:00
Travis Ralston 15a56fa90b Improve the profile section a bit and add a highlight to the temp tab 2019-01-21 17:27:43 -07:00
Travis Ralston c3692aa9ae Use the right icons, sizing, and font families for things 2019-01-21 16:51:43 -07:00
Travis Ralston f1e44757f0 Very early work on the "General" tab 2019-01-21 16:51:43 -07:00
Travis Ralston 22435bf8d2 Make the dialog look more like a new dialog 2019-01-21 16:51:43 -07:00
Travis Ralston a7e3d7df28 Make the tabs look like the design 2019-01-21 16:51:43 -07:00
J. Ryan Stinnett 29be3ee4b5 Rename login directory to auth 2019-01-21 17:45:55 -06:00
J. Ryan Stinnett 23b3e74c1c Change to new field focused color 2019-01-21 13:47:16 -06:00
J. Ryan Stinnett 352107352e Tweak field input padding to match label position 2019-01-21 13:47:16 -06:00
J. Ryan Stinnett 1906cfd700 Tweak field label to be vertically centered 2019-01-21 13:47:16 -06:00
J. Ryan Stinnett efd5405267 Add a form field component for the redesign
The label moves into the border on focus and after being filled. A valid color
is applied to the label and input border. Other states like invalid can be added
later as needed.

Adapted from @ara4n's experiment into a React component with a CSS only
approach.
2019-01-19 22:13:53 -06:00
David Baker 970880737e Merge remote-tracking branch 'origin/experimental' into dbkr/sas 2019-01-18 18:33:11 +00:00
David Baker ec2d51cbbb SAS verification screen matching design 2019-01-18 16:56:49 +00:00
J. Ryan Stinnett 20e296b20e Convert image URLs in React to `require` calls
This allows Webpack to insert the proper image URL after builds steps like
adding a hash and so on. The path you supply to `require` is relative to the JS
source file, just like any other would be.
2019-01-17 22:06:49 -06:00
J. Ryan Stinnett b2387f4cff Define SCSS variable for resource dir
Adds a `$res` SCSS variable set to the path from the root SCSS file to the `res`
directory.

This is a different base path than previously used in CSS URLs (it goes up 3
directories instead of 2), because Webpack will now be resolving images relative
to the root SCSS file, so the path corresponds to a source tree location,
instead of a path in the build output tree.

Defining this variable has two main goals:

* URLs are a bit easier to read
* The path can be overridden, which is needed for external (riot-web) themes
2019-01-17 22:06:49 -06:00
J. Ryan Stinnett 9a7a8da6c0 Use font-family from theme in all components 2019-01-17 21:50:45 -06:00
Bruno Windels 23e7811f33
Merge pull request #2454 from matrix-org/bwindels/topleftcursor
Fix: show hand cursor in topleft menu so its clear you can click it
2019-01-17 16:58:12 +00:00
Bruno Windels 2bec088591 show hand cursor in topleft menu so its clear you can click it 2019-01-17 14:07:33 +01:00
Bruno Windels 921906897f css url paths are relative to location of compiled file, not project structure 2019-01-17 13:49:52 +01:00
Bruno Windels 89b576936b
Merge pull request #2448 from matrix-org/bwindels/searchmakeover
Redesign: search makeover
2019-01-17 12:12:26 +00:00
Bruno Windels 8c30d05eb8 Revert "Merge pull request #2348 from matrix-org/bwindels/roomgridview-experimental"
This reverts commit ece5cb1fcc, reversing
changes made to 64a3d2521c.
2019-01-17 10:29:37 +01:00
J. Ryan Stinnett 859f2a8646 Show spinner while waiting on status message to commit
It can take some time to actually set the status message and see it play back as
a committed event.  This adds a spinner for immediate feedback so it's clear
that something is happening.

Fixes https://github.com/vector-im/riot-web/issues/8135.
2019-01-16 09:33:39 -06:00
Matthew Hodgson 1082f548d3 hack nunito italics for now with CSS skew
fixes https://github.com/google/fonts/issues/1726
2019-01-16 12:53:46 +00:00
Bruno Windels 899ee265e3 Merge branch 'experimental' into bwindels/searchmakeover 2019-01-16 11:17:38 +01:00
Bruno Windels b14d436e98 make cancel button icon slightly larger 2019-01-16 11:14:19 +01:00
J. Ryan Stinnett 807d3aba6e Use integer padding / border for avatar
It seems fractional spacing results in different behavior across browsers,
including unbalanced spacing, making the avatar appear uncentered.

Here we avoid this by using integers that seem to closely match the comps.

Fixes https://github.com/vector-im/riot-web/issues/8134.
2019-01-15 16:37:16 -06:00
J. Ryan Stinnett 4b13774585 Revert to avatar only when custom status disabled
This returns to the previous behavior of avatar only without a button when the
custom status feature is disabled so that you don't get pointer cursor for
something that does nothing when clicked.

The avatar ring spacing is kept consistent with and without the feature enabled
by using a different class in CSS.
2019-01-15 10:54:29 -06:00
J. Ryan Stinnett 5b88b64950 Rework custom status context menu
This updates the custom status context menu to match the latest comps.  A single
button is used for setting / clearing, depending on what is appropriate.

The state logic is also changed to depend on events and storage from js-sdk for
the committed status message.  This makes it easy to distinguish the value being
edited from what's currently committed.
2019-01-15 10:54:29 -06:00
J. Ryan Stinnett eae1e4c9aa Tweak custom status avatar ring
Adjusts the appearance of the avatar ring to match the latest comps.

In addition, we now always render the surrounding button element, which
simplifies styling since the same size is now occupied both with and without the
feature.

This improves alignment between text in the composer and text in the message
history (https://github.com/vector-im/riot-web/issues/8111).
2019-01-15 10:54:29 -06:00
J. Ryan Stinnett 7d6b996952 Tweak composer button padding so it won't affect status 2019-01-15 10:54:29 -06:00
Bruno Windels 77a62b9174 style search bar 2019-01-15 16:20:04 +01:00
J. Ryan Stinnett 35af3fc6f7 Add separate dialog for recovery method removed
The "New Recovery Method" dialog would show if either the recovery method had
been changed or removed, but the dialog text didn't make much sense for the
removed case.

This adds a separate dialog customized for the removed case.

Fixes https://github.com/vector-im/riot-web/issues/8046.
2019-01-10 15:18:57 -06:00
Erik Johnston cbf9ff6aee Merge branch 'experimental' of github.com:matrix-org/matrix-react-sdk into erikj/state_counters 2019-01-10 16:56:47 +00:00
Bruno Windels ece5cb1fcc
Merge pull request #2348 from matrix-org/bwindels/roomgridview-experimental
Tiled room UI
2019-01-09 17:25:08 +00:00
J. Ryan Stinnett 79df843a6e Fix path to New Recovery Method icon 2019-01-09 06:25:35 -06:00
David Baker e5f74957cb
Merge pull request #2408 from matrix-org/dbkr/fix_gif_icon_on_stickers
Fix black-on-black GIF icon for stickers
2019-01-08 09:35:06 +00:00
J. Ryan Stinnett 2ff532621c Remove unbalanced padding in create key backup dialog
This padding only one side made it impossible to center things in the dialog.
Since the dialog also has nice spacing without the padding, this change removes
it.

Fixes https://github.com/vector-im/riot-web/issues/7862.
2019-01-07 17:48:10 -06:00