Merge branches 'develop' and 't3chguy/leaks' of github.com:matrix-org/matrix-react-sdk into t3chguy/leaks

 Conflicts:
	src/components/views/avatars/BaseAvatar.js
This commit is contained in:
Michael Telatynski 2020-05-15 00:16:41 +01:00
commit 5844bee8f2
771 changed files with 25042 additions and 9044 deletions

View file

@ -1,119 +0,0 @@
steps:
- label: ":eslint: JS Lint"
command:
# We fetch the develop js-sdk to get our latest eslint rules
- "echo '--- Install js-sdk'"
- "./scripts/ci/install-deps.sh --ignore-scripts"
- "echo '+++ Lint'"
- "yarn lint:js"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: ":eslint: TS Lint"
command:
- "echo '--- Install'"
- "yarn install --ignore-scripts"
- "echo '+++ Lint'"
- "yarn lint:ts"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: ":eslint: Types Lint"
command:
- "echo '--- Install'"
- "yarn install --ignore-scripts"
- "echo '+++ Lint'"
- "yarn lint:types"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: ":stylelint: Style Lint"
command:
- "echo '--- Install'"
- "yarn install --ignore-scripts"
- "yarn lint:style"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: ":jest: Tests"
agents:
# We use a medium sized instance instead of the normal small ones because
# webpack loves to gorge itself on resources.
queue: "medium"
command:
- "echo '--- Install js-sdk'"
# We don't use the babel-ed output for anything so we can --ignore-scripts
# to save transpiling the files. We run the transpile step explicitly in
# the 'build' job.
- "./scripts/ci/install-deps.sh --ignore-scripts"
- "yarn run reskindex"
- "echo '+++ Running Tests'"
- "yarn test"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: "🛠 Build"
command:
- "echo '+++ Install & Build'"
- "yarn install"
plugins:
- docker#v3.0.1:
image: "node:12"
- label: ":chains: End-to-End Tests"
agents:
# We use a xlarge sized instance instead of the normal small ones because
# e2e tests otherwise take +-8min
queue: "xlarge"
command:
- "echo '--- Install js-sdk'"
- "./scripts/ci/install-deps.sh --ignore-scripts"
- "echo '+++ Running Tests'"
- "./scripts/ci/end-to-end-tests.sh"
plugins:
- docker#v3.0.1:
image: "matrixdotorg/riotweb-ci-e2etests-env:latest"
propagate-environment: true
workdir: "/workdir/matrix-react-sdk"
retry:
automatic:
- exit_status: 1 # retry end-to-end tests once as Puppeteer sometimes fails
limit: 1
- label: "🔧 Riot Tests"
agents:
# We use a medium sized instance instead of the normal small ones because
# webpack loves to gorge itself on resources.
queue: "medium"
command:
- "echo '+++ Running Tests'"
- "./scripts/ci/riot-unit-tests.sh"
plugins:
- docker#v3.0.1:
image: "node:10"
propagate-environment: true
workdir: "/workdir/matrix-react-sdk"
- label: "🌐 i18n"
command:
- "echo '--- Fetching Dependencies'"
- "yarn install --ignore-scripts"
- "echo '+++ Testing i18n output'"
- "yarn diff-i18n"
plugins:
- docker#v3.0.1:
image: "node:10"
- wait
- label: "🐴 Trigger riot-web"
trigger: "riot-web"
branches: "develop"
build:
branch: "develop"
message: "[react-sdk] ${BUILDKITE_MESSAGE}"
async: true

View file

@ -1 +1,4 @@
src/component-index.js
test/end-to-end-tests/node_modules/
test/end-to-end-tests/riot/
test/end-to-end-tests/synapse/

View file

@ -1,6 +1,5 @@
# autogenerated file: run scripts/generate-eslint-error-ignore-file to update.
src/component-index.js
src/components/structures/RoomDirectory.js
src/components/structures/RoomStatusBar.js
src/components/structures/RoomView.js
@ -9,7 +8,6 @@ src/components/structures/SearchBox.js
src/components/structures/UploadBar.js
src/components/views/avatars/MemberAvatar.js
src/components/views/create_room/RoomAlias.js
src/components/views/dialogs/DeactivateAccountDialog.js
src/components/views/dialogs/SetPasswordDialog.js
src/components/views/dialogs/UnknownDeviceDialog.js
src/components/views/elements/AddressSelector.js
@ -30,7 +28,6 @@ src/components/views/rooms/MemberInfo.js
src/components/views/rooms/MemberList.js
src/components/views/rooms/RoomList.js
src/components/views/rooms/RoomPreviewBar.js
src/components/views/rooms/SearchBar.js
src/components/views/rooms/SearchResultTile.js
src/components/views/settings/ChangeAvatar.js
src/components/views/settings/ChangePassword.js
@ -43,7 +40,6 @@ src/notifications/ContentRules.js
src/notifications/PushRuleVectorState.js
src/PlatformPeg.js
src/rageshake/rageshake.js
src/rageshake/submit-rageshake.js
src/ratelimitedfunc.js
src/Rooms.js
src/Unread.js
@ -59,4 +55,7 @@ test/components/views/dialogs/InteractiveAuthDialog-test.js
test/mock-clock.js
test/notifications/ContentRules-test.js
test/notifications/PushRuleVectorState-test.js
test/stores/RoomViewStore-test.js
src/component-index.js
test/end-to-end-tests/node_modules/
test/end-to-end-tests/riot/
test/end-to-end-tests/synapse/

View file

@ -1,3 +1,766 @@
Changes in [2.5.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0) (2020-05-05)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.6...v2.5.0)
* Upgrade to JS SDK 6.0.0
* EventIndex: Reduce the logging the event index is producing.
[\#4551](https://github.com/matrix-org/matrix-react-sdk/pull/4551)
* Differentiate copy for own untrusted device dialog
[\#4550](https://github.com/matrix-org/matrix-react-sdk/pull/4550)
* More detailed progress for key backup progress
[\#4545](https://github.com/matrix-org/matrix-react-sdk/pull/4545)
* Increase rageshake size limit to 5mb
[\#4544](https://github.com/matrix-org/matrix-react-sdk/pull/4544)
Changes in [2.5.0-rc.6](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.6) (2020-05-01)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.5...v2.5.0-rc.6)
* Upgrade to JS SDK 6.0.0-rc.2
* Wait for user to be verified in e2e setup
[\#4538](https://github.com/matrix-org/matrix-react-sdk/pull/4538)
* Add device name to unverified session toast
[\#4536](https://github.com/matrix-org/matrix-react-sdk/pull/4536)
Changes in [2.5.0-rc.5](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.5) (2020-04-30)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.4...v2.5.0-rc.5)
* Upgrade to JS SDK 6.0.0-rc.1
* Fix device verification toasts not disappearing
[\#4533](https://github.com/matrix-org/matrix-react-sdk/pull/4533)
* Allow resetting storage from the access dialog
[\#4526](https://github.com/matrix-org/matrix-react-sdk/pull/4526)
* Update toast copy again
[\#4530](https://github.com/matrix-org/matrix-react-sdk/pull/4530)
* Reduce maximum width of toasts & allow multiple lines
[\#4528](https://github.com/matrix-org/matrix-react-sdk/pull/4528)
* Treat sessions that are there when we log in as old
[\#4527](https://github.com/matrix-org/matrix-react-sdk/pull/4527)
* Update (bulk) unverified device toast copy
[\#4523](https://github.com/matrix-org/matrix-react-sdk/pull/4523)
* Make new device toasts appear above review toasts
[\#4520](https://github.com/matrix-org/matrix-react-sdk/pull/4520)
* Separate toasts for existing & new device verification
[\#4517](https://github.com/matrix-org/matrix-react-sdk/pull/4517)
* Aggregate device verify toasts
[\#4516](https://github.com/matrix-org/matrix-react-sdk/pull/4516)
* Fix set up encryption toast to use "set up" as action
[\#4515](https://github.com/matrix-org/matrix-react-sdk/pull/4515)
* Fix internal link styling in Security Settings
[\#4512](https://github.com/matrix-org/matrix-react-sdk/pull/4512)
* Don't enable e2ee when inviting a 3pid
[\#4513](https://github.com/matrix-org/matrix-react-sdk/pull/4513)
* only clear on continuations where the clear isn't done by SenderProfile
[\#4505](https://github.com/matrix-org/matrix-react-sdk/pull/4505)
* cap width of editable item list item to leave space for its X button
[\#4504](https://github.com/matrix-org/matrix-react-sdk/pull/4504)
* Add a link from settings / devices to your user profile
[\#4499](https://github.com/matrix-org/matrix-react-sdk/pull/4499)
* Make icon change in SetupEncryptionDialog
[\#4490](https://github.com/matrix-org/matrix-react-sdk/pull/4490)
* Remove invite only padlocks feature flag for release
[\#4488](https://github.com/matrix-org/matrix-react-sdk/pull/4488)
* Fix incorrect toast if security setup skipped
[\#4489](https://github.com/matrix-org/matrix-react-sdk/pull/4489)
* Revert "Update emojibase for fixed emoji codepoints and Emoji 13 support"
[\#4483](https://github.com/matrix-org/matrix-react-sdk/pull/4483)
* Fix recovery link on login verification flow
[\#4480](https://github.com/matrix-org/matrix-react-sdk/pull/4480)
Changes in [2.5.0-rc.4](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.4) (2020-04-23)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.3...v2.5.0-rc.4)
* Upgrade to JS SDK 5.3.1-rc.4
* Take encrypted message search out of labs for release
[\#4468](https://github.com/matrix-org/matrix-react-sdk/pull/4468)
* Update login security copy and design to match Figma [to release]
[\#4474](https://github.com/matrix-org/matrix-react-sdk/pull/4474)
* Fix i18n of SSO UIA copy in Deactivate Account Dialog on release
[\#4473](https://github.com/matrix-org/matrix-react-sdk/pull/4473)
* Skip auth flow test for signing upload when password present
[\#4465](https://github.com/matrix-org/matrix-react-sdk/pull/4465)
* Fix: wait until cross-signing keys are fetched to show verify button
[\#4457](https://github.com/matrix-org/matrix-react-sdk/pull/4457)
* Handle load error in create secret storage dialog
[\#4454](https://github.com/matrix-org/matrix-react-sdk/pull/4454)
* Don't recheck DeviceListener until after initial sync is finished
[\#4450](https://github.com/matrix-org/matrix-react-sdk/pull/4450)
* EventIndex: Filter out events that don't have a propper content value.
[\#4447](https://github.com/matrix-org/matrix-react-sdk/pull/4447)
Changes in [2.5.0-rc.3](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.3) (2020-04-17)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.2...v2.5.0-rc.3)
* Upgrade to JS SDK 5.3.1-rc.3
Changes in [2.5.0-rc.2](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.2) (2020-04-16)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.5.0-rc.1...v2.5.0-rc.2)
* Upgrade to JS SDK 5.3.1-rc.2
* [Release] Convert cross-signing flag to a setting
[\#4429](https://github.com/matrix-org/matrix-react-sdk/pull/4429)
* Iterate cross-signing copy
[\#4426](https://github.com/matrix-org/matrix-react-sdk/pull/4426)
* Fix: ensure twemoji font is loaded when showing SAS emojis
[\#4423](https://github.com/matrix-org/matrix-react-sdk/pull/4423)
Changes in [2.5.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.5.0-rc.1) (2020-04-15)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.4.0-rc.1...v2.5.0-rc.1)
* Upgrade to JS SDK 5.3.1-rc.1
* null-guard MatrixClientPeg in RoomViewStore
[\#4415](https://github.com/matrix-org/matrix-react-sdk/pull/4415)
* Fix: prevent spurious notifications from indexer
[\#4414](https://github.com/matrix-org/matrix-react-sdk/pull/4414)
* Login block on initialSync with spinners
[\#4413](https://github.com/matrix-org/matrix-react-sdk/pull/4413)
* Allow network dropdown to be scrollable and fix context menu padding calc
[\#4408](https://github.com/matrix-org/matrix-react-sdk/pull/4408)
* Remove end-to-end message info option when cross-signing is used
[\#4412](https://github.com/matrix-org/matrix-react-sdk/pull/4412)
* Minimize widgets by default
[\#4378](https://github.com/matrix-org/matrix-react-sdk/pull/4378)
* Add comments to highlight where we'll need m.widget support
[\#4380](https://github.com/matrix-org/matrix-react-sdk/pull/4380)
* Fix: dont try to enable 4S if cross-signing is disabled
[\#4407](https://github.com/matrix-org/matrix-react-sdk/pull/4407)
* Fix: don't confuse user with spinner during complete security step
[\#4406](https://github.com/matrix-org/matrix-react-sdk/pull/4406)
* Fix: avoid potential crash during certain verification paths
[\#4405](https://github.com/matrix-org/matrix-react-sdk/pull/4405)
* Add riot-desktop shortcuts for forward/back matching browsers&slack
[\#4392](https://github.com/matrix-org/matrix-react-sdk/pull/4392)
* Convert LoggedInView to an ES6 PureComponent Class & TypeScript
[\#4398](https://github.com/matrix-org/matrix-react-sdk/pull/4398)
* Fix width of MVideoBody in FilePanel
[\#4396](https://github.com/matrix-org/matrix-react-sdk/pull/4396)
* Remove unused react-addons-css-transition-group
[\#4397](https://github.com/matrix-org/matrix-react-sdk/pull/4397)
* Fix emoji tooltip flickering
[\#4395](https://github.com/matrix-org/matrix-react-sdk/pull/4395)
* Pass along key backup for bootstrap
[\#4374](https://github.com/matrix-org/matrix-react-sdk/pull/4374)
* Fix create room dialog e2ee private room setting
[\#4403](https://github.com/matrix-org/matrix-react-sdk/pull/4403)
* Sort emoji by shortcodes for autocomplete primarily for :-1 and :+1
[\#4391](https://github.com/matrix-org/matrix-react-sdk/pull/4391)
* Fix invalid commands when figuring out whether to set isTyping
[\#4390](https://github.com/matrix-org/matrix-react-sdk/pull/4390)
* op/deop return error if trying to affect an unknown user
[\#4389](https://github.com/matrix-org/matrix-react-sdk/pull/4389)
* Composer pills respect showPillAvatar setting
[\#4384](https://github.com/matrix-org/matrix-react-sdk/pull/4384)
* Only send typing notification when composing commands which send messages
[\#4385](https://github.com/matrix-org/matrix-react-sdk/pull/4385)
* Reverse order of they match/they don't match buttons
[\#4386](https://github.com/matrix-org/matrix-react-sdk/pull/4386)
* Use singular text on 'delete sessions' button for SSO
[\#4383](https://github.com/matrix-org/matrix-react-sdk/pull/4383)
* Pass widget data through from sticker picker
[\#4377](https://github.com/matrix-org/matrix-react-sdk/pull/4377)
* Obliterate widgets when they are minimized
[\#4376](https://github.com/matrix-org/matrix-react-sdk/pull/4376)
* Fix image thumbnail width when read receipts are hidden
[\#4370](https://github.com/matrix-org/matrix-react-sdk/pull/4370)
* Add toggle for e2ee when creating private room
[\#4362](https://github.com/matrix-org/matrix-react-sdk/pull/4362)
* Fix logging for failed searches
[\#4372](https://github.com/matrix-org/matrix-react-sdk/pull/4372)
* Ensure UI is updated when cross-signing gets disabled
[\#4369](https://github.com/matrix-org/matrix-react-sdk/pull/4369)
* Retry the request for the master key from SSSS on login
[\#4371](https://github.com/matrix-org/matrix-react-sdk/pull/4371)
* Upgrade deps
[\#4365](https://github.com/matrix-org/matrix-react-sdk/pull/4365)
* App load tweaks, i18n and localStorage
[\#4367](https://github.com/matrix-org/matrix-react-sdk/pull/4367)
* Fix encoding of widget arguments
[\#4366](https://github.com/matrix-org/matrix-react-sdk/pull/4366)
Changes in [2.4.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.4.0-rc.1) (2020-04-08)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.3.1...v2.4.0-rc.1)
* Upgrade to JS SDK to 5.3.0-rc.1
* EventIndex: Log if we had all events in a checkpoint but are continuing.
[\#4363](https://github.com/matrix-org/matrix-react-sdk/pull/4363)
* Update from Weblate
[\#4364](https://github.com/matrix-org/matrix-react-sdk/pull/4364)
* Support deactivating your account with SSO
[\#4356](https://github.com/matrix-org/matrix-react-sdk/pull/4356)
* Add debug status for cached backup key format
[\#4359](https://github.com/matrix-org/matrix-react-sdk/pull/4359)
* Fix composer placeholder not updating
[\#4361](https://github.com/matrix-org/matrix-react-sdk/pull/4361)
* Fix sas verification buttons to match figma
[\#4358](https://github.com/matrix-org/matrix-react-sdk/pull/4358)
* Don't show fallback text for verification requests
[\#4345](https://github.com/matrix-org/matrix-react-sdk/pull/4345)
* Fix share dialog correctly
[\#4360](https://github.com/matrix-org/matrix-react-sdk/pull/4360)
* Use singular copy when only deleting one device
[\#4357](https://github.com/matrix-org/matrix-react-sdk/pull/4357)
* Deem m.sticker events as actionable for reacting
[\#4288](https://github.com/matrix-org/matrix-react-sdk/pull/4288)
* Don't show spinner over encryption setup dialogs
[\#4354](https://github.com/matrix-org/matrix-react-sdk/pull/4354)
* Support Jitsi information from client .well-known
[\#4348](https://github.com/matrix-org/matrix-react-sdk/pull/4348)
* Add new default home page fallback
[\#4350](https://github.com/matrix-org/matrix-react-sdk/pull/4350)
* Check more account data in toast listener
[\#4351](https://github.com/matrix-org/matrix-react-sdk/pull/4351)
* Don't try to send presence updates until the client is started
[\#4353](https://github.com/matrix-org/matrix-react-sdk/pull/4353)
* Fix copy button on code blocks when there is no code tag just pre
[\#4352](https://github.com/matrix-org/matrix-react-sdk/pull/4352)
* Clear sessionStorage on sign out
[\#4346](https://github.com/matrix-org/matrix-react-sdk/pull/4346)
* Re-request room keys after auth
[\#4341](https://github.com/matrix-org/matrix-react-sdk/pull/4341)
* Update emojibase for fixed emoji codepoints and Emoji 13 support
[\#4344](https://github.com/matrix-org/matrix-react-sdk/pull/4344)
* App load order tweaks for code splitting
[\#4343](https://github.com/matrix-org/matrix-react-sdk/pull/4343)
* Fix alignment of e2e icon in userinfo and expose full displayname in title
[\#4312](https://github.com/matrix-org/matrix-react-sdk/pull/4312)
* Adjust copy & UX for self-verification
[\#4342](https://github.com/matrix-org/matrix-react-sdk/pull/4342)
* QR code reciprocation
[\#4334](https://github.com/matrix-org/matrix-react-sdk/pull/4334)
* Fix Hangul typing does not work properly
[\#4339](https://github.com/matrix-org/matrix-react-sdk/pull/4339)
* Fix: dismiss setup encryption toast if cross-signing is ready
[\#4336](https://github.com/matrix-org/matrix-react-sdk/pull/4336)
* Fix read marker visibility for grouped events
[\#4340](https://github.com/matrix-org/matrix-react-sdk/pull/4340)
* Make all 'font-size's and 'line-height's rem
[\#4305](https://github.com/matrix-org/matrix-react-sdk/pull/4305)
* Fix spurious extra devices on registration
[\#4337](https://github.com/matrix-org/matrix-react-sdk/pull/4337)
* Fix the edit messager composer
[\#4333](https://github.com/matrix-org/matrix-react-sdk/pull/4333)
* Fix Room Settings Dialog Notifications tab icon
[\#4321](https://github.com/matrix-org/matrix-react-sdk/pull/4321)
* Fix various cases of React warnings by silencing them
[\#4331](https://github.com/matrix-org/matrix-react-sdk/pull/4331)
* Only apply padding to standard textual buttons (kind buttons)
[\#4332](https://github.com/matrix-org/matrix-react-sdk/pull/4332)
* Use console.log in place of console.warn for less warnings
[\#4330](https://github.com/matrix-org/matrix-react-sdk/pull/4330)
* Revert componentDidMount changes on breadcrumbs
[\#4329](https://github.com/matrix-org/matrix-react-sdk/pull/4329)
* Use new method for checking secret storage key
[\#4309](https://github.com/matrix-org/matrix-react-sdk/pull/4309)
* Label and use UNSAFE_componentWillMount to minimize warnings
[\#4315](https://github.com/matrix-org/matrix-react-sdk/pull/4315)
* Fix a number of minor code quality issues
[\#4314](https://github.com/matrix-org/matrix-react-sdk/pull/4314)
* Use componentDidMount in place of componentWillMount where possible
[\#4313](https://github.com/matrix-org/matrix-react-sdk/pull/4313)
* EventIndex: Mark the initial checkpoints for a full crawl.
[\#4325](https://github.com/matrix-org/matrix-react-sdk/pull/4325)
* Fix UserInfo e2e buttons to match Figma
[\#4320](https://github.com/matrix-org/matrix-react-sdk/pull/4320)
* Only auto-scroll to RoomTile when clicking on RoomTile or via shortcuts
[\#4316](https://github.com/matrix-org/matrix-react-sdk/pull/4316)
* Support SSO for interactive authentication
[\#4292](https://github.com/matrix-org/matrix-react-sdk/pull/4292)
* Fix /invite Slash Command
[\#4328](https://github.com/matrix-org/matrix-react-sdk/pull/4328)
* Fix jitsi popout URL
[\#4326](https://github.com/matrix-org/matrix-react-sdk/pull/4326)
* Use our own jitsi widget for the popout URL
[\#4323](https://github.com/matrix-org/matrix-react-sdk/pull/4323)
* Fix popout support for jitsi widgets
[\#4319](https://github.com/matrix-org/matrix-react-sdk/pull/4319)
* Fix: legacy verify user throwing error
[\#4318](https://github.com/matrix-org/matrix-react-sdk/pull/4318)
* Document settingDefaults
[\#3046](https://github.com/matrix-org/matrix-react-sdk/pull/3046)
* Fix Ctrl+/ for Finnish keyboard where it includes Shift
[\#4317](https://github.com/matrix-org/matrix-react-sdk/pull/4317)
* Rework SlashCommands to better expose aliases
[\#4302](https://github.com/matrix-org/matrix-react-sdk/pull/4302)
* Fix EventListSummary when RR rendering is disabled
[\#4311](https://github.com/matrix-org/matrix-react-sdk/pull/4311)
* Update link to css location.
[\#4299](https://github.com/matrix-org/matrix-react-sdk/pull/4299)
* Fix peeking keeping two timeline update mechanisms in play
[\#4310](https://github.com/matrix-org/matrix-react-sdk/pull/4310)
* Pass new secret storage key to bootstrap path
[\#4308](https://github.com/matrix-org/matrix-react-sdk/pull/4308)
* Show red shield for users that become unverified
[\#4303](https://github.com/matrix-org/matrix-react-sdk/pull/4303)
* Accessibility fixed for Event List Summary and Composer Format Bar
[\#4295](https://github.com/matrix-org/matrix-react-sdk/pull/4295)
* Support $riot: Templates for SSO/CAS urls in the welcome.html page
[\#4279](https://github.com/matrix-org/matrix-react-sdk/pull/4279)
* Added the /html command
[\#4296](https://github.com/matrix-org/matrix-react-sdk/pull/4296)
* EventIndex: Better logging on how many events are added.
[\#4301](https://github.com/matrix-org/matrix-react-sdk/pull/4301)
* Field: mark id as optional in propTypes
[\#4307](https://github.com/matrix-org/matrix-react-sdk/pull/4307)
* Fix view community link icon contrast
[\#4254](https://github.com/matrix-org/matrix-react-sdk/pull/4254)
* Remove underscore from Jitsi conference names
[\#4304](https://github.com/matrix-org/matrix-react-sdk/pull/4304)
* Refactor shield display logic; changed rules for DMs
[\#4290](https://github.com/matrix-org/matrix-react-sdk/pull/4290)
* Fix: bring back global thin scrollbars
[\#4300](https://github.com/matrix-org/matrix-react-sdk/pull/4300)
* Keyboard shortcuts: Escape cancel reply and fix Ctrl+K
[\#4297](https://github.com/matrix-org/matrix-react-sdk/pull/4297)
* Field: make id optional, generate one if not provided
[\#4298](https://github.com/matrix-org/matrix-react-sdk/pull/4298)
* Fix ugly scrollbars in TabbedView (settings), emojipicker and widgets
[\#4293](https://github.com/matrix-org/matrix-react-sdk/pull/4293)
* Rename secret storage force-reset variable to avoid confusion
[\#4274](https://github.com/matrix-org/matrix-react-sdk/pull/4274)
* Fix: can't dismiss unverified session toast when encryption hasn't been
upgraded
[\#4291](https://github.com/matrix-org/matrix-react-sdk/pull/4291)
* Blank out UserInfo avatar when changing between members
[\#4289](https://github.com/matrix-org/matrix-react-sdk/pull/4289)
* Add cancel button to verification panel
[\#4283](https://github.com/matrix-org/matrix-react-sdk/pull/4283)
* Show ongoing verification request straight away when navigating to member
[\#4284](https://github.com/matrix-org/matrix-react-sdk/pull/4284)
* Fix: allow scrolling while window is not focused & remove scrollbar hack
[\#4276](https://github.com/matrix-org/matrix-react-sdk/pull/4276)
* Show whether backup key is cached
[\#4287](https://github.com/matrix-org/matrix-react-sdk/pull/4287)
* Rename unverified session toast
[\#4285](https://github.com/matrix-org/matrix-react-sdk/pull/4285)
* Fix: pick last active DM for verification request
[\#4286](https://github.com/matrix-org/matrix-react-sdk/pull/4286)
* Fix formatBar not hidden after highlight and backspacing some text
[\#4269](https://github.com/matrix-org/matrix-react-sdk/pull/4269)
Changes in [2.3.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.3.1) (2020-04-01)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.3.0...v2.3.1)
* Fix jitsi popout URL
[\#4327](https://github.com/matrix-org/matrix-react-sdk/pull/4327)
* Remove underscore from Jitsi conference names
[\#4324](https://github.com/matrix-org/matrix-react-sdk/pull/4324)
* Fix popout support for jitsi widgets
[\#4322](https://github.com/matrix-org/matrix-react-sdk/pull/4322)
Changes in [2.3.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.3.0) (2020-03-30)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.3.0-rc.1...v2.3.0)
* Upgrade JS SDK to 5.2.0
Changes in [2.3.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.3.0-rc.1) (2020-03-26)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.2.3...v2.3.0-rc.1)
* Upgrade JS SDK to 5.2.0-rc.1
* Add a flag to control whether cross-signing signatures are trusted
[\#4277](https://github.com/matrix-org/matrix-react-sdk/pull/4277)
* Update from Weblate
[\#4282](https://github.com/matrix-org/matrix-react-sdk/pull/4282)
* Update copy on SSSS symmetric upgrade toast
[\#4281](https://github.com/matrix-org/matrix-react-sdk/pull/4281)
* Wait for SSSS upgrade to complete
[\#4270](https://github.com/matrix-org/matrix-react-sdk/pull/4270)
* Update cross-signing verification copy and fix i18n
[\#4278](https://github.com/matrix-org/matrix-react-sdk/pull/4278)
* Fix soft-crash on bad permalinks
[\#4280](https://github.com/matrix-org/matrix-react-sdk/pull/4280)
* Fix: make self-verification wait for incoming request
[\#4267](https://github.com/matrix-org/matrix-react-sdk/pull/4267)
* Fall back to non-standard persisted api for Safari
[\#4272](https://github.com/matrix-org/matrix-react-sdk/pull/4272)
* Respond to backup key sharing requests
[\#4275](https://github.com/matrix-org/matrix-react-sdk/pull/4275)
* Log and display secret sharing cache state
[\#4268](https://github.com/matrix-org/matrix-react-sdk/pull/4268)
* Support sending config and ready events to capable widgets (Jitsi)
[\#4266](https://github.com/matrix-org/matrix-react-sdk/pull/4266)
* If cached keys are present in the key backup dialog, use them
[\#4273](https://github.com/matrix-org/matrix-react-sdk/pull/4273)
* Fix formatbar not hidden on highlighted message sent
[\#4265](https://github.com/matrix-org/matrix-react-sdk/pull/4265)
* Support Jitsi conferences sent/received on Riot Mobile and older Riot Webs
[\#4252](https://github.com/matrix-org/matrix-react-sdk/pull/4252)
* Use unified function to check cross-signing is ready
[\#4263](https://github.com/matrix-org/matrix-react-sdk/pull/4263)
* Migrate SSSS to symmetric
[\#4224](https://github.com/matrix-org/matrix-react-sdk/pull/4224)
* Migration to symmetric SSSS
[\#4242](https://github.com/matrix-org/matrix-react-sdk/pull/4242)
* Always display verification request toasts on top
[\#4262](https://github.com/matrix-org/matrix-react-sdk/pull/4262)
* Fix: assume SAS is supported when starting request with .start
[\#4249](https://github.com/matrix-org/matrix-react-sdk/pull/4249)
* Fix logout when Olm failed to load.
[\#4261](https://github.com/matrix-org/matrix-react-sdk/pull/4261)
* Improve naming of Jitsi conferences
[\#4251](https://github.com/matrix-org/matrix-react-sdk/pull/4251)
* Handle matrix.to user permalink in-room rather than solo
[\#4245](https://github.com/matrix-org/matrix-react-sdk/pull/4245)
* Fix: filter room list (again) by canonical and alternative aliases
[\#4260](https://github.com/matrix-org/matrix-react-sdk/pull/4260)
* EventIndex: Add some logging to the file panel populating.
[\#4250](https://github.com/matrix-org/matrix-react-sdk/pull/4250)
* Update from Weblate
[\#4259](https://github.com/matrix-org/matrix-react-sdk/pull/4259)
* Migrate RoomView to React Contexts in the hope for better temporal stability
[\#4258](https://github.com/matrix-org/matrix-react-sdk/pull/4258)
* Update WidgetUtils.js fix Jitsi path
[\#4256](https://github.com/matrix-org/matrix-react-sdk/pull/4256)
* Fix local jitsi build url fail and missing argument
[\#4255](https://github.com/matrix-org/matrix-react-sdk/pull/4255)
* Add shortcut CmdOrCtrl+. to toggle right panel
[\#4244](https://github.com/matrix-org/matrix-react-sdk/pull/4244)
* Improve Keyboard Shortcuts. Add alt-arrows & alt-shift-arrows
[\#4241](https://github.com/matrix-org/matrix-react-sdk/pull/4241)
* Bring back legacy verification by comparing public device keys
[\#4240](https://github.com/matrix-org/matrix-react-sdk/pull/4240)
* Searching: Return an empty result if the search term is an empty string.
[\#4248](https://github.com/matrix-org/matrix-react-sdk/pull/4248)
* Break continuation on showHiddenEvents-rendered events
[\#4247](https://github.com/matrix-org/matrix-react-sdk/pull/4247)
* Watch for show-RR settings changes, use room-specific and fix margins
[\#4246](https://github.com/matrix-org/matrix-react-sdk/pull/4246)
* Register Mac electron specific Cmd+, shortcut to User Settings
[\#4243](https://github.com/matrix-org/matrix-react-sdk/pull/4243)
* Use a local wrapper for Jitsi calls
[\#4234](https://github.com/matrix-org/matrix-react-sdk/pull/4234)
* Invite Dialog fixes
[\#4233](https://github.com/matrix-org/matrix-react-sdk/pull/4233)
* RoomPreviewBar word-break the sender name too
[\#4239](https://github.com/matrix-org/matrix-react-sdk/pull/4239)
* Report to the user when a key signature upload fails
[\#4229](https://github.com/matrix-org/matrix-react-sdk/pull/4229)
* pre-send megolm keys when possible when a user starts typing
[\#4235](https://github.com/matrix-org/matrix-react-sdk/pull/4235)
* we don't do mx_fadable anymore so get rid of broken RightPanel disabling
[\#4238](https://github.com/matrix-org/matrix-react-sdk/pull/4238)
* Fix left left panel overflowing vertically
[\#4237](https://github.com/matrix-org/matrix-react-sdk/pull/4237)
* Fix custom tags causing left panel to over-expand
[\#4236](https://github.com/matrix-org/matrix-react-sdk/pull/4236)
* Add Keyboard shortcuts dialog
[\#4231](https://github.com/matrix-org/matrix-react-sdk/pull/4231)
* Don't use buildkite agent to upload logs
[\#4232](https://github.com/matrix-org/matrix-react-sdk/pull/4232)
* Remove Gemini Scrollbars
[\#4217](https://github.com/matrix-org/matrix-react-sdk/pull/4217)
* Room Directory Explore Servers redesign
[\#4209](https://github.com/matrix-org/matrix-react-sdk/pull/4209)
* Fix redo keyboard shortcut on macOS
[\#4110](https://github.com/matrix-org/matrix-react-sdk/pull/4110)
* Fix: ensure local state for aliases doesn't get garbled up
[\#4230](https://github.com/matrix-org/matrix-react-sdk/pull/4230)
* Rename 'jump to bottom' to avoid ublock block
[\#4208](https://github.com/matrix-org/matrix-react-sdk/pull/4208)
* Restore key backup in background after complete security
[\#4225](https://github.com/matrix-org/matrix-react-sdk/pull/4225)
* Fix key backup trust text for cross-signing
[\#4223](https://github.com/matrix-org/matrix-react-sdk/pull/4223)
* Add default on config setting to control call button in composer
[\#4227](https://github.com/matrix-org/matrix-react-sdk/pull/4227)
* Fix: make alternative addresses UX less confusing
[\#4221](https://github.com/matrix-org/matrix-react-sdk/pull/4221)
* Wait for verification request on login
[\#4222](https://github.com/matrix-org/matrix-react-sdk/pull/4222)
* EventIndex: Add support to delete events from the index.
[\#4204](https://github.com/matrix-org/matrix-react-sdk/pull/4204)
* EventIndex: Remove a checkpoint if the HTTP request returns a 403.
[\#4214](https://github.com/matrix-org/matrix-react-sdk/pull/4214)
* Move to composer when typing letters with Shift held
[\#4216](https://github.com/matrix-org/matrix-react-sdk/pull/4216)
* Wrap large room names when previewing them
[\#4213](https://github.com/matrix-org/matrix-react-sdk/pull/4213)
* Rename Review Devices to Review Sessions
[\#4219](https://github.com/matrix-org/matrix-react-sdk/pull/4219)
* Fix typo in tabIndex to make React happy
[\#4215](https://github.com/matrix-org/matrix-react-sdk/pull/4215)
* Proof of concept for custom theme adding
[\#4148](https://github.com/matrix-org/matrix-react-sdk/pull/4148)
* Remove stuff that yarn install doesn't think we need
[\#4205](https://github.com/matrix-org/matrix-react-sdk/pull/4205)
* Declare jsx in tsconfig for IDEs
[\#4207](https://github.com/matrix-org/matrix-react-sdk/pull/4207)
* Fix: best-effort to join room without canonical alias over federation from
room directory
[\#4210](https://github.com/matrix-org/matrix-react-sdk/pull/4210)
* Test for cross-signing homeserver support during login, toasts
[\#4206](https://github.com/matrix-org/matrix-react-sdk/pull/4206)
* Send verification request to a single device in a way compatible with non-
cross-signing
[\#4202](https://github.com/matrix-org/matrix-react-sdk/pull/4202)
* Fixes for removing local alias
[\#4199](https://github.com/matrix-org/matrix-react-sdk/pull/4199)
* yarn upgrade
[\#4201](https://github.com/matrix-org/matrix-react-sdk/pull/4201)
* Support TypeScript for React components
[\#4203](https://github.com/matrix-org/matrix-react-sdk/pull/4203)
* When room name is changed, show both the old and new name
[\#4183](https://github.com/matrix-org/matrix-react-sdk/pull/4183)
Changes in [2.2.3](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.2.3) (2020-03-17)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.2.3-rc.1...v2.2.3)
* Upgrade JS SDK to 5.1.1
* Add default on config setting to control call button in composer
[\#4228](https://github.com/matrix-org/matrix-react-sdk/pull/4228)
* Fix: make alternative addresses UX less confusing
[\#4226](https://github.com/matrix-org/matrix-react-sdk/pull/4226)
* Fix: best-effort to join room without canonical alias over federation from
room directory
[\#4211](https://github.com/matrix-org/matrix-react-sdk/pull/4211)
Changes in [2.2.3-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.2.3-rc.1) (2020-03-11)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.2.1...v2.2.3-rc.1)
* Update from Weblate
[\#4200](https://github.com/matrix-org/matrix-react-sdk/pull/4200)
* Revert "enable 4s when accepting a verification request"
[\#4198](https://github.com/matrix-org/matrix-react-sdk/pull/4198)
* Don't remount main split children on rhs collapse
[\#4197](https://github.com/matrix-org/matrix-react-sdk/pull/4197)
* Add fallback label for canonical alias events that dont change anything
[\#4195](https://github.com/matrix-org/matrix-react-sdk/pull/4195)
* Immediately switch to verification dialog when clicking [Continue] from new
session dialog
[\#4196](https://github.com/matrix-org/matrix-react-sdk/pull/4196)
* Enable 4S if needed when trying to verify or accepting verification
[\#4194](https://github.com/matrix-org/matrix-react-sdk/pull/4194)
* Remove extraneous tab stop from room tree view.
[\#4193](https://github.com/matrix-org/matrix-react-sdk/pull/4193)
* Remove v1 identity server fallbacks
[\#4191](https://github.com/matrix-org/matrix-react-sdk/pull/4191)
* Allow editing of alt_aliases according to MSC2432
[\#4187](https://github.com/matrix-org/matrix-react-sdk/pull/4187)
* Update timeline rendering of aliases
[\#4189](https://github.com/matrix-org/matrix-react-sdk/pull/4189)
* Fix mark as read button for dark theme
[\#4190](https://github.com/matrix-org/matrix-react-sdk/pull/4190)
* Un-linkify version in settings
[\#4188](https://github.com/matrix-org/matrix-react-sdk/pull/4188)
* Make Mjolnir stop more robust
[\#4186](https://github.com/matrix-org/matrix-react-sdk/pull/4186)
* Fix secret sharing names to match spec
[\#4185](https://github.com/matrix-org/matrix-react-sdk/pull/4185)
* Share secrets with another device on request
[\#4172](https://github.com/matrix-org/matrix-react-sdk/pull/4172)
* Fall back to to_device verification if other user hasn't uploaded cross-
signing keys
[\#4181](https://github.com/matrix-org/matrix-react-sdk/pull/4181)
* Disable edits on redacted events
[\#4182](https://github.com/matrix-org/matrix-react-sdk/pull/4182)
* Use crypto.verification.request even when xsign is disabled
[\#4180](https://github.com/matrix-org/matrix-react-sdk/pull/4180)
* Reword the status for the currently indexing rooms.
[\#4084](https://github.com/matrix-org/matrix-react-sdk/pull/4084)
* Moved read receipts to the bottom of the message
[\#3892](https://github.com/matrix-org/matrix-react-sdk/pull/3892)
* Include a mark as read X under the scroll to unread button
[\#4159](https://github.com/matrix-org/matrix-react-sdk/pull/4159)
* Show the room presence indicator, even when cross-singing is enabled
[\#4178](https://github.com/matrix-org/matrix-react-sdk/pull/4178)
* Add local echo when clicking "Manually Verify" in unverified session dialog
[\#4179](https://github.com/matrix-org/matrix-react-sdk/pull/4179)
* link to matrix.org/security-disclosure-policy in help screen
[\#4129](https://github.com/matrix-org/matrix-react-sdk/pull/4129)
* only show verify button if user has uploaded cross-signing keys
[\#4174](https://github.com/matrix-org/matrix-react-sdk/pull/4174)
* Fix room alias references in topics
[\#4176](https://github.com/matrix-org/matrix-react-sdk/pull/4176)
* Fix not being able to start chats when you have no rooms
[\#4177](https://github.com/matrix-org/matrix-react-sdk/pull/4177)
* Disable registration flows on SSO servers
[\#4170](https://github.com/matrix-org/matrix-react-sdk/pull/4170)
* Don't group blank membership changes
[\#4160](https://github.com/matrix-org/matrix-react-sdk/pull/4160)
* Ensure the room list always triggers updates on itself
[\#4175](https://github.com/matrix-org/matrix-react-sdk/pull/4175)
* Fix composer touch bar flickering on keypress in Chrome
[\#4173](https://github.com/matrix-org/matrix-react-sdk/pull/4173)
* Document scrollpanel and BACAT scrolling
[\#4167](https://github.com/matrix-org/matrix-react-sdk/pull/4167)
* riot-desktop open SSO in browser so user doesn't have to auth twice
[\#4158](https://github.com/matrix-org/matrix-react-sdk/pull/4158)
* Lock login and registration buttons after submit
[\#4165](https://github.com/matrix-org/matrix-react-sdk/pull/4165)
* Suggest the server's results as lower quality in the invite dialog
[\#4149](https://github.com/matrix-org/matrix-react-sdk/pull/4149)
* Adjust scroll offset with relative scrolling
[\#4166](https://github.com/matrix-org/matrix-react-sdk/pull/4166)
* only automatically download in usercontent if user requested it
[\#4163](https://github.com/matrix-org/matrix-react-sdk/pull/4163)
* Fix having to decrypt & download in two steps
[\#4162](https://github.com/matrix-org/matrix-react-sdk/pull/4162)
* Use bash for release script
[\#4161](https://github.com/matrix-org/matrix-react-sdk/pull/4161)
* Revert to manual sorting for custom tag rooms
[\#4157](https://github.com/matrix-org/matrix-react-sdk/pull/4157)
* Fix the last char of people's names being cut off in the invite dialog
[\#4150](https://github.com/matrix-org/matrix-react-sdk/pull/4150)
* Add /whois SlashCommand to open UserInfo
[\#4154](https://github.com/matrix-org/matrix-react-sdk/pull/4154)
* word-break in pills and wrap the background correctly
[\#4155](https://github.com/matrix-org/matrix-react-sdk/pull/4155)
* don't show "This alias is available to use" if the alias is invalid
[\#4153](https://github.com/matrix-org/matrix-react-sdk/pull/4153)
* Don't ask to enable analytics when Do Not Track is enabled
[\#4098](https://github.com/matrix-org/matrix-react-sdk/pull/4098)
* Fix MELS not breaking on day boundaries regression
[\#4152](https://github.com/matrix-org/matrix-react-sdk/pull/4152)
* Fix Quote on search results page
[\#4151](https://github.com/matrix-org/matrix-react-sdk/pull/4151)
* Ensure errors when creating a DM are raised to the user
[\#4144](https://github.com/matrix-org/matrix-react-sdk/pull/4144)
* Add a Login button to startAnyRegistrationFlow
[\#3829](https://github.com/matrix-org/matrix-react-sdk/pull/3829)
* Use latest backup status directly rather than via state
[\#4147](https://github.com/matrix-org/matrix-react-sdk/pull/4147)
* Prefer account password variation of upgrading
[\#4146](https://github.com/matrix-org/matrix-react-sdk/pull/4146)
* Hide user avatars from screen readers in group and room user lists.
[\#4145](https://github.com/matrix-org/matrix-react-sdk/pull/4145)
* Room List sorting algorithms
[\#4085](https://github.com/matrix-org/matrix-react-sdk/pull/4085)
* Clear selected tags when disabling tag panel
[\#4143](https://github.com/matrix-org/matrix-react-sdk/pull/4143)
* Ignore cursor jumping shortcuts with shift
[\#4142](https://github.com/matrix-org/matrix-react-sdk/pull/4142)
* add local echo for clicking 'start verification' button
[\#4138](https://github.com/matrix-org/matrix-react-sdk/pull/4138)
* Fix formatting buttons not marking the composer as modified
[\#4141](https://github.com/matrix-org/matrix-react-sdk/pull/4141)
* Upgrade deps
[\#4136](https://github.com/matrix-org/matrix-react-sdk/pull/4136)
* Remove debug line from Analytics
[\#4137](https://github.com/matrix-org/matrix-react-sdk/pull/4137)
* Use the right function for creating binary verification QR codes
[\#4140](https://github.com/matrix-org/matrix-react-sdk/pull/4140)
* Ensure verification QR codes use the right buffer size
[\#4139](https://github.com/matrix-org/matrix-react-sdk/pull/4139)
* Don't prefix QR codes with the length of the static marker string
[\#4128](https://github.com/matrix-org/matrix-react-sdk/pull/4128)
* Solve fixed-width digit display in flowed text
[\#4127](https://github.com/matrix-org/matrix-react-sdk/pull/4127)
* Limit UserInfo Displayname to 3 lines to get rid of scrollbars
[\#4135](https://github.com/matrix-org/matrix-react-sdk/pull/4135)
Changes in [2.2.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.2.1) (2020-03-04)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.2.0...v2.2.1)
* Adjust scroll offset with relative scrolling
[\#4171](https://github.com/matrix-org/matrix-react-sdk/pull/4171)
* Disable registration flows on SSO servers
[\#4169](https://github.com/matrix-org/matrix-react-sdk/pull/4169)
Changes in [2.2.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.2.0) (2020-03-02)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.2.0-rc.1...v2.2.0)
* Upgrade JS SDK to 5.1.0
* Ignore cursor jumping shortcuts with shift
[\#4142](https://github.com/matrix-org/matrix-react-sdk/pull/4142)
Changes in [2.2.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.2.0-rc.1) (2020-02-26)
=============================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.1.1...v2.2.0-rc.1)
* Upgrade JS SDK to 5.1.0-rc.1
* Fix message context menu breaking on invalid m.room.pinned_events event
[\#4133](https://github.com/matrix-org/matrix-react-sdk/pull/4133)
* Update from Weblate
[\#4134](https://github.com/matrix-org/matrix-react-sdk/pull/4134)
* Notify platform of language changes
[\#4121](https://github.com/matrix-org/matrix-react-sdk/pull/4121)
* Handle errors when previewing rooms more safely
[\#4132](https://github.com/matrix-org/matrix-react-sdk/pull/4132)
* Don't try to collapse zero events with a group
[\#4131](https://github.com/matrix-org/matrix-react-sdk/pull/4131)
* Don't print errors when the tab is used with no autocomplete present
[\#4130](https://github.com/matrix-org/matrix-react-sdk/pull/4130)
* Improve UI feedback while waiting for network
[\#4126](https://github.com/matrix-org/matrix-react-sdk/pull/4126)
* Ensure DMs tagged outside of account data work in the invite dialog
[\#4123](https://github.com/matrix-org/matrix-react-sdk/pull/4123)
* Show a warning dialog when user indicates a new session wasn't them
[\#4125](https://github.com/matrix-org/matrix-react-sdk/pull/4125)
* Show cancel events as hidden events if we wouldn't usually render them
[\#4120](https://github.com/matrix-org/matrix-react-sdk/pull/4120)
* Collapsed room list has unaligned room tiles #4030 version 2
[\#4033](https://github.com/matrix-org/matrix-react-sdk/pull/4033)
* Check for cross-signing homeserver support
[\#4118](https://github.com/matrix-org/matrix-react-sdk/pull/4118)
* Don't leak if show_sas never comes (or already came)
[\#4119](https://github.com/matrix-org/matrix-react-sdk/pull/4119)
* Add verification request viewer in devtools
[\#4106](https://github.com/matrix-org/matrix-react-sdk/pull/4106)
* update phase when request prop changes
[\#4117](https://github.com/matrix-org/matrix-react-sdk/pull/4117)
* Handle file downloading locally in electron rather than sending to browser
[\#4113](https://github.com/matrix-org/matrix-react-sdk/pull/4113)
* Remove unused CIDER setting watcher
[\#4116](https://github.com/matrix-org/matrix-react-sdk/pull/4116)
* Use alt_aliases for pills and autocomplete
[\#4102](https://github.com/matrix-org/matrix-react-sdk/pull/4102)
* Add shortcuts for beginning / end of composer
[\#4108](https://github.com/matrix-org/matrix-react-sdk/pull/4108)
* Update from Weblate
[\#4115](https://github.com/matrix-org/matrix-react-sdk/pull/4115)
* Revert "Fix escaped markdown passing backslashes through"
[\#4114](https://github.com/matrix-org/matrix-react-sdk/pull/4114)
* Fix a couple of React warnings/errors
[\#4112](https://github.com/matrix-org/matrix-react-sdk/pull/4112)
* Fix two big DOM leaks which were locking Chrome solid.
[\#4111](https://github.com/matrix-org/matrix-react-sdk/pull/4111)
* Filter out empty strings when pasting IDs into the invite dialog
[\#4109](https://github.com/matrix-org/matrix-react-sdk/pull/4109)
* Remove buildkite pipeline
[\#4107](https://github.com/matrix-org/matrix-react-sdk/pull/4107)
* Use binary packing for verification QR codes
[\#4091](https://github.com/matrix-org/matrix-react-sdk/pull/4091)
* Fix several small bugs with the invite/DM dialog
[\#4099](https://github.com/matrix-org/matrix-react-sdk/pull/4099)
* ignore e2e tests node_modules during linting
[\#4103](https://github.com/matrix-org/matrix-react-sdk/pull/4103)
* Apply null-guard to room pills for when we can't fetch the room
[\#4104](https://github.com/matrix-org/matrix-react-sdk/pull/4104)
* Fix theme being overridden to light even after login is completed
[\#4105](https://github.com/matrix-org/matrix-react-sdk/pull/4105)
* Fix bug where SSSS could be overwritten if user never cross-signs
[\#4100](https://github.com/matrix-org/matrix-react-sdk/pull/4100)
* Accept canonical alias for pills
[\#4096](https://github.com/matrix-org/matrix-react-sdk/pull/4096)
* Fix: don't advertise ability to scan a QR code for verification
[\#4094](https://github.com/matrix-org/matrix-react-sdk/pull/4094)
* Fixes for printing event indexing stats.
[\#4082](https://github.com/matrix-org/matrix-react-sdk/pull/4082)
* Remove exec so release script continues
[\#4095](https://github.com/matrix-org/matrix-react-sdk/pull/4095)
* Use Persistent Storage where possible
[\#4092](https://github.com/matrix-org/matrix-react-sdk/pull/4092)
* Fix user page (missing null check)
[\#4088](https://github.com/matrix-org/matrix-react-sdk/pull/4088)
* Cancel verification request on dialog close
[\#4081](https://github.com/matrix-org/matrix-react-sdk/pull/4081)
* Fix various memory leaks due to method re-binding
[\#4093](https://github.com/matrix-org/matrix-react-sdk/pull/4093)
* Fix share message context menu option keyboard a11y
[\#4073](https://github.com/matrix-org/matrix-react-sdk/pull/4073)
Changes in [2.1.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v2.1.1) (2020-02-19)
===================================================================================================
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v2.1.0...v2.1.1)

View file

@ -34,7 +34,7 @@ All code lands on the `develop` branch - `master` is only used for stable releas
**Please file PRs against `develop`!!**
Please follow the standard Matrix contributor's guide:
https://github.com/matrix-org/synapse/tree/master/CONTRIBUTING.rst
https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.rst
Please follow the Matrix JS/React code style as per:
https://github.com/matrix-org/matrix-react-sdk/blob/master/code_style.md
@ -45,7 +45,7 @@ Code should be committed as follows:
* In practice, `matrix-react-sdk` is still evolving so fast that the maintenance
burden of customising and overriding these components for Riot can seriously
impede development. So right now, there should be very few (if any) customisations for Riot.
* CSS: https://github.com/vector-im/riot-web/tree/master/src/skins/vector/css/matrix-react-sdk
* CSS: https://github.com/matrix-org/matrix-react-sdk/tree/master/res/css
* Theme specific CSS & resources: https://github.com/matrix-org/matrix-react-sdk/tree/master/res/themes
React components in matrix-react-sdk are come in two different flavours:
@ -133,8 +133,10 @@ Development
Ensure you have the latest LTS version of Node.js installed.
Using `yarn` instead of `npm` is recommended. Please see the Yarn [install
guide](https://yarnpkg.com/docs/install/) if you do not have it already.
Using `yarn` instead of `npm` is recommended. Please see the Yarn 1 [install
guide](https://classic.yarnpkg.com/docs/install) if you do not have it
already. This project has not yet been migrated to Yarn 2, so please ensure
`yarn --version` shows a version from the 1.x series.
`matrix-react-sdk` depends on `matrix-js-sdk`. To make use of changes in the
latter and to ensure tests run against the develop branch of `matrix-js-sdk`,

31
docs/jitsi.md Normal file
View file

@ -0,0 +1,31 @@
# Jitsi Wrapper
**Note**: These are developer docs. Please consult your client's documentation for
instructions on setting up Jitsi.
The react-sdk wraps all Jitsi call widgets in a local wrapper called `jitsi.html`
which takes several parameters:
*Query string*:
* `widgetId`: The ID of the widget. This is needed for communication back to the
react-sdk.
* `parentUrl`: The URL of the parent window. This is also needed for
communication back to the react-sdk.
*Hash/fragment (formatted as a query string)*:
* `conferenceDomain`: The domain to connect Jitsi Meet to.
* `conferenceId`: The room or conference ID to connect Jitsi Meet to.
* `isAudioOnly`: Boolean for whether this is a voice-only conference. May not
be present, should default to `false`.
* `displayName`: The display name of the user viewing the widget. May not
be present or could be null.
* `avatarUrl`: The HTTP(S) URL for the avatar of the user viewing the widget. May
not be present or could be null.
* `userId`: The MXID of the user viewing the widget. May not be present or could
be null.
The react-sdk will assume that `jitsi.html` is at the path of wherever it is currently
being served. For example, `https://riot.im/develop/jitsi.html` or `vector://webapp/jitsi.html`.
The `jitsi.html` wrapper can use the react-sdk's `WidgetApi` to communicate, making
it easier to actually implement the feature.

28
docs/scrolling.md Normal file
View file

@ -0,0 +1,28 @@
# ScrollPanel
## Updates
During an onscroll event, we check whether we're getting close to the top or bottom edge of the loaded content. If close enough, we fire a request to load more through the callback passed in the `onFillRequest` prop. This returns a promise is passed down from `TimelinePanel`, where it will call paginate on the `TimelineWindow` and once the events are received back, update its state with the new events. This update trickles down to the `MessagePanel`, which rerenders all tiles and passed that to `ScrollPanel`. ScrollPanels `componentDidUpdate` method gets called, and we do the scroll housekeeping there (read below). Once the rerender has completed, the `setState` callback is called and we resolve the promise returned by `onFillRequest`. Now we check the DOM to see if we need more fill requests.
## Prevent Shrinking
ScrollPanel supports a mode to prevent it shrinking. This is used to prevent a jump when at the bottom of the timeline and people start and stop typing. It gets cleared automatically when 200px above the bottom of the timeline.
## BACAT (Bottom-Aligned, Clipped-At-Top) scrolling
BACAT scrolling implements a different way of restoring the scroll position in the timeline while tiles out of view are changing height or tiles are being added or removed. It was added in https://github.com/matrix-org/matrix-react-sdk/pull/2842.
The motivation for the changes is having noticed that setting scrollTop while scrolling tends to not work well, with it interrupting ongoing scrolling and also querying scrollTop reporting outdated values and consecutive scroll adjustments cancelling each out previous ones. This seems to be worse on macOS than other platforms, presumably because of a higher resolution in scroll events there. Also see https://github.com/vector-im/riot-web/issues/528. The BACAT approach allows to only have to change the scroll offset when adding or removing tiles.
The approach taken instead is to vertically align the timeline tiles to the bottom of the scroll container (using flexbox) and give the timeline inside the scroll container an explicit height, initially set to a multiple of the PAGE_SIZE (400px at time of writing) as needed by the content. When scrolled up, we can compensate for anything that grew below the viewport by changing the height of the timeline to maintain what's currently visible in the viewport without adjusting the scrollTop and hence without jumping.
For anything above the viewport growing or shrinking, we don't need to do anything as the timeline is bottom-aligned. We do need to update the height manually to keep all content visible as more is loaded. To maintain scroll position after the portion above the viewport changes height, we need to set the scrollTop, as we cannot balance it out with more height changes. We do this 100ms after the user has stopped scrolling, so setting scrollTop has not nasty side-effects.
As of https://github.com/matrix-org/matrix-react-sdk/pull/4166, we are scrolling to compensate for height changes by calling `scrollBy(0, x)` rather than reading and than setting `scrollTop`, as reading `scrollTop` can (again, especially on macOS) easily return values that are out of sync with what is on the screen, probably because scrolling can be done [off the main thread](https://wiki.mozilla.org/Platform/GFX/APZ) in some circumstances. This seems to further prevent jumps.
### How does it work?
`componentDidUpdate` is called when a tile in the timeline is updated (as we rerender the whole timeline) or tiles are added or removed (see Updates section before). From here, `checkScroll` is called, which calls `_restoreSavedScrollState`. Now, we increase the timeline height if something below the viewport grew by adjusting `this._bottomGrowth`. `bottomGrowth` is the height added to the timeline (on top of the height from the number of pages calculated at the last `_updateHeight` run) to compensate for growth below the viewport. This is cleared during the next run of `_updateHeight`. Remember that the tiles in the timeline are aligned to the bottom.
From `_restoreSavedScrollState` we also call `_updateHeight` which waits until the user stops scrolling for 100ms and then recalculates the amount of pages of 400px the timeline should be sized to, to be able to show all of its (newly added) content. We have to adjust the scroll offset (which is why we wait until scrolling has stopped) now because the space above the viewport has likely changed.

View file

@ -51,6 +51,17 @@ Settings are the different options a user may set or experience in the applicati
}
```
Settings that support the config level can be set in the config file under the `settingDefaults` key (note that some settings, like the "theme" setting, are special cased in the config file):
```json
{
...
"settingDefaults": {
"settingName": true
},
...
}
```
### Getting values for a setting
After importing `SettingsStore`, simply make a call to `SettingsStore.getValue`. The `roomId` parameter should always

View file

@ -1,6 +1,6 @@
{
"name": "matrix-react-sdk",
"version": "2.1.1",
"version": "2.5.0",
"description": "SDK for matrix.org using React",
"author": "matrix.org",
"repository": {
@ -40,15 +40,15 @@
"rethemendex": "res/css/rethemendex.sh",
"clean": "rimraf lib",
"build": "yarn clean && git rev-parse HEAD > git-revision.txt && yarn build:compile && yarn build:types",
"build:compile": "yarn reskindex && babel -d lib --verbose --extensions \".ts,.js\" src",
"build:types": "tsc --emitDeclarationOnly",
"build:compile": "yarn reskindex && babel -d lib --verbose --extensions \".ts,.js,.tsx\" src",
"build:types": "tsc --emitDeclarationOnly --jsx react",
"start": "echo THIS IS FOR LEGACY PURPOSES ONLY. && yarn start:all",
"start:all": "concurrently --kill-others-on-fail --prefix \"{time} [{name}]\" -n build,reskindex \"yarn start:build\" \"yarn reskindex:watch\"",
"start:build": "babel src -w -s -d lib --verbose --extensions \".ts,.js\"",
"lint": "yarn lint:types && yarn lint:ts && yarn lint:js && yarn lint:style",
"lint:js": "eslint --max-warnings 0 --ignore-path .eslintignore.errorfiles src test",
"lint:ts": "tslint --project ./tsconfig.json -t stylish",
"lint:types": "tsc --noEmit",
"lint:types": "tsc --noEmit --jsx react",
"lint:style": "stylelint 'res/css/**/*.scss'",
"test": "jest",
"test:e2e": "./test/end-to-end-tests/run.sh --riot-url http://localhost:8080"
@ -72,7 +72,6 @@
"flux": "2.1.1",
"focus-visible": "^5.0.2",
"fuse.js": "^2.2.0",
"gemini-scrollbar": "github:matrix-org/gemini-scrollbar#91e1e566",
"gfm.css": "^1.1.1",
"glob-to-regexp": "^0.4.1",
"highlight.js": "^9.15.8",
@ -80,19 +79,19 @@
"is-ip": "^2.0.0",
"linkifyjs": "^2.1.6",
"lodash": "^4.17.14",
"matrix-js-sdk": "5.0.1",
"matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop",
"minimist": "^1.2.0",
"pako": "^1.0.5",
"parse5": "^5.1.1",
"png-chunks-extract": "^1.0.0",
"project-name-generator": "^2.1.7",
"prop-types": "^15.5.8",
"qrcode-react": "^0.1.16",
"qrcode": "^1.4.4",
"qs": "^6.6.0",
"react": "^16.9.0",
"react-addons-css-transition-group": "15.6.2",
"react-beautiful-dnd": "^4.0.1",
"react-dom": "^16.9.0",
"react-focus-lock": "^2.2.1",
"react-gemini-scrollbar": "github:matrix-org/react-gemini-scrollbar#9cf17f63b7c0b0ec5f31df27da0f82f7238dc594",
"resize-observer-polyfill": "^1.5.0",
"sanitize-html": "^1.18.4",
"text-encoding-utf-8": "^1.0.1",
@ -117,6 +116,10 @@
"@babel/preset-typescript": "^7.7.4",
"@babel/register": "^7.7.4",
"@peculiar/webcrypto": "^1.0.22",
"@types/classnames": "^2.2.10",
"@types/modernizr": "^3.5.3",
"@types/qrcode": "^1.3.4",
"@types/react": "16.9",
"babel-eslint": "^10.0.3",
"babel-jest": "^24.9.0",
"chokidar": "^3.3.1",

View file

@ -1,4 +1,4 @@
#!/bin/sh
#!/bin/bash
#
# Script to perform a release of matrix-react-sdk.
#
@ -11,6 +11,7 @@ cd `dirname $0`
for i in matrix-js-sdk
do
echo "Checking version of $i..."
depver=`cat package.json | jq -r .dependencies[\"$i\"]`
latestver=`yarn info -s $i dist-tags.next`
if [ "$depver" != "$latestver" ]
@ -35,7 +36,7 @@ do
fi
done
exec ./node_modules/matrix-js-sdk/release.sh -z "$@"
./node_modules/matrix-js-sdk/release.sh -z "$@"
release="${1#v}"
prerelease=0

View file

@ -16,6 +16,12 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
@import "./_font-sizes.scss";
:root {
font-size: 15px;
}
html {
/* hack to stop overscroll bounce on OSX and iOS.
N.B. Breaks things when we have legitimate horizontal overscroll */
@ -25,7 +31,7 @@ html {
body {
font-family: $font-family;
font-size: 15px;
font-size: $font-15px;
background-color: $primary-bg-color;
color: $primary-fg-color;
border: 0px;
@ -42,10 +48,15 @@ pre, code {
font-size: 100% !important;
}
.error, .warning {
.error, .warning,
.text-error, .text-warning {
color: $warning-color;
}
.text-success {
color: $accent-color;
}
b {
// On Firefox, the default weight for `<b>` is `bolder` which results in no bold
// effect since we only have specific weights of our fonts available.
@ -55,7 +66,7 @@ b {
h2 {
color: $primary-fg-color;
font-weight: 400;
font-size: 18px;
font-size: $font-18px;
margin-top: 16px;
margin-bottom: 16px;
}
@ -71,7 +82,7 @@ input[type=search],
input[type=password] {
padding: 9px;
font-family: $font-family;
font-size: 14px;
font-size: $font-14px;
font-weight: 600;
min-width: 0;
}
@ -202,37 +213,6 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
transition: opacity 0.2s ease-in-out;
}
/* XXX: critical hack to GeminiScrollbar to allow them to work in FF 42 and Chrome 48.
Stop the scrollbar view from pushing out the container's overall sizing, which causes
flexbox to adapt to the new size and cause the view to keep growing.
*/
.gm-scrollbar-container .gm-scroll-view {
position: absolute;
}
/* Expand thumbs on hoverover */
.gm-scrollbar {
border-radius: 5px !important;
}
.gm-scrollbar.-vertical {
width: 6px;
transition: width 120ms ease-out !important;
}
.gm-scrollbar.-vertical:hover,
.gm-scrollbar.-vertical:active {
width: 8px;
transition: width 120ms ease-out !important;
}
.gm-scrollbar.-horizontal {
height: 6px;
transition: height 120ms ease-out !important;
}
.gm-scrollbar.-horizontal:hover,
.gm-scrollbar.-horizontal:active {
height: 8px;
transition: height 120ms ease-out !important;
}
// These are magic constants which are excluded from tinting, to let themes
// (which only have CSS, unlike skins) tell the app what their non-tinted
// colourscheme is by inspecting the stylesheet DOM.
@ -279,7 +259,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
color: $light-fg-color;
z-index: 4012;
font-weight: 300;
font-size: 15px;
font-size: $font-15px;
position: relative;
padding: 25px 30px 30px 30px;
max-height: 80%;
@ -347,8 +327,8 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
}
.mx_Dialog_title {
font-size: 22px;
line-height: 36px;
font-size: $font-22px;
line-height: $font-36px;
color: $dialog-title-fg-color;
}
@ -376,7 +356,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
.mx_Dialog_content {
margin: 24px 0 68px;
font-size: 14px;
font-size: $font-14px;
color: $primary-fg-color;
word-wrap: break-word;
}
@ -472,7 +452,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
}
.mx_TextInputDialog_input {
font-size: 15px;
font-size: $font-15px;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;

View file

@ -1,5 +1,6 @@
// autogenerated by rethemendex.sh
@import "./_common.scss";
@import "./_font-sizes.scss";
@import "./structures/_AutoHideScrollbar.scss";
@import "./structures/_CompatibilityPage.scss";
@import "./structures/_ContextualMenu.scss";
@ -65,6 +66,7 @@
@import "./views/dialogs/_GroupAddressPicker.scss";
@import "./views/dialogs/_IncomingSasDialog.scss";
@import "./views/dialogs/_InviteDialog.scss";
@import "./views/dialogs/_KeyboardShortcutsDialog.scss";
@import "./views/dialogs/_MessageEditHistoryDialog.scss";
@import "./views/dialogs/_NewSessionReviewDialog.scss";
@import "./views/dialogs/_RoomSettingsDialog.scss";
@ -106,6 +108,7 @@
@import "./views/elements/_ManageIntegsButton.scss";
@import "./views/elements/_PowerSelector.scss";
@import "./views/elements/_ProgressBar.scss";
@import "./views/elements/_QRCode.scss";
@import "./views/elements/_ReplyThread.scss";
@import "./views/elements/_ResizeHandle.scss";
@import "./views/elements/_RichText.scss";
@ -131,12 +134,14 @@
@import "./views/messages/_MNoticeBody.scss";
@import "./views/messages/_MStickerBody.scss";
@import "./views/messages/_MTextBody.scss";
@import "./views/messages/_MVideoBody.scss";
@import "./views/messages/_MessageActionBar.scss";
@import "./views/messages/_MessageTimestamp.scss";
@import "./views/messages/_MjolnirBody.scss";
@import "./views/messages/_ReactionsRow.scss";
@import "./views/messages/_ReactionsRowButton.scss";
@import "./views/messages/_ReactionsRowButtonTooltip.scss";
@import "./views/messages/_RedactedBody.scss";
@import "./views/messages/_RoomAvatarEvent.scss";
@import "./views/messages/_SenderProfile.scss";
@import "./views/messages/_TextualEvent.scss";
@ -177,7 +182,6 @@
@import "./views/rooms/_RoomTile.scss";
@import "./views/rooms/_RoomUpgradeWarningBar.scss";
@import "./views/rooms/_SearchBar.scss";
@import "./views/rooms/_SearchableEntityList.scss";
@import "./views/rooms/_SendMessageComposer.scss";
@import "./views/rooms/_Stickers.scss";
@import "./views/rooms/_TopUnreadMessagesBar.scss";
@ -186,6 +190,7 @@
@import "./views/settings/_AvatarSetting.scss";
@import "./views/settings/_CrossSigningPanel.scss";
@import "./views/settings/_DevicesPanel.scss";
@import "./views/settings/_E2eAdvancedPanel.scss";
@import "./views/settings/_EmailAddresses.scss";
@import "./views/settings/_IntegrationManager.scss";
@import "./views/settings/_KeyBackupPanel.scss";

71
res/css/_font-sizes.scss Normal file
View file

@ -0,0 +1,71 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
$font-1px: 0.067rem;
$font-2px: 0.133rem;
$font-3px: 0.200rem;
$font-4px: 0.267rem;
$font-5px: 0.333rem;
$font-6px: 0.400rem;
$font-7px: 0.467rem;
$font-8px: 0.533rem;
$font-9px: 0.600rem;
$font-10px: 0.667rem;
$font-10-4px: 0.693rem;
$font-11px: 0.733rem;
$font-12px: 0.800rem;
$font-13px: 0.867rem;
$font-14px: 0.933rem;
$font-15px: 1.000rem;
$font-16px: 1.067rem;
$font-17px: 1.133rem;
$font-18px: 1.200rem;
$font-19px: 1.267rem;
$font-20px: 1.3333333rem;
$font-21px: 1.400rem;
$font-22px: 1.467rem;
$font-23px: 1.533rem;
$font-24px: 1.600rem;
$font-25px: 1.667rem;
$font-26px: 1.733rem;
$font-27px: 1.800rem;
$font-28px: 1.867rem;
$font-29px: 1.933rem;
$font-30px: 2.000rem;
$font-31px: 2.067rem;
$font-32px: 2.133rem;
$font-33px: 2.200rem;
$font-34px: 2.267rem;
$font-35px: 2.333rem;
$font-36px: 2.400rem;
$font-37px: 2.467rem;
$font-38px: 2.533rem;
$font-39px: 2.600rem;
$font-40px: 2.667rem;
$font-41px: 2.733rem;
$font-42px: 2.800rem;
$font-43px: 2.867rem;
$font-44px: 2.933rem;
$font-45px: 3.000rem;
$font-46px: 3.067rem;
$font-47px: 3.133rem;
$font-48px: 3.200rem;
$font-49px: 3.267rem;
$font-50px: 3.333rem;
$font-51px: 3.400rem;
$font-52px: 3.467rem;
$font-88px: 5.887rem;
$font-400px: 26.667rem;

View file

@ -14,69 +14,16 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
/* This file has CSS for both native and non-native scrollbars in an order
* that's fairly logical to read but duplicates a selector to separate the
* hiding/showing from the sizing.
*/
/* stylelint-disable no-duplicate-selectors */
/*
1. for browsers that support native overlay auto-hiding scrollbars
*/
.mx_AutoHideScrollbar {
overflow-x: hidden;
overflow-y: auto;
-ms-overflow-style: -ms-autohiding-scrollbar;
}
/*
2. webkit also supports overflow:overlay where the scrollbars don't take any space
in the layout but they don't autohide, so do that only on hover
*/
body.mx_scrollbar_overlay_noautohide .mx_AutoHideScrollbar {
overflow-y: hidden;
}
body.mx_scrollbar_overlay_noautohide .mx_AutoHideScrollbar:hover {
overflow-y: overlay;
}
/*
3. as a last fallback, compensate for the scrollbar taking up space in the layout
by having giving the child element (.mx_AutoHideScrollbar_offset) a
negative right margin of the width of the scrollbar when the container
is overflowing. This is what Firefox ends up using. Overflow is detected
in javascript, and adds the mx_AutoHideScrollbar_overflow class to the container.
This only works in Firefox, which should be fine as this fallback is only needed there.
*/
body.mx_scrollbar_nooverlay {
.mx_AutoHideScrollbar {
overflow-y: hidden;
}
.mx_AutoHideScrollbar:hover {
overflow-y: auto;
}
/*
offset scrollbar width with negative margin-right
include before and after psuedo-elements here so they can
be used to do something interesting like scroll-indicating
gradients (see IndicatorScrollBar)
*/
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow > .mx_AutoHideScrollbar_offset,
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow::before,
.mx_AutoHideScrollbar:hover.mx_AutoHideScrollbar_overflow::after {
margin-right: calc(-1 * var(--scrollbar-width));
}
}
// style the native scrollbars ...
// ... standard css scrollbars (firefox at time of writing)
.mx_AutoHideScrollbar {
// make any scrollbar grey and thin
html {
scrollbar-color: $scrollbar-thumb-color $scrollbar-track-color;
}
// scrollbar-width is not inherited (but -color is, why?!),
// so declare it on every element
* {
scrollbar-width: thin;
}
// or fallback for webkit browsers
::-webkit-scrollbar {
width: 6px;
height: 6px;
@ -84,6 +31,37 @@ body.mx_scrollbar_nooverlay {
}
::-webkit-scrollbar-thumb {
background-color: $scrollbar-thumb-color;
border-radius: 3px;
background-color: $scrollbar-thumb-color;
}
// make auto-hide scrollbars not transparent again on hover
.mx_AutoHideScrollbar:hover {
scrollbar-color: $scrollbar-thumb-color $scrollbar-track-color;
&::-webkit-scrollbar {
background-color: $scrollbar-track-color;
}
&::-webkit-scrollbar-thumb {
background-color: $scrollbar-thumb-color;
}
}
// make scrollbars transparent for autohide scrollbars
.mx_AutoHideScrollbar {
overflow-x: hidden;
overflow-y: auto;
overflow-y: overlay; // where supported
-ms-overflow-style: -ms-autohiding-scrollbar;
&::-webkit-scrollbar {
background-color: transparent;
}
&::-webkit-scrollbar-thumb {
background-color: transparent;
}
scrollbar-color: transparent transparent;
}

View file

@ -36,7 +36,7 @@ limitations under the License.
background-color: $menu-bg-color;
color: $primary-fg-color;
position: absolute;
font-size: 14px;
font-size: $font-14px;
z-index: 5001;
}

View file

@ -26,7 +26,7 @@ limitations under the License.
border-radius: 3px;
border: 1px solid $strong-input-border-color;
font-weight: 300;
font-size: 13px;
font-size: $font-13px;
padding: 9px;
margin-top: 6px;
}

View file

@ -49,7 +49,7 @@ limitations under the License.
.mx_FilePanel .mx_EventTile .mx_MFileBody_download {
display: flex;
font-size: 14px;
font-size: $font-14px;
color: $event-timestamp-color;
}
@ -60,7 +60,7 @@ limitations under the License.
.mx_FilePanel .mx_EventTile .mx_MImageBody_size {
flex: 1 0 0;
font-size: 11px;
font-size: $font-11px;
text-align: right;
white-space: nowrap;
}
@ -80,7 +80,7 @@ limitations under the License.
flex: 1 1 auto;
line-height: initial;
padding: 0px;
font-size: 11px;
font-size: $font-11px;
opacity: 1.0;
color: $event-timestamp-color;
}
@ -90,7 +90,7 @@ limitations under the License.
text-align: right;
visibility: visible;
position: initial;
font-size: 11px;
font-size: $font-11px;
opacity: 1.0;
color: $event-timestamp-color;
}

View file

@ -134,7 +134,7 @@ limitations under the License.
overflow: hidden;
color: $primary-fg-color;
font-weight: bold;
font-size: 22px;
font-size: $font-22px;
padding-left: 19px;
padding-right: 16px;
/* why isn't text-overflow working? */
@ -148,7 +148,7 @@ limitations under the License.
max-height: 42px;
color: $settings-grey-fg-color;
font-weight: 300;
font-size: 13px;
font-size: $font-13px;
padding-left: 19px;
margin-right: 16px;
overflow: hidden;
@ -180,10 +180,6 @@ limitations under the License.
line-height: 2em;
}
.mx_GroupView > .mx_MainSplit {
flex: 1;
}
.mx_GroupView_body {
flex-grow: 1;
}
@ -200,7 +196,7 @@ limitations under the License.
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
font-size: $font-13px;
margin-bottom: 10px;
}
@ -230,7 +226,7 @@ limitations under the License.
.mx_GroupView_rooms_header_addRow_label {
display: inline-block;
vertical-align: top;
line-height: 24px;
line-height: $font-24px;
padding-left: 28px;
color: $accent-color;
}
@ -262,7 +258,7 @@ limitations under the License.
.mx_GroupView_membershipSection_description {
/* To match textButton */
line-height: 34px;
line-height: $font-34px;
}
.mx_GroupView_membershipSection_description .mx_BaseAvatar {
@ -341,8 +337,8 @@ limitations under the License.
display: none;
}
.mx_GroupView_body .gm-scroll-view > * {
margin: 11px 50px 0px 68px;
.mx_GroupView_body .mx_AutoHideScrollbar > * {
margin: 11px 50px 50px 68px;
}
.mx_GroupView_groupDesc textarea {
@ -370,7 +366,7 @@ limitations under the License.
padding: 40px 20px;
}
.mx_GroupView .mx_MemberInfo .gm-scroll-view > :not(.mx_MemberInfo_avatar) {
.mx_GroupView .mx_MemberInfo .mx_AutoHideScrollbar > :not(.mx_MemberInfo_avatar) {
padding-left: 16px;
padding-right: 16px;
}

View file

@ -23,3 +23,84 @@ limitations under the License.
margin-left: auto;
margin-right: auto;
}
.mx_HomePage_default {
text-align: center;
.mx_HomePage_default_wrapper {
padding: 25vh 0 12px;
}
img {
height: 48px;
}
h1 {
font-weight: 600;
font-size: $font-32px;
line-height: $font-44px;
margin-bottom: 4px;
}
h4 {
margin-top: 4px;
font-weight: 600;
font-size: $font-18px;
line-height: $font-25px;
color: $muted-fg-color;
}
.mx_HomePage_default_buttons {
margin: 80px auto 0;
width: fit-content;
.mx_AccessibleButton {
padding: 73px 8px 15px; // top: 20px top padding + 40px icon + 13px margin
width: 104px; // 120px - 2* 8px
margin: 0 39px; // 55px - 2* 8px
position: relative;
display: inline-block;
border-radius: 8px;
vertical-align: top;
word-break: break-word;
font-weight: 600;
font-size: $font-15px;
line-height: $font-20px;
color: $muted-fg-color;
&:hover {
color: $accent-color;
background: rgba(#03b381, 0.06);
&::before {
background-color: $accent-color;
}
}
&::before {
top: 20px;
left: 40px; // (120px-40px)/2
width: 40px;
height: 40px;
content: '';
position: absolute;
background-color: $muted-fg-color;
mask-repeat: no-repeat;
mask-size: contain;
}
&.mx_HomePage_button_sendDm::before {
mask-image: url('$(res)/img/feather-customised/message-circle.svg');
}
&.mx_HomePage_button_explore::before {
mask-image: url('$(res)/img/feather-customised/explore.svg');
}
&.mx_HomePage_button_createGroup::before {
mask-image: url('$(res)/img/feather-customised/group.svg');
}
}
}
}

View file

@ -147,7 +147,7 @@ limitations under the License.
}
.mx_AccessibleButton {
font-size: 14px;
font-size: $font-14px;
margin: 4px 0 1px 9px;
padding: 9px;
padding-left: 42px;

View file

@ -18,6 +18,7 @@ limitations under the License.
display: flex;
flex-direction: row;
min-width: 0;
height: 100%;
}
// move hit area 5px to the right so it doesn't overlap with the timeline scrollbar

View file

@ -76,13 +76,6 @@ limitations under the License.
flex: 1 1 0;
min-width: 0;
/* Experimental fix for https://github.com/vector-im/vector-web/issues/947
and https://github.com/vector-im/vector-web/issues/946.
Empirically this stops the MessagePanel's width exploding outwards when
gemini is in 'prevented' mode
*/
overflow-x: auto;
/* To fix https://github.com/vector-im/riot-web/issues/3298 where Safari
needed height 100% all the way down to the HomePage. Height does not
have to be auto, empirically.

View file

@ -67,9 +67,6 @@ limitations under the License.
}
}
.mx_MyGroups_headerCard_header {
font-weight: bold;
margin-bottom: 10px;
@ -98,12 +95,17 @@ limitations under the License.
display: flex;
flex-direction: column;
overflow-y: auto;
}
.mx_MyGroups_scrollable {
overflow-y: inherit;
}
.mx_MyGroups_placeholder {
background-color: $info-plinth-bg-color;
color: $info-plinth-fg-color;
line-height: 400px;
line-height: $font-400px;
border-radius: 10px;
text-align: center;
}
@ -147,11 +149,11 @@ limitations under the License.
.mx_GroupTile_profile .mx_GroupTile_name {
margin: 0px;
font-size: 15px;
font-size: $font-15px;
}
.mx_GroupTile_profile .mx_GroupTile_groupId {
font-size: 13px;
font-size: $font-13px;
opacity: 0.7;
}
@ -159,7 +161,7 @@ limitations under the License.
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
font-size: 13px;
font-size: $font-13px;
max-height: 36px;
overflow: hidden;
}

View file

@ -39,7 +39,7 @@ limitations under the License.
.mx_NotificationPanel .mx_EventTile_roomName {
font-weight: bold;
font-size: 14px;
font-size: $font-14px;
}
.mx_NotificationPanel .mx_EventTile_roomName a {
@ -54,7 +54,7 @@ limitations under the License.
.mx_NotificationPanel .mx_EventTile .mx_SenderProfile,
.mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp {
color: $primary-fg-color;
font-size: 12px;
font-size: $font-12px;
display: inline;
padding-left: 0px;
}

View file

@ -96,7 +96,7 @@ limitations under the License.
}
.mx_RightPanel_headerButton_badge {
font-size: 8px;
font-size: $font-8px;
border-radius: 8px;
color: $accent-fg-color;
background-color: $accent-color;

View file

@ -1,5 +1,6 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -45,9 +46,8 @@ limitations under the License.
}
.mx_RoomDirectory_listheader {
display: flex;
margin-top: 12px;
margin-bottom: 12px;
display: block;
margin-top: 13px;
}
.mx_RoomDirectory_searchbox {
@ -64,7 +64,7 @@ limitations under the License.
}
.mx_RoomDirectory_table {
font-size: 14px;
font-size: $font-12px;
color: $primary-fg-color;
width: 100%;
text-align: left;
@ -112,6 +112,7 @@ limitations under the License.
.mx_RoomDirectory_name {
display: inline-block;
font-size: $font-18px;
font-weight: 600;
}
@ -123,7 +124,7 @@ limitations under the License.
border-radius: 10px;
display: inline-block;
height: 20px;
line-height: 20px;
line-height: $font-20px;
padding: 0 5px;
color: $accent-fg-color;
background-color: $rte-room-pill-color;
@ -135,7 +136,7 @@ limitations under the License.
}
.mx_RoomDirectory_alias {
font-size: 12px;
font-size: $font-12px;
color: $settings-grey-fg-color;
}
@ -148,8 +149,8 @@ limitations under the License.
padding: 0;
}
.mx_RoomDirectory p {
font-size: 14px;
.mx_RoomDirectory > span {
font-size: $font-15px;
margin-top: 0;
.mx_AccessibleButton {

View file

@ -32,7 +32,7 @@ limitations under the License.
.mx_RoomStatusBar_callBar {
height: 50px;
line-height: 50px;
line-height: $font-50px;
}
.mx_RoomStatusBar_placeholderIndicator span {
@ -94,7 +94,7 @@ limitations under the License.
border-radius: 40px;
width: 24px;
height: 24px;
line-height: 24px;
line-height: $font-24px;
font-size: 0.8em;
vertical-align: top;
text-align: center;
@ -132,7 +132,7 @@ limitations under the License.
.mx_RoomStatusBar_connectionLostBar_desc {
color: $primary-fg-color;
font-size: 13px;
font-size: $font-13px;
opacity: 0.5;
padding-bottom: 20px;
}
@ -145,7 +145,7 @@ limitations under the License.
.mx_RoomStatusBar_typingBar {
height: 50px;
line-height: 50px;
line-height: $font-50px;
color: $primary-fg-color;
opacity: 0.5;
@ -155,7 +155,7 @@ limitations under the License.
.mx_RoomStatusBar_isAlone {
height: 50px;
line-height: 50px;
line-height: $font-50px;
color: $primary-fg-color;
opacity: 0.5;
@ -174,11 +174,11 @@ limitations under the License.
.mx_RoomStatusBar_callBar {
height: 40px;
line-height: 40px;
line-height: $font-40px;
}
.mx_RoomStatusBar_typingBar {
height: 40px;
line-height: 40px;
line-height: $font-40px;
}
}

View file

@ -68,15 +68,15 @@ limitations under the License.
text-transform: uppercase;
color: $roomsublist-label-fg-color;
font-weight: 700;
font-size: 12px;
font-size: $font-12px;
margin-left: 8px;
}
.mx_RoomSubList_badge > div {
flex: 0 0 auto;
border-radius: 8px;
border-radius: $font-16px;
font-weight: 600;
font-size: 12px;
font-size: $font-12px;
padding: 0 5px;
color: $roomtile-badge-fg-color;
background-color: $roomtile-name-color;
@ -166,41 +166,22 @@ limitations under the License.
// overflow indicators
.mx_RoomSubList:not(.resized-all) > .mx_RoomSubList_scroll {
&.mx_IndicatorScrollbar_topOverflow::before,
&.mx_IndicatorScrollbar_bottomOverflow::after {
&.mx_IndicatorScrollbar_topOverflow::before {
position: sticky;
content: "";
top: 0;
left: 0;
right: 0;
height: 8px;
content: "";
display: block;
z-index: 100;
display: block;
pointer-events: none;
}
&.mx_IndicatorScrollbar_topOverflow > .mx_AutoHideScrollbar_offset {
margin-top: -8px;
}
&.mx_IndicatorScrollbar_bottomOverflow > .mx_AutoHideScrollbar_offset {
margin-bottom: -8px;
}
&.mx_IndicatorScrollbar_topOverflow::before {
top: 0;
transition: background-image 0.1s ease-in;
background: linear-gradient(to top, $panel-gradient);
}
/*
// for now, we remove the bottomOverflow entirely as we don't want to
// lose the screen real-estate due to a bg-colored gradient, but we also
// don't want to use drop shadows and risk a confusing hierarchy of cards.
// so, instead, we hard-clip at the bottom but soft-clip at the top.
&.mx_IndicatorScrollbar_bottomOverflow::after {
bottom: 0;
transition: background-image 0.1s ease-in;
margin: 0px -8px;
background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.0));
&.mx_IndicatorScrollbar_topOverflow {
margin-top: -8px;
}
*/
}

View file

@ -23,7 +23,7 @@ limitations under the License.
.mx_RoomView_fileDropTarget {
min-width: 0px;
width: 100%;
font-size: 18px;
font-size: $font-18px;
text-align: center;
pointer-events: none;
@ -186,7 +186,7 @@ limitations under the License.
.mx_RoomView_empty {
flex: 1 1 auto;
font-size: 13px;
font-size: $font-13px;
padding-left: 3em;
padding-right: 3em;
margin-right: 20px;

View file

@ -39,7 +39,7 @@ limitations under the License.
cursor: pointer;
display: block;
border-radius: 3px;
font-size: 14px;
font-size: $font-14px;
min-height: 24px; // use min-height instead of height to allow the label to overflow a bit
margin-bottom: 6px;
position: relative;

View file

@ -23,6 +23,7 @@ limitations under the License.
flex-direction: column;
align-items: center;
justify-content: space-between;
min-height: 0;
}
.mx_TagPanel_items_selected {
@ -57,6 +58,7 @@ limitations under the License.
.mx_TagPanel .mx_TagPanel_scroller {
flex-grow: 1;
width: 100%;
}
.mx_TagPanel .mx_TagPanel_tagTileContainer {
@ -67,7 +69,7 @@ limitations under the License.
height: 100%;
}
.mx_TagPanel .mx_TagPanel_tagTileContainer > div {
height: 40px;
height: $font-40px;
padding: 10px 0 9px 0;
}
@ -108,13 +110,13 @@ limitations under the License.
.mx_TagPanel .mx_TagTile.mx_TagTile_selected::before {
content: '';
height: 56px;
height: calc(100% + 16px);
background-color: $accent-color;
width: 5px;
position: absolute;
left: -15px;
border-radius: 0 3px 3px 0;
top: -8px; // (56 - 40)/2
top: -8px; // (16px / 2)
}
.mx_TagPanel .mx_TagTile.mx_AccessibleButton:focus {
@ -135,9 +137,9 @@ limitations under the License.
top: -8px;
border-radius: 8px;
background-color: $neutral-badge-color;
color: #ffffff;
color: #000;
font-weight: 600;
font-size: 10px;
font-size: $font-10px;
text-align: center;
padding-top: 1px;
padding-left: 4px;
@ -155,7 +157,7 @@ limitations under the License.
border-radius: 8px;
color: $accent-fg-color;
font-weight: 600;
font-size: 14px;
font-size: $font-14px;
padding: 0 5px;
background-color: $roomtile-name-color;
}

View file

@ -77,7 +77,7 @@ limitations under the License.
grid-column: 1 / 3;
grid-row: 1;
margin: 0;
font-size: 15px;
font-size: $font-15px;
font-weight: 600;
}
@ -91,16 +91,15 @@ limitations under the License.
}
.mx_Toast_description {
max-width: 400px;
max-width: 272px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 4px 0 11px 0;
font-size: 12px;
font-size: $font-12px;
}
.mx_Toast_deviceID {
font-size: 10px;
font-size: $font-10px;
}
}
}

View file

@ -32,7 +32,7 @@ limitations under the License.
.mx_TopLeftMenuButton_name {
margin: 0 7px;
font-size: 18px;
font-size: $font-18px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;

View file

@ -29,7 +29,7 @@ limitations under the License.
.mx_ViewSource pre {
text-align: left;
font-size: 12px;
font-size: $font-12px;
padding: 0.5em 1em 0.5em 1em;
word-wrap: break-word;
white-space: pre-wrap;

View file

@ -26,6 +26,50 @@ limitations under the License.
position: relative;
}
.mx_CompleteSecurity_clients {
width: max-content;
margin: 36px auto 0;
.mx_CompleteSecurity_clients_desktop, .mx_CompleteSecurity_clients_mobile {
position: relative;
width: 160px;
text-align: center;
padding-top: 64px;
display: inline-block;
&::before {
content: '';
position: absolute;
height: 48px;
width: 48px;
left: 56px;
top: 0;
background-color: $muted-fg-color;
mask-repeat: no-repeat;
mask-size: contain;
}
}
.mx_CompleteSecurity_clients_desktop {
margin-right: 56px;
}
.mx_CompleteSecurity_clients_desktop::before {
mask-image: url('$(res)/img/feather-customised/monitor.svg');
}
.mx_CompleteSecurity_clients_mobile::before {
mask-image: url('$(res)/img/feather-customised/smartphone.svg');
}
p {
margin-top: 16px;
font-size: $font-12px;
color: $muted-fg-color;
text-align: center;
}
}
.mx_CompleteSecurity_heroIcon {
width: 128px;
height: 128px;
@ -34,12 +78,17 @@ limitations under the License.
}
.mx_CompleteSecurity_body {
font-size: 15px;
font-size: $font-15px;
}
.mx_CompleteSecurity_waiting {
color: $notice-secondary-color;
}
.mx_CompleteSecurity_actionRow {
display: flex;
justify-content: flex-end;
margin-top: $font-28px;
.mx_AccessibleButton {
margin-inline-start: 18px;

View file

@ -89,3 +89,13 @@ limitations under the License.
.mx_Login_underlinedServerName {
border-bottom: 1px dashed $accent-color;
}
div.mx_AccessibleButton_kind_link.mx_Login_forgot {
// style it as a link
font-size: inherit;
padding: 0;
&.mx_AccessibleButton_disabled {
cursor: not-allowed;
}
}

View file

@ -17,7 +17,7 @@ limitations under the License.
.mx_AuthBody {
width: 500px;
font-size: 12px;
font-size: $font-12px;
color: $authpage-secondary-color;
background-color: $authpage-body-bg-color;
border-radius: 0 4px 4px 0;
@ -25,14 +25,14 @@ limitations under the License.
box-sizing: border-box;
h2 {
font-size: 24px;
font-size: $font-24px;
font-weight: 600;
margin-top: 8px;
color: $authpage-primary-color;
}
h3 {
font-size: 14px;
font-size: $font-14px;
font-weight: 600;
color: $authpage-primary-color;
}
@ -98,7 +98,7 @@ limitations under the License.
.mx_AuthBody_editServerDetails {
padding-left: 1em;
font-size: 12px;
font-size: $font-12px;
font-weight: normal;
}
@ -119,6 +119,24 @@ limitations under the License.
margin-right: 0;
}
.mx_AuthBody_paddedFooter {
height: 80px; // height of the submit button + register link
padding-top: 28px;
text-align: center;
.mx_AuthBody_paddedFooter_title {
margin-top: 16px;
font-size: $font-15px;
line-height: $font-24px;
}
.mx_AuthBody_paddedFooter_subtitle {
margin-top: 8px;
font-size: $font-10px;
line-height: $font-14px;
}
}
.mx_AuthBody_changeFlow {
display: block;
text-align: center;

View file

@ -43,7 +43,7 @@ limitations under the License.
cursor: pointer;
font-size: 15px;
font-size: $font-15px;
padding: 0 11px;
word-break: break-word;
}

View file

@ -17,7 +17,7 @@ limitations under the License.
.mx_AuthFooter {
text-align: center;
width: 100%;
font-size: 14px;
font-size: $font-14px;
opacity: 0.72;
padding: 20px 0;
background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));

View file

@ -24,13 +24,13 @@ limitations under the License.
box-sizing: border-box;
h2 {
font-size: 24px;
font-size: $font-24px;
font-weight: 600;
margin-top: 0;
}
h3 {
font-size: 14px;
font-size: $font-14px;
font-weight: 600;
}

View file

@ -60,3 +60,14 @@ limitations under the License.
.mx_InteractiveAuthEntryComponents_passwordSection {
width: 300px;
}
.mx_InteractiveAuthEntryComponents_sso_buttons {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 20px;
.mx_AccessibleButton {
margin-left: 5px;
}
}

View file

@ -20,7 +20,7 @@ limitations under the License.
.mx_AuthBody_language .mx_Dropdown_input {
border: none;
font-size: 14px;
font-size: $font-14px;
font-weight: 600;
color: $authpage-lang-color;
}

View file

@ -65,5 +65,5 @@ limitations under the License.
}
.mx_ServerTypeSelector_description {
font-size: 10px;
font-size: $font-10px;
}

View file

@ -17,7 +17,7 @@ limitations under the License.
.mx_MessageComposer_avatar .mx_BaseAvatar {
padding: 2px;
border: 1px solid transparent;
border-radius: 15px;
border-radius: 100%;
}
.mx_MessageComposer_avatar .mx_BaseAvatar_initial {

View file

@ -19,6 +19,7 @@ limitations under the License.
}
.mx_MessageContextMenu_field {
display: block;
padding: 3px 6px 3px 6px;
cursor: pointer;
white-space: nowrap;

View file

@ -38,7 +38,7 @@ limitations under the License.
white-space: nowrap;
display: flex;
align-items: center;
line-height: 16px;
line-height: $font-16px;
}
.mx_RoomTileContextMenu_tag_field.mx_RoomTileContextMenu_tag_fieldSet {

View file

@ -44,7 +44,7 @@ input.mx_StatusMessageContextMenu_message {
.mx_StatusMessageContextMenu_clear {
@mixin mx_DialogButton;
align-self: start;
font-size: 12px;
font-size: $font-12px;
padding: 6px 1em;
border: 1px solid transparent;
margin-right: 10px;

View file

@ -22,7 +22,7 @@ limitations under the License.
white-space: nowrap;
display: flex;
align-items: center;
line-height: 16px;
line-height: $font-16px;
}
.mx_TagTileContextMenu_item object {

View file

@ -19,12 +19,12 @@ limitations under the License.
border-radius: 4px;
.mx_TopLeftMenu_greyedText {
font-size: 12px;
font-size: $font-12px;
opacity: 0.5;
}
.mx_TopLeftMenu_upgradeLink {
font-size: 12px;
font-size: $font-12px;
img {
margin-left: 5px;
@ -72,10 +72,10 @@ limitations under the License.
.mx_AccessibleButton::after {
mask-repeat: no-repeat;
mask-position: 0 center;
mask-size: 16px;
mask-size: $font-16px;
position: absolute;
width: 16px;
height: 16px;
width: $font-16px;
height: $font-16px;
content: "";
top: 5px;
left: 14px;

View file

@ -28,7 +28,7 @@ limitations under the License.
.mx_AddressPickerDialog_input,
.mx_AddressPickerDialog_input:focus {
height: 26px;
font-size: 14px;
font-size: $font-14px;
font-family: $font-family;
padding-left: 12px;
padding-right: 12px;
@ -50,7 +50,7 @@ limitations under the License.
.mx_AddressPickerDialog_inputContainer {
border-radius: 3px;
border: solid 1px $input-border-color;
line-height: 36px;
line-height: $font-36px;
padding-left: 4px;
padding-right: 4px;
padding-top: 1px;

View file

@ -26,22 +26,22 @@ limitations under the License.
}
.mx_ConfirmUserActionDialog_name {
font-size: 18px;
font-size: $font-18px;
}
.mx_ConfirmUserActionDialog_userId {
font-size: 13px;
font-size: $font-13px;
}
.mx_ConfirmUserActionDialog_reasonField {
font-family: $font-family;
font-size: 14px;
font-size: $font-14px;
color: $primary-fg-color;
background-color: $primary-bg-color;
border-radius: 3px;
border: solid 1px $input-border-color;
line-height: 36px;
line-height: $font-36px;
padding-left: 16px;
padding-right: 16px;
padding-top: 1px;

View file

@ -25,7 +25,7 @@ limitations under the License.
}
.mx_CreateGroupDialog_input {
font-size: 15px;
font-size: $font-15px;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
@ -44,7 +44,7 @@ limitations under the License.
.mx_CreateGroupDialog_prefix,
.mx_CreateGroupDialog_suffix {
padding: 0px 5px;
line-height: 37px;
line-height: $font-37px;
background-color: $input-darker-bg-color;
border: 1px solid $input-border-color;
text-align: center;

View file

@ -15,6 +15,8 @@ limitations under the License.
*/
.mx_CreateRoomDialog_details {
margin-top: 15px;
.mx_CreateRoomDialog_details_summary {
outline: none;
list-style: none;
@ -49,7 +51,7 @@ limitations under the License.
}
.mx_CreateRoomDialog_input {
font-size: 15px;
font-size: $font-15px;
border-radius: 3px;
border: 1px solid $input-border-color;
padding: 9px;
@ -71,11 +73,19 @@ limitations under the License.
}
.mx_CreateRoomDialog {
&.mx_Dialog_fixedWidth {
width: 450px;
}
.mx_Dialog_content {
margin-bottom: 40px;
}
p,
.mx_Field_input label {
color: $muted-fg-color;
}
.mx_SettingsFlag {
display: flex;
}
@ -90,5 +100,18 @@ limitations under the License.
flex: 0 0 auto;
margin-left: 30px;
}
.mx_CreateRoomDialog_topic {
margin-bottom: 36px;
}
.mx_Dialog_content > .mx_SettingsFlag {
margin-top: 24px;
}
p {
margin: 0 85px 0 0;
font-size: $font-12px;
}
}

View file

@ -68,11 +68,11 @@ limitations under the License.
width: 240px;
color: $input-fg-color;
font-family: $font-family;
font-size: 16px;
font-size: $font-16px;
}
.mx_DevTools_textarea {
font-size: 12px;
font-size: $font-12px;
max-width: 684px;
min-height: 250px;
padding: 10px;
@ -189,3 +189,37 @@ limitations under the License.
}
}
}
.mx_DevTools_VerificationRequest {
border: 1px solid #cccccc;
border-radius: 3px;
padding: 1px 5px;
margin-bottom: 6px;
font-family: $monospace-font-family;
dl {
display: grid;
grid-template-columns: max-content auto;
margin: 0;
}
dd {
grid-column-start: 2;
}
dd:empty {
color: #666666;
&::after {
content: "(empty)";
}
}
dt {
font-weight: bold;
grid-column-start: 1;
}
dt::after {
content: ":";
}
}

View file

@ -40,8 +40,8 @@ limitations under the License.
textarea,
textarea:focus {
height: 34px;
line-height: 34px;
font-size: 14px;
line-height: $font-34px;
font-size: $font-14px;
padding-left: 12px;
margin: 0 !important;
border: 0 !important;
@ -65,7 +65,7 @@ limitations under the License.
min-width: 48px;
margin-left: 10px;
height: 25px;
line-height: 25px;
line-height: $font-25px;
}
.mx_InviteDialog_buttonAndSpinner {
@ -84,7 +84,7 @@ limitations under the License.
padding-bottom: 10px;
h3 {
font-size: 12px;
font-size: $font-12px;
color: $muted-fg-color;
font-weight: bold;
text-transform: uppercase;
@ -143,23 +143,23 @@ limitations under the License.
.mx_InviteDialog_roomTile_name {
font-weight: 600;
font-size: 14px;
font-size: $font-14px;
color: $primary-fg-color;
margin-left: 7px;
}
.mx_InviteDialog_roomTile_userId {
font-size: 12px;
font-size: $font-12px;
color: $muted-fg-color;
margin-left: 7px;
}
.mx_InviteDialog_roomTile_time {
text-align: right;
font-size: 12px;
font-size: $font-12px;
color: $muted-fg-color;
float: right;
line-height: 36px; // Height of the avatar to keep the time vertically aligned
line-height: $font-36px; // Height of the avatar to keep the time vertically aligned
}
.mx_InviteDialog_roomTile_highlight {
@ -176,7 +176,7 @@ limitations under the License.
border-radius: 12px;
display: inline-block;
height: 24px;
line-height: 24px;
line-height: $font-24px;
padding-left: 8px;
padding-right: 8px;
color: #ffffff; // this is fine without a var because it's for both themes

View file

@ -0,0 +1,65 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_KeyboardShortcutsDialog {
display: flex;
flex-wrap: wrap;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
margin-bottom: -50px;
max-height: 1100px; // XXX: this may need adjusting when adding new shortcuts
.mx_KeyboardShortcutsDialog_category {
width: 33.3333%; // 3 columns
margin: 0 0 40px;
& > div {
padding-left: 5px;
}
}
h3 {
margin: 0 0 10px;
}
h5 {
margin: 15px 0 5px;
font-weight: normal;
}
kbd {
padding: 5px;
border-radius: 4px;
background-color: $reaction-row-button-bg-color;
margin-right: 5px;
min-width: 20px;
text-align: center;
display: inline-block;
border: 1px solid $kbd-border-color;
box-shadow: 0 2px $kbd-border-color;
margin-bottom: 4px;
text-transform: capitalize;
& + kbd {
margin-left: 5px;
}
}
.mx_KeyboardShortcutsDialog_inline div {
display: inline;
}
}

View file

@ -35,7 +35,7 @@ limitations under the License.
.mx_MessageEditHistoryDialog_edits {
list-style-type: none;
font-size: 14px;
font-size: $font-14px;
padding: 0;
color: $primary-fg-color;
@ -60,7 +60,7 @@ limitations under the License.
}
.mx_MessageActionBar .mx_AccessibleButton {
font-size: 10px;
font-size: $font-10px;
padding: 0 8px;
}
}

View file

@ -32,6 +32,6 @@ limitations under the License.
}
.mx_NewSessionReviewDialog_deviceID {
font-size: 12px;
font-size: $font-12px;
color: $notice-secondary-color;
}

View file

@ -29,6 +29,10 @@ limitations under the License.
mask-image: url('$(res)/img/feather-customised/users-sm.svg');
}
.mx_RoomSettingsDialog_notificationsIcon::before {
mask-image: url('$(res)/img/feather-customised/notifications.svg');
}
.mx_RoomSettingsDialog_bridgesIcon::before {
// This icon is pants, please improve :)
mask-image: url('$(res)/img/feather-customised/bridge.svg');

View file

@ -20,7 +20,7 @@ limitations under the License.
padding: 9px;
color: $input-fg-color;
background-color: $primary-bg-color;
font-size: 15px;
font-size: $font-15px;
width: 100%;
max-width: 280px;
margin-bottom: 10px;

View file

@ -29,7 +29,7 @@ limitations under the License.
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
font-size: 15px;
font-size: $font-15px;
width: 100%;
max-width: 280px;
}

View file

@ -20,7 +20,7 @@ limitations under the License.
padding: 9px;
color: $primary-fg-color;
background-color: $primary-bg-color;
font-size: 15px;
font-size: $font-15px;
max-width: 280px;
margin-bottom: 10px;
}

View file

@ -64,9 +64,6 @@ limitations under the License.
.mx_ShareDialog_qrcode_container {
float: left;
background-color: #ffffff;
padding: 5px; // makes qr code more readable in dark theme
border-radius: 5px;
height: 256px;
width: 256px;
margin-right: 64px;

View file

@ -31,7 +31,7 @@ limitations under the License.
}
.mx_TermsDialog_termsTable {
font-size: 12px;
font-size: $font-12px;
width: 100%;
}

View file

@ -14,14 +14,6 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
// CSS voodoo to support a gemini-scrollbar for the contents of the dialog
.mx_Dialog_unknownDevice .mx_Dialog {
// ideally we'd shrink the height to fit when needed, but in practice this
// is a pain in the ass. plus might as well make the dialog big given how
// important it is.
height: 100%;
}
.mx_UnknownDeviceDialog {
height: 100%;
display: flex;
@ -35,7 +27,7 @@ limitations under the License.
// userid
.mx_UnknownDeviceDialog p {
font-weight: bold;
font-size: 16px;
font-size: $font-16px;
}
.mx_UnknownDeviceDialog .mx_DeviceVerifyButtons {
@ -44,6 +36,7 @@ limitations under the License.
.mx_UnknownDeviceDialog .mx_Dialog_content {
margin-bottom: 24px;
overflow-y: scroll;
}
.mx_UnknownDeviceDialog_deviceList > li {

View file

@ -32,3 +32,9 @@ limitations under the License.
padding: 10px;
}
.mx_RestoreKeyBackupDialog_content > div {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: 110px; /* Empirically measured */
}

View file

@ -1,5 +1,5 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -15,70 +15,152 @@ limitations under the License.
*/
.mx_NetworkDropdown {
height: 32px;
position: relative;
}
width: max-content;
padding-right: 32px;
margin-left: auto;
margin-right: 9px;
margin-top: 12px;
.mx_NetworkDropdown_input {
position: relative;
border-radius: 3px;
border: 1px solid $strong-input-border-color;
font-weight: 300;
font-size: 13px;
user-select: none;
}
.mx_NetworkDropdown_arrow {
border-color: $primary-fg-color transparent transparent;
border-style: solid;
border-width: 5px 5px 0;
display: block;
height: 0;
position: absolute;
right: 10px;
top: 16px;
width: 0;
}
.mx_NetworkDropdown_networkoption {
height: 37px;
line-height: 37px;
padding-left: 8px;
padding-right: 8px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.mx_NetworkDropdown_networkoption img {
margin: 5px;
width: 25px;
vertical-align: middle;
}
input.mx_NetworkDropdown_networkoption, input.mx_NetworkDropdown_networkoption:focus {
border: 0;
padding-top: 0;
padding-bottom: 0;
.mx_AccessibleButton {
width: max-content;
}
}
.mx_NetworkDropdown_menu {
position: absolute;
left: -1px;
right: -1px;
top: 100%;
z-index: 2;
min-width: 204px;
margin: 0;
padding: 0px;
border-radius: 3px;
border: 1px solid $accent-color;
box-sizing: border-box;
border-radius: 4px;
border: 1px solid $dialog-close-fg-color;
background-color: $primary-bg-color;
}
.mx_NetworkDropdown_menu .mx_NetworkDropdown_networkoption:hover {
background-color: $focus-bg-color;
max-height: calc(100vh - 20px); // allow 10px padding on both top and bottom
overflow-y: auto;
}
.mx_NetworkDropdown_menu_network {
font-weight: bold;
}
.mx_NetworkDropdown_server {
padding: 12px 0;
border-bottom: 1px solid $input-darker-fg-color;
.mx_NetworkDropdown_server_title {
padding: 0 10px;
font-size: $font-15px;
font-weight: 600;
line-height: $font-20px;
margin-bottom: 4px;
position: relative;
// remove server button
.mx_AccessibleButton {
position: absolute;
display: inline;
right: 10px;
height: 16px;
width: 16px;
margin-top: 2px;
&::after {
content: "";
position: absolute;
width: 16px;
height: 16px;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/feather-customised/x.svg');
background-color: $notice-primary-color;
}
}
}
.mx_NetworkDropdown_server_subtitle {
padding: 0 10px;
font-size: $font-10px;
line-height: $font-14px;
margin-top: -4px;
margin-bottom: 4px;
color: $muted-fg-color;
}
.mx_NetworkDropdown_server_network {
font-size: $font-12px;
line-height: $font-16px;
padding: 4px 10px;
cursor: pointer;
position: relative;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&[aria-checked=true]::after {
content: "";
position: absolute;
width: 16px;
height: 16px;
right: 10px;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/feather-customised/check.svg');
background-color: $input-valid-border-color;
}
}
}
.mx_NetworkDropdown_server_add,
.mx_NetworkDropdown_server_network {
&:hover {
background-color: $header-panel-bg-color;
}
}
.mx_NetworkDropdown_server_add {
padding: 16px 10px 16px 32px;
position: relative;
border-radius: 0 0 4px 4px;
&::before {
content: "";
position: absolute;
width: 16px;
height: 16px;
left: 7px;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/feather-customised/plus.svg');
background-color: $muted-fg-color;
}
}
.mx_NetworkDropdown_handle {
position: relative;
&::after {
content: "";
position: absolute;
width: 24px;
height: 24px;
right: -28px; // - (24 + 4)
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
background-color: $primary-fg-color;
}
.mx_NetworkDropdown_handle_server {
color: $muted-fg-color;
font-size: $font-12px;
}
}
.mx_NetworkDropdown_dialog .mx_Dialog {
width: 45vw;
}

View file

@ -27,7 +27,7 @@ limitations under the License.
text-align: center;
border-radius: 4px;
display: inline-block;
font-size: 14px;
font-size: $font-14px;
}
.mx_AccessibleButton_kind_primary {
@ -36,12 +36,20 @@ limitations under the License.
font-weight: 600;
}
.mx_AccessibleButton_kind_primary_outline {
color: $button-primary-bg-color;
background-color: $button-secondary-bg-color;
border: 1px solid $button-primary-bg-color;
font-weight: 600;
}
.mx_AccessibleButton_kind_secondary {
color: $accent-color;
font-weight: 600;
}
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled {
.mx_AccessibleButton_kind_primary.mx_AccessibleButton_disabled,
.mx_AccessibleButton_kind_primary_outline.mx_AccessibleButton_disabled {
opacity: 0.4;
}
@ -60,7 +68,14 @@ limitations under the License.
background-color: $button-danger-bg-color;
}
.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled {
.mx_AccessibleButton_kind_danger_outline {
color: $button-danger-bg-color;
background-color: $button-secondary-bg-color;
border: 1px solid $button-danger-bg-color;
}
.mx_AccessibleButton_kind_danger.mx_AccessibleButton_disabled,
.mx_AccessibleButton_kind_danger_outline.mx_AccessibleButton_disabled {
color: $button-danger-disabled-fg-color;
background-color: $button-danger-disabled-bg-color;
}

View file

@ -19,9 +19,9 @@ limitations under the License.
border-radius: 3px;
background-color: rgba(74, 73, 74, 0.1);
border: solid 1px $input-border-color;
line-height: 26px;
line-height: $font-26px;
color: $primary-fg-color;
font-size: 14px;
font-size: $font-14px;
font-weight: normal;
margin-right: 4px;
}

View file

@ -18,7 +18,6 @@ limitations under the License.
display: flex;
padding-left: 9px;
padding-right: 9px;
margin: 0 5px 0 0 !important;
}
.mx_DirectorySearchBox_joinButton {
@ -33,7 +32,7 @@ limitations under the License.
background-repeat: no-repeat;
text-indent: 18px;
font-weight: 600;
font-size: 12px;
font-size: $font-12px;
user-select: none;
cursor: pointer;
}

View file

@ -29,10 +29,14 @@ limitations under the License.
position: relative;
border-radius: 3px;
border: 1px solid $strong-input-border-color;
font-size: 12px;
font-size: $font-12px;
user-select: none;
}
.mx_Dropdown_input.mx_AccessibleButton_disabled {
cursor: not-allowed;
}
.mx_Dropdown_input:focus {
border-color: $input-focused-border-color;
}
@ -53,7 +57,7 @@ limitations under the License.
.mx_Dropdown_option {
height: 35px;
line-height: 35px;
line-height: $font-35px;
padding-left: 8px;
padding-right: 8px;
}
@ -63,6 +67,8 @@ limitations under the License.
text-overflow: ellipsis;
white-space: nowrap;
flex: 1;
display: inline-flex;
align-items: center;
}
.mx_Dropdown_option div {
@ -71,12 +77,18 @@ limitations under the License.
white-space: nowrap;
}
.mx_Dropdown_option img {
.mx_Dropdown_option img,
.mx_Dropdown_option .mx_Dropdown_option_emoji {
margin: 5px;
width: 16px;
vertical-align: middle;
}
.mx_Dropdown_option_emoji {
font-size: $font-16px;
line-height: $font-16px;
}
input.mx_Dropdown_option,
input.mx_Dropdown_option:focus {
font-weight: normal;

View file

@ -20,14 +20,21 @@ limitations under the License.
}
.mx_EditableItem {
display: flex;
margin-bottom: 5px;
margin-left: 15px;
}
.mx_EditableItem_delete {
order: 3;
margin-right: 5px;
cursor: pointer;
vertical-align: middle;
width: 14px;
height: 14px;
mask-image: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
background-color: $warning-color;
mask-size: 100%;
}
.mx_EditableItem_email {
@ -36,12 +43,22 @@ limitations under the License.
.mx_EditableItem_promptText {
margin-right: 10px;
order: 2;
}
.mx_EditableItem_confirmBtn {
margin-right: 5px;
}
.mx_EditableItem_item {
flex: auto 1 0;
order: 1;
width: calc(100% - 14px); // leave space for the remove button
overflow-x: hidden;
text-overflow: ellipsis;
}
.mx_EditableItemList_label {
margin-bottom: 5px;
}

View file

@ -19,7 +19,7 @@ limitations under the License.
}
.mx_TextualEvent.mx_EventListSummary_summary {
font-size: 14px;
font-size: $font-14px;
display: inline-flex;
}
@ -27,7 +27,7 @@ limitations under the License.
display: inline-block;
margin-right: 8px;
padding-top: 8px;
line-height: 12px;
line-height: $font-12px;
}
.mx_EventListSummary_avatars .mx_BaseAvatar {
@ -46,19 +46,19 @@ limitations under the License.
.mx_EventListSummary_line {
border-bottom: 1px solid $primary-hairline-color;
margin-left: 63px;
line-height: 30px;
line-height: $font-30px;
}
.mx_MatrixChat_useCompactLayout {
.mx_EventListSummary {
font-size: 13px;
font-size: $font-13px;
.mx_EventTile_line {
line-height: 20px;
line-height: $font-20px;
}
}
.mx_EventListSummary_line {
line-height: 22px;
line-height: $font-22px;
}
.mx_EventListSummary_toggle {
@ -66,6 +66,6 @@ limitations under the License.
}
.mx_TextualEvent.mx_EventListSummary_summary {
font-size: 13px;
font-size: $font-13px;
}
}

View file

@ -40,7 +40,7 @@ limitations under the License.
.mx_Field textarea {
font-weight: normal;
font-family: $font-family;
font-size: 14px;
font-size: $font-14px;
border: none;
// Even without a border here, we still need this avoid overlapping the rounded
// corners on the field above.
@ -102,7 +102,7 @@ limitations under the License.
background-color 0.25s ease-out 0.1s;
color: $primary-fg-color;
background-color: transparent;
font-size: 14px;
font-size: $font-14px;
position: absolute;
left: 0px;
top: 0px;
@ -126,7 +126,7 @@ limitations under the License.
color 0.25s ease-out 0s,
top 0.25s ease-out 0s,
background-color 0.25s ease-out 0s;
font-size: 10px;
font-size: $font-10px;
top: -13px;
padding: 0 2px;
background-color: $field-focused-label-bg-color;

View file

@ -15,9 +15,9 @@ limitations under the License.
*/
.mx_FormButton {
line-height: 16px;
line-height: $font-16px;
padding: 5px 15px;
font-size: 12px;
font-size: $font-12px;
height: min-content;
&:not(:last-child) {

View file

@ -102,13 +102,13 @@ limitations under the License.
}
.mx_ImageView_name {
font-size: 18px;
font-size: $font-18px;
margin-bottom: 6px;
word-wrap: break-word;
}
.mx_ImageView_metadata {
font-size: 15px;
font-size: $font-15px;
opacity: 0.5;
}
@ -118,13 +118,13 @@ limitations under the License.
margin-bottom: 6px;
border-radius: 5px;
background-color: $lightbox-bg-color;
font-size: 14px;
font-size: $font-14px;
padding: 9px;
border: 1px solid $lightbox-border-color;
}
.mx_ImageView_size {
font-size: 11px;
font-size: $font-11px;
}
.mx_ImageView_link {
@ -133,7 +133,7 @@ limitations under the License.
}
.mx_ImageView_button {
font-size: 15px;
font-size: $font-15px;
opacity: 0.5;
margin-top: 18px;
cursor: pointer;

View file

@ -24,7 +24,7 @@ limitations under the License.
background-color: $interactive-tooltip-bg-color;
color: $interactive-tooltip-fg-color;
position: absolute;
font-size: 10px;
font-size: $font-10px;
font-weight: 600;
padding: 6px;
z-index: 5001;

View file

@ -0,0 +1,21 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_QRCode {
img {
border-radius: 8px;
}
}

View file

@ -6,11 +6,33 @@
.mx_RoomPill,
.mx_GroupPill,
.mx_AtRoomPill {
border-radius: 16px;
display: inline-block;
height: 20px;
line-height: 20px;
padding-left: 5px;
display: inline-flex;
align-items: center;
vertical-align: middle;
border-radius: $font-16px;
line-height: $font-15px;
padding-left: 0;
}
a.mx_Pill {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
max-width: calc(100% - 1ch);
}
.mx_Pill {
padding: $font-1px;
padding-right: 0.4em;
vertical-align: text-top;
line-height: $font-17px;
}
/* More specific to override `.markdown-body a` color */
.mx_EventTile_content .markdown-body a.mx_GroupPill,
.mx_GroupPill {
color: $accent-fg-color;
background-color: $rte-group-pill-color;
}
/* More specific to override `.markdown-body a` text-decoration */
@ -23,7 +45,6 @@
.mx_UserPill {
color: $primary-fg-color;
background-color: $other-user-pill-bg-color;
padding-right: 5px;
}
.mx_UserPill_selected {
@ -37,7 +58,6 @@
.mx_MessageComposer_input .mx_AtRoomPill {
color: $accent-fg-color;
background-color: $mention-user-pill-bg-color;
padding-right: 5px;
}
/* More specific to override `.markdown-body a` color */
@ -47,15 +67,6 @@
.mx_GroupPill {
color: $accent-fg-color;
background-color: $rte-room-pill-color;
padding-right: 5px;
}
/* More specific to override `.markdown-body a` color */
.mx_EventTile_content .markdown-body a.mx_GroupPill,
.mx_GroupPill {
color: $accent-fg-color;
background-color: $rte-group-pill-color;
padding-right: 5px;
}
.mx_EventTile_body .mx_UserPill,
@ -69,8 +80,10 @@
.mx_GroupPill .mx_BaseAvatar,
.mx_AtRoomPill .mx_BaseAvatar {
position: relative;
left: -3px;
top: 2px;
display: inline-flex;
align-items: center;
border-radius: 10rem;
margin-right: 0.24rem;
}
.mx_Markdown_BOLD {

View file

@ -16,11 +16,13 @@ limitations under the License.
.mx_ToggleSwitch {
transition: background-color 0.20s ease-out 0.1s;
width: 48px;
height: 24px;
border-radius: 14px;
width: $font-44px;
height: $font-20px;
border-radius: 1.5rem;
padding: 2px;
background-color: $togglesw-off-color;
position: relative;
opacity: 0.5;
}
@ -31,23 +33,18 @@ limitations under the License.
.mx_ToggleSwitch.mx_ToggleSwitch_on {
background-color: $togglesw-on-color;
> .mx_ToggleSwitch_ball {
left: calc(100% - $font-20px);
}
}
.mx_ToggleSwitch_ball {
transition: left 0.15s ease-out 0.1s;
margin: 2px;
width: 20px;
height: 20px;
border-radius: 20px;
position: relative;
width: $font-20px;
height: $font-20px;
border-radius: $font-20px;
background-color: $togglesw-ball-color;
position: absolute;
top: 0;
}
.mx_ToggleSwitch_on > .mx_ToggleSwitch_ball {
left: 23px; // 48px switch - 20px ball - 5px padding = 23px
}
.mx_ToggleSwitch:not(.mx_ToggleSwitch_on) > .mx_ToggleSwitch_ball {
left: 2px;
transition: left 0.15s ease-out 0.1s;
left: 0;
}

View file

@ -58,8 +58,8 @@ limitations under the License.
z-index: 4000; // Higher than dialogs so tooltips can be used in dialogs
padding: 10px;
pointer-events: none;
line-height: 14px;
font-size: 12px;
line-height: $font-14px;
font-size: $font-12px;
font-weight: 600;
color: $primary-fg-color;
max-width: 200px;
@ -82,7 +82,7 @@ limitations under the License.
text-align: center;
border: none;
border-radius: 3px;
font-size: 14px;
font-size: $font-14px;
line-height: 1.2;
padding: 6px 8px;

View file

@ -28,7 +28,7 @@ limitations under the License.
transition: opacity 0.2s ease-in;
opacity: 0.6;
line-height: 11px;
line-height: $font-11px;
text-align: center;
cursor: pointer;

View file

@ -163,7 +163,7 @@ limitations under the License.
.mx_EmojiPicker_item {
display: inline-block;
font-size: 20px;
font-size: $font-20px;
padding: 5px;
width: 100%;
height: 100%;
@ -183,7 +183,7 @@ limitations under the License.
}
.mx_EmojiPicker_category_label, .mx_EmojiPicker_preview_name {
font-size: 16px;
font-size: $font-16px;
font-weight: 600;
margin: 0;
}
@ -197,7 +197,7 @@ limitations under the License.
}
.mx_EmojiPicker_preview_emoji {
font-size: 32px;
font-size: $font-32px;
padding: 8px 16px;
}
@ -212,7 +212,7 @@ limitations under the License.
.mx_EmojiPicker_shortcode {
color: $light-fg-color;
font-size: 14px;
font-size: $font-14px;
&::before, &::after {
content: ":";

View file

@ -19,7 +19,7 @@ limitations under the License.
margin: 4px 0;
display: flex;
align-items: center;
font-size: 14px;
font-size: $font-14px;
color: $roomtopic-color;
}

View file

@ -0,0 +1,22 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
span.mx_MVideoBody {
video.mx_MVideoBody {
max-width: 100%;
height: auto;
}
}

View file

@ -21,7 +21,7 @@ limitations under the License.
cursor: pointer;
display: flex;
height: 24px;
line-height: 24px;
line-height: $font-24px;
border-radius: 4px;
background: $message-action-bar-bg-color;
top: -18px;

View file

@ -16,5 +16,5 @@ limitations under the License.
.mx_MessageTimestamp {
color: $event-timestamp-color;
font-size: 10px;
font-size: $font-10px;
}

View file

@ -21,7 +21,7 @@ limitations under the License.
.mx_ReactionsRow_showAll {
text-decoration: none;
font-size: 10px;
font-size: $font-10px;
font-weight: 600;
margin-left: 6px;
vertical-align: top;

View file

@ -17,7 +17,7 @@ limitations under the License.
.mx_ReactionsRowButton {
display: inline-flex;
height: 20px;
line-height: 21px;
line-height: $font-21px;
margin-right: 6px;
padding: 0 6px;
border: 1px solid $reaction-row-button-border-color;
@ -34,12 +34,17 @@ limitations under the License.
background-color: $reaction-row-button-selected-bg-color;
border-color: $reaction-row-button-selected-border-color;
}
}
.mx_ReactionsRowButton_content {
max-width: 100px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-right: 4px;
// ignore mouse events for all children, treat it as one entire hoverable entity
* {
pointer-events: none;
}
.mx_ReactionsRowButton_content {
max-width: 100px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding-right: 4px;
}
}

View file

@ -0,0 +1,36 @@
/*
Copyright 2020 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_RedactedBody {
white-space: pre-wrap;
color: $muted-fg-color;
vertical-align: middle;
padding-left: 20px;
position: relative;
&::before {
height: 14px;
width: 14px;
background-color: $muted-fg-color;
mask-image: url('$(res)/img/feather-customised/trash.custom.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
content: '';
position: absolute;
top: 2px;
left: 0;
}
}

View file

@ -17,7 +17,7 @@ limitations under the License.
.mx_EventTile_content.mx_ViewSourceEvent {
display: flex;
opacity: 0.6;
font-size: 12px;
font-size: $font-12px;
pre, code {
flex: 1;

View file

@ -45,7 +45,7 @@ limitations under the License.
.mx_cryptoEvent_title {
font-weight: 600;
font-size: 15px;
font-size: $font-15px;
grid-column: 2;
grid-row: 1;
}
@ -56,7 +56,7 @@ limitations under the License.
}
.mx_cryptoEvent_state, .mx_cryptoEvent_subtitle {
font-size: 12px;
font-size: $font-12px;
}
.mx_cryptoEvent_state, .mx_cryptoEvent_buttons {

View file

@ -20,7 +20,7 @@ limitations under the License.
flex-direction: column;
flex: 1;
overflow-y: auto;
font-size: 12px;
font-size: $font-12px;
.mx_UserInfo_cancel {
cursor: pointer;
@ -43,7 +43,7 @@ limitations under the License.
}
h2 {
font-size: 18px;
font-size: $font-18px;
font-weight: 600;
margin: 18px 0 0 0;
}
@ -98,8 +98,8 @@ limitations under the License.
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
width: 100% !important;
height: 100% !important;
}
.mx_UserInfo_avatar .mx_BaseAvatar_initial {
@ -109,7 +109,7 @@ limitations under the License.
justify-content: center;
// override the calculated sizes so that the letter isn't HUGE
font-size: 56px !important;
font-size: 6rem !important;
width: 100% !important;
transition: font-size 0.5s;
}
@ -122,7 +122,7 @@ limitations under the License.
text-transform: uppercase;
color: $notice-secondary-color;
font-weight: bold;
font-size: 12px;
font-size: $font-12px;
margin: 4px 0;
}
@ -134,17 +134,28 @@ limitations under the License.
text-align: center;
h2 {
font-size: 18px;
line-height: 25px;
flex: 1;
overflow-x: auto;
max-height: 50px;
display: flex;
font-size: $font-18px;
line-height: $font-25px;
flex: 1;
justify-content: center;
align-items: center;
span {
// limit to 2 lines, show an ellipsis if it overflows
// this looks webkit specific but is supported by Firefox 68+
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
word-break: break-all;
text-overflow: ellipsis;
}
.mx_E2EIcon {
margin: 5px;
margin-top: 3px; // visual vertical centering to the top line of text
margin-right: 4px; // margin from displyname
min-width: 18px; // convince flexbox to not collapse it
}
}
@ -190,7 +201,7 @@ limitations under the License.
.mx_UserInfo_field {
cursor: pointer;
color: $accent-color;
line-height: 16px;
line-height: $font-16px;
margin: 8px 0;
&.mx_UserInfo_destructive {
@ -199,7 +210,7 @@ limitations under the License.
}
.mx_UserInfo_statusMessage {
font-size: 11px;
font-size: $font-11px;
opacity: 0.5;
overflow: hidden;
white-space: nowrap;
@ -259,12 +270,31 @@ limitations under the License.
}
}
.mx_AccessibleButton.mx_AccessibleButton_hasKind {
padding: 8px 18px;
&.mx_AccessibleButton_kind_primary {
color: $accent-color;
background-color: $accent-bg-color;
}
&.mx_AccessibleButton_kind_danger {
color: $notice-primary-color;
background-color: $notice-primary-bg-color;
}
}
.mx_VerificationShowSas .mx_AccessibleButton,
.mx_UserInfo_wideButton {
display: block;
margin: 16px 0;
margin: 16px 0 8px;
}
button.mx_UserInfo_wideButton {
width: 100%; // FIXME get rid of this once we get rid of DialogButtons here
.mx_VerificationShowSas {
.mx_AccessibleButton + .mx_AccessibleButton {
margin: 8px 0; // space between buttons
}
}
}

View file

@ -14,10 +14,30 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
.mx_UserInfo {
.mx_VerificationPanel_verified_section .mx_E2EIcon {
.mx_VerificationPanel_verified_section,
.mx_VerificationPanel_reciprocate_section {
// center the big shield icon
.mx_E2EIcon {
// Override general user info margin
margin: 0 auto !important;
margin: 20px auto !important;
}
}
.mx_UserInfo {
.mx_EncryptionPanel_cancel {
mask: url('$(res)/img/feather-customised/cancel.svg');
mask-repeat: no-repeat;
mask-position: center;
mask-size: cover;
width: 14px;
height: 14px;
background-color: $settings-subsection-fg-color;
cursor: pointer;
position: absolute;
z-index: 100;
top: 14px;
right: 14px;
}
.mx_VerificationPanel_qrCode {
@ -36,6 +56,16 @@ limitations under the License.
max-width: 240px;
}
}
.mx_VerificationPanel_reciprocate_section {
.mx_FormButton {
width: 100%;
box-sizing: border-box;
padding: 10px;
display: block;
margin: 10px 0;
}
}
}
// Special case styling for EncryptionPanel in a Modal dialog
@ -45,6 +75,7 @@ limitations under the License.
margin-top: 10px;
margin-bottom: 10px;
align-items: stretch;
justify-content: center;
> .mx_VerificationPanel_QRPhase_betweenText {
width: 50px;
@ -60,10 +91,12 @@ limitations under the License.
border-radius: 10px;
flex: 1;
display: flex;
padding: 10px;
padding: 20px;
align-items: center;
flex-direction: column;
position: relative;
max-width: 310px;
justify-content: space-between;
canvas, .mx_VerificationPanel_QRPhase_noQR {
width: 220px !important;
@ -76,31 +109,36 @@ limitations under the License.
}
> p {
margin-top: 0;
font-weight: 700;
}
.mx_VerificationPanel_QRPhase_helpText {
font-size: 14px;
margin-top: 71px;
font-size: $font-14px;
margin: 30px 0;
text-align: center;
}
.mx_AccessibleButton {
position: absolute;
bottom: 30px;
}
}
}
// EncryptionPanel when verification is done
.mx_VerificationPanel_verified_section {
// center the big shield icon
.mx_E2EIcon {
margin: 0 auto;
}
// right align the "Got it" button
.mx_AccessibleButton {
float: right;
}
}
.mx_VerificationPanel_reciprocate_section {
.mx_AccessibleButton {
margin-left: 10px;
padding: 7px 40px;
}
.mx_VerificationPanel_reciprocateButtons {
display: flex;
flex-direction: row;
justify-content: flex-end;
}
}
}

View file

@ -26,3 +26,21 @@ limitations under the License.
outline: none;
box-shadow: none;
}
.mx_AliasSettings {
summary {
cursor: pointer;
color: $accent-color;
font-weight: 600;
list-style: none;
// list-style doesn't do it for webkit
&::-webkit-details-marker {
display: none;
}
}
.mx_AliasSettings_localAliasHeader {
margin-top: 35px;
}
}

View file

@ -46,7 +46,7 @@ $AppsDrawerBodyHeight: 273px;
padding: 0;
margin: 5px auto 5px auto;
color: $accent-color;
font-size: 12px;
font-size: $font-12px;
}
.mx_AddWidget_button_full_width {
@ -59,7 +59,7 @@ $AppsDrawerBodyHeight: 273px;
padding: 9px;
color: $primary-hairline-color;
background-color: $primary-bg-color;
font-size: 15px;
font-size: $font-15px;
}
.mx_AppTile {
@ -102,7 +102,7 @@ $AppsDrawerBodyHeight: 273px;
.mx_AppTileMenuBar {
margin: 0;
font-size: 12px;
font-size: $font-12px;
background-color: $widget-menu-bar-bg-color;
display: flex;
flex-direction: row;
@ -272,7 +272,7 @@ form.mx_Custom_Widget_Form div {
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 16px;
font-size: $font-16px;
}
.mx_AppPermissionWarning_row {
@ -280,7 +280,7 @@ form.mx_Custom_Widget_Form div {
}
.mx_AppPermissionWarning_smallText {
font-size: 12px;
font-size: $font-12px;
}
.mx_AppPermissionWarning_bolder {

View file

@ -31,9 +31,10 @@
}
.mx_Autocomplete_Completion_pill {
border-radius: 17px;
height: 34px;
padding: 0px 5px;
box-sizing: border-box;
border-radius: 2rem;
height: $font-34px;
padding: 0.4rem;
display: flex;
user-select: none;
cursor: pointer;
@ -42,7 +43,7 @@
}
.mx_Autocomplete_Completion_pill > * {
margin: 0 3px;
margin-right: 0.3rem;
}
/* styling for common completion elements */

View file

@ -44,27 +44,26 @@ limitations under the License.
outline: none;
overflow-x: hidden;
span.mx_UserPill, span.mx_RoomPill {
padding-left: 21px;
position: relative;
&.mx_BasicMessageComposer_input_shouldShowPillAvatar {
span.mx_UserPill, span.mx_RoomPill {
position: relative;
// avatar psuedo element
&::before {
position: absolute;
left: 2px;
top: 2px;
content: var(--avatar-letter);
width: 16px;
height: 16px;
background: var(--avatar-background), $avatar-bg-color;
color: $avatar-initial-color;
background-repeat: no-repeat;
background-size: 16px;
border-radius: 8px;
text-align: center;
font-weight: normal;
line-height: 16px;
font-size: 10.4px;
// avatar psuedo element
&::before {
content: var(--avatar-letter);
width: $font-16px;
height: $font-16px;
margin-right: 0.24rem;
background: var(--avatar-background), $avatar-bg-color;
color: $avatar-initial-color;
background-repeat: no-repeat;
background-size: $font-16px;
border-radius: $font-16px;
text-align: center;
font-weight: normal;
line-height: $font-16px;
font-size: $font-10-4px;
}
}
}
}

View file

@ -69,8 +69,6 @@ limitations under the License.
padding-right: 12px;
padding-top: 4px;
padding-bottom: 4px;
width: 36px;
height: 36px;
position: relative;
}
@ -78,7 +76,7 @@ limitations under the License.
.mx_GroupRoomTile_name {
flex: 1 1 0;
overflow: hidden;
font-size: 14px;
font-size: $font-14px;
text-overflow: ellipsis;
white-space: nowrap;
}
@ -116,7 +114,7 @@ limitations under the License.
}
.mx_EntityTile_subtext {
font-size: 11px;
font-size: $font-11px;
opacity: 0.5;
overflow: hidden;
white-space: nowrap;
@ -125,7 +123,7 @@ limitations under the License.
.mx_EntityTile_power {
padding-inline-start: 6px;
font-size: 10px;
font-size: $font-10px;
color: $notice-secondary-color;
max-width: 6em;
overflow: hidden;

View file

@ -19,7 +19,7 @@ limitations under the License.
max-width: 100%;
clear: both;
padding-top: 18px;
font-size: 14px;
font-size: $font-14px;
position: relative;
}
@ -45,7 +45,7 @@ limitations under the License.
}
.mx_EventTile.mx_EventTile_info .mx_EventTile_avatar {
top: 8px;
top: $font-8px;
left: 65px;
}
@ -64,7 +64,7 @@ limitations under the License.
.mx_EventTile .mx_SenderProfile {
color: $primary-fg-color;
font-size: 14px;
font-size: $font-14px;
display: inline-block; /* anti-zalgo, with overflow hidden */
overflow: hidden;
cursor: pointer;
@ -72,7 +72,7 @@ limitations under the License.
padding-bottom: 0px;
padding-top: 0px;
margin: 0px;
line-height: 17px;
line-height: $font-17px;
/* the next three lines, along with overflow hidden, truncate long display names */
white-space: nowrap;
text-overflow: ellipsis;
@ -110,16 +110,26 @@ limitations under the License.
user-select: none;
}
.mx_EventTile_continuation .mx_EventTile_line {
clear: both;
}
.mx_EventTile_line, .mx_EventTile_reply {
position: relative;
/* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */
margin-right: 110px;
padding-left: 65px; /* left gutter */
padding-top: 4px;
padding-bottom: 2px;
padding-top: 3px;
padding-bottom: 3px;
border-radius: 4px;
min-height: 24px;
line-height: 22px;
line-height: $font-22px;
}
.mx_RoomView_timeline_rr_enabled,
// on ELS we need the margin to allow interaction with the expand/collapse button which is normally in the RR gutter
.mx_EventListSummary {
.mx_EventTile_line {
/* ideally should be 100px, but 95px gives us a max thumbnail size of 800x600, which is nice */
margin-right: 110px;
}
}
.mx_EventTile_bubbleContainer {
@ -234,34 +244,6 @@ limitations under the License.
color: $event-notsent-color;
}
.mx_EventTile_redacted .mx_EventTile_line .mx_UnknownBody,
.mx_EventTile_redacted .mx_EventTile_reply .mx_UnknownBody {
--lozenge-color: $event-redacted-fg-color;
--lozenge-border-color: $event-redacted-border-color;
display: block;
height: 22px;
width: 250px;
border-radius: 11px;
background:
repeating-linear-gradient(
-45deg,
var(--lozenge-color),
var(--lozenge-color) 3px,
transparent 3px,
transparent 6px
);
box-shadow: 0px 0px 3px var(--lozenge-border-color) inset;
}
.mx_EventTile_sending.mx_EventTile_redacted .mx_UnknownBody {
opacity: 0.4;
}
div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
--lozenge-color: $event-notsent-color;
--lozenge-border-color: $event-notsent-color;
}
.mx_EventTile_contextual {
opacity: 0.4;
}
@ -303,11 +285,13 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile_readAvatars .mx_BaseAvatar {
position: absolute;
display: inline-block;
height: $font-14px;
width: $font-14px;
}
.mx_EventTile_readAvatarRemainder {
color: $event-timestamp-color;
font-size: 11px;
font-size: $font-11px;
position: absolute;
}
@ -336,7 +320,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile_spoiler_reason {
color: $event-timestamp-color;
font-size: 11px;
font-size: $font-11px;
}
.mx_EventTile_spoiler_content {
@ -388,7 +372,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
}
.mx_EventTile_keyRequestInfo {
font-size: 12px;
font-size: $font-12px;
}
.mx_EventTile_keyRequestInfo_text {
@ -466,7 +450,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile_content .mx_EventTile_edited {
user-select: none;
font-size: 12px;
font-size: $font-12px;
color: $roomtopic-color;
display: inline-block;
margin-left: 9px;
@ -484,7 +468,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
white-space: normal !important;
line-height: inherit !important;
color: inherit; // inherit the colour from the dark or light theme by default (but not for code blocks)
font-size: 14px;
font-size: $font-14px;
pre, code {
font-family: $monospace-font-family !important;
@ -584,9 +568,9 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
.mx_EventTile.mx_EventTile_info {
// same as the padding for non-compact .mx_EventTile.mx_EventTile_info
padding-top: 0px;
font-size: 13px;
font-size: $font-13px;
.mx_EventTile_line, .mx_EventTile_reply {
line-height: 20px;
line-height: $font-20px;
}
.mx_EventTile_avatar {
top: 4px;
@ -594,7 +578,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
}
.mx_EventTile .mx_SenderProfile {
font-size: 13px;
font-size: $font-13px;
}
.mx_EventTile.mx_EventTile_emote {
@ -653,3 +637,23 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
}
}
}
.mx_EventTile_tileError {
color: red;
text-align: center;
// Remove some of the default tile padding so that the error is centered
margin-right: 0;
.mx_EventTile_line {
padding-left: 0;
margin-right: 0;
}
.mx_EventTile_line span {
padding: 4px 8px;
}
a {
margin-left: 1em;
}
}

Some files were not shown because too many files have changed in this diff Show more