Commit Graph

4771 Commits (e6cddcbfe143be8bc31b6e945f1e1caa43768d6e)

Author SHA1 Message Date
Suguru Hirahara e6cddcbfe1
Remove obsolete style rules - mx_SpaceRoomView_inviteTeammates_betaDisclaimer (#11004)
* Remove obsolete style rules - mx_SpaceRoomView_inviteTeammates_betaDisclaimer

* Remove the deprecated disclaimer

* Remove ExternalLink

* Add a Percy snapshot - 'Invite your teammates' dialog
2023-05-29 21:13:52 +00:00
Kerry b35fb4fed2
Use semantic headings in user settings - profile (#10973)
* account password section

* account email and phone numbers

* update cypress selectors

* use settingsection for General section

* use semantic headings for profile settings

* fix show advanced spacing

* udpate snapshot
2023-05-29 01:36:09 +00:00
Kerry 520659242b
Fix spacing regression in user settings - roles & permissions (#10993)
* add content container to settingsfieldset

* fix spacing
2023-05-28 22:20:44 +00:00
Suguru Hirahara 6871667741
Tidy style rules related to `mx_Dialog` (#10549)
* Nest - .mx_Dialog .markdown-body

* Nest - .mx_Dialog .markdown-body *

* Run prettier

* Nest

* Nest - * .mx_Dialog_background

* Run prettier

* Nest - * .mx_Dialog

* Nest - mx_Dialog_title.danger

* Use a variable for z-index: default wrapper index

* Use a variable for z-index: static dialog background

* Use a variable for z-index: static dialog itself

* Use a variable for z-index: standard dialog background

* Use a variable for z-index: standard dialog

* Merge :root selector blocks

* Calculate z-index values to fix the order

* Rename the variables

* Include mx_Dialog_buttons_row in mx_Dialog_buttons

mx_Dialog_buttons_row is used on DialogButtons.tsx only inside mx_Dialog_buttons under {additive}

* Run prettier

* Nest `pre code` in `pre`
2023-05-26 13:28:29 +00:00
Kerry 530197bfcd
Move session manager out of beta (#10968)
* remove old device manager

* undo type fix for cypress crypto

* update test case
2023-05-26 01:58:28 +00:00
Kerry d0d9a36d07
Use semantic headings in user settings - account (#10972)
* account password section

* account email and phone numbers

* update cypress selectors
2023-05-25 22:42:01 +00:00
Suguru Hirahara 953da1ae2a
Remove `_RoleButton.pcss` (#10958)
* Remove obsolete style rules

These have been obsolete since 3c5c2bef6d.

* Remove _RoleButton.pcss

mx_RoleButton_tooltip style rules are used only on NotificationBadge.tsx.

* Rename the class
2023-05-25 04:03:19 +00:00
Suguru Hirahara 0c30f0c838
Simplify nodes on `ThirdPartyMemberInfo` (#10889)
* Remove mx_MemberInfo_profileField

* Merge mx_MemberInfo_profile with mx_MemberInfo_container

* Remove redundant div elements

* Update a Jest snapshot
2023-05-24 08:28:15 +00:00
Kerry 9f011b955b
Use semantic headings in user settings - discovery (#10838)
* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* put back margin var

* use SettingsTab wrapper

* use semantic headings for deactivate acc section

* use semantic heading in manage integratios

* i18n

* use currentColor in warning-triangle svg, update use in RoomStatusBar

* use semantic headings for discovery section

* test manage integration settings

* test deactivate account section display

* remove SettingsFieldset margins

* threepids styles

* remove debug

* test discovery email and phone
2023-05-24 02:37:10 +00:00
Kerry 9211da20f4
Use semantic headings in user settings - Notifications (#10948)
* use semantic headings in user notif settings

* unset margin for subsection content when no heading

* remove debug
2023-05-23 23:36:09 +00:00
Kerry f491f2f951
use semantic headings for spellcheck and language (#10959) 2023-05-23 23:34:56 +00:00
Kerry 2f2804f8af
fix content overflow in settings subsection (#10960) 2023-05-23 23:31:56 +00:00
Suguru Hirahara b7cd1f00fc
Use `Icon` component for icons on AppTile's menu bar (#10955)
* Use icon component for buttons on mx_AppTileMenuBar_widgets

* Remove redundant declarations

* Add a Percy snapshot test

* Set color value to mx_Icon, fill and stroke with currentColor

* Iterate
2023-05-22 07:48:40 +00:00
Suguru Hirahara 2e3cb0adf7
Replace a Sass variable with a CSS custom property - hover-transition (#10786) 2023-05-22 07:40:40 +00:00
Suguru Hirahara 08c0f332b3
Remove an obsolete CSS file - _ChatCreateOrReuseChatDialog.pcss (#10949)
It has been obsolete since f85898cdca.
2023-05-21 23:50:14 +00:00
Kerry b3b03e5dcb
Use semantic headings in user settings Appearance (#10827)
* split SettingsSection out of SettingsTab, replace usage

* correct copyright

* use semantic headings in GeneralRoomSettingsTab

* use SettingsTab and SettingsSubsection in room settings

* fix VoipRoomSettingsTab

* use SettingsSection components in space settings

* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* use ExternalLink components for external links

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* use new settings components in eventindexpanel

* findByTestId

* prettier

* semantic headings and style refresh for crypto settings

* e2e panel

* use semantic headings in User settings appearance tab

* update selectors in tests

* tidy
2023-05-21 21:12:11 +00:00
Kerry 55336bf932
Use semantic heading in user settings Sidebar & Voip (#10782)
* split SettingsSection out of SettingsTab, replace usage

* correct copyright

* use semantic headings in GeneralRoomSettingsTab

* use SettingsTab and SettingsSubsection in room settings

* fix VoipRoomSettingsTab

* use SettingsSection components in space settings

* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* use ExternalLink components for external links

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* use new settings components in eventindexpanel

* findByTestId

* prettier

* semantic headings and style refresh for crypto settings

* e2e panel

* semantic headings and cleanup in Sidebar user settings

* semantic heading in voice user settings

* sonarcloud bug and test
2023-05-19 00:03:39 +00:00
Kerry d9a61c093c
Use semantic headings in user settings Security (#10774)
* split SettingsSection out of SettingsTab, replace usage

* correct copyright

* use semantic headings in GeneralRoomSettingsTab

* use SettingsTab and SettingsSubsection in room settings

* fix VoipRoomSettingsTab

* use SettingsSection components in space settings

* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* use ExternalLink components for external links

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* use new settings components in eventindexpanel

* findByTestId

* prettier

* semantic headings and style refresh for crypto settings

* e2e panel

* test cross signing panel

* strict

* more strict

* tweak

* test eventindexpanel

* strict fixes
2023-05-18 22:32:10 +00:00
Suguru Hirahara fabfae172b
Update `_AuxPanel.pcss` (#10888)
* Fix class names - from m_ to mx_

* Move mx_RoomView_auxPanel from _RoomView.pcss to _AuxPanel.pcss

The class name 'mx_RoomView_auxPanel' belongs to AuxPanel, not RoomView

* Correct naming

* Strictify: mx_RoomView_auxPanel *

* Nest mx_AuxPanel_stateViews_span

* Sort

* Run prettier

* Use custom properties

* Revert "Use custom properties"

This reverts commit fe720d05f4572e74e71887203d43c491f0723a92.
2023-05-18 08:54:31 +00:00
Suguru Hirahara 9f574cc764
Replace Sass variable with CSS custom property: --selected-message-border-width (#10876) 2023-05-18 04:18:59 +00:00
Suguru Hirahara 7917d973e7
Fix widget permission tooltip style rules by applying the naming policy properly (#10916) 2023-05-17 08:51:18 +00:00
Kerry 8cd84b0e7b
Use semantic headings in user settings - integrations and account deletion (#10837)
* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* put back margin var

* use SettingsTab wrapper

* use semantic headings for deactivate acc section

* use semantic heading in manage integratios

* i18n

* explicit cast to boolean

* Update src/components/views/settings/shared/SettingsSubsection.tsx

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

* test manage integration settings

* test deactivate account section display

* remove debug

* fix cypress test

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2023-05-17 07:52:44 +00:00
Kerry 68b1930852
Use semantic headings in user settings Keyboard (#10793)
* settingssubsection text component

* use semantic headings in HelpUserSetttings tab

* test

* strict

* lint

* semantic heading in labs settings

* semantic headings in keyboard settings tab

* semantic heading in preferencesusersettingstab

* tidying

* findByTestId

* prettier

* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* use semantic headings in usersettingspreferences

* rethemendex

* put back margin var
2023-05-17 02:34:55 +00:00
Kerry 38ae8e98e4
Use semantic headings in user settings Preferences (#10794)
* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* use semantic headings in usersettingspreferences

* rethemendex

* put back margin var
2023-05-17 01:16:49 +00:00
Suguru Hirahara 4cc6ab1187
Remove AnalyticsPolicyLink (#10924) 2023-05-16 15:52:30 +00:00
Suguru Hirahara e01d47923d
Deprecate `mx_RightPanel_headerButton` class (#10821)
* Replace: %s/mx_RightPanel_headerButton/mx_RoomHeader_button/g

* Conform the selectors to our naming policy: with flag (--)

- %s/mx_RoomHeader_button_highlight/mx_RoomHeader_button--highlight/g
- %s/mx_RoomHeader_button_unread/mx_RoomHeader_button--unread/g

* Update a Jest snapshot

* Move the declarations and Sass variables

- Move Sass variables to the place where they are used
2023-05-16 15:42:58 +00:00
Suguru Hirahara 7f017a84c2
Make `Privacy Notice` external link on integration manager ToS clickable (#10914) 2023-05-16 12:54:38 +00:00
Suguru Hirahara 2eedfbf566
Split `mx_AppPermissionWarning` on `_AppsDrawer.pcss` into two classes (#10824)
* Separate mx_AppWarning and mx_AppPermission

* Remove mx_AppPermission_row for a type selector

* Nest: mx_AppPermission

* Run prettier

* Create a CSS file for AppPermission
2023-05-16 11:14:52 +01:00
Suguru Hirahara ae692f712a
Replace Sass variables with custom properties - mx_Indicator (#10808) 2023-05-16 11:12:45 +01:00
Kerry 9bab356e20
Use semantic headings in user settings Labs (#10773)
* allow testids in settings sections

* use semantic headings in LabsUserSettingsTab

* put back margin var

* explicit cast to boolean

* Update src/components/views/settings/shared/SettingsSubsection.tsx

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

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2023-05-16 01:22:45 +00:00
Suguru Hirahara 77d18f1a43
Remove default margin and padding from `mx_TabbedView_tabLabels` (#10907) 2023-05-15 18:57:29 +01:00
Michael Telatynski 296ed2273e
Use semantic list elements for menu lists and tab lists (#10902)
* Use semantic list elements for pop up menu lists

* Use semantic list elements for tab lists

* Fix tests

* Update snapshot
2023-05-15 13:33:49 +00:00
Suguru Hirahara 4d59a6ff1f
Fix timeline search bar being overlapped by the right panel (#10809)
* Set zero min-width to prevent input area blowout

* Set min-width values to mx_SearchBar_input and mx_SearchBar_button

* Prevent the input area and cancel button from being overlapped by BaseCard

* Use custom properties: --size-button-search

* Take Percy snapshot of mx_SearchBar

* Apply suggestions from code review

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

* Edit a comment

* Feedback

* Edit a comment

* Update cypress/e2e/timeline/timeline.spec.ts

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

---------

Co-authored-by: Richard van der Hoff <1389908+richvdh@users.noreply.github.com>
2023-05-15 11:58:59 +00:00
Robin d213dff4c6
Make widgets take up the full height of the PiP again (#10886)
This fixes a visual regression introduced in 73007d6dd6f6e714d30bbe2292f80133c14538dd: AppTiles with the class mx_AppTile_mini don't get an mx_AppsDrawer as their parent, so the --AppTile_mini-height variable needs a broader scope.
2023-05-15 11:54:29 +00:00
Suguru Hirahara 3b2216ec9d
Fix class name of the read marker on `MessagePanel` (#10745)
* Optimize mx_RoomView_myReadMarker

- Replace the compound selector with a type selector
- Nest the type selector in "mx_RoomView_myReadMarker_container"

* Conform the style rules to the naming policy

Including "container" in a class name is redundant as our naming policy tells that a string followed by an underscore (_) represents a container if it contains an element.

* Run prettier

* Replace `mx_RoomView_myReadMarker hr` with `mx_RoomView_myReadMarker`

- Remove a unit
- Hide hr's parent (mx_RoomView_myReadMarker) on Percy snapshots

* Change the class name from `mx_RoomView_myReadMarker` to `mx_MessagePanel_myReadMarker`

The read marker is specified on MessagePanel.tsx, and should be named so to avoid confusion.

- Create _MessagePanel.pcss for the style rules of MessagePanel

* Update permalinks.spec.ts
2023-05-15 11:02:04 +00:00
Suguru Hirahara fb3f20f70c
Conform _AppsDrawer.pcss to the naming policy - AppDrawer variants (#10856)
* Conform _AppsDrawer.pcss to the naming policy - AppDrawer variants

* Sort style blocks

* Feedback
2023-05-15 09:05:14 +00:00
Suguru Hirahara 64733e5982
Conform `_AppsDrawer.pcss` to our naming policy - move styles specific to `mx_AppTileMenuBar` to be nested inside it (#10877)
* Nest: mx_AppTileMenuBar

* Run prettier
2023-05-12 11:33:23 +00:00
Suguru Hirahara cb779fe872
Conform the style rules of `GeneralUserSettingsTab.tsx` to the style guide (#10595)
* Nesting: `mx_GeneralUserSettingsTab_changePassword`

* Nesting: `mx_Spinner`

* Conform the style rules to the naming policy

For elements inside "mx_GeneralUserSettingsTab_accountSection" and "mx_GeneralUserSettingsTab_discovery"

* Conform `mx_GeneralUserSettingsTab_discovery_existing*` to the naming policy
2023-05-12 10:33:01 +00:00
Suguru Hirahara 73007d6dd6
Tidy up `_AppsDrawer.pcss` (#10775)
* Nesting

* Run prettier

* Common style rules for `mx_AppTileBody` and `mx_AppTileBody_mini`

* Common style rules for iframe

* Use a custom property for height

* Replace with a custom property - $MiniAppTileHeight

* Replace with a custom property - $MinWidth

* Group common declarations

* Sorting
2023-05-11 15:26:41 +00:00
Suguru Hirahara d944422417
Tidy up `_MemberInfo.pcss` (#10862)
* Nest: mx_MemberInfo_name *

* Nest: mx_MemberInfo *

* Nest: mx_MemberInfo_avatar
2023-05-11 13:01:12 +00:00
Suguru Hirahara 5cdbdd9f97
Update some class names of AppTile on the naming policy (#10777) 2023-05-09 21:07:12 +00:00
Suguru Hirahara dc8ea8dc27
Replace `$timeline-image-border-radius` with a CSS custom property (#10792)
* Use CSS custom property: --timeline-image-border-radius

Remove the same variable from _MImageBody.pcss

* Rename the property

The property is neither limited to a timeline nor image, but applied to M.*?Body components as well, such as MLocationBody and MVideoBody.
2023-05-09 21:06:19 +00:00
Suguru Hirahara b3fd9377d6
Use shorthand "inset" property (#10825) 2023-05-09 10:02:12 +00:00
Suguru Hirahara d2fa0af3c0
Manage rules for `mx_RoomView` on `_RoomView.pcss` - `_ScrollPanel.pcss` (#10770)
* Move style rules of `mx_RoomView_MessageList` from _ScrollPanel.pcss on _RoomView.pcss

* Nesting: `mx_RoomView--local .mx_ScrollPanel`
2023-05-09 08:32:16 +00:00
Suguru Hirahara 556a36f7d5
Remove obsolete style blocks from _MemberInfo.pcss (#10816)
* Remove obsolete style blocks from _MemberInfo.pcss

Deprecated by 2b432b0d82

* Remove obsolete style blocks from _MemberInfo.pcss

Deprecated by fce36ec826
2023-05-09 08:22:40 +00:00
Suguru Hirahara ed5c02be6d
Fix long room address and name not being clipped on room info card and update `_RoomSummaryCard.pcss` (#10811)
* Handle a long room address and name with ellipsis on RoomSummaryCard

* Use a class selector for maintainability

Sort the selectors
2023-05-09 07:56:09 +00:00
Suguru Hirahara dc9a00f280
Remove an obsolete variable and use a custom property for Slider (#10779) 2023-05-09 05:16:40 +00:00
Suguru Hirahara 1cfe126e14
Fix icon on empty notification panel (#10817)
* Use custom properties for the empty panel icons on FilePanel and NotificationPanel

* Create E2E test for the notification panel
2023-05-09 05:02:08 +00:00
Suguru Hirahara aed5fcf64a
Update `mx_AppLoading` to improve maintainability (#10783)
* Nesting: mx_AppLoading

* Conform class and animation name to the naming policy

* Nesting for maintainability, preventing the rule from becoming an orphan

* Rename the class: mx_AppLoading to mx_AppTile_loading
2023-05-08 12:38:04 +00:00
Suguru Hirahara 53fcb0c36e
Remove mixin `mx_Tooltip_dark` and rename class `mx_Tooltip_dark` (#10801)
* Remove a mixin - mx_Tooltip_dark

The mixin has been used on `_AppsDrawer.pcss` only.

* Rename mx_Tooltip_dark based on the naming policy

'mx_Tooltip_dark' has been used on `AppPermission.tsx` only.
2023-05-08 03:01:00 +00:00