Commit Graph

4703 Commits

Author SHA1 Message Date
Suguru Hirahara
ee4484fa40
Use spacing variables on _SpotlightDialog.scss (#8871) 2022-06-19 11:50:32 +02:00
Suguru Hirahara
da9f2f6caa
Improve _InviteDialog.scss by applying spacing variables (#8869) 2022-06-19 10:17:05 +02:00
Suguru Hirahara
edf071acae
Fix position of message action bar on the info tile on TimelineCard in message bubble layout (#8865) 2022-06-18 14:29:04 +00:00
Suguru Hirahara
e8f56c26d0
Remove inline start margin from display name in reply tile on the timeline with a maximized widget (#8864) 2022-06-18 14:27:17 +00:00
Suguru Hirahara
c4460d8add
Move EventTile style rules of compact modern layout, enabling it on the right panel as well (#8766) 2022-06-18 15:43:23 +02:00
Janne Mareike Koschinski
162be6ca94
Improve homeserver dropdown dialog styling (#8850) 2022-06-17 16:29:03 +02:00
Suguru Hirahara
239b59d4a8
Tidy _SettingsTab.scss (#8819)
* Include descedants of mx_SettingsTab_section

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include descedants of mx_SettingsFlag

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use logical properties and variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include a descedant of mx_SettingsTab_heading

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove redundant declarations specified by default with _SettingsFlag.scss

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use not logical properties

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include a in mx_SettingsTab

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-17 11:04:52 +02:00
Suguru Hirahara
c5bc91291d
Fix grid blowout on pinned event tiles (#8816)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-17 08:34:33 +02:00
Suguru Hirahara
43f2ee4283
Fix reactions row overflow and gap between reactions (#8813) 2022-06-16 17:47:37 +00:00
Suguru Hirahara
3b28b1100f
Include mx_MessageActionBar_maskButton in mx_MessageActionBar (#8792)
* Include mx_MessageActionBar_maskButton in mx_MessageActionBar

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-16 14:34:56 +01:00
Suguru Hirahara
fe8c267a14
Create a common header on right panel cards on BaseCard (#8808)
* Remove duplicate declarations and add height and overflow properties

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move mx_TimelineCard__header under mx_BaseCard_header for normalization

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize mx_BaseCard_close position

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize className of header

- mx_BaseCard_header__ThreadPanel
- mx_BaseCard_header__TimelineCard

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize header's button size

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize inline start header margin

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* normalize header bottom margin for PinnedMessagesCard and TimelineCard

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize header declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Add mixin RightPanelCard

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common declarations - top level

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common declarations - mx_BaseCard_header

Remove specific declarations on PinnedMessagesCard

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common declarations - mx_BaseCard_back and mx_BaseCard_close

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Create a common class name - mx_BaseCard_header_title

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Create a common class name - mx_BaseCard_header_title - ThreadPanel

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common declarations - mx_BaseCard_header_title

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common declarations - span:first-of-type

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove redundant declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Rename a variable to remove --ThreadPanel_header-button-size

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove class name - mx_BaseCard_header_title

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove mx_BaseCard_header_title--ThreadPanel and h2 declarations from PinnedMessagesCard

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Headers need Heading

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use spacing variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move common style rules of mx_ContextualMenu inside mx_BaseCard_header_title to BaseCard

leaving style rules specific to ThreadPanel.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Hide long header title with ellipsis

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules - BaseCard_header-button-size

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules - BaseCard_header margin-bottom

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules - BaseCard back and close margin

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules - BaseCard back ~ mx_BaseCard_header_title

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules - mx_BaseCard_header_title

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Return special declarations to _ThreadPanel.scss

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove the mixin

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Add mx_BaseCard_header_title_button--option

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove redundant margin from AppTileFullWidth

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Header on mx_RoomSummaryCard - remove default declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove default declarations from mx_UserInfo

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use variables - _BaseCard.scss

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-16 09:22:45 +02:00
Suguru Hirahara
81c894f2d9
Stop using mx_GroupLayout for styling (#8711) 2022-06-15 17:26:24 +00:00
Suguru Hirahara
1188f1a508
Remove margin from E2E icon between avatar and hidden event (#8584)
* Remove margin from warning E2E icon between an avatar and a hidden event

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use a variable to ensure the same spacing around the E2E icon

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Apply the style to E2E icon

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Rename variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-15 09:50:35 -06:00
Suguru Hirahara
1b426ce0c8
Organize style rules of AccessSecretStorageDialog to avoid visual bugs (#8395)
* .mx_AccessSecretStorageDialog

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* .mx_AccessSecretStorageDialog_primaryContainer

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* .mx_AccessSecretStorageDialog_titleWithIcon

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Adopt BEM style

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-15 09:47:25 -06:00
Suguru Hirahara
78ba5e35a3
Fix waveform on a message bubble (#8852)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-15 15:37:08 +00:00
Janne Mareike Koschinski
9333e609b0
Update the avatar mask so it doesn’t cut off spaces’ avatars anymore (#8849)
* Update the avatar mask so it doesn’t cut off spaces’ avatars anymore
* Remove unused mask
* Remove unused class
2022-06-15 14:32:25 +00:00
Janne Mareike Koschinski
5096e7b992
Integrate searching public rooms and people into the new search experience (#8707)
* Implement searching for public rooms and users in new search experience
* Implement loading indicator for spotlight results
* Moved spotlight dialog into own subfolder
* Extract search result avatar into separate component
* Build generic new dropdown menu component
* Build new network menu based on new network dropdown component
* Switch roomdirectory to use new network dropdown
* Replace old networkdropdown with new networkdropdown
* Added component for public room result details
* Extract hooks and subcomponents from SpotlightDialog
* Create new hook to get profile info based for an mxid
* Add hook to automatically re-request search results
* Add hook to prevent out-of-order search results
* Extract member sort algorithm from InviteDialog
* Keep sorting for non-room results stable
* Sort people suggestions using sort algorithm from InviteDialog
* Add copy/copied tooltip for invite link option in spotlight
* Clamp length of topic for public room results
* Add unit test for useDebouncedSearch
* Add unit test for useProfileInfo
* Create cypress test cases for spotlight dialog
* Add test for useLatestResult to prevent out-of-order results
2022-06-15 16:14:05 +02:00
Suguru Hirahara
37298d7b1b
Remove Riot-era media query declarations of event tile on mobile UI (#8814)
* Apply style declarations for mobile UI to modern layout, which breaks the current layout

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove the style declarations to restore the current layout

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Readd zero margin for event tile content

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove a comment

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-15 08:44:39 +02:00
Travis Ralston
39f2bbaaf4
Bring back waveform for voice messages and retain seeking (#8843)
* Crude way of layering the waveform and seek bar

Not intended for production.

* Use a layout prop instead of something less descriptive

* Fix alignment properly, and play with styles

* Convert back to a ball

* Use `transparent` which makes NVDA happy enough

* Allow keyboards in the seek bar

* Try to make the clock behave more correctly with screen readers

MIDNIGHT

* Remove legacy export

* Remove redundant attr

* Appease the linter
2022-06-14 18:13:13 -06:00
Šimon Brandner
7da8c51c6b
Improve colors in settings (#7283) 2022-06-14 18:17:10 +00:00
Michael Telatynski
3c5c2bef6d
Remove Piwik support (#8835)
* Remove all mentions of Piwik

* Kill off all consumer of the old Piwik Analytics module

* Simplify ModalManager interface

* i18n

* Attempt to fix old e2e tests

* Remove unused component

* Iterate PR
2022-06-14 17:51:51 +01:00
Suguru Hirahara
1dee39f419
Improve help user settings tab styling (#8838)
* Set the default margin between the debug button and the subsection texts

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove obsolete style rule for AccessibleButton

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove the special block margin setting from the reload button

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove obsolete class name - mx_HelpUserSettingsTab_versions

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace <br>s for spacing with a margin style declaration

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace <br> for spacing with a margin style declaration

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove <br>s for spacing

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Apply mx_SettingsTab_subsectionText to the credits list

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Apply spacing-16 instead of spacing-12

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-14 15:20:54 +02:00
Suguru Hirahara
d1b95e5491
Remove obsolete style rules for "Show my Communities" which has been removed (#8839)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-14 13:43:51 +01:00
Suguru Hirahara
2c751a4fa6
Remove unique settings from labs user settings tab (#8828)
* Remove redundant style declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove obsolete float setting

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove special margin setting

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove unnecessary specificity

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Reset the margin with a variable

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-14 09:05:43 +02:00
Michael Telatynski
b03aa2ebf5
Move room directory Puppeteer tests over to Cypress (#8832)
* Fix user view percy test by sticking the user avatar colour

* Move room directory Puppeteer tests over to Cypress

* Consolidate import

* Fix tests

* Grab default widths

* Tweak Percy CSS mechanism
2022-06-13 19:25:39 +01:00
Suguru Hirahara
dfdba46d57
Remove _NotificationUserSettingsTab.scss (#8831) 2022-06-13 17:30:07 +02:00
Suguru Hirahara
95e8a9e419
Fix keyboard shortcuts on settings tab being wrapped (#8825)
* Fix keyboard shortcuts being wrapped

Setting $spacing-8 gap between the labels and the shortcuts

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Add the block margin to the rows, not to the keys

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Add the inline margin to the shortcuts, not to the keys

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-13 16:12:48 +02:00
Janne Mareike Koschinski
57dff8131c
Prevent new composer from overflowing from non-breakable text (#8829) 2022-06-13 13:05:41 +02:00
Suguru Hirahara
cda18a3dfb
Improve CSS rules of zoom buttons on live location (#8728)
* Use flex to stop redundant margin-top from appearing

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove ButtonResetDefault which resets nothing

It should be avoided to use ButtonResetDefault where there is nothing to be reset, in order to prevent resources from being wasted.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Ensure that unexpected regressions will never happen on the buttons and their icons

Rules can be extracted when needed. Until then there is no point of exposing elements to possible regressions, which could easily happen on the current architecture.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use SASS variables and remove a redundant declaration

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-13 09:23:49 +02:00
Suguru Hirahara
68ce7bf35e
Remove an obsolete style declaration of .mx_ReplyChain_show (#8743)
It was added with https://github.com/matrix-org/matrix-react-sdk/pull/6291/files#diff-11808ff6468e6efa5982f414119fcc8a3a3eea4090b1a4ebda8ed6eae732418aR163

It has not been effective for unknown period, and since the layout of the area has changed, it should be able to be safely removed.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-13 09:17:48 +02:00
Suguru Hirahara
18d7f7c525
Use mx_SettingsTab_subsectionText for the text under the top header of appearance user settings tab (#8822) 2022-06-12 14:52:55 +00:00
Suguru Hirahara
d1d4cc42bc
Use common subheading on sidebar user settings tab (#8823) 2022-06-12 15:12:34 +02:00
Suguru Hirahara
6b40c0b2e3
Tidy _AppearanceUserSettingsTab.scss (#8824) 2022-06-12 15:11:33 +02:00
Suguru Hirahara
89743c9321
Fix clickable area of advanced toggle on appearance user settings tab (#8820) 2022-06-12 13:13:41 +02:00
Šimon Brandner
9b8b1d193e
Disable redacting reactions if we don't have sufficient permissions (#8767) 2022-06-10 18:41:05 +00:00
Suguru Hirahara
1b7e9d95da
Fix flex blowout on image reply (#8809)
* Set min-width to prevent a flex blowout

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use a native spacing property

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set max-width: 100% to display name inside the image reply

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-10 12:36:17 +01:00
Suguru Hirahara
0d3fe300aa
Enable background color on hover for chat panel and thread panel (#8644)
* Enable background color on hover for chat panel and thread panel

- Display reactions row on hover
- Use variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace --BaseCard_EventTile-spacing-horizontal with --BaseCard_EventTile-spacing-inline

- horizontal: inline
- vertical: block

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* mx_EventTile.mx_EventTile_bad[data-layout=bubble] seems to require bubble layout

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-10 10:21:22 +02:00
Robin
8e9f7407e9
Allow AppTiles to shrink as much as necessary (#8805) 2022-06-09 13:30:58 -04:00
Robin
30460943b2
Release video rooms as a beta feature (#8431)
* Remove blank header from video room view frame

* Add a beta card for video rooms

* Rename the 'disclaimer' on beta cards to 'FAQ'

Because that's what the section actually gets used as

* Add beta pills to video room creation buttons

* Remove duplicate tooltips from face piles

* Add beta pill to headers of video rooms

* Factor RoomInfoLine out of SpaceRoomView

* Factor RoomPreviewCard out of SpaceRoomView

* Adapt RoomPreviewCard for video rooms

* "New video room" → "Video room"

* Add comment about unused cases in RoomPreviewCard

* Add types

* Clarify !important comments

* Add a reload warning

* Fix the reload warning being the wrong way around

* Fix lints

* Make widgets in video rooms mutable again to de-risk future upgrades

* Ensure that the video channel exists when mounting VideoRoomView

* Fix lint

* Iterate beta reload warning
2022-06-09 13:07:59 -04:00
Robin
d9396b0b54
Expire video member events after 1 hour (#8776)
* Expire video member events after 1 hour

* Iterate based on feedback

* Validate the types of video member events better

* Even more parentheses
2022-06-09 13:19:52 +00:00
Suguru Hirahara
12dd5a7ef0
Name lists on invite dialog (#8046)
* Place room tiles with grid

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set padding inside of name stack

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove overflow:hidden (to be cancelled)

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace text-align with margin

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Style invite failure dialog with display:grid

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge style rules of room tiles and tiles on invitation failure dialog

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Normalize avatar size for multiInviterError

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set text overflow with ellipsis

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use spacing variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set narrow gap to nameStack

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Rename mx_InviteDialog_inviterErrorTile_error

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Create mx_InviteDialog_tile

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set padding to room tiles only

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove space between name / userID and time (there is gap by default)

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove the margin from the last child

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-09 13:45:33 +01:00
Suguru Hirahara
67cace7de7
Move style rules for EventTile on ThreadView from _ThreadPanel.scss to _EventTile.scss (#8689) 2022-06-09 13:31:38 +01:00
Germain
5167521ea4
Fix scroll jump issue with the composer (#8791) 2022-06-08 15:02:15 +01:00
Germain
f568a76dc6
Fix scroll jump issue with the composer (#8788) 2022-06-08 13:29:16 +01:00
Suguru Hirahara
c304e3da51
Fix the incorrect nesting of MessageActionBar (#8785)
mx_MessageActionBar_downloadSpinnerButton::after

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-08 13:16:24 +02:00
Suguru Hirahara
36f2f3e2ce
Use MessageActionBar style declarations on pinned message card (#8757)
* Refer mx_MessageActionBar on pinned messages card

Normalize mx_MessageActionBar style rules

- Allow the varaible (--MessageActionBar-size-button) to be used
- Remove redundant declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use variables for normalization

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set class name

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Readd the comment

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use Heading size='h4'

- Use size='h4' instead of 'h2' as 15px has been specified as the font-size of the header
- Use logical values following _Heading.scss
- Remove line-height declaration in favor of the default value

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-08 12:52:25 +02:00
Suguru Hirahara
c016815562
Normalize the name of buttons on MessageActionBar (#8781)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-08 10:53:58 +01:00
Germain
aedbeb2995
Revert link color change in composer (#8784) 2022-06-08 09:11:14 +00:00
Suguru Hirahara
66daaf0748
Force style rules of buttons on MessageActionBar used with maskButton selector (#8780)
* Include mx_MessageActionBar_maskButton::after in mx_MessageActionBar_maskButton

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include mx_MessageActionBar_maskButton:hover::after in mx_MessageActionBar_maskButton

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Ensure buttons on message action bar used only with mx_MessageActionBar_maskButton as expected

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include mx_Indicator in mx_MessageActionBar_threadButton

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include mx_MessageActionBar_downloadButton.mx_MessageActionBar_downloadSpinnerButton in mx_MessageActionBar_downloadButton

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-08 11:08:49 +02:00
Suguru Hirahara
8362174039
Improve style of DialogSidebar (of live location map) (#8760) 2022-06-08 09:38:20 +01:00
Suguru Hirahara
46f07a8edb
Organize style rules of ThreadPanel header (#8672)
* Move declarations for ThreadPanel_dropdown to '.ThreadPanel__header'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move declarations under '.mx_ThreadPanel_dropdown'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move '~ .mx_ThreadPanel__header'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move '.mx_ThreadPanel__header' under '.mx_BaseCard_header'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use spacing variables for dropdown

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run link:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-08 10:22:43 +02:00
Johannes Marbach
abd39c61b1
Add support for MD / HTML in room topics (#8215)
* Add support for MD / HTML in room topics

Setting MD / HTML supported:
- /topic command
- Room settings overlay
- Space settings overlay

Display of MD / HTML supported:
- /topic command
- Room header
- Space home

Based on extensible events as defined in [MSC1767]

Fixes: vector-im/element-web#5180
Signed-off-by: Johannes Marbach <johannesm@element.io>

[MSC1767]: matrix-org/matrix-spec-proposals#1767

* Fix build error

* Add comment to explain origin of styles

Co-authored-by: Travis Ralston <travpc@gmail.com>

* Empty commit to retrigger build

* Fix import grouping

* Fix useTopic test

* Add tests for HtmlUtils

* Add slash command test

* Add further serialize test

* Fix ternary formatting

Co-authored-by: Travis Ralston <travpc@gmail.com>

* Add blank line

Co-authored-by: Travis Ralston <travpc@gmail.com>

* Properly mock SettingsStore access

* Remove trailing space

* Assert on HTML content and add test for plain text in HTML parameter

* Appease the linter

* Fix JSDoc comment

* Fix toEqual call formatting

* Repurpose test for literal HTML case

* Empty commit to fix CI

Co-authored-by: Travis Ralston <travpc@gmail.com>
Co-authored-by: Travis Ralston <travisr@matrix.org>
2022-06-07 14:20:32 -06:00
Suguru Hirahara
3a20cb1703
Improve style rules of threads list (#8706)
* Remove obsolete declarations - border-radius of EventTile_line

The border-radius is specified with .mx_EventTile[data-shape="ThreadsList"]

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move declarations for ThreadSummary on Threadslist from _ThreadsPanel.scss to _EventTile.scss

To .mx_EventTile[data-shape=ThreadsList]

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* mx_ThreadPanel_replies block is used only on threads list after all

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* &::after and &::before

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set shorthand property and use variables

- Shorthand for inset property of border between threads
- Use variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Change 'ThreadPanel_ThreadsAmount' class name to 'ThreadPanel_replies_amount'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* specific to prevent regressions

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-07 14:55:11 +01:00
Kerry
56b0b79fb7
Live location share - link to timeline tile from share warning (PSF-1078) (#8752)
* navigate to live location tile from left panel live warning

Signed-off-by: Kerry Archibald <kerrya@element.io>

* navigate to beacon tile from room live share warning

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add cursor

Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-06-07 10:15:09 +00:00
Germain
f14374a51c
Improve composer visiblity (#8578)
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
2022-06-07 07:28:29 +00:00
Šimon Brandner
8c13a0f8d4
Slightly improve the look of the Message edits dialog (#8763)
* Improve the look of the `Message edits` dialog

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

* Left-align title

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2022-06-07 07:00:27 +02:00
Germain
d388ef0e96
Reduce gutter with the new read receipt UI (#8736) 2022-06-06 10:14:38 +01:00
Suguru Hirahara
a6da89481c
Makes the avatar of the user menu non-draggable (#8765) 2022-06-06 04:25:19 +00:00
Suguru Hirahara
5ca035772d
Remove ListResetDefault (#8769) 2022-06-05 18:44:23 +00:00
Suguru Hirahara
41ee47f8c4
Tidy up mx_InviteDialog_dialPad style rules (#8762) 2022-06-05 14:31:13 +00:00
Suguru Hirahara
022535e389
Remove unnecessary ButtonResetDefault from mx_LeftPanelLiveShareWarning (#8761) 2022-06-05 13:38:57 +00:00
Suguru Hirahara
4b5816f5c1
Make the pill on the basic message composer compatible with display name in RTL languages (#8758) 2022-06-05 15:22:44 +02:00
Suguru Hirahara
dc1f53b6e9
Prevent the banner text from being selected, replacing the spacing values with the variable (#8756) 2022-06-05 08:30:29 +02:00
Suguru Hirahara
323e911fe7
Add ellipsis effect to hidden beacon status (#8755) 2022-06-05 05:40:17 +00:00
Suguru Hirahara
ef6bd3540d
Revert "Move style rules of MatrixChat_useCompactLayout from _GroupLayout.scss to _EventTile.scss and _RoomView.scss (#8725)" (#8751)
This reverts commit 228abb6f07.
2022-06-03 12:22:13 +02:00
Michael Weimann
3174cf2606
Improve widget buttons behaviour and layout (#8734)
* Improve widet buttons behaviour and layout

Relates to vector-im/element-web#20506
See PSC-79

Signed-off-by: Michael Weimann <michaelw@matrix.org>

* Add AppTile tests
2022-06-03 12:00:16 +02:00
Suguru Hirahara
228abb6f07
Move style rules of MatrixChat_useCompactLayout from _GroupLayout.scss to _EventTile.scss and _RoomView.scss (#8725)
* Move mx_RoomView_MessageList h2 block from _GroupLayout.scss to _RoomView.scss

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move mx_MatrixChat_useCompactLayout block from _GroupLayout.scss to _EventTile.scss

This block is not related to the group layout.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include EventTile_continuation block in EventTile_emote

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use logical properties for the padding values

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Sort declarations for maintainability

- EventTile_avatar
- EventTile_line
- EventTile_reply

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Separate selectors of .markdown-body

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-03 08:45:10 +02:00
Suguru Hirahara
b5ed051ecc
Use AccessibleButton for 'Reset All' link button on SetupEncryptionBody (#8730)
- Remove ButtonResetDefault to respect the concept of cascading

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-03 08:07:18 +02:00
Suguru Hirahara
54239464fa
Make sure MessageTimestamp is not hidden by EventTile_line (#8748)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-02 22:38:39 -04:00
Suguru Hirahara
68bc8112b3
Adjust message timestamp position on TimelineCard in non-bubble layouts (#8745) 2022-06-02 19:26:48 +02:00
Kerry
79a2dfe171
Live location share - enable reply and react to tiles (#8721)
* test most basic paths in messageactionbar

Signed-off-by: Kerry Archibald <kerrya@element.io>

* tidy

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use rtl for MessageActionBar test

Signed-off-by: Kerry Archibald <kerrya@element.io>

* make beacon_info events semi actionable

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove log

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test thread exception for beacon

Signed-off-by: Kerry Archibald <kerrya@element.io>

* eat click events in beacon status to stop jumping from reply tile

Signed-off-by: Kerry Archibald <kerrya@element.io>

* set max width on beaconbody for render in thread panel
2022-06-02 15:43:19 +00:00
Janne Mareike Koschinski
a74b9a7083
Prevent Invite and DevTools dialogs from being cut off (#8646)
* fix: replace fixed height based styling with flex for invite and dev dialogs
* feat: create flex wrapper class for dialogs
* feat: make invite dialogs use flex layout
* feat: make devtools dialogs use flex layout
2022-06-02 15:59:40 +02:00
Robin
4b957b57af
Squish event bubble tiles less (#8740) 2022-06-02 09:10:41 -04:00
Suguru Hirahara
abfc66a34e
Improve _ShareType.scss (#8737)
* Specify the button style explicitly removing the dependency on the mixin

The reset mixin can cause style inconsistencies by disrupting cascading arbitrarily, increasing the number of specified declarations more than needed. Though it might be useful for development, it is not necessary to use it, makes it difficult to grasp the style structure, and can be removed to optimize the structure.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove element='button' from AccessibleButton

Since AccessibleButton has role='button' by default, setting the element button property is redundant.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Protect mx_ShareType_option from being regressed structurally

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Wrap buttons with declarations for spacing

box-sizing is not required for the buttons or the wrapper.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* fix eslint errors

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Fix LocationShareMenu-test.tsx

AccessibleButton is div by default

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Reflect the review

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Revert "Remove element='button' from AccessibleButton"

This reverts commit af78d2713f6b4fca9405498e0090db1e6218ff1b.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Revert "Fix LocationShareMenu-test.tsx"

This reverts commit 7d783a733ec84af6453b2359b2d00443fcece2ef.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-02 14:18:26 +02:00
Suguru Hirahara
7c57680b93
Fix read avatars overflow from the right chat panel with a maximized widget on bubble message layout (#8470)
* Fix RR overflow on the right chat panel

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Align with RR outside of info tile

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use inset-inline property

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-06-02 02:43:07 +00:00
Suguru Hirahara
b12a272385
Use AccessibleButton for 'In reply to' link button on ReplyChain (#8726)
- Remove ButtonResetDefault mixin to respect the concept of cascading

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-31 15:52:12 -06:00
Suguru Hirahara
bae8854c13
Remove inline margin from UTD error message inside a reply tile on ThreadView (#8708)
* Remove inline margin from UTD error message inside a reply tile on ThreadView

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Merge 'mx_ReplyChain_wrapper' blocks

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-30 08:55:12 +02:00
Robin
f47121ece7
Revert "Fix wide image overflowing from the thumbnail container (#8663)" (#8709)
This reverts commit 5082d67dc1.
2022-05-27 17:18:44 +00:00
Kerry
15c2fb6b71
Live location sharing - open location in OpenStreetMap (PSF-1040) (#8695)
* share plain lat,lon string from beacon tooltip and list item

Signed-off-by: Kerry Archibald <kerrya@element.io>

* export makeMapSiteLink helper fn

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use currentColor in external-link.svg

Signed-off-by: Kerry Archibald <kerrya@element.io>

* add open in openstreetmap link

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fussy import ordering

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fix icon color var

Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-05-27 11:58:39 +02:00
Suguru Hirahara
12abbf4042
Prevent overflow of grid items on a bubble with UTD generally (#8697) 2022-05-27 10:41:53 +01:00
Suguru Hirahara
aef080ac80
Create 'Unable To Decrypt' grid layout for hidden events on a bubble layout (#8704) 2022-05-27 09:23:34 +01:00
Kerry
14cf6275d0
Fix: AccessibleButton does not set disabled attribute (PSF-1055) (#8682)
* remove old styles for pin drop buttons

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fully disable share location button until location is shared

Signed-off-by: Kerry Archibald <kerrya@element.io>

* set disabled on button

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test AccessibleButton disabled

Signed-off-by: Kerry Archibald <kerrya@element.io>

* remove disbaled check in LocationPicker

Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-05-27 07:13:50 +00:00
Suguru Hirahara
f3b762c1a8
Move unread notification dots of the threads list to the expected position (#8700)
* Change dot size from 10px to 8px

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Set inset 8px to the dot

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use shorthand properties for inset

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move blocks from '.mx_EventTile:not([data-layout=bubble])' to '.mx_EventTile[data-shape=ThreadsList]'

For a notification dot it does not matter whether the layout of the event tile is bubble or not. Instead what matters is that the dot is expected to be displayed on the threads list.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove redundant declarations

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove an obsolete z-index declaration

The declaration was added with ed34952 to fix a clickability issue. Now the event tile is clickable everywhere, it is no longer required.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-25 23:33:35 +01:00
Suguru Hirahara
dbd9911fe7
Align EventTile_line with display name on message bubble (#8692) 2022-05-25 14:08:43 +00:00
Suguru Hirahara
948f81d25f
Make the empty thread panel fill BaseCard (#8690)
Use border-box to make maintaining the layout more intuitive.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-25 14:33:27 +02:00
Suguru Hirahara
90dfb8d61f
Move style rules related to ThreadPanel from EventTile (#8683)
Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-25 09:36:12 +02:00
Suguru Hirahara
03c2bdbde1
Remove ButtonResetDefault from mx_AccessibleButton of EventTile_keyRequestInfo_text (#8678)
To respect the concept of cascading. Also using a mixin to unset the declarations can easily cause a style inconsistency.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-25 08:45:18 +02:00
Suguru Hirahara
8afb1abd36
Fix a grid blowout due to nowrap displayName on a bubble with UTD (#8688) 2022-05-25 06:50:36 +02:00
Suguru Hirahara
412c207b23
Apply the same max-width to image tile on the thread timeline as message bubble (#8669) 2022-05-25 06:31:39 +02:00
Matthew Hodgson
ef69946440
Improve combining diacritics in Chrome (#8687)
This makes all but 9 of U+20D0 to U+20F0 combine
correctly on Chrome. See also
https://bugs.chromium.org/p/chromium/issues/detail?id=1328898
2022-05-24 21:37:08 -06:00
Suguru Hirahara
ed2c79051e
Fix dropdown button size for picture-in-picture CallView (#8680) 2022-05-24 17:49:04 +02:00
Kerry
6cdeb64408
fix square border for initial avatar (#8679)
Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-05-24 17:14:41 +02:00
Suguru Hirahara
9f1bffcd34
Fix file button and audio player overflowing from message bubble (#8666)
* Fix file button and audio player overflowing from message bubble

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move '.mx_EventTile_image' to '.mx_EventTile_mediaLine'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use class names for now, adding a TODO comment

Remove unset as it is no longer required.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-24 09:06:04 +02:00
Suguru Hirahara
ef977146c3
Prevent possible regressions of EventTile structurally (#8647)
* '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'

- Include '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'
- Merge '.mx_EventTile_e2eIcon_warning' and '.mx_EventTile_e2eIcon_normal'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* mx_EventTile_spoiler

- Group 'mx_EventTile_spoiler'
- mx_EventTile_spoiler.visible

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group 'mx_EventTile_button'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_collapseButton' and '.mx_EventTile_expandButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_body .mx_EventTile_pre_container'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_copyButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_collapseButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_expandButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_copyButton' and '.mx_EventTile_collapseButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Group '.mx_EventTile_collapseButton'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include '.mx_EventTile_collapsedCodeBlock' in '.mx_EventTile_pre_container'

Collapsed code block is displayed only in mx_EventTile_pre_container

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* .mx_EventTile_keyRequestInfo

- Include '.mx_EventTile_keyRequestInfo_text' in '.mx_EventTile_keyRequestInfo'
- Include '.mx_AccessibleButton' in '.mx_EventTile_keyRequestInfo_text'
- Include '.mx_EventTile_keyRequestInfo_tooltip_contents p:first-child' and 'p:last-child' in '.mx_EventTile_keyRequestInfo_tooltip_contents p'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Separate properties of mx_EventTile_button

The properties which should only be applied to buttons inside mx_EventTile_pre_container should not be applied to the top level.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Apply mask-size of collapse button and expand button to ones in mx_EventTile_pre_container only

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move declarations of buttons from mx_EventTile_button to mx_EventTile_pre_container

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move buttons declarations below mx_EventTile_button

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Include '.mx_EventTile_pre_container' in '.mx_EventTile_body .mx_EventTile_pre_container'

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Specify width and height to only buttons in mx_EventTile_pre_container

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Dedupe 'mx_EventTile_e2eIcon' ::before

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Hide buttons in mx_EventTile_pre_container and show them on hover by default

Setting "visibility: hidden" to mx_EventTile_button can easily cause a regression. The declaration should be exclusively applied to buttons inside mx_EventTile_pre_container, and "visibility: visible" should be set to those buttons only.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove redundant nestings for E2E icons

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 21:16:50 +01:00
Suguru Hirahara
20fd68b902
Organize UserInfo.scss (#8461)
* .mx_UserInfo_profileField under .mx_UserInfo_memberDetails

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* .mx_UserInfo_container:not(.mx_UserInfo_separator) under .mx_UserInfo_container

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* reorganize structure of .mx_UserInfo_avatar - 1

.mx_UserInfo_avatar > div > div *

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* reorganize structure of .mx_UserInfo_avatar - 2

.mx_UserInfo_avatar > div > div

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* reorganize structure of .mx_UserInfo_avatar - 3

.mx_UserInfo_avatar > div

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* reorganize structure of .mx_UserInfo_avatar - 4

- .mx_BaseAvatar_initial
- .mx_BaseAvatar

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* reorganize structure of .mx_UserInfo_avatar - 5

Move .mx_BaseAvatar_initial under .mx_BaseAvatar

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Replace a wildcard with className

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Specify className

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* .mx_UserInfo.mx_BaseCard.mx_UserInfo_smallAvatar

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Fix position of the E2E icon of expanding sessions button

To prevent the icon from moving down a little bit

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 12:42:31 +01:00
Suguru Hirahara
764b307e63
Edit properties and values of EventTile on ThreadView (#8638)
* Edit properties and values of EventTile on ThreadView

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove obsolete order properties of EventTile on ThreadView

These values are no longer required as the reactions row is displayed under the message by default.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 11:11:55 +01:00
Suguru Hirahara
eb977e6e7d
Add padding to event info tile for MessageTimestamp on TimelineCard (#8639)
* Add padding-right to EventTile_line in EventTile_info on TimelineCard

Also ensure the same padding values are applied to EventTile_line on TimelineCard.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove git diff

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 09:52:52 +00:00
Suguru Hirahara
67b0078b33
Integrate thread panel's header style declarations with those of BaseCard (#8651)
* Variable on mx_BaseCard_Header

- Use a variable for margin of buttons on mx_BaseCard_header
- Reduce default margin instead of setting negative left and right values
- Set margin to span in order to ensure spacing between the back button and the span (6px: 30px - 24px)

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use the same variable to the mask button

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Use spacing variables

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Remove obsolete declarations - mx_ThreadPanel_button

mx_ThreadPanel_button does not seem to be used anywhere.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 09:42:48 +02:00
Suguru Hirahara
5446d5d6ba
Fix position of wide images on IRC / modern layout (#8667)
* Move declarations related to position from _MImageBody.scss to _EventTile.scss

These declarations should not be defined as default values as position depends on other factors such as layout, etc.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Move min-height and min-width declarations from _MImageBody.scss to _EventTile.scss

Since min-height and min-width have been specified for bubble layout, the declarations have been expected to be applied to the other layouts.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* Apply 'justify-content: center' to bubble layout only

'justify-content: center' was added for the bubble layout with 1436f23. It should not be applied to the other layouts.

In order to prevent an issue related to cascading from happening, 'justify-content: flex-start' is explicitly specified.

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
2022-05-23 09:02:13 +02:00
Suguru Hirahara
11cb48176e
Fix other user's displayName being wrapped on the bubble message layout (#8456) 2022-05-22 09:07:29 +02:00