6806c2cdca
Enlarge emoji in composer ( #7602 )
2022-01-24 12:53:05 +00:00
a2f1e856be
Make room ID copyable ( #7600 )
2022-01-24 11:47:59 +00:00
a00d359422
Fix left positioned tooltips being wrong and offset by fixed value ( #7551 )
...
Previously, the `left` positioning seemed to only work with icons which are all about the same size so the arbitrary offset worked. Now we actually position off to the left of the element and we have equal `margin-left` and `margin-right` to determine the offset.
Spawned from https://github.com/matrix-org/matrix-react-sdk/pull/7339#discussion_r767154349
2022-01-18 21:08:11 -06:00
368085982f
Add hover background color to SSO buttons ( #7500 )
2022-01-10 13:30:31 +00:00
fed53a268b
A11y - fix anchors-as-buttons ( #7444 )
...
* add link_inline accessiblebutton variant
* valid anchors in SecurityRoomSettingsTab
Signed-off-by: Kerry Archibald <kerrya@element.io>
* new room intro link button
Signed-off-by: Kerry Archibald <kerrya@element.io>
* replace anchor with button in rerequest encryption keys message
Signed-off-by: Kerry Archibald <kerrya@element.io>
* inline button in UrlPreviewSettings
Signed-off-by: Kerry Archibald <kerrya@element.io>
* ButtonResetDefault mixin
Signed-off-by: Kerry Archibald <kerrya@element.io>
* inline link buttons in TextForEvent
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in InviteDialog
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in DevToolsDialog
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in login/registration/reset pword flows
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix types after fixing anchors in devtools
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in MemberEventListSummary
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in ReactionsRow and RoomUpgrade
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in ReplyChain
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix more anchors
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix anchors in auth comps
* stylelint fixes
Signed-off-by: Kerry Archibald <kerrya@element.io>
* remove ignore of jsx-a11y rule that is not added yet
Signed-off-by: Kerry Archibald <kerrya@element.io>
* devtools style important explainer
Signed-off-by: Kerry Archibald <kerrya@element.io>
* translate button alt in devtools dialog
Signed-off-by: Kerry Archibald <kerrya@element.io>
* AccessibleButton is reactionsrow
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix viewsourcevent button placement, use AccessibleButton
Signed-off-by: Kerry Archibald <kerrya@element.io>
* use AccessibleButton in EventTile
Signed-off-by: Kerry Archibald <kerrya@element.io>
* unignore jsx-a11y/anchor-is-valid
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix lint issue in test jsx
Signed-off-by: Kerry Archibald <kerrya@element.io>
* update coment
Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-01-07 10:40:53 +01:00
f4a94f6e7f
Add new line in settings label ( #7451 )
2022-01-04 10:57:29 +01:00
2e3f225520
Put room settings form elements in fieldsets ( #7311 )
...
* override default fieldset styles
Signed-off-by: Kerry Archibald <kerrya@element.io>
* SettingsFieldset component
Signed-off-by: Kerry Archibald <kerrya@element.io>
* test settings fieldset
Signed-off-by: Kerry Archibald <kerrya@element.io>
* refactor SettingsFlag styles
* use SettingsFieldset in room > securit settings
* use fieldset in urlpreviewsettings
Signed-off-by: Kerry Archibald <kerrya@element.io>
* use SettingsFieldset in AliasSettings
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fieldset in room > roles settings
Signed-off-by: Kerry Archibald <kerrya@element.io>
* css lint
Signed-off-by: Kerry Archibald <kerrya@element.io>
* run i18n
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fussy order
Signed-off-by: Kerry Archibald <kerrya@element.io>
* default export
Signed-off-by: Kerry Archibald <kerrya@element.io>
* fix copyright headers
Signed-off-by: Kerry Archibald <kerrya@element.io>
2021-12-09 18:44:22 +01:00
1216285ed2
Add descriptions to ambiguous links for screen readers ( #7310 )
...
* add title to room share link
Signed-off-by: Kerry Archibald <kerrya@element.io>
* add ExternalLink component
Signed-off-by: Kerry Archibald <kerrya@element.io>
* unit test ExternalLink
Signed-off-by: Kerry Archibald <kerrya@element.io>
* default target and rel for external link
Signed-off-by: Kerry Archibald <kerrya@element.io>
* use scss $font variables
Signed-off-by: Kerry Archibald <kerrya@element.io>
2021-12-09 13:04:06 +01:00
0c850b2f13
Make tooltips keyboard accessible ( #7281 )
...
* show tooltips on hover in eventtile
Signed-off-by: Kerry Archibald <kerrya@element.io>
* use tooltip props pass thru
* use tooltiptarget in InfoTooltip
Signed-off-by: Kerry Archibald <kerrya@element.io>
* use target in TestWithTooltip
Signed-off-by: Kerry Archibald <kerrya@element.io>
* tsc fixes
Signed-off-by: Kerry Archibald <kerrya@element.io>
* test tooltip target
Signed-off-by: Kerry Archibald <kerrya@element.io>
* lint fix
Signed-off-by: Kerry Archibald <kerrya@element.io>
* rename tooltip handlers
Signed-off-by: Kerry Archibald <kerrya@element.io>
* update copyright to 2021
Signed-off-by: Kerry Archibald <kerrya@element.io>
2021-12-09 11:47:50 +01:00
26297f5498
Corrected the alignment of the Edit button on LoginPage. ( #7292 )
2021-12-07 07:20:09 +00:00
9bcb82d6dc
Add CSS variable to make the UI gaps consistent and fix the resize handle position ( #7234 )
...
Co-authored-by: J. Ryan Stinnett <jryans@gmail.com>
2021-12-06 13:10:52 +01:00
4a6d46b76a
Replace breadcrumbs with recently viewed menu ( #7073 )
2021-12-01 10:50:06 +00:00
347bbefd46
Fix left panel glow in Safari ( #7236 )
...
Add back removed CSS
2021-11-30 17:30:41 +00:00
9db0ebb7f5
Task/colors 11 ( #7211 )
2021-11-29 12:52:09 +00:00
556cfc7ed8
Add maximise widget functionality ( #7098 )
...
Co-authored-by: J. Ryan Stinnett <jryans@gmail.com>
2021-11-16 15:43:18 +01:00
9abb2f5ff4
Color cleanup 8 ( #7108 )
...
* $accent-color -> $accent
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $notice-primary-color -> $alert
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $notice-primary-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-50pct
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $warning-color -> $alert
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-darker
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $orange-warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $warning-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $info-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-11-11 13:37:29 +00:00
71d8946641
Color cleanup number 7 ( #7094 )
...
* $reaction-row-button-selected-border-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $reaction-row-button-bg-color -> $header-panel-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $room-warning-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $button-link-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $tab-label-icon-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $tab-label-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $event-redacted-border-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $event-redacted-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $panel-divider-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $search-placeholder-color -> #61708b
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $search-bg-color -> #181b21
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $header-panel-border-color -> #000000
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $scrollbar-track-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $eventbubble-avatar-outline -> $background
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-11-10 09:46:33 +00:00
50ff00084f
Change radio button border colour to match design ( #7087 )
2021-11-10 09:34:21 +00:00
07d9e93d67
Color cleanup number six ( #7050 )
...
* Remove $voip-decline-color and $voip-accept-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $dialog-background-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $mention-user-pill-bg-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $plinth-bg-color -> $secondary-accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-lighter-fg-color -> $input-darker-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-valid-border-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-invalid-border-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $avatar-bg-color -> $background
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $preview-widget-fg-color -> $greyed-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $settings-profile-button-fg-color -> $settings-profile-overlay-placeholder-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $presence-online -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $pinned-unread-color -> $notice-primary-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $event-highlight-fg-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $tab-label-active-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-primary-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-danger-bg-color -> $notice-primary-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-link-fg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $togglesw-on-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $slider-selection-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $progressbar-fg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $authpage-body-bg-color -> $background
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix merge issue
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix second merge issue
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-11-08 11:50:53 +00:00
9c8e1d32e2
Rename mx_RadioButton to mx_StyledRadioButton to match class name ( #7083 )
2021-11-04 12:57:38 +00:00
57fae01991
Improve the look of tooltips ( #7049 )
2021-11-02 09:41:33 +00:00
f643839a00
Improve the look of the spinner ( #6083 )
2021-11-02 09:35:06 +00:00
73731cc478
Polls: Creation form & start event ( #7001 )
...
* PSFD-423: Permission check for polls dialog
* PSFD-423: Implement compound scrollable dialog and skeleton create poll
* PSFD-325: Ask the question
* PSFD-328: Ask for options
* PSFD-423: Ensure form submission semantics work for dialogs
* PSFD-328: Option semantics
* Can delete all option to end up with zero
* Minimum 2 to submit the form
* PSFD-316: Send poll start event
* Appease the linter
* PSFD-328: Reduce padding between options to account for field size
* Iterate per design
* Fix submission
2021-11-01 23:44:42 -06:00
71244f3b3c
Add more checkbox styles ( #7058 )
...
Add a "kind" param for StyledCheckbox, allowing designers to choose different styles of checkbox as needed. In addition to the preexisting default kind (now called Solid), there's an Outline kind with a green checkmark and a transparent fill. This is used in the device trust view, since the default checkbox style looks too much like the green "verified" shield and it's awkward to have those next to each other.
2021-10-29 21:57:32 -04:00
d88b8efd19
Improve device list in Security & Privacy settings ( #7004 )
...
Overhaul the device list in the "Security and Privacy" settings tab to include device trust status, provide buttons for verifying unverified devices, and improve overall usability and style. This should now be the primary interface for checking and changing the trust status of your own devices, rather than looking at your own user profile in the right panel.
2021-10-29 18:11:39 -04:00
166fba6428
Improve the appearance of the font size slider ( #7038 )
2021-10-26 13:29:02 +01:00
5c66bd6c7b
Add `max-empty-lines` and `no-eol-whitespace` to stylelint ( #7034 )
2021-10-26 08:23:23 +01:00
96bd052ecf
Improve visibility of font size chooser ( #6988 )
...
* Improve visibility of font size chooser
* Move slider dot sizes into variables
* Use a standard font size instead of percentage in Slider
* Use shorthand for padding in FontScalingPanel
* Change Slider text pos to px to be consistent when font changes
* Cleaner dot size for Slider selection
2021-10-20 13:41:27 +01:00
77e6e1c0ab
Merge pull request #6960 from matrix-org/gsouquet/rename-replythread
2021-10-18 17:11:31 +01:00
1691127ad2
$field-focused-label-bg-color -> $background
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-10-16 20:21:20 +02:00
5a7c0d87b6
Rename ReplyThread to ReplyChain to avoid confusion with m.thread
2021-10-15 17:42:44 +01:00
e1c1d2dc0f
Merge pull request #6840 from wlach/make-placeholder-for-field-grey-no-input
...
Make placeholder more grey when no input
2021-10-08 12:54:57 +01:00
8c9cd0d2f4
Merge pull request #6865 from robintown/cut-off-pills
2021-09-27 16:39:04 +01:00
0cfa2a58c7
Add ability to expand and collapse long quoted messages ( #6701 )
...
In case where we had a very long message the experience of going between
messages to see the full quote isn't very nice on desktop, therefore this commit
adds a button with additional hotkey to normalize the experience a bit.
Fixes https://github.com/vector-im/element-web/issues/18884
2021-09-27 12:20:37 +02:00
b08e05ebe7
Fix pills being cut off in message bubble layout
...
Signed-off-by: Robin Townsend <robin@robin.town>
2021-09-26 10:24:46 -04:00
b2c0f57c4b
More prefers-reduced-motion friendliness
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-09-21 17:59:13 +02:00
7022ab4f8a
Merge remote-tracking branch 'upstream/develop' into feature/image-view-load-anim/18186
2021-09-21 17:36:26 +02:00
499b470d07
Use CSS var in JS
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-09-21 17:36:16 +02:00
b257393d74
Make placeholder more grey when no input ( fixes #17243 )
...
The placeholder is actually the label in this case.
2021-09-19 07:48:35 -04:00
8e3be15365
Move animations into _animations
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-09-14 18:05:15 +02:00
1a128c3a00
Merge remote-tracking branch 'upstream/develop' into feature/image-view-load-anim/18186
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-09-11 15:32:44 +02:00
049040b67d
Optimize input label transition on focus
...
Fix https://github.com/vector-im/element-web/issues/12876
2021-09-11 02:03:55 -05:00
9fdc5659b7
Fixed eslint error and copyright header
2021-08-28 13:56:08 +02:00
d76adde1ab
Use scss instead of inline styles
2021-08-28 13:41:24 +02:00
49453f2d49
Merge pull request #6604 from SimonBrandner/task/colors-2
...
Color de-duplication #2
2021-08-24 12:37:18 -06:00
751c57ecc2
Add some padding to the Add button
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-24 10:05:24 +02:00
8b59bf3d18
$tertiary-fg-color -> $tertiary-content
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:19:29 +02:00
10bc85724a
$secondary-fg-color -> $secondary-content
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:19:26 +02:00
e5fd19c332
$primary-fg-color -> $primary-content
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:18:18 +02:00
2afee596a9
$primary-bg-color -> $background
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:17:34 +02:00
Robin