Commit Graph

4103 Commits

Author SHA1 Message Date
Michael Telatynski
f7a078d250
Update right panel base card styling to match Compound (#12768)
* Update base card styling to match Compound

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

* Update screenshot

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-16 09:03:35 +00:00
R Midhun Suresh
cf8b87fd14
Add tabs to the right panel (#12672)
* Create new method for header button behaviour

With the introduction of tabs, the behaviour of the header buttons is
changed as follows:
- Close any right panel if open
- Open the correct right panel if no panel was open before

The old method (and behaviour) is retained as showOrHidePhase.

* Implement tabs in the right panel

There are three tabs: Info, People and Threads

* Remove unwanted code from RoomSummaryCard

- Remove the menu item for opening the memberlist since that is now
  taken of by the tabs.
- Remove the close button

* Remove code for focusing close button from tac item

See https://github.com/matrix-org/matrix-react-sdk/pull/12410

There's no longer a close button to focus so we instead focus the thread
tab. This is done in RightPaneltabs.tsx so we just need to remove this
code.

* Introduce a room info icon to the header

This was previously present in the legacy room header but not in the new
header.

* BaseCard changes

- Adds id, ariaLabelledBy and role props to implement tab accessibility.
- Adds hideHeaderButtons prop to hide header buttons (think back and
  close buttons).
- Change confusing header rendering code:
  header is not rendered ONLY when no header is passed AND
  hideHeaderButtons is true.

* Refactor repeated code into function

Created a new function createSpaceScopeHeader which returns the
component if the room is a space room. Previously this code was
duplicated in every component that uses SpaceScopeHeader component.

* Pass BaseCard attributes and use helper function

Actually using the code from the last two commits

* Add, update and remove tests/screenshots/snapshots

* Fix distance between search bar and tabs

* Update compound

* Update screenshots/snapshots
2024-07-09 11:36:50 +00:00
Michael Telatynski
466f37a83d
Improve new room header accessibility (#12725)
* Fix room header topic not showing on keyboard navigation whilst still using tabstops

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

* Fix keyboard activation of the room header FacePile

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

* Fix label on room header facepile

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

* Comment

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

* Update src/components/views/elements/FacePile.tsx

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2024-07-08 11:52:26 +00:00
Michael Telatynski
2a26afe438
Redesign room search interface (#12677)
* Extract SearchInfo interface and SearchScope enum

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

* Fix in-progress and update behaviour of RoomSearchView

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

* Remove search button from legacy header

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

* Move search from aux panel to room summary card

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

* Wire up Cmd/Ctrl F for moved search field

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

* Use cpd space tokens

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

* Remove stale props

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

* Fix ctrl/cmd f search shortcut

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

* Tests

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

* Tests

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

* Update Compound

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

* Revert the back button for now

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

* i18n

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>

* Iterate

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

* Iterate

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

* Cancel search on escape

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

* Fix missing X

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

* Improve coverage

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

* Extract SearchScope and SearchInfo into Searching

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

* delint

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

* delint

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

* Fix test

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

* Switch to icon button for cancel search

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

* Iterate

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

* yarn.lock

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

* Iterate

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

* lint

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>

* Update screenshots

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

* i18n

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>

* Update locators

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

* Revert screenshots

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

* Update screenshots

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

* Update snapshots

* Discard changes to package.json

* i18n

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

* Snapshots

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

* Handle narrow viewports

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

* Iterate

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

* Improve coverage

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

* Improve coverage

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

* Iterate

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

* Revert copy

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-07-08 09:57:41 +00:00
David Baker
81f29d13dc
Move language settings to 'preferences' (#12723)
* Move language settings to 'preferences'

Their new home is in this tab

* Update snapshot

* Move playwright test code

* Add test

* tests

* Update screenshot
2024-07-05 22:04:27 +00:00
Florian Duros
2f953f1d0f
New layout selector ui in user settings (#12676)
* feat: reworked the layout switcher

* feat: make the classname optional in EventTilePreview.tsx

* test: add tests to LayoutSwitcher

* feat: change appearance tab

* test: update appearance snapshot

* e2e: add tests

* css: add comment for gap overriding
2024-07-05 07:30:31 +00:00
David Baker
e48110d7c6
Move the account management button (#12663)
* Disable profile controls if the HS doesn't allow them to be set

Also updates to the js-sdk interface changes in https://github.com/matrix-org/matrix-js-sdk/pull/4246

* Remove unnecessary await

* Pass disabled prop to accessiblebutton in avatarsetting

* Move the account management button

The section it lives in with the server name goes, and the button
just lives on its own in the profile section.

* Update test

* Revert bits of previous PR that are no longer wanted

because we squash merge so git can no longer make sense of what changes
have been applied.

* More squash-merge fails

* More more squash merge fails
2024-07-04 09:46:26 +00:00
Florian Duros
53ea045c54
Update @vector-im/compound-web (#12718)
* deps: update `@vector-im/compound-web`

* feat: use new EditInPlace

* e2e: update snapshots
2024-07-02 12:35:13 +00:00
Florian Duros
33a017b528
New theme ui in user settings (#12576)
* Add hook to get the theme

* Adapt subsection settings to new ui

* WIP new theme subsection

* Add theme selection

* Fix test types

* Disabled theme selector when system theme is used

* Update compound to `4.4.1`

* Add custom theme support

* Remove old ThemChoicePanel

* Fix QuickThemeSwitcher-test.tsx

* Fix AppearanceUserSettingsTab-test.tsx

* Update i18n

* Fix ThemeChoicePanel-test.tsx

* Update `@vector-im/compound-web`

* Small tweaks

* Fix CSS comments and use compound variable

* Remove custom theme title

* i18n: update

* test: add tests to theme selection

* test: update AppearanceUserSettingsTab-test snapshot

* test: rework custom theme

* playwright: fix audio-player.spec.ts

* playwright: appearance tab

* test: update snapshot

* playright: add custom theme

* i18n: use correct char for ellipsis

* a11y: add missing aria-label to delete button

* dialog: update close button tooltip

* theme: remove local state and handle custom delete

* theme: don't add twice the same custom theme

* test: update snapshot

* playwright: update snapshot

* custom theme: add background to custom theme list

* update compound web

* Use new destructive property on `IconButton` of theme panel

* test: update snapshots

* rename new ui into legacy

* remove wrong constructor doc

* fix theme selector padding

* theme selector: fix key

* test: fix e2e
2024-06-26 15:47:01 +00:00
Michael Telatynski
8ede89101a
Adjust room header hover transition from 300ms to 200ms (#12703)
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-06-26 14:17:12 +00:00
David Baker
ea0baee101
Split out email & phone number settings to separate components & move discovery to privacy tab (#12670)
* WIP update of threepid settings section

* Remove email / phone number section from original place

and don't show the new one if 3pids are disabled

* Update snapshots

* Pull identity server / 3pid binding settings out to separate component

and put it in the security & privacy section which is its new home

* Update snapshot

* Move relevant part of test & update screenshots / snapshots

* Remove unnecessary dependency

* Add test for discovery settings

* Add spacing in terms agreement
2024-06-26 13:04:19 +00:00
Florian Duros
6c99b91210
Minor tweaks to UserSettings dialog (#12651)
* Make user settings dialog title looks like figma design

* dialog: add title to close button

* Update dialog snapshot

* Update playwright snapshot
2024-06-20 09:29:38 +00:00
Michael Telatynski
1cf3045a5b
Fix stray background colour on markdown body (#12628)
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2024-06-17 16:20:18 +00:00
David Baker
650b9cb0cf
Add in-progress view to display name EditInPlace (#12609)
* Add in-progress view to display name EditInPlace

Requires https://github.com/element-hq/compound-web/pull/180

* Update to new compound-web

for editinplace component with spinner

* Update snapshots

for https://github.com/element-hq/compound-web/pull/178

* Update screenshots

* Remove margin

which isn't necessary now there's no 'Remove' link on the bottom

* Update screenshots
2024-06-14 14:16:13 +00:00
Michael Telatynski
8c49f3f2ea
Update gfm.css to github-markdown-css (#12613)
* Update gfm.css to github-markdown-css

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-06-13 16:27:37 +00:00
David Baker
7091ca02b0
Add hover / active state on avatsetting upload button (#12590) 2024-06-07 16:16:41 +00:00
David Baker
1696c5cd0a
Change avatarsetting componment to use a menu (#12585)
* 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 display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* Fix room profile display

* Update edit icon on avatarsetting comnponent

* Change avatarsetting componment to use a menu

As per the designs, remove the 'remove' link and instead have a menu
pop up to either upload a new file or remove the avatar.

This also changes the room profile viw, since that uses the same view.

* 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

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* 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

* Switch to useMatrixClientContext

* Fix other test

* Make clickable with no avatar again and fix tests

and renmove a test for the remove button which is no longer there

* Put back missing CSS to make the menu entry red

* Fix type error

* Fix tests

* Supply open / onOpenChange props

* Fix tests

* There is no hover anymore

* Use the computed name, not the name which may be null

* Fix room avatar remove behaviour

* Remove redundant else
2024-06-07 13:25:21 +00:00
David Baker
3c8010b719
Fix display of no avatar in avatar setting controls (#12558)
* 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 display of no avatar in avatar setting controls

There was supposed to be a person icon but it was invisible, and also
would have been inappropriate for room avatars anyway.

This makes it match the designs by being the same as whatever the
default avatar is.

* 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

* Add required props in test

* Fix test

* Also here

* Update screenshots

* Remove user icon

...which is unused now, as far as I can see.

* 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

* Switch to useMatrixClientContext

* Fix other test
2024-06-06 17:35:44 +00:00
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
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
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
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
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
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
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
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
b9bdd18666
Use green dot for activity notification in LegacyRoomHeader (#12270) 2024-02-22 13:36:12 +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
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
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
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
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
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
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
Timo
e26d3e9b68
Update element call embedding UI (#12056)
Signed-off-by: Timo K <toger5@hotmail.de>
2023-12-20 12:39:57 +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
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
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
Andy Balaam
97d871cba9
Merge pull request #11674 from manancodes/manancodes/Edited_message_ux_fix
Fix: Edited message remove button is hard to reach.
2023-10-02 10:53:19 +01:00
Michael Telatynski
e0f4b26512
Remove focus-visible polyfill (#11677)
* Remove focus-visible polyfill

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>
2023-09-28 11:52:26 +00:00
Manan Sadana
8e4de798a5
Fix: Theme selector radio button not aligned in center with the text (#11676)
* Theme selector radio button aligned in center with the text

* fixed alignment, align-items at correct position now

---------

Co-authored-by: Manan Sadana <manan.sadana@cnhteam.onmicrosoft.com>
2023-09-28 10:26:01 +00:00
Manan Sadana
2e0eb63fe2 Room avatar alignment fixed 2023-09-27 21:19:07 +05:30
Manan Sadana
c16aba5c3a
Merge branch 'develop' into manancodes/Edited_message_ux_fix 2023-09-27 17:03:00 +05:30
Manan Sadana
99a2d024ec Changed hover ui of edited messages for a better experience 2023-09-27 16:12:49 +05:30
Manan Sadana
2cfdf2ced9
Fix: Unread notification dot aligned (#11658)
Co-authored-by: Manan Sadana <manan.sadana@cnhteam.onmicrosoft.com>
2023-09-27 06:36:31 +00:00
Germain
d99618263a
Merge branch 'develop' into germain-gg/facepile-offset 2023-09-25 11:33:28 +01:00
Germain
7378b7fdd1 Fix more button sizing in face pile 2023-09-22 17:07:43 +01:00