Commit graph

5022 commits

Author SHA1 Message Date
David Baker
cfa322cd62
New user profile UI in User Settings (#12548)
* New user profile UI in User Settings

Using new Edit In Place component.

* Show avatar upload error

* Fix avatar upload error

* Wire up errors & feedback for display name setting

* Implement avatar upload / remove progress toast

* Add 768px breakpoint

* Fix room profile display

* Update to released compund-web with required components / fixes

* Require compound-web 4.4.0

because we do need it

* Update snapshots

Because of course all the auto-generated IDs of unrelated things
have changed.

* Fix duplicate import

* Fix CSS comment

* Update snapshot

* Run all the tests so the ids stay the same

* Start of a test for ProfileSettings

* More tests

* Test that a toast appears

* Test ToastRack

* Update snapshots

* Add the usernamee control

* Fix playwright tests

 * New compound version for editinplace fixes
 * Fix useId to not just generate a constant ID
 * Use the label in the username component
 * Fix widths of test boxes
 * Update screenshots

* Put ^ back on compound-web version

* Split CSS for room & user profile settings

and name the components correspondingly

* Fix playwright test

* Update room settings screenshot

* Use original screenshot instead

* Fix styling of unrelated buttons

Needed to be added in other places otherwise the specificity changes.

Also put the old screenshots back.

* Add copyright year

* Fix copyright year
2024-06-06 13:56:38 +00:00
Michael Telatynski
1677ed1be0
MSC4108 support OIDC QR code login (#12370)
Co-authored-by: Hugh Nimmo-Smith <hughns@matrix.org>
2024-06-06 09:57:28 +01:00
David Baker
e8bb2419c9
Fix tabbedview breakpoint width (#12556)
Which should be 1024 according to the designs, not 768
2024-05-28 10:59:31 +00:00
Florian Duros
1190de9028
Migrate TooltipTarget usage to compound Tooltip (#12542)
* Use new tooltip in `RoomTopic.tsx`

* Use new tooltip in `MLocationBody.tsx`

* Fix room topic

* Update location snapshot

* Use new tooltip in `AppPermission.tsx`

* Remove `TooltipTarget`

* Add tests for `RoomTopic`
2024-05-22 12:15:07 +00:00
David Baker
3342aa5ff8
Refactor some logic into common AvatarSetting component (#12544)
* Refactor some logic into common AvatarSetting component

We duplicated some of the logic of setting avatars between profiles &
rooms. This pulls some of that logic into the AvatarSetting component
and hopefully make things a little simpler.

* Unsed import

* Convert JS based hover to CSS

* Remove unnecessary container

* Test avatar-as-file path

* Test file upload

* Unused imports

* Add test for RoomProfileSettings

* Test removing room avatar

* Move upload control CSS too

* Remove commented code

Co-authored-by: Florian Duros <florianduros@element.io>

* Prettier

* Coments & move style to inline as per PR suggestion

* Better test names

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Fix test

Upload input doesn't have that class anymore

---------

Co-authored-by: Florian Duros <florianduros@element.io>
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-21 10:37:02 +00:00
Florian Duros
f6e919021a
Fix E2E icon display in room header (#12545)
* Fix E2E icon display

* Add e2e test
2024-05-20 16:08:50 +00:00
Florian Duros
5109e7e4c0
Fix deformed avatar in call in a narrow timeline (#12538) 2024-05-16 08:00:57 +00:00
Florian Duros
6b0cb75d82
Use kdb in space panel shortcut (#12525) 2024-05-15 09:44:17 +00:00
Florian Duros
77a724526e
Tooltip: Improve the accessibility of the composer and the rich text editor (#12459)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton`

* Update snapshots

* Update @vector-im/compound-web

* Update composer

* Update formating buttons

* Update snapshots

* Remove placement

* Update snapshots

* Use kbd

* Update ``@vector-im/compound-web`
2024-05-15 08:32:53 +00:00
David Baker
948435ceb9
Collapse UserSettings tabs to just icons on narrow screens (#12505)
* Collapse UserSettings tabs to just icons on narrow screens

* Add screenshot test

* Better comment formatting.

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Comment the media query

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-05-10 16:29:50 +00:00
Michael Telatynski
eee0b2a9c3
Add room topic to right panel room info (#12503)
* Add room topic to right panel room info

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add snapshot tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-05-10 10:00:43 +00:00
R Midhun Suresh
706c4b7101
Use h tag for widget title instead of b tag (#12504)
* Change b tag to h3 tag

* Remove margin

* Update snapshots
2024-05-08 13:57:17 +00:00
Florian Duros
caef3c1921
Tooltip: improve accessibility in room (#12493)
* Migrate to `AccessibleButton`

* Update snapshots

* Update snapshots
2024-05-07 10:20:46 +00:00
Ilan Varillon
c121167087
fix avatar stretched on 1:1 call (#12494)
Co-authored-by: Florian Duros <florianduros@element.io>
2024-05-06 08:28:02 +00:00
Michael Telatynski
641a20ce63
Prepare for OIDC QR Login PR (#12463)
* Move LoginWithQRSection to the top of the settings tab

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Refactor LoginWithQRSection to a Functional Component

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Extract LoginWithQR types

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update LoginWithQRFlow styling & copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Re-add missing buttons and update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Use compound spacings

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-04-30 17:18:55 +00:00
Timo
d35fce198c
Call Guest Access, give user the option to change the acces level so they can generate a call link. (#12401)
* Ask the user to change the room access settings if they click the create link button.

Signed-off-by: Timo K <toger5@hotmail.de>

* disable call button if appropriate.

Signed-off-by: Timo K <toger5@hotmail.de>

* Add tests
Refactor tests to be in CallGuestLinkButton-test instead of the RoomHeader

Signed-off-by: Timo K <toger5@hotmail.de>

* add test for: no button if cannot change join rule and room not public nor knock

Signed-off-by: Timo K <toger5@hotmail.de>

* fix tests

Signed-off-by: Timo K <toger5@hotmail.de>

* add JoinRuleDialog tests

Signed-off-by: Timo K <toger5@hotmail.de>

* move spy into before each

Signed-off-by: Timo K <toger5@hotmail.de>

* Update src/i18n/strings/en_EN.json

Co-authored-by: Robin <robin@robin.town>

* remove inline css and update modal style

Signed-off-by: Timo K <toger5@hotmail.de>

* Update src/i18n/strings/en_EN.json

Co-authored-by: Robin <robin@robin.town>

* Update src/i18n/strings/en_EN.json

Co-authored-by: Robin <robin@robin.town>

* Invite state was not reactive.
Changing power level did not update the ui.

Signed-off-by: Timo K <toger5@hotmail.de>

* linter

Signed-off-by: Timo K <toger5@hotmail.de>

* make useGuestAccessInformation use useRoomState

Signed-off-by: Timo K <toger5@hotmail.de>

* fix tests and simplify logic

* fix tests

* review

Signed-off-by: Timo K <toger5@hotmail.de>

---------

Signed-off-by: Timo K <toger5@hotmail.de>
Co-authored-by: Robin <robin@robin.town>
2024-04-10 14:46:27 +00:00
David Baker
4ae94ae247
Mark all threads as read button (#12378)
* Mark all threads as read button

* Wrap in TooltipProvider and update snapshots

* Remove TooltipProvider wrapper: just add it to the test

* Add some more tests

* Add test for no-room-context handler because sonarcloud

* Add playwright test

* Make assertNoTacIndicator wait

* Use dedicated useMatrixClientContext function

Co-authored-by: Florian Duros <florianduros@element.io>

* Use dedicated useRoomContext function

Co-authored-by: Florian Duros <florianduros@element.io>

* Compound spacing variables

Co-authored-by: Florian Duros <florianduros@element.io>

* Compound spacing variables

Co-authored-by: Florian Duros <florianduros@element.io>

* Imports

* Use createTestClient()

* Add function to utils

* Use mkRoom

---------

Co-authored-by: Florian Duros <florianduros@element.io>
2024-03-28 17:38:21 +00:00
Timo
a24aa7e0f7
Video call meta space (#12297)
* add video room meta space button

Signed-off-by: Timo K <toger5@hotmail.de>

* Add videoRoomsSpace to meta space configuration

Signed-off-by: Timo K <toger5@hotmail.de>

* temp

Signed-off-by: Timo K <toger5@hotmail.de>

* dont show ppl section in video room space

Signed-off-by: Timo K <toger5@hotmail.de>

* add i18n strings

Signed-off-by: Timo K <toger5@hotmail.de>

* revert waitForIframe=false (this is part of another PR)

Signed-off-by: Timo K <toger5@hotmail.de>

* fix missing mock room method

Signed-off-by: Timo K <toger5@hotmail.de>

* test snapshot: add video room meta space

Signed-off-by: Timo K <toger5@hotmail.de>

* rename Conferences -> Conference

Signed-off-by: Timo K <toger5@hotmail.de>

* space panel snap test

Signed-off-by: Timo K <toger5@hotmail.de>

* update snapshot

Signed-off-by: Timo K <toger5@hotmail.de>

* fix test

Signed-off-by: Timo K <toger5@hotmail.de>

* add video room space tests

Signed-off-by: Timo K <toger5@hotmail.de>

* better logic

Signed-off-by: Timo K <toger5@hotmail.de>

* Add Video MetaSpace Test

Signed-off-by: Timo K <toger5@hotmail.de>

* make room join rule update reactive for the video room meta space

Signed-off-by: Timo K <toger5@hotmail.de>

* temp

Signed-off-by: Timo K <toger5@hotmail.de>

* fix description for meta space video room settings

Signed-off-by: Timo K <toger5@hotmail.de>

* tests

Signed-off-by: Timo K <toger5@hotmail.de>

* update snapshot

Signed-off-by: Timo K <toger5@hotmail.de>

* review

Signed-off-by: Timo K <toger5@hotmail.de>

* i18n

Signed-off-by: Timo K <toger5@hotmail.de>

* fix tests

Signed-off-by: Timo K <toger5@hotmail.de>

* put video meta space behind "feature_video_rooms" labs flag

Signed-off-by: Timo K <toger5@hotmail.de>

* review

Signed-off-by: Timo K <toger5@hotmail.de>

* update space store on RoomCreate state event

Signed-off-by: Timo K <toger5@hotmail.de>

* test for updating video room space on room type update

Signed-off-by: Timo K <toger5@hotmail.de>

* remove comment

Signed-off-by: Timo K <toger5@hotmail.de>

* also make knock join rule rooms part of the conference section

Signed-off-by: Timo K <toger5@hotmail.de>

---------

Signed-off-by: Timo K <toger5@hotmail.de>
2024-03-25 18:35:31 +00:00
Robin
10526c92bb
Remove the glass border from modal spinners (#12367)
It was not intentional, as these spinners are not a real dialog.
2024-03-25 17:36:00 +00:00
Michael Telatynski
56d7911897
Iterate styles around Link new device via QR (#12356)
* Rearrange user settings tab order to move Sessions up to 2nd

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate copy & iconography on Settings > Sessions > Link new device

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate design of Scan QR code screen

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak styles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests and snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-03-22 15:50:06 +00:00
Robin
a0795c7518
Improve readability of badges and pills (#12360)
* Improve readability of badges and pills

Badges will now always use light theme colors so that they become white-on-gray in both themes, and the contrast of pills has been increased so that they use primary action colors as the background.

* Fix tests
2024-03-22 00:27:13 +00:00
Florian Duros
ddd0ec48ac
Change user permission by using a new apply button (#12346)
* Add PowerLevelSelector.tsx.
It's extracting the current behavior of the privileged users and muted of `RolesRoomSettingsTab.tsx` into a dedicated component.
It's also adding a new apply button.

* Use `PowerLevelSelector` to render privileged and muted users in `RolesRoomSettingsTab`

* Update existing tests

* Add playwright test

* Fix typo

* Fix typo
2024-03-19 13:45:23 +00:00
David Baker
a5ed97b903
Mark as Unread (#12254)
* Support the mark as unread flag

* Add mark as unread menu option

and make clering notifications also clear the unread flag

* Mark as read on viewing room

* Tests

* Remove random import

* Don't show mark as unread for historical rooms

* Fix tests & add test for menu option

* Test RoomNotificationState updates on unread flag change

* Test it doesn't update on other room account data

* New icon for mark as unread

* Add analytics events for mark as (un)read

* Bump to new analytics-events package

* Read from both stable & unstable prefixes

* Cast to boolean before checking

to avoid setting state unnecessarily

* Typo

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Doc external interface (and the rest at the same time)

* Doc & rename unread market set function

* Doc const exports

* Remove listener on destroy

* Add playwright test

* Clearer language, hopefully

* Move comment

* Add reference to the MSC

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Expand on function doc

* Remove empty beforeEach

* Rejig badge logic a little and add tests

* Fix basdges to not display dots in room sublists again

and hopefully rename the forceDot option to something that better
indicates what it does, and add tests.

* Remove duplicate license header (?)

* Missing word (several times...)

* Incorporate PR suggestion on badge type switch

* Better description in doc comment

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>

* Update other doc comments in the same way

* Remove duplicate quote

* Use quotes consistently

* Better test name

* c+p fail

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-03-19 13:28:20 +00:00
Robin
26b4d47af1
Refine the colors of some more components (#12343)
* Refine the colors of some more components

This is a reintroduction of https://github.com/matrix-org/matrix-react-sdk/pull/12255, and should be the last part of the Compound color refinement work (https://github.com/element-hq/element-web/issues/26992). I've updated the following components to reflect design decisions (https://www.figma.com/file/pqhlirZFEwEp5XpudSbiia/Theming-Web-templates?type=design&node-id=80-60219&mode=design&t=mjqwylUie1vRwzOV-0) that will help them fit in better with the new design system:

- Message bubbles
- Pills
- Sent indicators
- Jump to bottom/unread buttons
- Composer placeholder
- Notification badges
- Room sublists
- Verification shields
- Date separators
- Tooltips

Closes https://github.com/element-hq/element-web/issues/22122

* Update some screenshots
2024-03-18 15:47:55 +00:00
Florian Duros
e309410266
TAC: Fix hover state when expanded (#12337)
* Fix TAC hover state

* Add playwright test

* Update playwright snapshot after last compound style changes
2024-03-14 16:21:18 +00:00
Robin
49be30bbc3
Fix the image view (#12341) 2024-03-14 15:33:43 +00:00
Robin
80c4c3c28c
Refine styles of menus, toasts, popovers, and modals (#12332)
* Refine styles of menus, toasts, popovers, and modals

This is a reintroduction of https://github.com/matrix-org/matrix-react-sdk/pull/12247, with the difference that modal styles have now been refreshed as well.

* Restore the fixed heights of some dialogs

* Fix formatting and flaky screenshot
2024-03-13 13:38:32 +00:00
Florian Duros
753fc2d33a
TAC: Fix CSS & component typos (#12333)
* Fix CSS & component typo

* Update snapshots
2024-03-11 15:48:11 +00:00
Michael Telatynski
8e68d5d6be
Improve Forward Dialog a11y by switching to roving tab index interactions (#12306)
* Improve Forward Dialog a11y by switching to roving tab index interactions

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve screen reader readout

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve screen reader readout

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-03-08 14:45:15 +00:00
Florian Duros
ddbc6439ce
Fix spotlight opening in TAC (#12315)
* Fix spotlight opening in TAC

* Add tests

* Remove `RovingTabIndexProvider`
2024-03-08 10:18:30 +00:00
renovate[bot]
af51897889
Update dependency @vector-im/compound-web to v3.1.3 (#12281)
* Update dependency @vector-im/compound-web to v3.1.3

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix TAC width due to compound update (#12326)

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: Florian Duros <florianduros@element.io>
2024-03-07 14:40:03 +00:00
Robin
60f3c2eae5
Remove unused slider component (#12303)
It is unused as of https://github.com/matrix-org/matrix-react-sdk/pull/12246. I noticed this while working on https://github.com/matrix-org/matrix-react-sdk/pull/12299.
2024-03-07 03:52:20 +00:00
Michael Telatynski
26176116bf
Use strong element to semantically denote visually emphasised content (#12320)
* Use `strong` element to semantically denote visually emphasised content

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add comment

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-03-06 23:34:14 +00:00
Robin
6eafe0e5a8
Refine styles of controls to match Compound (#12299)
This changes the styles of buttons, other form controls, and tabs in settings to:

1. Improve their usage of semantic colors, so that they adapt correctly to custom themes
2. Make them more visually coherent with the new Compound design system, as we integrate more of it into the app

This is a re-introduction of https://github.com/matrix-org/matrix-react-sdk/pull/12241 with the difference that we're now using our branding colors again on form colors, and buttons have become rounded to match the appearance of new Compound buttons.
2024-03-05 04:25:47 +00:00
Florian Duros
29b79ef351
Fix TAC opening with keyboard (#12285)
* Fix TAC opening with keyboard

* Use compound tooltip and icon button

* Revert "Fix TAC opening with keyboard"

This reverts commit 5a1e5d0c

* Add missing aria-label

* Update tests

* Add tests

* Fix visual regression

* Fix remaining tooltip

* Fix ref typing

* Fix typing
2024-02-29 14:07:46 +00:00
David Baker
5ac222e1c4
Fix alignment of user menu avatar (#12289)
* Fix alignment of user menu avatar

https://github.com/matrix-org/matrix-react-sdk/pull/12267 made the avatar
a couple of pixels out of alignment with the space icons. It just needed
to be moved 2px to the right to match the 18px margin of the space icons
(including the padding from the black border).

Also change elements in the user menu to block elements so they don't
generate extra vertical space in the user menu div, which was causing the
hairline to be too far down.

* Update snapshots

* Typo

Co-authored-by: Robin <robin@robin.town>

* Reference the span by class

* The img wasn't actually necessary here

---------

Co-authored-by: Robin <robin@robin.town>
2024-02-27 19:50:44 +00:00
Florian Duros
b9bdd18666
Use green dot for activity notification in LegacyRoomHeader (#12270) 2024-02-22 13:36:12 +00:00
David Baker
ebd0a046b1
Fix the space panel getting bigger when gaining a scroll bar (#12267)
* Fix the space panel getting bigger when gaining a scroll bar

Just makes the scrollbar gutter stable and removes 8px of padding
to compensate, so it will make the bar slightly larger, but it will
no longer change size weirdly if you have too many spaces in too short
a window.

* Tweak margins to keep space panel the same size

* Try 1px more

* Try 1px more to the left

* Fix sizes and disable flex when in narrow mode

* Update screenshots

* Another screenshot

* Last screenshot hopefully
2024-02-21 15:18:58 +00:00
Florian Duros
6d55ce0217
Use browser's font size instead of hardcoded 16px as root font size (#12246)
* WIP Use browser font size instead of hardcoded 16px

* Add font migration to v3

* Remove custom font size input

* Use a dropdown instead of a slider

* Add margin to the font size dropdown

* Fix `UpdateFontSizeDelta` action typo

* Fix `fontScale`in `Call.ts`

* Rename `baseFontSizeV3` to `fontSizeDelta`

* Update playwright test

* Add `default` next to the browser font size

* Remove remaining `TODO`

* Remove falsy `private`

* Improve doc

* Update snapshots after develop merge

* Remove commented import
2024-02-21 11:23:07 +00:00
Florian Duros
96a33b800a
Revert "Use Compound primary colors for most actions" (#12264)
* Revert ed5ef023b2

* Update failing snapshots

* Update snapshots after develop merge
2024-02-20 16:24:40 +00:00
David Baker
d20e9e4f8e
Fix gradients spacings on the space panel (#12262)
* Fix gradients spacings on the space panel

Make the gradients two separate ones so they can be fixed pixel widths
from the top & bottom rather than percentages of the height.

Tweak the spacings between the user menu & threads panel to match
the figma and from Gaelle's design.

* Update snapshots

* More screenshots
2024-02-20 15:28:46 +00:00
Florian Duros
ac435c8d4e
Revert "Refine menu, toast, and popover colors (#12247)" (#12263)
This reverts commit 0856c7617d.

Co-authored-by: David Langley <langley.dave@gmail.com>
2024-02-20 13:54:33 +00:00
David Baker
e8ce9cb360
Use h1 as first heading in dialogs (#12250)
* Use h1 as first heading in dialogs

The dialog should be modal and therefore the only content active
on the screen, so the title of the dialog should be the top level.

Update snapshots & tests appropriately.

* Just customise the letter spacing on dialog titles
2024-02-16 14:23:33 +00:00
Robin
0856c7617d
Refine menu, toast, and popover colors (#12247)
So that they use Compound semantic colors correctly and appear more similar to the real components now found in Compound.
2024-02-14 22:30:16 +00:00
Robin
ed5ef023b2
Use Compound primary colors for most actions (#12241)
* Use Compound primary colors for most actions

The "accent" color variable is something we should generally not use anymore: it maps to a Compound text token, which makes its semantics inappropriate for icons and backgrounds, and it clashes with the primary colors present on the Compound components we're now bringing into the app. As discussed with design, we would like to phase out its usage on interactive components in favor of the correct icon and background colors from Compound. This is a best-effort attempt at applying new colors to all the major places that we were previously using "accent": mainly, buttons and form controls are affected.

* Update some more colors

* Update test snapshots

* Fix broken screenshot
2024-02-13 20:10:07 +00:00
Robin
8bbad9f653
Enable custom themes to theme Compound (#12240)
* Enable custom themes to theme Compound

* Remove the now redundant username color variables

They are replaced by the Compound theming options (specifically, username colors can be themed by changing the color of Compound's decorative color tokens).
2024-02-13 14:07:58 +00:00
Florian Duros
1c789cbb18
Reduce TAC width by 16px (#12239) 2024-02-08 14:46:34 +00:00
Florian Duros
cf5d9f86fd
Fix TAC button alignment when expanded (#12238) 2024-02-08 14:09:32 +00:00
Florian Duros
a4987060b7
Pop out of Threads Activity Centre (#12136)
* Add `Thread Activity centre` labs flag

* Rename translation string

* WIP Thread Activity Centre

* Update supportedLevels

* css lint

* i18n lint

* Fix labs subsection test

* Update Threads Activity Centre label

* Rename Thread Activity Centre to Threads Activity Centre

* Use compound `MenuItem` instead of custom button

* Color thread icon when hovered

* Make the pop-up scrollable and add a max height

* Remove Math.random in key

* Remove unused class

* Change add comments on `mx_ThreadsActivityRows` and `mx_ThreadsActivityRow`

* Make threads activity centre labs flag split out unread counts

Just shows notif & unread counts for main thread if the TAC is enabled.

* Fix tests

* Simpler fix

* Open thread panel when thread clicke in Threads Activity Centre

Hopefully this is a sensible enough way. The panel will stay open of
course (ie. if you go to a different room & come back), but that's the
nature of the right panel.

* Dynamic state of room

* Add doc

* Use the StatelessNotificationBadge component in ThreadsActivityCentre

and re-use the existing NotificationLevel

* Remove unused style

* Add room sorting

* Fix `ThreadsActivityRow` props doc

* Pass in & cache the status of the TAC labs flag

* Pass includeThreads as setting to doesRoomHaveUnreadMessages too

* Fix tests

* Add analytics to the TAC (#12179)

* Update TAC label (#12186)

* Add `IndicatorIcon` to the TAC button (#12182)

Add `IndicatorIcon` to the TAC button

* Threads don't have activity if the room is muted

This makes it match the computation in determineUnreadState.
Ideally this logic should all be in one place.

* Re-use doesRoomHaveUnreadThreads for useRoomThreadNotifications

This incorporates the logic of not showing unread dots if the room
is muted

* Add TAC description in labs (#12197)

* Fox position & size of dot on the tac button

IndicatorIcon doesn't like having the size of its icon adjusted and
we probably shouldn't do it anyway: better to specify to the component
what size we want it.

* TAC: Utils tests (#12200)

* Add tests for `doesRoomHaveUnreadThreads`
* Add tests for `getThreadNotificationLevel`

* Add test for the ThreadsActivityCentre component

* Add snapshot test

* Fix narrow hover background on TAC button

Make the button 32x32 (and the inner icon 24x24)

* Add caption for empty TAC

* s/tac/threads_activity_centre/

* Fix i18n & add tests

* Add playwright tests for the TAC (#12227)

* Fox comments

---------

Co-authored-by: David Baker <dbkr@users.noreply.github.com>
2024-02-07 13:49:40 +00:00
Robin
3052025dd0
Use new semantic tokens for username colors (#12209)
* Use new semantic tokens for username colors

To match the tokens now used by the Compound Web avatar component

* Fix incorrect lock icon

* Update screenshots
2024-02-06 20:54:30 +00:00
David Baker
95430cecbc
Add notification dots to thread summary icons (#12146)
* Add notification dots to thread summary icons

Adopts new IndicatorIcon from compound to have threads icons with
indicator dot (that aren't also buttons). Adds green & red dots on
the threads icon in the thread summary to indicate notifications.
Changes the notification level dots colours in the threads panel to
be green to match.

* Update test for new CSS class

* Update snapshots with new class name

* Another snapshot update for new class name

* Replace more uses of old class name in tests

* More snapshot updates for new class name

* Unsure how this ever worked in chronological mode

* More snapshot updates

* Fix dot colours

* Upgrade to compound-web 3

* Fix computed notification levels

* Add test for notificationLevelToIndicator
2024-01-25 16:53:41 +00:00
David Baker
d110660dc3
Make the unread badge component more reusable (#12163)
Add a paramter to make it a dot rather than a badge rather than mangling
it to a dot with CSS in EventTile. Move it to a place in the DOM that reflects
where it's actually supposed to sit rather than repositioning it with CSS.
Tweak sizes to match what figma says (8px everywhere for dots rather than 6px in
some places as it was).
2024-01-23 14:39:50 +00:00
Manan Sadana
b3ab5fc2c3
Fixed shield alignment on message Input (#12149)
* Fixed shield alignment on message Input

* Fixed shield alignment on message Input

* Updated fix

* reversing merged changes
2024-01-18 14:48:29 +00:00
Richard van der Hoff
993a7029b8
Show a progress bar while migrating from legacy crypto (#12104)
* Show a progress bar during migration of crypto data

* playwright: add new `pageWithCredentials` fixture

* Add a playwright test for migration progress

* Add documentation for `idbSave`
2024-01-17 07:14:49 +00:00
Michael Telatynski
5983528a8d
Remove Cypress & Playwright in their entirety (#12145) 2024-01-16 09:48:49 +00:00
David Baker
9254e9562e
Don't reference the notification levels by colour (#12138)
* Don't reference the notification levels by colour

We're about to change what colours they are so either we'd have to rename
a bunch of constants. We may as well make things not reference what colour
anything is in the actual UI. Hopefully these constants are clear enough.

 * Rename NotificationColor -> NotificationLevel
 * Red -> Highlight
 * Grey -> Notification
 * Bold -> Activity
 * Anywhere else that calls it 'color' -> 'level'

Also fixes some weird mixes of US & UK English.

It turns out this is referenced in... quite a lot of places, so this is
quite a large PR. It can't really be much smaller, sorry.

* One test rename & some hiding due to ts-ignore

* More hiding behind ts-ignore

* Damn you, @ts-ignore...

* Fix test CSS values

* Missed some colour -> level

Co-authored-by: Florian Duros <florianduros@element.io>

* Change other instances of variables renamed in suggestion

* Update new test for renames

---------

Co-authored-by: Florian Duros <florianduros@element.io>
2024-01-15 15:25:48 +00:00
Florian Duros
80e75e3b70
Change Quick Settings icon (#12141)
* Change Quick Settings icon

* Update space panel playwright snapshot
2024-01-15 10:56:46 +00:00
Michael Telatynski
0820994463
Use Compound tooltips more widely (#12128)
* Switch MIMageBody & MStickerBody to Compound Tooltip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch E2ePadlock & SentReceipt to Compound Tooltips

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Workaround compound bug

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-01-11 11:49:24 +00:00
Michael Telatynski
061c269f36
Use Compound Tooltips in StatelessNotificationBadge, VerifyEmailModal, CheckEmail (#12084)
* Switch StatelessNotificationBadge to using Compound Tooltips

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate CheckEmail & VerifyEmailModal to Compound tooltips

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix CSS stacking contexts for Dialogs & PersistedElement

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch to PersistedElement sharing a CSS stacking context for z-index to continue functioning

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix Widget PIP overlay being under the widget and dragging being broken

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix border-radius on widget pip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix majority of tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix jest retryTimes applying outside of CI

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix remaining tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix React unique key warnings

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix sticker picker

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* id not class

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix widget pip button colour in light theme

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-01-09 11:46:27 +00:00
Michael Telatynski
57da29de58
Fix regression around CSS stacking contexts and PIP widgets (#12094)
* Fix CSS stacking contexts for Dialogs & PersistedElement

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Switch to PersistedElement sharing a CSS stacking context for z-index to continue functioning

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix Widget PIP overlay being under the widget and dragging being broken

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix border-radius on widget pip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix majority of tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix jest retryTimes applying outside of CI

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix remaining tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix React unique key warnings

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix sticker picker

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* id not class

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix widget pip button colour in light theme

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert unrelated change

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-01-08 12:11:44 +00:00
Richard van der Hoff
fd64eccd4a
Factor out post-login splash screen to a new component (#12103)
* Factor out post-login splash screen to a new component

* Move CSS classes to per-component file

* Rename CSS classes

... to reflect the component that uses them

* code review
2024-01-04 18:12:08 +00:00
renovate[bot]
a0c8575113
Update dependency prettier to v3 (#12095)
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2024-01-02 18:56:39 +00:00
Michael Telatynski
176237ee9b
Prepare for switching AccessibleTooltipButton to using Compound Tooltips (#12082)
* Fix Compound tooltips in Dialogs

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix setting labels not being correctly linked

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix playwright test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-01-02 09:21:53 +00:00
Timo
e26d3e9b68
Update element call embedding UI (#12056)
Signed-off-by: Timo K <toger5@hotmail.de>
2023-12-20 12:39:57 +00:00
Michael Telatynski
2212fbadd0
Use Compound tooltips instead of homegrown in TextWithTooltip & InfoTooltip (#12052)
* Migrate InfoTooltip to use Compound Tooltip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate DecoratedRoomAvatar.tsx to Compound tooltips

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Small type tweaks

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove unused props

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate TextWithTooltip.tsx to Compound tooltips

This adds `contain: strict` to #matrixchat which may have side effects.

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add comment

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert accidental layout change to TextWithTooltip from inline to block

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve test coverage and simplify

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Ditch the sleep call

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve coverage

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-19 17:19:54 +00:00
Anoop P
18f11b8024
Fix position of thumbnail in room timeline (#12016)
Co-authored-by: David Baker <dbkr@users.noreply.github.com>
2023-12-14 11:16:05 +00:00
Michael Telatynski
e180ca841b
Improve stability of Playwright screenshot tests (#11983) 2023-12-04 11:02:48 +00:00
Michael Telatynski
446400b6b6
Migrate right-panel/* from Cypress to Playwright (#11954)
* Migrate file-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate right-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Migrate notification-panel.spec.ts from Cypress to Playwright

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix test flakes

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Try stabilise test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* sleep

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Handle both cases

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix assertion

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Flip

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-12-01 12:24:49 +00:00
Germain
07b7ee6111
Deprecate lab experiment 'feature_state_counters' (#11343)
* Deprecate lab experiment 'feature_state_counters'

* i18n

* Regenerate strings

---------

Co-authored-by: Johannes Marbach <johannesm@element.io>
2023-11-30 08:19:16 +00:00
Kerry
1ffa1c9c18
Fix: Space scope header overflow (#11933)
* fix spacing for scope header

* extract scope header into component, apply line clamp

* update ThirdPartyMemberInfo styles

* pass onClose to ThirdPartyRoomMemberInfo

* rethemendex

* add View3pidInvite to actions enum, replace uses

* extract out action handler

* push card instead, test

* comment

* reinstate data-testid

* fix typo in styles
2023-11-29 08:25:34 +00:00
Kerry
cd985d6d6a
make room info button to open room details (#11951) 2023-11-28 21:15:21 +00:00
Michael Telatynski
ee485ffcfd
Default to system emoji font (#11925)
* Disable Twemoji emoji font by default

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Force Twemoji font in SAS Verification

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Improve tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-23 13:04:05 +00:00
Michael Telatynski
2f0eb8fb05
Fix ended polls overlapping event bubbles (#11895)
* Fix ended polls overlapping event bubbles

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-11-20 17:27:54 +00:00
Germain
f96583e74a
Update RoomSummaryCard navigation links (#11812)
* Update RoomSummaryCard navigation links

* Fix tests

* remove unneeded test

* "@vector-im/compound-web": "0.8.0"

* Fix: search button no transition on hover

* Fix: disabled invite option is not reflected in UI

* test canInviteTo

* update snapshots for CW 0.8.1

* unit test inviteToRoom

* unit test tagRoom

* add member link to roomsummarycard when using legacy room header

* use onChange instead of onClick for ToggleMenuItem favourite room

* update selectors in cypress tests

* always show people menu item

* add hover style to close button

* add padding around room name

* prettier

---------

Co-authored-by: Kerry Archibald <kerrya@element.io>
2023-11-16 03:25:34 +00:00
Kerry
f6ef476f79
Fix: Emoji cause topics being cut off in new room header (#11865)
* Order of buttons on the right should be Video Call, Voice Call, Threads, Facepile

* Fix 26326: Emoji cause topics being cut off in new room header
2023-11-14 22:20:21 +00:00
Kerry
2a3fd93afa
Room header: do not collapse avatar or facepile (#11866)
* Room header: do not collapse avatar or facepile

* comment
2023-11-14 06:48:26 +00:00
Kerry
a3f0633037
Fix: align base card close button to the right always (#11861) 2023-11-13 21:57:20 +00:00
Germain
722c5ad493
Update room summary card header (#11823)
* Update room summary card header

* test coverage for public room label

* test coverage for public room label (#11841)

* fix encrypted badge selector in cypress/crypto.spec

---------

Co-authored-by: Kerry <kerrya@element.io>
2023-11-11 07:24:48 +00:00
R Midhun Suresh
90419bdffd
Implement new unreachable state and fix broken string ref (#11748)
* Fix string ref issue

* Implement unreachable state

* Fix eslint failure

* Fix i18n

* Fix i18n again

* Write cypress test

* Write jest test

* Write more jest tests

* Update method name

* Use unstable prefix

* Always use prefix

This is never to going to be in the spec so always use the io.element
prefix

* Update tests

* Remove redundant code from cypress test

* Use unstable prefix

* Refactor code

* Remove supressOnHover prop

* Remove sub-text label

* Join lines

* Remove blank line

* Add jsdoc
2023-11-07 10:14:30 +00:00
Kerry
6849afd9fc
fix rightpanel hiding scrollbar (#11831) 2023-11-06 23:22:40 +00:00
Dharshan
53f35b6d28
Fix Incorrect message scaling for verification request (#11793)
* Fix CSS for uploading-files in threads

* fix-close button to stick at top of container

* re-align close button

* re-align close button

* Fix verification-message-scaling

* add min width to mx_EventTileBubble

---------

Co-authored-by: Kerry <kerrya@element.io>
2023-10-26 07:07:32 +00:00
nurjin jafar
b2fb41b91c
Make invitation dialog scrollable when infos are too long (#11753)
* make invitation dialog scrollable when room name or invitation text/info is too long.

Signed-off-by: nurjinn jafar <nurjin.jafar@nordeck.net>

* truncate room name in invitation dialog to two lines

Signed-off-by: nurjinn jafar <nurjin.jafar@nordeck.net>

* truncate room name in invitation dialog to two lines

Signed-off-by: nurjinn jafar <nurjin.jafar@nordeck.net>

* fix linter issue

Signed-off-by: nurjinn jafar <nurjin.jafar@nordeck.net>

---------

Signed-off-by: nurjinn jafar <nurjin.jafar@nordeck.net>
2023-10-24 16:06:44 +00:00
Ajay Bura
827715cf1e
fix spoiler text-align (#11790) 2023-10-24 15:48:12 +00:00
Germain
c28f3164bd
Fix margin of invite to room button (#11780) 2023-10-20 20:26:32 +00:00
Germain
f784a085fd
New right panel visual language (#11664)
* New right panel visual language

* Upgrade Compound

* Align old room header with right panel

* Rigth panel look and feel

* Fix linting and e2e tests

* Update snapshot

* Add test

* Lint

* Remove screenshot local script

* Update snapshots and UI based on feedback

* fix i18n key

* Update right panel visuals

* Fix tests

* lintfixes

* fix tests

* fix tests

* Add tests for search icon

* Fix invite dialog spec
2023-10-20 13:30:37 +00:00
Kerry
a63b99f687
Revert "remove problematic big emoji style (#11757)" (#11774)
This reverts commit eb7ce666b7.
2023-10-20 02:41:53 +00:00
Dharshan
3902ce9c40
Fix CSS for uploading-files in threads (#11751)
* Fix CSS for uploading-files in threads

* fix-close button to stick at top of container

* re-align close button

* re-align close button

---------

Co-authored-by: Kerry <kerrya@element.io>
2023-10-19 04:07:38 +00:00
Kerry
eb7ce666b7
remove problematic big emoji style (#11757) 2023-10-18 21:39:47 +00:00
Manan Sadana
01714d9c83
Fix: Bubble layout design is broken (#11763)
* Fixed the layout, added border to match design

* Border fixed for hover and highlighted messages

* moved some selectors up to avoid duplicate selectors
2023-10-18 09:46:09 +00:00
Michael Telatynski
4ff307b562
Iterate io.element.late_event decoration (#11760)
* Update copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add icon to late event timestamp

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-10-17 12:31:41 +00:00
Manan Sadana
6d1aea49db
Fix: Message shield alignment is not right. (#11703)
* Message shield alignment fixed

* Alignment fixed in all layouts

* Fixed for all font sizes
2023-10-17 07:01:37 +00:00
Michael Telatynski
5ff965106a
Render timeline separator for late event groups (#11739)
* Use Compound tooltips on MessageTimestamp to improve UX of date time discovery

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Show io.element.late_event in MessageTimestamp when known

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Avoid needing new Compound changes

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move groupers into their own directory

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Refactor date separator code to be more generic

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Render timeline separator for late event groups

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix date used in copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Move groupers into their own directory

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update copy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* i18n

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add comments

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add comments

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2023-10-16 14:14:04 +00:00
Manan Sadana
7dc40e6613
Fix: <detail> HTML elements clickable area too wide. (#11666)
* Fix: Details element wide clickable area

* LogoutDialog-test.tsx snapshot updated

* Fixed open state clickable area for dropdowns

* Advanced changed to advanced

---------

Co-authored-by: Manan Sadana <manan.sadana@cnhteam.onmicrosoft.com>
Co-authored-by: Florian Duros <florianduros@element.io>
2023-10-12 08:50:49 +00:00
Gabriel Rodríguez
a80cf58aa3
Fix alignment and poor contrast on user pills in invite dialog (#11722)
* improve invite tile color

* change checkmark color for consistency

* switch to cpd-color-text-info-primary

* fix misaligned "x"

* use --cpd-color-bg-success-subtle instead
2023-10-11 16:00:15 +00:00
Germain
ac32d45bcd
Usability fixes for new room header (#11729)
* Usability fixes for new room header

* lintfix

* Apply padding to both heading and topic

* lintfix

* comment clarity

* Remove title attr
2023-10-11 14:43:01 +00:00
Abhinav Dixit
54ca20df4b
Prevent select element in General settings overflowing in a room with very long room-id (#11597)
* #25614 Updated mx_Field select

* making the changes reset

* #25614 Updated mx_Field select

* Changes made in the grid and Select tag

* Adding test for mx_Field overflow

* Adding test for mx_Field overflow for long address

* Adding test for mx_Field overflow after formatting

---------

Co-authored-by: R Midhun Suresh <hi@midhun.dev>
2023-10-09 10:55:43 +00:00
Manan Sadana
54fa9a572e
Fix: Clicking on members pile does nothing. (#11657)
* Fix: Clicking on pile opens members list

* onClick used on Accessible Component

* Updated snapshots for testing

* Snapshots updated after merging

---------

Co-authored-by: Manan Sadana <manan.sadana@cnhteam.onmicrosoft.com>
2023-10-06 06:54:25 +00:00
Manan Sadana
34a0cf7e54
Members shield alignment fixed (#11700) 2023-10-03 14:49:09 +00:00
Andy Balaam
c27c230195
Merge pull request #11678 from manancodes/manancodes/Room_avatar_alignment
Fix: Wierd shadow below room avatar in dark mode.
2023-10-03 15:39:47 +01:00
Manan Sadana
ab2aef3f3e
Avatar image shrink fixed (#11698)
Co-authored-by: Manan Sadana <manan.sadana@cnhteam.onmicrosoft.com>
2023-10-03 07:55:31 +00:00