mirror of
https://github.com/vector-im/element-web.git
synced 2024-11-16 13:14:58 +08:00
Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into t3chguy/a11y/composer-list-autocomplete
Conflicts: src/components/views/rooms/BasicMessageComposer.tsx src/editor/autocomplete.ts
This commit is contained in:
Michael Telatynski
commit
ebfe38dc4a
@ -1,16 +0,0 @@
|
||||
# autogenerated file: run scripts/generate-eslint-error-ignore-file to update.
|
||||
|
||||
src/Markdown.js
|
||||
src/NodeAnimator.js
|
||||
src/components/structures/RoomDirectory.js
|
||||
src/components/views/rooms/MemberList.js
|
||||
src/ratelimitedfunc.js
|
||||
src/utils/DMRoomMap.js
|
||||
src/utils/MultiInviter.js
|
||||
test/components/structures/MessagePanel-test.js
|
||||
test/components/views/dialogs/InteractiveAuthDialog-test.js
|
||||
test/mock-clock.js
|
||||
src/component-index.js
|
||||
test/end-to-end-tests/node_modules/
|
||||
test/end-to-end-tests/element/
|
||||
test/end-to-end-tests/synapse/
|
||||
65
.eslintrc.js
65
.eslintrc.js
@ -1,7 +1,9 @@
|
||||
module.exports = {
|
||||
extends: ["matrix-org", "matrix-org/react-legacy"],
|
||||
parser: "babel-eslint",
|
||||
|
||||
plugins: ["matrix-org"],
|
||||
extends: [
|
||||
"plugin:matrix-org/babel",
|
||||
"plugin:matrix-org/react",
|
||||
],
|
||||
env: {
|
||||
browser: true,
|
||||
node: true,
|
||||
@ -15,21 +17,64 @@ module.exports = {
|
||||
"prefer-promise-reject-errors": "off",
|
||||
"no-async-promise-executor": "off",
|
||||
"quotes": "off",
|
||||
},
|
||||
"no-extra-boolean-cast": "off",
|
||||
|
||||
// Bind or arrow functions in props causes performance issues (but we
|
||||
// currently use them in some places).
|
||||
// It's disabled here, but we should using it sparingly.
|
||||
"react/jsx-no-bind": "off",
|
||||
"react/jsx-key": ["error"],
|
||||
|
||||
"no-restricted-properties": [
|
||||
"error",
|
||||
...buildRestrictedPropertiesOptions(
|
||||
["window.innerHeight", "window.innerWidth", "window.visualViewport"],
|
||||
"Use UIStore to access window dimensions instead.",
|
||||
),
|
||||
...buildRestrictedPropertiesOptions(
|
||||
["*.mxcUrlToHttp", "*.getHttpUriForMxc"],
|
||||
"Use Media helper instead to centralise access for customisation.",
|
||||
),
|
||||
],
|
||||
},
|
||||
overrides: [{
|
||||
"files": ["src/**/*.{ts,tsx}"],
|
||||
"extends": ["matrix-org/ts"],
|
||||
"rules": {
|
||||
files: [
|
||||
"src/**/*.{ts,tsx}",
|
||||
"test/**/*.{ts,tsx}",
|
||||
],
|
||||
extends: [
|
||||
"plugin:matrix-org/typescript",
|
||||
"plugin:matrix-org/react",
|
||||
],
|
||||
rules: {
|
||||
// Things we do that break the ideal style
|
||||
"prefer-promise-reject-errors": "off",
|
||||
"quotes": "off",
|
||||
"no-extra-boolean-cast": "off",
|
||||
|
||||
// Remove Babel things manually due to override limitations
|
||||
"@babel/no-invalid-this": ["off"],
|
||||
|
||||
// We're okay being explicit at the moment
|
||||
"@typescript-eslint/no-empty-interface": "off",
|
||||
// We disable this while we're transitioning
|
||||
"@typescript-eslint/no-explicit-any": "off",
|
||||
// We'd rather not do this but we do
|
||||
"@typescript-eslint/ban-ts-comment": "off",
|
||||
|
||||
"quotes": "off",
|
||||
"no-extra-boolean-cast": "off",
|
||||
},
|
||||
}],
|
||||
};
|
||||
|
||||
function buildRestrictedPropertiesOptions(properties, message) {
|
||||
return properties.map(prop => {
|
||||
let [object, property] = prop.split(".");
|
||||
if (object === "*") {
|
||||
object = undefined;
|
||||
}
|
||||
return {
|
||||
object,
|
||||
property,
|
||||
message,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
@ -1,6 +0,0 @@
|
||||
[include]
|
||||
src/**/*.js
|
||||
test/**/*.js
|
||||
|
||||
[ignore]
|
||||
node_modules/
|
||||
3
.github/PULL_REQUEST_TEMPLATE.md
vendored
Normal file
3
.github/PULL_REQUEST_TEMPLATE.md
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
<!-- Please read https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.md before submitting your pull request -->
|
||||
|
||||
<!-- Include a Sign-Off as described in https://github.com/matrix-org/matrix-js-sdk/blob/develop/CONTRIBUTING.md#sign-off -->
|
||||
44
.github/workflows/develop.yml
vendored
Normal file
44
.github/workflows/develop.yml
vendored
Normal file
@ -0,0 +1,44 @@
|
||||
name: Develop
|
||||
on:
|
||||
# These tests won't work for non-develop branches at the moment as they
|
||||
# won't pull in the right versions of other repos, so they're only enabled
|
||||
# on develop.
|
||||
push:
|
||||
branches: [develop]
|
||||
pull_request:
|
||||
branches: [develop]
|
||||
jobs:
|
||||
end-to-end:
|
||||
runs-on: ubuntu-latest
|
||||
container: vectorim/element-web-ci-e2etests-env:latest
|
||||
steps:
|
||||
- name: Checkout code
|
||||
uses: actions/checkout@v2
|
||||
- name: Prepare End-to-End tests
|
||||
run: ./scripts/ci/prepare-end-to-end-tests.sh
|
||||
- name: Run End-to-End tests
|
||||
run: ./scripts/ci/run-end-to-end-tests.sh
|
||||
- name: Archive logs
|
||||
uses: actions/upload-artifact@v2
|
||||
if: ${{ always() }}
|
||||
with:
|
||||
path: |
|
||||
test/end-to-end-tests/logs/**/*
|
||||
test/end-to-end-tests/synapse/installations/consent/homeserver.log
|
||||
retention-days: 14
|
||||
- name: Download previous benchmark data
|
||||
uses: actions/cache@v1
|
||||
with:
|
||||
path: ./cache
|
||||
key: ${{ runner.os }}-benchmark
|
||||
- name: Store benchmark result
|
||||
uses: matrix-org/github-action-benchmark@jsperfentry-1
|
||||
with:
|
||||
tool: 'jsperformanceentry'
|
||||
output-file-path: test/end-to-end-tests/performance-entries.json
|
||||
fail-on-alert: false
|
||||
comment-on-alert: false
|
||||
# Only temporary to monitor where failures occur
|
||||
alert-comment-cc-users: '@gsouquet'
|
||||
github-token: ${{ secrets.DEPLOY_GH_PAGES }}
|
||||
auto-push: ${{ github.ref == 'refs/heads/develop' }}
|
||||
3
.gitignore
vendored
3
.gitignore
vendored
@ -15,3 +15,6 @@ package-lock.json
|
||||
|
||||
.DS_Store
|
||||
*.tmp
|
||||
|
||||
.vscode
|
||||
.vscode/
|
||||
|
||||
520
CHANGELOG.md
520
CHANGELOG.md
@ -1,3 +1,523 @@
|
||||
Changes in [3.25.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.25.0) (2021-07-05)
|
||||
=====================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.25.0-rc.1...v3.25.0)
|
||||
|
||||
* Remove reminescent references to the tinter
|
||||
[\#6316](https://github.com/matrix-org/matrix-react-sdk/pull/6316)
|
||||
* Update to released version of js-sdk
|
||||
|
||||
Changes in [3.25.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.25.0-rc.1) (2021-06-29)
|
||||
===============================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.24.0...v3.25.0-rc.1)
|
||||
|
||||
* Update to js-sdk v12.0.1-rc.1
|
||||
* Translations update from Weblate
|
||||
[\#6286](https://github.com/matrix-org/matrix-react-sdk/pull/6286)
|
||||
* Fix back button on user info card after clicking a permalink
|
||||
[\#6277](https://github.com/matrix-org/matrix-react-sdk/pull/6277)
|
||||
* Group ACLs with MELS
|
||||
[\#6280](https://github.com/matrix-org/matrix-react-sdk/pull/6280)
|
||||
* Fix editState not getting passed through
|
||||
[\#6282](https://github.com/matrix-org/matrix-react-sdk/pull/6282)
|
||||
* Migrate message context menu to IconizedContextMenu
|
||||
[\#5671](https://github.com/matrix-org/matrix-react-sdk/pull/5671)
|
||||
* Improve audio recording performance
|
||||
[\#6240](https://github.com/matrix-org/matrix-react-sdk/pull/6240)
|
||||
* Fix multiple timeline panels handling composer and edit events
|
||||
[\#6278](https://github.com/matrix-org/matrix-react-sdk/pull/6278)
|
||||
* Let m.notice messages mark a room as unread
|
||||
[\#6281](https://github.com/matrix-org/matrix-react-sdk/pull/6281)
|
||||
* Removes the override on the Bubble Container
|
||||
[\#5953](https://github.com/matrix-org/matrix-react-sdk/pull/5953)
|
||||
* Fix IRC layout regressions
|
||||
[\#6193](https://github.com/matrix-org/matrix-react-sdk/pull/6193)
|
||||
* Fix trashcan.svg by exporting it with its viewbox
|
||||
[\#6248](https://github.com/matrix-org/matrix-react-sdk/pull/6248)
|
||||
* Fix tiny scrollbar dot on chrome/electron in Forward Dialog
|
||||
[\#6276](https://github.com/matrix-org/matrix-react-sdk/pull/6276)
|
||||
* Upgrade puppeteer to use newer version of Chrome
|
||||
[\#6268](https://github.com/matrix-org/matrix-react-sdk/pull/6268)
|
||||
* Make toast dismiss button less prominent
|
||||
[\#6275](https://github.com/matrix-org/matrix-react-sdk/pull/6275)
|
||||
* Encrypt the voice message file if needed
|
||||
[\#6269](https://github.com/matrix-org/matrix-react-sdk/pull/6269)
|
||||
* Fix hyper-precise presence
|
||||
[\#6270](https://github.com/matrix-org/matrix-react-sdk/pull/6270)
|
||||
* Fix issues around private spaces, including previewable
|
||||
[\#6265](https://github.com/matrix-org/matrix-react-sdk/pull/6265)
|
||||
* Make _pinned messages_ in `m.room.pinned_events` event clickable
|
||||
[\#6257](https://github.com/matrix-org/matrix-react-sdk/pull/6257)
|
||||
* Fix space avatar management layout being broken
|
||||
[\#6266](https://github.com/matrix-org/matrix-react-sdk/pull/6266)
|
||||
* Convert EntityTile, MemberTile and PresenceLabel to TS
|
||||
[\#6251](https://github.com/matrix-org/matrix-react-sdk/pull/6251)
|
||||
* Fix UserInfo not working when rendered without a room
|
||||
[\#6260](https://github.com/matrix-org/matrix-react-sdk/pull/6260)
|
||||
* Update membership reason handling, including leave reason displaying
|
||||
[\#6253](https://github.com/matrix-org/matrix-react-sdk/pull/6253)
|
||||
* Consolidate types with js-sdk changes
|
||||
[\#6220](https://github.com/matrix-org/matrix-react-sdk/pull/6220)
|
||||
* Fix edit history modal
|
||||
[\#6258](https://github.com/matrix-org/matrix-react-sdk/pull/6258)
|
||||
* Convert MemberList to TS
|
||||
[\#6249](https://github.com/matrix-org/matrix-react-sdk/pull/6249)
|
||||
* Fix two PRs duplicating the css attribute
|
||||
[\#6259](https://github.com/matrix-org/matrix-react-sdk/pull/6259)
|
||||
* Improve invite error messages in InviteDialog for room invites
|
||||
[\#6201](https://github.com/matrix-org/matrix-react-sdk/pull/6201)
|
||||
* Fix invite dialog being cut off when it has limited results
|
||||
[\#6256](https://github.com/matrix-org/matrix-react-sdk/pull/6256)
|
||||
* Fix pinning event in a room which hasn't had events pinned in before
|
||||
[\#6255](https://github.com/matrix-org/matrix-react-sdk/pull/6255)
|
||||
* Allow modal widget buttons to be disabled when the modal opens
|
||||
[\#6178](https://github.com/matrix-org/matrix-react-sdk/pull/6178)
|
||||
* Decrease e2e shield fill mask size so that it doesn't overlap
|
||||
[\#6250](https://github.com/matrix-org/matrix-react-sdk/pull/6250)
|
||||
* Dial Pad UI bug fixes
|
||||
[\#5786](https://github.com/matrix-org/matrix-react-sdk/pull/5786)
|
||||
* Simple handling of mid-call output changes
|
||||
[\#6247](https://github.com/matrix-org/matrix-react-sdk/pull/6247)
|
||||
* Improve ForwardDialog performance by using TruncatedList
|
||||
[\#6228](https://github.com/matrix-org/matrix-react-sdk/pull/6228)
|
||||
* Fix dependency and lockfile mismatch
|
||||
[\#6246](https://github.com/matrix-org/matrix-react-sdk/pull/6246)
|
||||
* Improve room directory click behaviour
|
||||
[\#6234](https://github.com/matrix-org/matrix-react-sdk/pull/6234)
|
||||
* Fix keyboard accessibility of the space panel
|
||||
[\#6239](https://github.com/matrix-org/matrix-react-sdk/pull/6239)
|
||||
* Add ways to manage addresses for Spaces
|
||||
[\#6151](https://github.com/matrix-org/matrix-react-sdk/pull/6151)
|
||||
* Hide communities invites and the community autocompleter when Spaces on
|
||||
[\#6244](https://github.com/matrix-org/matrix-react-sdk/pull/6244)
|
||||
* Convert bunch of files to TS
|
||||
[\#6241](https://github.com/matrix-org/matrix-react-sdk/pull/6241)
|
||||
* Open local addresses section by default when there are no existing local
|
||||
addresses
|
||||
[\#6179](https://github.com/matrix-org/matrix-react-sdk/pull/6179)
|
||||
* Allow reordering of the space panel via Drag and Drop
|
||||
[\#6137](https://github.com/matrix-org/matrix-react-sdk/pull/6137)
|
||||
* Replace drag and drop mechanism in communities with something simpler
|
||||
[\#6134](https://github.com/matrix-org/matrix-react-sdk/pull/6134)
|
||||
* EventTilePreview fixes
|
||||
[\#6000](https://github.com/matrix-org/matrix-react-sdk/pull/6000)
|
||||
* Upgrade @types/react and @types/react-dom
|
||||
[\#6233](https://github.com/matrix-org/matrix-react-sdk/pull/6233)
|
||||
* Fix type error in the SpaceStore
|
||||
[\#6242](https://github.com/matrix-org/matrix-react-sdk/pull/6242)
|
||||
* Add experimental options to the Spaces beta
|
||||
[\#6199](https://github.com/matrix-org/matrix-react-sdk/pull/6199)
|
||||
* Consolidate types with js-sdk changes
|
||||
[\#6215](https://github.com/matrix-org/matrix-react-sdk/pull/6215)
|
||||
* Fix branch matching for Buildkite
|
||||
[\#6236](https://github.com/matrix-org/matrix-react-sdk/pull/6236)
|
||||
* Migrate SearchBar to TypeScript
|
||||
[\#6230](https://github.com/matrix-org/matrix-react-sdk/pull/6230)
|
||||
* Add support to keyboard shortcuts dialog for [digits]
|
||||
[\#6088](https://github.com/matrix-org/matrix-react-sdk/pull/6088)
|
||||
* Fix modal opening race condition
|
||||
[\#6238](https://github.com/matrix-org/matrix-react-sdk/pull/6238)
|
||||
* Deprecate FormButton in favour of AccessibleButton
|
||||
[\#6229](https://github.com/matrix-org/matrix-react-sdk/pull/6229)
|
||||
* Add PR template
|
||||
[\#6216](https://github.com/matrix-org/matrix-react-sdk/pull/6216)
|
||||
* Prefer canonical aliases while autocompleting rooms
|
||||
[\#6222](https://github.com/matrix-org/matrix-react-sdk/pull/6222)
|
||||
* Fix quote button
|
||||
[\#6232](https://github.com/matrix-org/matrix-react-sdk/pull/6232)
|
||||
* Restore branch matching support for GitHub Actions e2e tests
|
||||
[\#6224](https://github.com/matrix-org/matrix-react-sdk/pull/6224)
|
||||
* Fix View Source accessing renamed private field on MatrixEvent
|
||||
[\#6225](https://github.com/matrix-org/matrix-react-sdk/pull/6225)
|
||||
* Fix ConfirmUserActionDialog returning an input field rather than text
|
||||
[\#6219](https://github.com/matrix-org/matrix-react-sdk/pull/6219)
|
||||
* Revert "Partially restore immutable event objects at the rendering layer"
|
||||
[\#6221](https://github.com/matrix-org/matrix-react-sdk/pull/6221)
|
||||
* Add jq to e2e tests Dockerfile
|
||||
[\#6218](https://github.com/matrix-org/matrix-react-sdk/pull/6218)
|
||||
* Partially restore immutable event objects at the rendering layer
|
||||
[\#6196](https://github.com/matrix-org/matrix-react-sdk/pull/6196)
|
||||
* Update MSC number references for voice messages
|
||||
[\#6197](https://github.com/matrix-org/matrix-react-sdk/pull/6197)
|
||||
* Fix phase enum usage in JS modules as well
|
||||
[\#6214](https://github.com/matrix-org/matrix-react-sdk/pull/6214)
|
||||
* Migrate some dialogs to TypeScript
|
||||
[\#6185](https://github.com/matrix-org/matrix-react-sdk/pull/6185)
|
||||
* Typescript fixes due to MatrixEvent being TSified
|
||||
[\#6208](https://github.com/matrix-org/matrix-react-sdk/pull/6208)
|
||||
* Allow click-to-ping, quote & emoji picker for edit composer too
|
||||
[\#5858](https://github.com/matrix-org/matrix-react-sdk/pull/5858)
|
||||
* Add call silencing
|
||||
[\#6082](https://github.com/matrix-org/matrix-react-sdk/pull/6082)
|
||||
* Fix types in SlashCommands
|
||||
[\#6207](https://github.com/matrix-org/matrix-react-sdk/pull/6207)
|
||||
* Benchmark multiple common user scenario
|
||||
[\#6190](https://github.com/matrix-org/matrix-react-sdk/pull/6190)
|
||||
* Fix forward dialog message preview display names
|
||||
[\#6204](https://github.com/matrix-org/matrix-react-sdk/pull/6204)
|
||||
* Remove stray bullet point in reply preview
|
||||
[\#6206](https://github.com/matrix-org/matrix-react-sdk/pull/6206)
|
||||
* Stop requesting null next replies from the server
|
||||
[\#6203](https://github.com/matrix-org/matrix-react-sdk/pull/6203)
|
||||
* Fix soft crash caused by a broken shouldComponentUpdate
|
||||
[\#6202](https://github.com/matrix-org/matrix-react-sdk/pull/6202)
|
||||
* Keep composer reply when scrolling away from a highlighted event
|
||||
[\#6200](https://github.com/matrix-org/matrix-react-sdk/pull/6200)
|
||||
* Cache virtual/native room mappings when they're created
|
||||
[\#6194](https://github.com/matrix-org/matrix-react-sdk/pull/6194)
|
||||
* Disable comment-on-alert
|
||||
[\#6191](https://github.com/matrix-org/matrix-react-sdk/pull/6191)
|
||||
* Bump postcss from 7.0.35 to 7.0.36
|
||||
[\#6195](https://github.com/matrix-org/matrix-react-sdk/pull/6195)
|
||||
|
||||
Changes in [3.24.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.24.0) (2021-06-21)
|
||||
=====================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.24.0-rc.1...v3.24.0)
|
||||
|
||||
* Upgrade to JS SDK 12.0.0
|
||||
* [Release] Keep composer reply when scrolling away from a highlighted event
|
||||
[\#6211](https://github.com/matrix-org/matrix-react-sdk/pull/6211)
|
||||
* [Release] Remove stray bullet point in reply preview
|
||||
[\#6210](https://github.com/matrix-org/matrix-react-sdk/pull/6210)
|
||||
* [Release] Stop requesting null next replies from the server
|
||||
[\#6209](https://github.com/matrix-org/matrix-react-sdk/pull/6209)
|
||||
|
||||
Changes in [3.24.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.24.0-rc.1) (2021-06-15)
|
||||
===============================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.23.0...v3.24.0-rc.1)
|
||||
|
||||
* Upgrade to JS SDK 12.0.0-rc.1
|
||||
* Translations update from Weblate
|
||||
[\#6192](https://github.com/matrix-org/matrix-react-sdk/pull/6192)
|
||||
* Disable comment-on-alert for PR coming from a fork
|
||||
[\#6189](https://github.com/matrix-org/matrix-react-sdk/pull/6189)
|
||||
* Add JS benchmark tracking in CI
|
||||
[\#6177](https://github.com/matrix-org/matrix-react-sdk/pull/6177)
|
||||
* Upgrade matrix-react-test-utils for React 17 peer deps
|
||||
[\#6187](https://github.com/matrix-org/matrix-react-sdk/pull/6187)
|
||||
* Fix display name overlaps on the IRC layout
|
||||
[\#6186](https://github.com/matrix-org/matrix-react-sdk/pull/6186)
|
||||
* Small fixes to the spaces experience
|
||||
[\#6184](https://github.com/matrix-org/matrix-react-sdk/pull/6184)
|
||||
* Add footer and privacy note to the start dm dialog
|
||||
[\#6111](https://github.com/matrix-org/matrix-react-sdk/pull/6111)
|
||||
* Format mxids when disambiguation needed
|
||||
[\#5880](https://github.com/matrix-org/matrix-react-sdk/pull/5880)
|
||||
* Move various createRoom types to the js-sdk
|
||||
[\#6183](https://github.com/matrix-org/matrix-react-sdk/pull/6183)
|
||||
* Fix HTML tag for Event Tile when not rendered in a list
|
||||
[\#6175](https://github.com/matrix-org/matrix-react-sdk/pull/6175)
|
||||
* Remove legacy polyfills and unused dependencies
|
||||
[\#6176](https://github.com/matrix-org/matrix-react-sdk/pull/6176)
|
||||
* Fix buggy hovering/selecting of event tiles
|
||||
[\#6173](https://github.com/matrix-org/matrix-react-sdk/pull/6173)
|
||||
* Add room intro warning when e2ee is not enabled
|
||||
[\#5929](https://github.com/matrix-org/matrix-react-sdk/pull/5929)
|
||||
* Migrate end to end tests to GitHub actions
|
||||
[\#6156](https://github.com/matrix-org/matrix-react-sdk/pull/6156)
|
||||
* Fix expanding last collapsed sticky session when zoomed in
|
||||
[\#6171](https://github.com/matrix-org/matrix-react-sdk/pull/6171)
|
||||
* ⚛️ Upgrade to React@17
|
||||
[\#6165](https://github.com/matrix-org/matrix-react-sdk/pull/6165)
|
||||
* Revert refreshStickyHeaders optimisations
|
||||
[\#6168](https://github.com/matrix-org/matrix-react-sdk/pull/6168)
|
||||
* Add logging for which rooms calls are in
|
||||
[\#6170](https://github.com/matrix-org/matrix-react-sdk/pull/6170)
|
||||
* Restore read receipt animation from event to event
|
||||
[\#6169](https://github.com/matrix-org/matrix-react-sdk/pull/6169)
|
||||
* Restore copy button icon when sharing permalink
|
||||
[\#6166](https://github.com/matrix-org/matrix-react-sdk/pull/6166)
|
||||
* Restore Page Up/Down key bindings when focusing the composer
|
||||
[\#6167](https://github.com/matrix-org/matrix-react-sdk/pull/6167)
|
||||
* Timeline rendering optimizations
|
||||
[\#6143](https://github.com/matrix-org/matrix-react-sdk/pull/6143)
|
||||
* Bump css-what from 5.0.0 to 5.0.1
|
||||
[\#6164](https://github.com/matrix-org/matrix-react-sdk/pull/6164)
|
||||
* Bump ws from 6.2.1 to 6.2.2 in /test/end-to-end-tests
|
||||
[\#6145](https://github.com/matrix-org/matrix-react-sdk/pull/6145)
|
||||
* Bump trim-newlines from 3.0.0 to 3.0.1
|
||||
[\#6163](https://github.com/matrix-org/matrix-react-sdk/pull/6163)
|
||||
* Fix upgrade to element home button in top left menu
|
||||
[\#6162](https://github.com/matrix-org/matrix-react-sdk/pull/6162)
|
||||
* Fix unpinning of pinned messages and panel empty state
|
||||
[\#6140](https://github.com/matrix-org/matrix-react-sdk/pull/6140)
|
||||
* Better handling for widgets that fail to load
|
||||
[\#6161](https://github.com/matrix-org/matrix-react-sdk/pull/6161)
|
||||
* Improved forwarding UI
|
||||
[\#5999](https://github.com/matrix-org/matrix-react-sdk/pull/5999)
|
||||
* Fixes for sharing room links
|
||||
[\#6118](https://github.com/matrix-org/matrix-react-sdk/pull/6118)
|
||||
* Fix setting watchers
|
||||
[\#6160](https://github.com/matrix-org/matrix-react-sdk/pull/6160)
|
||||
* Fix Stickerpicker context menu
|
||||
[\#6152](https://github.com/matrix-org/matrix-react-sdk/pull/6152)
|
||||
* Add warning to private space creation flow
|
||||
[\#6155](https://github.com/matrix-org/matrix-react-sdk/pull/6155)
|
||||
* Add prop to alwaysShowTimestamps on TimelinePanel
|
||||
[\#6159](https://github.com/matrix-org/matrix-react-sdk/pull/6159)
|
||||
* Fix notif panel timestamp padding
|
||||
[\#6157](https://github.com/matrix-org/matrix-react-sdk/pull/6157)
|
||||
* Fixes and refactoring for the ImageView
|
||||
[\#6149](https://github.com/matrix-org/matrix-react-sdk/pull/6149)
|
||||
* Fix timestamps
|
||||
[\#6148](https://github.com/matrix-org/matrix-react-sdk/pull/6148)
|
||||
* Make it easier to pan images in the lightbox
|
||||
[\#6147](https://github.com/matrix-org/matrix-react-sdk/pull/6147)
|
||||
* Fix scroll token for EventTile and EventListSummary node type
|
||||
[\#6154](https://github.com/matrix-org/matrix-react-sdk/pull/6154)
|
||||
* Convert bunch of things to Typescript
|
||||
[\#6153](https://github.com/matrix-org/matrix-react-sdk/pull/6153)
|
||||
* Lint the typescript tests
|
||||
[\#6142](https://github.com/matrix-org/matrix-react-sdk/pull/6142)
|
||||
* Fix jumping to bottom without a highlighted event
|
||||
[\#6146](https://github.com/matrix-org/matrix-react-sdk/pull/6146)
|
||||
* Repair event status position in timeline
|
||||
[\#6141](https://github.com/matrix-org/matrix-react-sdk/pull/6141)
|
||||
* Adapt for js-sdk MatrixClient conversion to TS
|
||||
[\#6132](https://github.com/matrix-org/matrix-react-sdk/pull/6132)
|
||||
* Improve pinned messages in Labs
|
||||
[\#6096](https://github.com/matrix-org/matrix-react-sdk/pull/6096)
|
||||
* Map phone number lookup results to their native rooms
|
||||
[\#6136](https://github.com/matrix-org/matrix-react-sdk/pull/6136)
|
||||
* Fix mx_Event containment rules and empty read avatar row
|
||||
[\#6138](https://github.com/matrix-org/matrix-react-sdk/pull/6138)
|
||||
* Improve switch room rendering
|
||||
[\#6079](https://github.com/matrix-org/matrix-react-sdk/pull/6079)
|
||||
* Add CSS containment rules for shorter reflow operations
|
||||
[\#6127](https://github.com/matrix-org/matrix-react-sdk/pull/6127)
|
||||
* ignore hash/fragment when de-duplicating links for url previews
|
||||
[\#6135](https://github.com/matrix-org/matrix-react-sdk/pull/6135)
|
||||
* Clicking jump to bottom resets room hash
|
||||
[\#5823](https://github.com/matrix-org/matrix-react-sdk/pull/5823)
|
||||
* Use passive option for scroll handlers
|
||||
[\#6113](https://github.com/matrix-org/matrix-react-sdk/pull/6113)
|
||||
* Optimise memberSort performance for large list
|
||||
[\#6130](https://github.com/matrix-org/matrix-react-sdk/pull/6130)
|
||||
* Tweak event border radius to match action bar
|
||||
[\#6133](https://github.com/matrix-org/matrix-react-sdk/pull/6133)
|
||||
* Log when we ignore a second call in a room
|
||||
[\#6131](https://github.com/matrix-org/matrix-react-sdk/pull/6131)
|
||||
* Performance monitoring measurements
|
||||
[\#6041](https://github.com/matrix-org/matrix-react-sdk/pull/6041)
|
||||
|
||||
Changes in [3.23.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.23.0) (2021-06-07)
|
||||
=====================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.23.0-rc.1...v3.23.0)
|
||||
|
||||
* Upgrade to JS SDK 11.2.0
|
||||
* [Release] Fix notif panel timestamp padding
|
||||
[\#6158](https://github.com/matrix-org/matrix-react-sdk/pull/6158)
|
||||
|
||||
Changes in [3.23.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.23.0-rc.1) (2021-06-01)
|
||||
===============================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.22.0...v3.23.0-rc.1)
|
||||
|
||||
* Upgrade to JS SDK 11.2.0-rc.1
|
||||
* Translations update from Weblate
|
||||
[\#6128](https://github.com/matrix-org/matrix-react-sdk/pull/6128)
|
||||
* Fix all DMs wrongly appearing in room list when `m.direct` is changed
|
||||
[\#6122](https://github.com/matrix-org/matrix-react-sdk/pull/6122)
|
||||
* Update way of checking for registration disabled
|
||||
[\#6123](https://github.com/matrix-org/matrix-react-sdk/pull/6123)
|
||||
* Fix the ability to remove avatar from a space via settings
|
||||
[\#6126](https://github.com/matrix-org/matrix-react-sdk/pull/6126)
|
||||
* Switch to stable endpoint/fields for MSC2858
|
||||
[\#6125](https://github.com/matrix-org/matrix-react-sdk/pull/6125)
|
||||
* Clear stored editor state when canceling editing using a shortcut
|
||||
[\#6117](https://github.com/matrix-org/matrix-react-sdk/pull/6117)
|
||||
* Respect newlines in space topics
|
||||
[\#6124](https://github.com/matrix-org/matrix-react-sdk/pull/6124)
|
||||
* Add url param `defaultUsername` to prefill the login username field
|
||||
[\#5674](https://github.com/matrix-org/matrix-react-sdk/pull/5674)
|
||||
* Bump ws from 7.4.2 to 7.4.6
|
||||
[\#6115](https://github.com/matrix-org/matrix-react-sdk/pull/6115)
|
||||
* Sticky headers repositioning without layout trashing
|
||||
[\#6110](https://github.com/matrix-org/matrix-react-sdk/pull/6110)
|
||||
* Handle user_busy in voip calls
|
||||
[\#6112](https://github.com/matrix-org/matrix-react-sdk/pull/6112)
|
||||
* Avoid showing warning modals from the invite dialog after it unmounts
|
||||
[\#6105](https://github.com/matrix-org/matrix-react-sdk/pull/6105)
|
||||
* Fix misleading child counts in spaces
|
||||
[\#6109](https://github.com/matrix-org/matrix-react-sdk/pull/6109)
|
||||
* Close creation menu when expanding space panel via expand hierarchy
|
||||
[\#6090](https://github.com/matrix-org/matrix-react-sdk/pull/6090)
|
||||
* Prevent having duplicates in pending room state
|
||||
[\#6108](https://github.com/matrix-org/matrix-react-sdk/pull/6108)
|
||||
* Update reactions row on event decryption
|
||||
[\#6106](https://github.com/matrix-org/matrix-react-sdk/pull/6106)
|
||||
* Destroy playback instance on voice message unmount
|
||||
[\#6101](https://github.com/matrix-org/matrix-react-sdk/pull/6101)
|
||||
* Fix message preview not up to date
|
||||
[\#6102](https://github.com/matrix-org/matrix-react-sdk/pull/6102)
|
||||
* Convert some Flow typed files to TS (round 2)
|
||||
[\#6076](https://github.com/matrix-org/matrix-react-sdk/pull/6076)
|
||||
* Remove unused middlePanelResized event listener
|
||||
[\#6086](https://github.com/matrix-org/matrix-react-sdk/pull/6086)
|
||||
* Fix accessing currentState on an invalid joinedRoom
|
||||
[\#6100](https://github.com/matrix-org/matrix-react-sdk/pull/6100)
|
||||
* Remove Promise allSettled polyfill as js-sdk uses it directly
|
||||
[\#6097](https://github.com/matrix-org/matrix-react-sdk/pull/6097)
|
||||
* Prevent DecoratedRoomAvatar to update its state for the same value
|
||||
[\#6099](https://github.com/matrix-org/matrix-react-sdk/pull/6099)
|
||||
* Skip generatePreview if event is not part of the live timeline
|
||||
[\#6098](https://github.com/matrix-org/matrix-react-sdk/pull/6098)
|
||||
* fix sticky headers when results num get displayed
|
||||
[\#6095](https://github.com/matrix-org/matrix-react-sdk/pull/6095)
|
||||
* Improve addEventsToTimeline performance scoping WhoIsTypingTile::setState
|
||||
[\#6094](https://github.com/matrix-org/matrix-react-sdk/pull/6094)
|
||||
* Safeguards to prevent layout trashing for window dimensions
|
||||
[\#6092](https://github.com/matrix-org/matrix-react-sdk/pull/6092)
|
||||
* Use local room state to render space hierarchy if the room is known
|
||||
[\#6089](https://github.com/matrix-org/matrix-react-sdk/pull/6089)
|
||||
* Add spinner in UserMenu to list pending long running actions
|
||||
[\#6085](https://github.com/matrix-org/matrix-react-sdk/pull/6085)
|
||||
* Stop overscroll in Firefox Nightly for macOS
|
||||
[\#6093](https://github.com/matrix-org/matrix-react-sdk/pull/6093)
|
||||
* Move SettingsStore watchers/monitors over to ES6 maps for performance
|
||||
[\#6063](https://github.com/matrix-org/matrix-react-sdk/pull/6063)
|
||||
* Bump libolm version.
|
||||
[\#6080](https://github.com/matrix-org/matrix-react-sdk/pull/6080)
|
||||
* Improve styling of the message action bar
|
||||
[\#6066](https://github.com/matrix-org/matrix-react-sdk/pull/6066)
|
||||
* Improve explore rooms when no results are found
|
||||
[\#6070](https://github.com/matrix-org/matrix-react-sdk/pull/6070)
|
||||
* Remove logo spinner
|
||||
[\#6078](https://github.com/matrix-org/matrix-react-sdk/pull/6078)
|
||||
* Fix add reaction prompt showing even when user is not joined to room
|
||||
[\#6073](https://github.com/matrix-org/matrix-react-sdk/pull/6073)
|
||||
* Vectorize spinners
|
||||
[\#5680](https://github.com/matrix-org/matrix-react-sdk/pull/5680)
|
||||
* Fix handling of via servers for suggested rooms
|
||||
[\#6077](https://github.com/matrix-org/matrix-react-sdk/pull/6077)
|
||||
* Upgrade showChatEffects to room-level setting exposure
|
||||
[\#6075](https://github.com/matrix-org/matrix-react-sdk/pull/6075)
|
||||
* Delete RoomView dead code
|
||||
[\#6071](https://github.com/matrix-org/matrix-react-sdk/pull/6071)
|
||||
* Reduce noise in tests
|
||||
[\#6074](https://github.com/matrix-org/matrix-react-sdk/pull/6074)
|
||||
* Fix room name issues in right panel summary card
|
||||
[\#6069](https://github.com/matrix-org/matrix-react-sdk/pull/6069)
|
||||
* Cache normalized room name
|
||||
[\#6072](https://github.com/matrix-org/matrix-react-sdk/pull/6072)
|
||||
* Update MemberList to reflect changes for invite permission change
|
||||
[\#6061](https://github.com/matrix-org/matrix-react-sdk/pull/6061)
|
||||
* Delete RoomView dead code
|
||||
[\#6065](https://github.com/matrix-org/matrix-react-sdk/pull/6065)
|
||||
* Show subspace rooms count even if it is 0 for consistency
|
||||
[\#6067](https://github.com/matrix-org/matrix-react-sdk/pull/6067)
|
||||
|
||||
Changes in [3.22.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.22.0) (2021-05-24)
|
||||
=====================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.22.0-rc.1...v3.22.0)
|
||||
|
||||
* Upgrade to JS SDK 11.1.0
|
||||
* [Release] Bump libolm version
|
||||
[\#6087](https://github.com/matrix-org/matrix-react-sdk/pull/6087)
|
||||
|
||||
Changes in [3.22.0-rc.1](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.22.0-rc.1) (2021-05-19)
|
||||
===============================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.21.0...v3.22.0-rc.1)
|
||||
|
||||
* Upgrade to JS SDK 11.1.0-rc.1
|
||||
* Translations update from Weblate
|
||||
[\#6068](https://github.com/matrix-org/matrix-react-sdk/pull/6068)
|
||||
* Show DMs in space for invited members too, to match Android impl
|
||||
[\#6062](https://github.com/matrix-org/matrix-react-sdk/pull/6062)
|
||||
* Support filtering by alias in add existing to space dialog
|
||||
[\#6057](https://github.com/matrix-org/matrix-react-sdk/pull/6057)
|
||||
* Fix issue when a room without a name or alias is marked as suggested
|
||||
[\#6064](https://github.com/matrix-org/matrix-react-sdk/pull/6064)
|
||||
* Fix space room hierarchy not updating when removing a room
|
||||
[\#6055](https://github.com/matrix-org/matrix-react-sdk/pull/6055)
|
||||
* Revert "Try putting room list handling behind a lock"
|
||||
[\#6060](https://github.com/matrix-org/matrix-react-sdk/pull/6060)
|
||||
* Stop assuming encrypted messages are decrypted ahead of time
|
||||
[\#6052](https://github.com/matrix-org/matrix-react-sdk/pull/6052)
|
||||
* Add error detail when languges fail to load
|
||||
[\#6059](https://github.com/matrix-org/matrix-react-sdk/pull/6059)
|
||||
* Add space invaders chat effect
|
||||
[\#6053](https://github.com/matrix-org/matrix-react-sdk/pull/6053)
|
||||
* Create SpaceProvider and hide Spaces from the RoomProvider autocompleter
|
||||
[\#6051](https://github.com/matrix-org/matrix-react-sdk/pull/6051)
|
||||
* Don't mark a room as unread when redacted event is present
|
||||
[\#6049](https://github.com/matrix-org/matrix-react-sdk/pull/6049)
|
||||
* Add support for MSC2873: Client information for Widgets
|
||||
[\#6023](https://github.com/matrix-org/matrix-react-sdk/pull/6023)
|
||||
* Support UI for MSC2762: Widgets reading events from rooms
|
||||
[\#5960](https://github.com/matrix-org/matrix-react-sdk/pull/5960)
|
||||
* Fix crash on opening notification panel
|
||||
[\#6047](https://github.com/matrix-org/matrix-react-sdk/pull/6047)
|
||||
* Remove custom LoggedInView::shouldComponentUpdate logic
|
||||
[\#6046](https://github.com/matrix-org/matrix-react-sdk/pull/6046)
|
||||
* Fix edge cases with the new add reactions prompt button
|
||||
[\#6045](https://github.com/matrix-org/matrix-react-sdk/pull/6045)
|
||||
* Add ids to homeserver and passphrase fields
|
||||
[\#6043](https://github.com/matrix-org/matrix-react-sdk/pull/6043)
|
||||
* Update space order field validity requirements to match msc update
|
||||
[\#6042](https://github.com/matrix-org/matrix-react-sdk/pull/6042)
|
||||
* Try putting room list handling behind a lock
|
||||
[\#6024](https://github.com/matrix-org/matrix-react-sdk/pull/6024)
|
||||
* Improve progress bar progression for smaller voice messages
|
||||
[\#6035](https://github.com/matrix-org/matrix-react-sdk/pull/6035)
|
||||
* Fix share space edge case where space is public but not invitable
|
||||
[\#6039](https://github.com/matrix-org/matrix-react-sdk/pull/6039)
|
||||
* Add missing 'rel' to image view download button
|
||||
[\#6033](https://github.com/matrix-org/matrix-react-sdk/pull/6033)
|
||||
* Improve visible waveform for voice messages
|
||||
[\#6034](https://github.com/matrix-org/matrix-react-sdk/pull/6034)
|
||||
* Fix roving tab index intercepting home/end in space create menu
|
||||
[\#6040](https://github.com/matrix-org/matrix-react-sdk/pull/6040)
|
||||
* Decorate room avatars with publicity in add existing to space flow
|
||||
[\#6030](https://github.com/matrix-org/matrix-react-sdk/pull/6030)
|
||||
* Improve Spaces "Just Me" wizard
|
||||
[\#6025](https://github.com/matrix-org/matrix-react-sdk/pull/6025)
|
||||
* Increase hover feedback on room sub list buttons
|
||||
[\#6037](https://github.com/matrix-org/matrix-react-sdk/pull/6037)
|
||||
* Show alternative button during space creation wizard if no rooms
|
||||
[\#6029](https://github.com/matrix-org/matrix-react-sdk/pull/6029)
|
||||
* Swap rotation buttons in the image viewer
|
||||
[\#6032](https://github.com/matrix-org/matrix-react-sdk/pull/6032)
|
||||
* Typo: initilisation -> initialisation
|
||||
[\#5915](https://github.com/matrix-org/matrix-react-sdk/pull/5915)
|
||||
* Save edited state of a message when switching rooms
|
||||
[\#6001](https://github.com/matrix-org/matrix-react-sdk/pull/6001)
|
||||
* Fix shield icon in Untrusted Device Dialog
|
||||
[\#6022](https://github.com/matrix-org/matrix-react-sdk/pull/6022)
|
||||
* Do not eagerly decrypt breadcrumb rooms
|
||||
[\#6028](https://github.com/matrix-org/matrix-react-sdk/pull/6028)
|
||||
* Update spaces.png
|
||||
[\#6031](https://github.com/matrix-org/matrix-react-sdk/pull/6031)
|
||||
* Encourage more diverse reactions to content
|
||||
[\#6027](https://github.com/matrix-org/matrix-react-sdk/pull/6027)
|
||||
* Wrap decodeURIComponent in try-catch to protect against malformed URIs
|
||||
[\#6026](https://github.com/matrix-org/matrix-react-sdk/pull/6026)
|
||||
* Iterate beta feedback dialog
|
||||
[\#6021](https://github.com/matrix-org/matrix-react-sdk/pull/6021)
|
||||
* Disable space fields whilst their form is busy
|
||||
[\#6020](https://github.com/matrix-org/matrix-react-sdk/pull/6020)
|
||||
* Add missing space on beta feedback dialog
|
||||
[\#6018](https://github.com/matrix-org/matrix-react-sdk/pull/6018)
|
||||
* Fix colours used for the back button in space create menu
|
||||
[\#6017](https://github.com/matrix-org/matrix-react-sdk/pull/6017)
|
||||
* Prioritise and reduce the amount of events decrypted on application startup
|
||||
[\#5980](https://github.com/matrix-org/matrix-react-sdk/pull/5980)
|
||||
* Linkify topics in space room directory results
|
||||
[\#6015](https://github.com/matrix-org/matrix-react-sdk/pull/6015)
|
||||
* Persistent space collapsed states
|
||||
[\#5972](https://github.com/matrix-org/matrix-react-sdk/pull/5972)
|
||||
* Catch another instance of unlabeled avatars.
|
||||
[\#6010](https://github.com/matrix-org/matrix-react-sdk/pull/6010)
|
||||
* Rescale and smooth voice message playback waveform to better match
|
||||
expectation
|
||||
[\#5996](https://github.com/matrix-org/matrix-react-sdk/pull/5996)
|
||||
* Scale voice message clock with user's font size
|
||||
[\#5993](https://github.com/matrix-org/matrix-react-sdk/pull/5993)
|
||||
* Remove "in development" flag from voice messages
|
||||
[\#5995](https://github.com/matrix-org/matrix-react-sdk/pull/5995)
|
||||
* Support voice messages on Safari
|
||||
[\#5989](https://github.com/matrix-org/matrix-react-sdk/pull/5989)
|
||||
* Translations update from Weblate
|
||||
[\#6011](https://github.com/matrix-org/matrix-react-sdk/pull/6011)
|
||||
|
||||
Changes in [3.21.0](https://github.com/matrix-org/matrix-react-sdk/releases/tag/v3.21.0) (2021-05-17)
|
||||
=====================================================================================================
|
||||
[Full Changelog](https://github.com/matrix-org/matrix-react-sdk/compare/v3.21.0-rc.1...v3.21.0)
|
||||
|
||||
6
__mocks__/FontManager.js
Normal file
6
__mocks__/FontManager.js
Normal file
@ -0,0 +1,6 @@
|
||||
// Stub out FontManager for tests as it doesn't validate anything we don't already know given
|
||||
// our fixed test environment and it requires the installation of node-canvas.
|
||||
|
||||
module.exports = {
|
||||
fixupColorFonts: () => Promise.resolve(),
|
||||
};
|
||||
1
__mocks__/workerMock.js
Normal file
1
__mocks__/workerMock.js
Normal file
@ -0,0 +1 @@
|
||||
module.exports = jest.fn();
|
||||
@ -10,7 +10,6 @@ module.exports = {
|
||||
],
|
||||
}],
|
||||
"@babel/preset-typescript",
|
||||
"@babel/preset-flow",
|
||||
"@babel/preset-react",
|
||||
],
|
||||
"plugins": [
|
||||
@ -19,7 +18,6 @@ module.exports = {
|
||||
"@babel/plugin-proposal-numeric-separator",
|
||||
"@babel/plugin-proposal-class-properties",
|
||||
"@babel/plugin-proposal-object-rest-spread",
|
||||
"@babel/plugin-transform-flow-comments",
|
||||
"@babel/plugin-syntax-dynamic-import",
|
||||
"@babel/plugin-transform-runtime",
|
||||
],
|
||||
|
||||
57
package.json
57
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "matrix-react-sdk",
|
||||
"version": "3.21.0",
|
||||
"version": "3.25.0",
|
||||
"description": "SDK for matrix.org using React",
|
||||
"author": "matrix.org",
|
||||
"repository": {
|
||||
@ -45,7 +45,7 @@
|
||||
"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:js && yarn lint:style",
|
||||
"lint:js": "eslint --max-warnings 0 --ignore-path .eslintignore.errorfiles src test",
|
||||
"lint:js": "eslint --max-warnings 0 src test",
|
||||
"lint:types": "tsc --noEmit --jsx react",
|
||||
"lint:style": "stylelint 'res/css/**/*.scss'",
|
||||
"test": "jest",
|
||||
@ -55,7 +55,7 @@
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.12.5",
|
||||
"await-lock": "^2.1.0",
|
||||
"blueimp-canvas-to-blob": "^3.28.0",
|
||||
"blurhash": "^1.1.3",
|
||||
"browser-encrypt-attachment": "^0.3.0",
|
||||
"browser-request": "^0.3.3",
|
||||
"cheerio": "^1.0.0-rc.9",
|
||||
@ -79,8 +79,8 @@
|
||||
"katex": "^0.12.0",
|
||||
"linkifyjs": "^2.1.9",
|
||||
"lodash": "^4.17.20",
|
||||
"matrix-js-sdk": "github:matrix-org/matrix-js-sdk#develop",
|
||||
"matrix-widget-api": "^0.1.0-beta.14",
|
||||
"matrix-js-sdk": "12.0.1",
|
||||
"matrix-widget-api": "^0.1.0-beta.15",
|
||||
"minimist": "^1.2.5",
|
||||
"opus-recorder": "^8.0.3",
|
||||
"pako": "^2.0.3",
|
||||
@ -88,18 +88,17 @@
|
||||
"png-chunks-extract": "^1.0.0",
|
||||
"prop-types": "^15.7.2",
|
||||
"qrcode": "^1.4.4",
|
||||
"qs": "^6.9.6",
|
||||
"re-resizable": "^6.9.0",
|
||||
"react": "^16.14.0",
|
||||
"react-beautiful-dnd": "^4.0.1",
|
||||
"react-dom": "^16.14.0",
|
||||
"react": "^17.0.2",
|
||||
"react-beautiful-dnd": "^13.1.0",
|
||||
"react-blurhash": "^0.1.3",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-focus-lock": "^2.5.0",
|
||||
"react-transition-group": "^4.4.1",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"rfc4648": "^1.4.0",
|
||||
"sanitize-html": "^2.3.2",
|
||||
"tar-js": "^0.3.0",
|
||||
"text-encoding-utf-8": "^1.0.2",
|
||||
"url": "^0.11.0",
|
||||
"what-input": "^5.2.10",
|
||||
"zxcvbn": "^4.4.2"
|
||||
@ -107,24 +106,28 @@
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.12.10",
|
||||
"@babel/core": "^7.12.10",
|
||||
"@babel/eslint-parser": "^7.12.10",
|
||||
"@babel/eslint-plugin": "^7.12.10",
|
||||
"@babel/parser": "^7.12.11",
|
||||
"@babel/plugin-proposal-class-properties": "^7.12.1",
|
||||
"@babel/plugin-proposal-decorators": "^7.12.12",
|
||||
"@babel/plugin-proposal-export-default-from": "^7.12.1",
|
||||
"@babel/plugin-proposal-numeric-separator": "^7.12.7",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
|
||||
"@babel/plugin-transform-flow-comments": "^7.12.1",
|
||||
"@babel/plugin-transform-runtime": "^7.12.10",
|
||||
"@babel/preset-env": "^7.12.11",
|
||||
"@babel/preset-flow": "^7.12.1",
|
||||
"@babel/preset-react": "^7.12.10",
|
||||
"@babel/preset-typescript": "^7.12.7",
|
||||
"@babel/register": "^7.12.10",
|
||||
"@babel/traverse": "^7.12.12",
|
||||
"@matrix-org/olm": "https://gitlab.matrix.org/api/v4/projects/27/packages/npm/@matrix-org/olm/-/@matrix-org/olm-3.2.3.tgz",
|
||||
"@peculiar/webcrypto": "^1.1.4",
|
||||
"@sinonjs/fake-timers": "^7.0.2",
|
||||
"@types/classnames": "^2.2.11",
|
||||
"@types/commonmark": "^0.27.4",
|
||||
"@types/counterpart": "^0.18.1",
|
||||
"@types/css-font-loading-module": "^0.0.6",
|
||||
"@types/diff-match-patch": "^1.0.32",
|
||||
"@types/flux": "^3.1.9",
|
||||
"@types/jest": "^26.0.20",
|
||||
"@types/linkifyjs": "^2.1.3",
|
||||
@ -134,23 +137,22 @@
|
||||
"@types/pako": "^1.0.1",
|
||||
"@types/parse5": "^6.0.0",
|
||||
"@types/qrcode": "^1.3.5",
|
||||
"@types/react": "^16.9",
|
||||
"@types/react-dom": "^16.9.10",
|
||||
"@types/react": "^17.0.2",
|
||||
"@types/react-beautiful-dnd": "^13.0.0",
|
||||
"@types/react-dom": "^17.0.2",
|
||||
"@types/react-transition-group": "^4.4.0",
|
||||
"@types/sanitize-html": "^2.3.1",
|
||||
"@types/zxcvbn": "^4.4.0",
|
||||
"@typescript-eslint/eslint-plugin": "^4.14.0",
|
||||
"@typescript-eslint/parser": "^4.14.0",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"@typescript-eslint/eslint-plugin": "^4.17.0",
|
||||
"@typescript-eslint/parser": "^4.17.0",
|
||||
"@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
|
||||
"babel-jest": "^26.6.3",
|
||||
"chokidar": "^3.5.1",
|
||||
"concurrently": "^5.3.0",
|
||||
"enzyme": "^3.11.0",
|
||||
"enzyme-adapter-react-16": "^1.15.6",
|
||||
"eslint": "7.18.0",
|
||||
"eslint-config-matrix-org": "^0.2.0",
|
||||
"eslint-plugin-babel": "^5.3.1",
|
||||
"eslint-plugin-flowtype": "^5.2.0",
|
||||
"eslint-config-google": "^0.14.0",
|
||||
"eslint-plugin-matrix-org": "github:matrix-org/eslint-plugin-matrix-org#main",
|
||||
"eslint-plugin-react": "^7.22.0",
|
||||
"eslint-plugin-react-hooks": "^4.2.0",
|
||||
"glob": "^7.1.6",
|
||||
@ -159,10 +161,9 @@
|
||||
"jest-environment-jsdom-sixteen": "^1.0.3",
|
||||
"jest-fetch-mock": "^3.0.3",
|
||||
"matrix-mock-request": "^1.2.3",
|
||||
"matrix-react-test-utils": "^0.2.2",
|
||||
"matrix-react-test-utils": "^0.2.3",
|
||||
"matrix-web-i18n": "github:matrix-org/matrix-web-i18n",
|
||||
"olm": "https://packages.matrix.org/npm/olm/olm-3.2.1.tgz",
|
||||
"react-test-renderer": "^16.14.0",
|
||||
"react-test-renderer": "^17.0.2",
|
||||
"rimraf": "^3.0.2",
|
||||
"stylelint": "^13.9.0",
|
||||
"stylelint-config-standard": "^20.0.0",
|
||||
@ -170,13 +171,10 @@
|
||||
"typescript": "^4.1.3",
|
||||
"walk": "^2.3.14"
|
||||
},
|
||||
"resolutions": {
|
||||
"**/@types/react": "^16.14"
|
||||
},
|
||||
"jest": {
|
||||
"testEnvironment": "./__test-utils__/environment.js",
|
||||
"testMatch": [
|
||||
"<rootDir>/test/**/*-test.[jt]s"
|
||||
"<rootDir>/test/**/*-test.[jt]s?(x)"
|
||||
],
|
||||
"setupFiles": [
|
||||
"jest-canvas-mock"
|
||||
@ -189,7 +187,8 @@
|
||||
"\\$webapp/i18n/languages.json": "<rootDir>/__mocks__/languages.json",
|
||||
"decoderWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js",
|
||||
"decoderWorker\\.min\\.wasm": "<rootDir>/__mocks__/empty.js",
|
||||
"waveWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js"
|
||||
"waveWorker\\.min\\.js": "<rootDir>/__mocks__/empty.js",
|
||||
"workers/(.+)\\.worker\\.ts": "<rootDir>/__mocks__/workerMock.js"
|
||||
},
|
||||
"transformIgnorePatterns": [
|
||||
"/node_modules/(?!matrix-js-sdk).+$"
|
||||
|
||||
@ -45,6 +45,8 @@ html {
|
||||
N.B. Breaks things when we have legitimate horizontal overscroll */
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
// Stop similar overscroll bounce in Firefox Nightly for macOS
|
||||
overscroll-behavior: none;
|
||||
}
|
||||
|
||||
body {
|
||||
@ -289,6 +291,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
|
||||
|
||||
.mx_Dialog_staticWrapper .mx_Dialog {
|
||||
z-index: 4010;
|
||||
contain: content;
|
||||
}
|
||||
|
||||
.mx_Dialog_background {
|
||||
|
||||
@ -37,6 +37,11 @@
|
||||
@import "./structures/_ViewSource.scss";
|
||||
@import "./structures/auth/_CompleteSecurity.scss";
|
||||
@import "./structures/auth/_Login.scss";
|
||||
@import "./views/audio_messages/_AudioPlayer.scss";
|
||||
@import "./views/audio_messages/_PlayPauseButton.scss";
|
||||
@import "./views/audio_messages/_PlaybackContainer.scss";
|
||||
@import "./views/audio_messages/_SeekBar.scss";
|
||||
@import "./views/audio_messages/_Waveform.scss";
|
||||
@import "./views/auth/_AuthBody.scss";
|
||||
@import "./views/auth/_AuthButtons.scss";
|
||||
@import "./views/auth/_AuthFooter.scss";
|
||||
@ -52,7 +57,6 @@
|
||||
@import "./views/avatars/_BaseAvatar.scss";
|
||||
@import "./views/avatars/_DecoratedRoomAvatar.scss";
|
||||
@import "./views/avatars/_MemberStatusMessageAvatar.scss";
|
||||
@import "./views/avatars/_PulsedAvatar.scss";
|
||||
@import "./views/avatars/_WidgetAvatar.scss";
|
||||
@import "./views/beta/_BetaCard.scss";
|
||||
@import "./views/context_menus/_CallContextMenu.scss";
|
||||
@ -76,6 +80,7 @@
|
||||
@import "./views/dialogs/_DevtoolsDialog.scss";
|
||||
@import "./views/dialogs/_EditCommunityPrototypeDialog.scss";
|
||||
@import "./views/dialogs/_FeedbackDialog.scss";
|
||||
@import "./views/dialogs/_ForwardDialog.scss";
|
||||
@import "./views/dialogs/_GroupAddressPicker.scss";
|
||||
@import "./views/dialogs/_HostSignupDialog.scss";
|
||||
@import "./views/dialogs/_IncomingSasDialog.scss";
|
||||
@ -115,6 +120,7 @@
|
||||
@import "./views/elements/_AddressTile.scss";
|
||||
@import "./views/elements/_DesktopBuildsNotice.scss";
|
||||
@import "./views/elements/_DesktopCapturerSourcePicker.scss";
|
||||
@import "./views/elements/_DialPadBackspaceButton.scss";
|
||||
@import "./views/elements/_DirectorySearchBox.scss";
|
||||
@import "./views/elements/_Dropdown.scss";
|
||||
@import "./views/elements/_EditableItemList.scss";
|
||||
@ -122,7 +128,6 @@
|
||||
@import "./views/elements/_EventListSummary.scss";
|
||||
@import "./views/elements/_FacePile.scss";
|
||||
@import "./views/elements/_Field.scss";
|
||||
@import "./views/elements/_FormButton.scss";
|
||||
@import "./views/elements/_ImageView.scss";
|
||||
@import "./views/elements/_InfoTooltip.scss";
|
||||
@import "./views/elements/_InlineSpinner.scss";
|
||||
@ -165,6 +170,7 @@
|
||||
@import "./views/messages/_MTextBody.scss";
|
||||
@import "./views/messages/_MVideoBody.scss";
|
||||
@import "./views/messages/_MVoiceMessageBody.scss";
|
||||
@import "./views/messages/_MediaBody.scss";
|
||||
@import "./views/messages/_MessageActionBar.scss";
|
||||
@import "./views/messages/_MessageTimestamp.scss";
|
||||
@import "./views/messages/_MjolnirBody.scss";
|
||||
@ -179,6 +185,7 @@
|
||||
@import "./views/messages/_common_CryptoEvent.scss";
|
||||
@import "./views/right_panel/_BaseCard.scss";
|
||||
@import "./views/right_panel/_EncryptionInfo.scss";
|
||||
@import "./views/right_panel/_PinnedMessagesCard.scss";
|
||||
@import "./views/right_panel/_RoomSummaryCard.scss";
|
||||
@import "./views/right_panel/_UserInfo.scss";
|
||||
@import "./views/right_panel/_VerificationPanel.scss";
|
||||
@ -195,6 +202,7 @@
|
||||
@import "./views/rooms/_GroupLayout.scss";
|
||||
@import "./views/rooms/_IRCLayout.scss";
|
||||
@import "./views/rooms/_JumpToBottomButton.scss";
|
||||
@import "./views/rooms/_LinkPreviewGroup.scss";
|
||||
@import "./views/rooms/_LinkPreviewWidget.scss";
|
||||
@import "./views/rooms/_MemberInfo.scss";
|
||||
@import "./views/rooms/_MemberList.scss";
|
||||
@ -203,7 +211,6 @@
|
||||
@import "./views/rooms/_NewRoomIntro.scss";
|
||||
@import "./views/rooms/_NotificationBadge.scss";
|
||||
@import "./views/rooms/_PinnedEventTile.scss";
|
||||
@import "./views/rooms/_PinnedEventsPanel.scss";
|
||||
@import "./views/rooms/_PresenceLabel.scss";
|
||||
@import "./views/rooms/_ReplyPreview.scss";
|
||||
@import "./views/rooms/_RoomBreadcrumbs.scss";
|
||||
@ -253,12 +260,10 @@
|
||||
@import "./views/toasts/_AnalyticsToast.scss";
|
||||
@import "./views/toasts/_NonUrgentEchoFailureToast.scss";
|
||||
@import "./views/verification/_VerificationShowSas.scss";
|
||||
@import "./views/voice_messages/_PlayPauseButton.scss";
|
||||
@import "./views/voice_messages/_PlaybackContainer.scss";
|
||||
@import "./views/voice_messages/_Waveform.scss";
|
||||
@import "./views/voip/_CallContainer.scss";
|
||||
@import "./views/voip/_CallView.scss";
|
||||
@import "./views/voip/_CallViewForRoom.scss";
|
||||
@import "./views/voip/_CallPreview.scss";
|
||||
@import "./views/voip/_DialPad.scss";
|
||||
@import "./views/voip/_DialPadContextMenu.scss";
|
||||
@import "./views/voip/_DialPadModal.scss";
|
||||
|
||||
@ -38,6 +38,7 @@ limitations under the License.
|
||||
position: absolute;
|
||||
font-size: $font-14px;
|
||||
z-index: 5001;
|
||||
contain: content;
|
||||
}
|
||||
|
||||
.mx_ContextualMenu_right {
|
||||
@ -115,8 +116,3 @@ limitations under the License.
|
||||
border-top: 8px solid $menu-bg-color;
|
||||
border-right: 8px solid transparent;
|
||||
}
|
||||
|
||||
.mx_ContextualMenu_spinner {
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@ -323,7 +323,7 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_GroupView_featuredThing .mx_BaseAvatar {
|
||||
/* To prevent misalignment with mx_TintableSvg (in addButton) */
|
||||
/* To prevent misalignment with img (in addButton) */
|
||||
vertical-align: initial;
|
||||
}
|
||||
|
||||
|
||||
@ -25,6 +25,7 @@ $roomListCollapsedWidth: 68px;
|
||||
|
||||
// Create a row-based flexbox for the GroupFilterPanel and the room list
|
||||
display: flex;
|
||||
contain: content;
|
||||
|
||||
.mx_LeftPanel_GroupFilterPanelContainer {
|
||||
flex-grow: 0;
|
||||
@ -70,6 +71,7 @@ $roomListCollapsedWidth: 68px;
|
||||
// aligned correctly. This is also a row-based flexbox.
|
||||
display: flex;
|
||||
align-items: center;
|
||||
contain: content;
|
||||
|
||||
&.mx_IndicatorScrollbar_leftOverflow {
|
||||
mask-image: linear-gradient(90deg, transparent, black 5%);
|
||||
@ -109,6 +111,29 @@ $roomListCollapsedWidth: 68px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LeftPanel_dialPadButton {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 8px;
|
||||
background-color: $roomlist-button-bg-color;
|
||||
position: relative;
|
||||
margin-left: 8px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left: 8px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
mask-image: url('$(res)/img/element-icons/call/dialpad.svg');
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
background: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LeftPanel_exploreButton {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
@ -183,6 +208,12 @@ $roomListCollapsedWidth: 68px;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
.mx_LeftPanel_dialPadButton {
|
||||
margin-left: 0;
|
||||
margin-top: 8px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.mx_LeftPanel_exploreButton {
|
||||
margin-left: 0;
|
||||
margin-top: 8px;
|
||||
|
||||
@ -82,7 +82,6 @@ limitations under the License.
|
||||
color: $primary-fg-color;
|
||||
font-size: $font-12px;
|
||||
display: inline;
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.mx_NotificationPanel .mx_EventTile_senderDetails {
|
||||
@ -103,6 +102,7 @@ limitations under the License.
|
||||
visibility: visible;
|
||||
position: initial;
|
||||
display: inline;
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
.mx_NotificationPanel .mx_EventTile_line {
|
||||
|
||||
@ -25,6 +25,7 @@ limitations under the License.
|
||||
padding: 4px 0;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
contain: strict;
|
||||
|
||||
.mx_RoomView_MessageList {
|
||||
padding: 14px 18px; // top and bottom is 4px smaller to balance with the padding set above
|
||||
@ -98,6 +99,76 @@ limitations under the License.
|
||||
mask-position: center;
|
||||
}
|
||||
|
||||
$dot-size: 8px;
|
||||
$pulse-color: $pinned-unread-color;
|
||||
|
||||
.mx_RightPanel_pinnedMessagesButton {
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin.svg');
|
||||
mask-position: center;
|
||||
}
|
||||
|
||||
.mx_RightPanel_pinnedMessagesButton_unreadIndicator {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
margin: 4px;
|
||||
width: $dot-size;
|
||||
height: $dot-size;
|
||||
border-radius: 50%;
|
||||
transform: scale(1);
|
||||
background: rgba($pulse-color, 1);
|
||||
box-shadow: 0 0 0 0 rgba($pulse-color, 1);
|
||||
animation: mx_RightPanel_indicator_pulse 2s infinite;
|
||||
animation-iteration-count: 1;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transform: scale(1);
|
||||
transform-origin: center center;
|
||||
animation-name: mx_RightPanel_indicator_pulse_shadow;
|
||||
animation-duration: inherit;
|
||||
animation-iteration-count: inherit;
|
||||
border-radius: 50%;
|
||||
background: rgba($pulse-color, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mx_RightPanel_indicator_pulse {
|
||||
0% {
|
||||
transform: scale(0.95);
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(0.95);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mx_RightPanel_indicator_pulse_shadow {
|
||||
0% {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(2.2);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RightPanel_headerButton_highlight {
|
||||
&::before {
|
||||
background-color: $accent-color !important;
|
||||
|
||||
@ -61,6 +61,39 @@ limitations under the License.
|
||||
.mx_RoomDirectory_tableWrapper {
|
||||
overflow-y: auto;
|
||||
flex: 1 1 0;
|
||||
|
||||
.mx_RoomDirectory_footer {
|
||||
margin-top: 24px;
|
||||
text-align: center;
|
||||
|
||||
> h5 {
|
||||
margin: 0;
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-18px;
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
||||
> p {
|
||||
margin: 40px auto 60px;
|
||||
font-size: $font-14px;
|
||||
line-height: $font-20px;
|
||||
color: $secondary-fg-color;
|
||||
max-width: 464px; // easier reading
|
||||
}
|
||||
|
||||
> hr {
|
||||
margin: 0;
|
||||
border: none;
|
||||
height: 1px;
|
||||
background-color: $header-panel-bg-color;
|
||||
}
|
||||
|
||||
.mx_RoomDirectory_newRoom {
|
||||
margin: 24px auto 0;
|
||||
width: max-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomDirectory_table {
|
||||
@ -138,11 +171,6 @@ limitations under the License.
|
||||
color: $settings-grey-fg-color;
|
||||
}
|
||||
|
||||
.mx_RoomDirectory_table tr {
|
||||
padding-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mx_RoomDirectory .mx_RoomView_MessageList {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@ -112,7 +112,7 @@ limitations under the License.
|
||||
|
||||
.mx_AccessibleButton {
|
||||
padding: 5px 10px;
|
||||
padding-left: 28px; // 16px for the icon, 2px margin to text, 10px regular padding
|
||||
padding-left: 30px; // 18px for the icon, 2px margin to text, 10px regular padding
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
@ -128,13 +128,14 @@ limitations under the License.
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
top: 50%; // text sizes are dynamic
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
&.mx_RoomStatusBar_unsentCancelAllBtn::before {
|
||||
mask-image: url('$(res)/img/element-icons/trashcan.svg');
|
||||
width: 12px;
|
||||
height: 16px;
|
||||
top: calc(50% - 8px); // text sizes are dynamic
|
||||
}
|
||||
|
||||
&.mx_RoomStatusBar_unsentResendAllBtn {
|
||||
@ -142,9 +143,6 @@ limitations under the License.
|
||||
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/retry.svg');
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
top: calc(50% - 9px); // text sizes are dynamic
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -57,14 +57,15 @@ limitations under the License.
|
||||
|
||||
@keyframes mx_RoomView_fileDropTarget_image_animation {
|
||||
from {
|
||||
width: 0px;
|
||||
transform: scaleX(0);
|
||||
}
|
||||
to {
|
||||
width: 32px;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
.mx_RoomView_fileDropTarget_image {
|
||||
width: 32px;
|
||||
animation: mx_RoomView_fileDropTarget_image_animation;
|
||||
animation-duration: 0.5s;
|
||||
margin-bottom: 16px;
|
||||
@ -152,6 +153,7 @@ limitations under the License.
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
contain: content;
|
||||
}
|
||||
|
||||
.mx_RoomView_statusArea {
|
||||
@ -237,6 +239,7 @@ hr.mx_RoomView_myReadMarker {
|
||||
position: relative;
|
||||
top: -1px;
|
||||
z-index: 1;
|
||||
will-change: width;
|
||||
transition: width 400ms easeinsine 1s, opacity 400ms easeinsine 1s;
|
||||
width: 99%;
|
||||
opacity: 1;
|
||||
|
||||
@ -21,5 +21,8 @@ limitations under the License.
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-end;
|
||||
|
||||
content-visibility: auto;
|
||||
contain-intrinsic-size: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -31,7 +31,6 @@ $activeBorderColor: $secondary-fg-color;
|
||||
// Create another flexbox so the Panel fills the container
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
|
||||
.mx_SpacePanel_spaceTreeWrapper {
|
||||
flex: 1;
|
||||
@ -69,6 +68,12 @@ $activeBorderColor: $secondary-fg-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mx_SpaceItem_dragging {
|
||||
.mx_SpaceButton_toggleCollapse {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpaceTreeLevel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@ -328,6 +328,8 @@ $SpaceRoomViewInnerWidth: 428px;
|
||||
font-size: $font-15px;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 16px;
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
> hr {
|
||||
@ -364,6 +366,45 @@ $SpaceRoomViewInnerWidth: 428px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpaceRoomView_betaWarning {
|
||||
padding: 12px 12px 12px 54px;
|
||||
position: relative;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
width: 432px;
|
||||
border-radius: 8px;
|
||||
background-color: $info-plinth-bg-color;
|
||||
color: $secondary-fg-color;
|
||||
box-sizing: border-box;
|
||||
|
||||
> h3 {
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
> p {
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/room-summary.svg');
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
left: 14px;
|
||||
background-color: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpaceRoomView_inviteTeammates {
|
||||
// XXX remove this when spaces leaves Beta
|
||||
.mx_SpaceRoomView_inviteTeammates_betaDisclaimer {
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
/*
|
||||
Copyright 2017 Travis Ralston
|
||||
Copyright 2019 New Vector Ltd
|
||||
Copyright 2021 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.
|
||||
@ -20,7 +21,6 @@ limitations under the License.
|
||||
padding: 0 0 0 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
@ -28,11 +28,93 @@ limitations under the License.
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabsOnLeft {
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
|
||||
.mx_TabbedView_tabLabels {
|
||||
width: 170px;
|
||||
max-width: 170px;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabPanel {
|
||||
margin-left: 240px; // 170px sidebar + 70px padding
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active {
|
||||
background-color: $tab-label-active-bg-color;
|
||||
color: $tab-label-active-fg-color;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
|
||||
background-color: $tab-label-active-icon-bg-color;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin-left: 8px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon::before {
|
||||
mask-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabsOnTop {
|
||||
flex-direction: column;
|
||||
|
||||
.mx_TabbedView_tabLabels {
|
||||
display: flex;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel {
|
||||
padding-left: 0px;
|
||||
padding-right: 52px;
|
||||
|
||||
.mx_TabbedView_tabLabel_text {
|
||||
font-size: 15px;
|
||||
color: $tertiary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabPanel {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active {
|
||||
color: $accent-color;
|
||||
.mx_TabbedView_tabLabel_text {
|
||||
color: $accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
|
||||
background-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin-left: 0px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon::before {
|
||||
mask-size: 22px;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabels {
|
||||
width: 170px;
|
||||
max-width: 170px;
|
||||
color: $tab-label-fg-color;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel {
|
||||
@ -46,43 +128,25 @@ limitations under the License.
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active {
|
||||
background-color: $tab-label-active-bg-color;
|
||||
color: $tab-label-active-fg-color;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon {
|
||||
margin-left: 8px;
|
||||
margin-right: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.mx_TabbedView_maskedIcon::before {
|
||||
display: inline-block;
|
||||
background-color: $tab-label-icon-bg-color;
|
||||
background-color: $icon-button-color;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
mask-position: center;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_active .mx_TabbedView_maskedIcon::before {
|
||||
background-color: $tab-label-active-icon-bg-color;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel_text {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabPanel {
|
||||
margin-left: 240px; // 170px sidebar + 70px padding
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0; // firefox
|
||||
}
|
||||
|
||||
|
||||
@ -71,7 +71,7 @@ limitations under the License.
|
||||
&::before {
|
||||
background-color: #ffffff;
|
||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||
mask-size: 90%;
|
||||
mask-size: 80%;
|
||||
}
|
||||
|
||||
&::after {
|
||||
@ -135,10 +135,14 @@ limitations under the License.
|
||||
float: right;
|
||||
display: flex;
|
||||
|
||||
.mx_FormButton {
|
||||
.mx_AccessibleButton {
|
||||
min-width: 96px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton + .mx_AccessibleButton {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_Toast_description {
|
||||
|
||||
68
res/css/views/audio_messages/_AudioPlayer.scss
Normal file
68
res/css/views/audio_messages/_AudioPlayer.scss
Normal file
@ -0,0 +1,68 @@
|
||||
/*
|
||||
Copyright 2021 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_AudioPlayer_container {
|
||||
padding: 16px 12px 12px 12px;
|
||||
max-width: 267px; // use max to make the control fit in the files/pinned panels
|
||||
|
||||
.mx_AudioPlayer_primaryContainer {
|
||||
display: flex;
|
||||
|
||||
.mx_PlayPauseButton {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.mx_AudioPlayer_mediaInfo {
|
||||
flex: 1;
|
||||
overflow: hidden; // makes the ellipsis on the file name work
|
||||
|
||||
& > * {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.mx_AudioPlayer_mediaName {
|
||||
color: $primary-fg-color;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-15px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
padding-bottom: 4px; // mimics the line-height differences in the Figma
|
||||
}
|
||||
|
||||
.mx_AudioPlayer_byline {
|
||||
font-size: $font-12px;
|
||||
line-height: $font-12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_AudioPlayer_seek {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.mx_SeekBar {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.mx_Clock {
|
||||
width: $font-42px; // we're not using a monospace font, so fake it
|
||||
min-width: $font-42px; // for flexbox
|
||||
padding-left: 4px; // isolate from seek bar
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -18,6 +18,8 @@ limitations under the License.
|
||||
position: relative;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
min-width: 32px; // for when the button is used in a flexbox
|
||||
min-height: 32px; // for when the button is used in a flexbox
|
||||
border-radius: 32px;
|
||||
background-color: $voice-playback-button-bg-color;
|
||||
|
||||
@ -22,25 +22,24 @@ limitations under the License.
|
||||
// 7px top and bottom for visual design. 12px left & right, but the waveform (right)
|
||||
// has a 1px padding on it that we want to account for.
|
||||
padding: 7px 12px 7px 11px;
|
||||
background-color: $voice-record-waveform-bg-color;
|
||||
border-radius: 12px;
|
||||
|
||||
// Cheat at alignment a bit
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
color: $voice-record-waveform-fg-color;
|
||||
font-size: $font-14px;
|
||||
line-height: $font-24px;
|
||||
contain: content;
|
||||
|
||||
.mx_Waveform {
|
||||
.mx_Waveform_bar {
|
||||
background-color: $voice-record-waveform-incomplete-fg-color;
|
||||
height: 100%;
|
||||
/* Variable set by a JS component */
|
||||
transform: scaleY(max(0.05, var(--barHeight)));
|
||||
|
||||
&.mx_Waveform_bar_100pct {
|
||||
// Small animation to remove the mechanical feel of progress
|
||||
transition: background-color 250ms ease;
|
||||
background-color: $voice-record-waveform-fg-color;
|
||||
background-color: $message-body-panel-fg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -50,4 +49,8 @@ limitations under the License.
|
||||
padding-right: 6px; // with the fixed width this ends up as a visual 8px most of the time, as intended.
|
||||
padding-left: 8px; // isolate from recording circle / play control
|
||||
}
|
||||
|
||||
&.mx_VoiceMessagePrimaryContainer_noWaveform {
|
||||
max-width: 162px; // with all the padding this results in 185px wide
|
||||
}
|
||||
}
|
||||
103
res/css/views/audio_messages/_SeekBar.scss
Normal file
103
res/css/views/audio_messages/_SeekBar.scss
Normal file
@ -0,0 +1,103 @@
|
||||
/*
|
||||
Copyright 2021 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.
|
||||
*/
|
||||
|
||||
// CSS inspiration from:
|
||||
// * https://www.w3schools.com/howto/howto_js_rangeslider.asp
|
||||
// * https://stackoverflow.com/a/28283806
|
||||
// * https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
|
||||
|
||||
.mx_SeekBar {
|
||||
// Dev note: we deliberately do not have the -ms-track (and friends) selectors because we don't
|
||||
// need to support IE.
|
||||
|
||||
appearance: none; // default style override
|
||||
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background: $quaternary-fg-color;
|
||||
outline: none; // remove blue selection border
|
||||
position: relative; // for before+after pseudo elements later on
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
&::-webkit-slider-thumb {
|
||||
appearance: none; // default style override
|
||||
|
||||
// Dev note: This needs to be duplicated with the -moz-range-thumb selector
|
||||
// because otherwise Edge (webkit) will fail to see the styles and just refuse
|
||||
// to apply them.
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 8px;
|
||||
background-color: $tertiary-fg-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&::-moz-range-thumb {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 8px;
|
||||
background-color: $tertiary-fg-color;
|
||||
cursor: pointer;
|
||||
|
||||
// Firefox adds a border on the thumb
|
||||
border: none;
|
||||
}
|
||||
|
||||
// This is for webkit support, but we can't limit the functionality of it to just webkit
|
||||
// browsers. Firefox responds to webkit-prefixed values now, which means we can't use media
|
||||
// or support queries to selectively apply the rule. An upside is that this CSS doesn't work
|
||||
// in firefox, so it's just wasted CPU/GPU time.
|
||||
&::before { // ::before to ensure it ends up under the thumb
|
||||
content: '';
|
||||
background-color: $tertiary-fg-color;
|
||||
|
||||
// Absolute positioning to ensure it overlaps with the existing bar
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
||||
// Sizing to match the bar
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
|
||||
// And finally dynamic width without overly hurting the rendering engine.
|
||||
transform-origin: 0 100%;
|
||||
transform: scaleX(var(--fillTo));
|
||||
}
|
||||
|
||||
// This is firefox's built-in support for the above, with 100% less hacks.
|
||||
&::-moz-range-progress {
|
||||
background-color: $tertiary-fg-color;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
// Increase clickable area for the slider (approximately same size as browser default)
|
||||
// We do it this way to keep the same padding and margins of the element, avoiding margin math.
|
||||
// Source: https://front-back.com/expand-clickable-areas-for-a-better-touch-experience/
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
bottom: -6px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
@ -16,6 +16,7 @@ limitations under the License.
|
||||
|
||||
.mx_DecoratedRoomAvatar, .mx_ExtraTile {
|
||||
position: relative;
|
||||
contain: content;
|
||||
|
||||
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
|
||||
mask-image: url('$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg');
|
||||
|
||||
@ -19,49 +19,68 @@ limitations under the License.
|
||||
padding: 24px;
|
||||
background-color: $settings-profile-placeholder-bg-color;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
|
||||
> div {
|
||||
.mx_BetaCard_title {
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-18px;
|
||||
line-height: $font-22px;
|
||||
color: $primary-fg-color;
|
||||
margin: 4px 0 14px;
|
||||
.mx_BetaCard_columns {
|
||||
display: flex;
|
||||
|
||||
.mx_BetaCard_betaPill {
|
||||
margin-left: 12px;
|
||||
> div {
|
||||
.mx_BetaCard_title {
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-18px;
|
||||
line-height: $font-22px;
|
||||
color: $primary-fg-color;
|
||||
margin: 4px 0 14px;
|
||||
|
||||
.mx_BetaCard_betaPill {
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_BetaCard_caption {
|
||||
font-size: $font-15px;
|
||||
line-height: $font-20px;
|
||||
color: $secondary-fg-color;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.mx_BetaCard_buttons .mx_AccessibleButton {
|
||||
display: block;
|
||||
margin: 12px 0;
|
||||
padding: 7px 40px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.mx_BetaCard_disclaimer {
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-fg-color;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_BetaCard_caption {
|
||||
font-size: $font-15px;
|
||||
line-height: $font-20px;
|
||||
color: $secondary-fg-color;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton {
|
||||
display: block;
|
||||
margin: 12px 0;
|
||||
padding: 7px 40px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.mx_BetaCard_disclaimer {
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-fg-color;
|
||||
margin-top: 20px;
|
||||
> img {
|
||||
margin: auto 0 auto 20px;
|
||||
width: 300px;
|
||||
object-fit: contain;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
> img {
|
||||
margin: auto 0 auto 20px;
|
||||
width: 300px;
|
||||
object-fit: contain;
|
||||
height: 100%;
|
||||
.mx_BetaCard_relatedSettings {
|
||||
.mx_SettingsFlag {
|
||||
margin: 16px 0 0;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
color: $primary-fg-color;
|
||||
|
||||
.mx_SettingsFlag_microcopy {
|
||||
margin-top: 4px;
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -91,24 +110,52 @@ $dot-size: 12px;
|
||||
width: $dot-size;
|
||||
transform: scale(1);
|
||||
background: rgba($pulse-color, 1);
|
||||
box-shadow: 0 0 0 0 rgba($pulse-color, 1);
|
||||
animation: mx_Beta_bluePulse 2s infinite;
|
||||
animation-iteration-count: 20;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
top: 0;
|
||||
left: 0;
|
||||
transform: scale(1);
|
||||
transform-origin: center center;
|
||||
animation-name: mx_Beta_bluePulse_shadow;
|
||||
animation-duration: inherit;
|
||||
animation-iteration-count: inherit;
|
||||
border-radius: 50%;
|
||||
background: rgba($pulse-color, 1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mx_Beta_bluePulse {
|
||||
0% {
|
||||
transform: scale(0.95);
|
||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0.7);
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(1);
|
||||
box-shadow: 0 0 0 10px rgba($pulse-color, 0);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(0.95);
|
||||
box-shadow: 0 0 0 0 rgba($pulse-color, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mx_Beta_bluePulse_shadow {
|
||||
0% {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
70% {
|
||||
transform: scale(2.2);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
/*
|
||||
Copyright 2015, 2016 OpenMarket Ltd
|
||||
Copyright 2021 Michael Weimann <mail@michael-weimann.eu>
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
@ -15,16 +16,69 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_MessageContextMenu {
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_field {
|
||||
display: block;
|
||||
padding: 3px 6px 3px 6px;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.mx_IconizedContextMenu_icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: block;
|
||||
|
||||
.mx_MessageContextMenu_field.mx_MessageContextMenu_fieldSet {
|
||||
font-weight: bold;
|
||||
&::before {
|
||||
content: '';
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
display: block;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-repeat: no-repeat;
|
||||
background: $primary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconCollapse::before {
|
||||
mask-image: url('$(res)/img/element-icons/message/chevron-up.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconReport::before {
|
||||
mask-image: url('$(res)/img/element-icons/warning-badge.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconLink::before {
|
||||
mask-image: url('$(res)/img/element-icons/link.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconPermalink::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/share.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconUnhidePreview::before {
|
||||
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconForward::before {
|
||||
mask-image: url('$(res)/img/element-icons/message/fwd.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconRedact::before {
|
||||
mask-image: url('$(res)/img/element-icons/trashcan.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconResend::before {
|
||||
mask-image: url('$(res)/img/element-icons/retry.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconSource::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/format-bar/code.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconQuote::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/format-bar/quote.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconPin::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin-upright.svg');
|
||||
}
|
||||
|
||||
.mx_MessageContextMenu_iconUnpin::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin.svg');
|
||||
}
|
||||
}
|
||||
|
||||
@ -38,6 +38,15 @@ limitations under the License.
|
||||
mask-image: url('$(res)/img/element-icons/view-community.svg');
|
||||
}
|
||||
|
||||
.mx_TagTileContextMenu_moveUp::before {
|
||||
transform: rotate(180deg);
|
||||
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||
}
|
||||
|
||||
.mx_TagTileContextMenu_moveDown::before {
|
||||
mask-image: url('$(res)/img/feather-customised/chevron-down.svg');
|
||||
}
|
||||
|
||||
.mx_TagTileContextMenu_hideCommunity::before {
|
||||
mask-image: url('$(res)/img/element-icons/hide.svg');
|
||||
}
|
||||
|
||||
159
res/css/views/dialogs/_ForwardDialog.scss
Normal file
159
res/css/views/dialogs/_ForwardDialog.scss
Normal file
@ -0,0 +1,159 @@
|
||||
/*
|
||||
Copyright 2021 Robin Townsend <robin@robin.town>
|
||||
|
||||
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_ForwardDialog {
|
||||
width: 520px;
|
||||
color: $primary-fg-color;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
min-height: 0;
|
||||
height: 80vh;
|
||||
|
||||
> h3 {
|
||||
margin: 0 0 6px;
|
||||
color: $secondary-fg-color;
|
||||
font-size: $font-12px;
|
||||
font-weight: $font-semi-bold;
|
||||
line-height: $font-15px;
|
||||
}
|
||||
|
||||
> .mx_ForwardDialog_preview {
|
||||
max-height: 30%;
|
||||
flex-shrink: 0;
|
||||
overflow-y: auto;
|
||||
|
||||
div {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.mx_EventTile_msgOption {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// When forwarding messages from encrypted rooms, EventTile will complain
|
||||
// that our preview is unencrypted, which doesn't actually matter
|
||||
.mx_EventTile_e2eIcon_unencrypted {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// We also hide download links to not encourage users to try interacting
|
||||
.mx_MFileBody_download {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
> hr {
|
||||
width: 100%;
|
||||
border: none;
|
||||
border-top: 1px solid $input-border-color;
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
> .mx_ForwardList {
|
||||
display: contents;
|
||||
|
||||
.mx_SearchBox {
|
||||
// To match the space around the title
|
||||
margin: 0 0 15px 0;
|
||||
flex-grow: 0;
|
||||
}
|
||||
|
||||
.mx_ForwardList_content {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.mx_ForwardList_noResults {
|
||||
display: block;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.mx_ForwardList_results {
|
||||
&:not(:first-child) {
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.mx_ForwardList_entry {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 32px;
|
||||
padding: 6px;
|
||||
border-radius: 8px;
|
||||
|
||||
&:hover {
|
||||
background-color: $groupFilterPanel-bg-color;
|
||||
}
|
||||
|
||||
.mx_ForwardList_roomButton {
|
||||
display: flex;
|
||||
margin-right: 12px;
|
||||
min-width: 0;
|
||||
|
||||
.mx_DecoratedRoomAvatar {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.mx_ForwardList_entry_name {
|
||||
font-size: $font-15px;
|
||||
line-height: 30px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_ForwardList_sendButton {
|
||||
position: relative;
|
||||
|
||||
&:not(.mx_ForwardList_canSend) .mx_ForwardList_sendLabel {
|
||||
// Hide the "Send" label while preserving button size
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.mx_ForwardList_sendIcon, .mx_NotificationBadge {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.mx_NotificationBadge {
|
||||
// Match the failed to send indicator's color with the disabled button
|
||||
background-color: $button-danger-disabled-fg-color;
|
||||
}
|
||||
|
||||
&.mx_ForwardList_sending .mx_ForwardList_sendIcon {
|
||||
background-color: $button-primary-bg-color;
|
||||
mask-image: url('$(res)/img/element-icons/circle-sending.svg');
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
&.mx_ForwardList_sent .mx_ForwardList_sendIcon {
|
||||
background-color: $button-primary-bg-color;
|
||||
mask-image: url('$(res)/img/element-icons/circle-sent.svg');
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -14,9 +14,16 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_InviteDialog_transferWrapper .mx_Dialog {
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_addressBar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
// Right margin for the design. We could apply this to the whole dialog, but then the scrollbar
|
||||
// for the user section gets weird.
|
||||
margin: 8px 45px 0 0;
|
||||
|
||||
.mx_InviteDialog_editor {
|
||||
flex: 1;
|
||||
@ -73,7 +80,7 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_InviteDialog_section {
|
||||
padding-bottom: 10px;
|
||||
padding-bottom: 4px;
|
||||
|
||||
h3 {
|
||||
font-size: $font-12px;
|
||||
@ -82,6 +89,14 @@ limitations under the License.
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
> p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
> span {
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_subname {
|
||||
margin-bottom: 10px;
|
||||
margin-top: -10px; // HACK: Positioning with margins is bad
|
||||
@ -90,6 +105,63 @@ limitations under the License.
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_section_hidden_suggestions_disclaimer {
|
||||
padding: 8px 0 16px 0;
|
||||
font-size: $font-14px;
|
||||
|
||||
> span {
|
||||
color: $primary-fg-color;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
> p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_footer {
|
||||
border-top: 1px solid $input-border-color;
|
||||
|
||||
> h3 {
|
||||
margin: 12px 0;
|
||||
font-size: $font-12px;
|
||||
color: $muted-fg-color;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_footer_link {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-radius: 4px;
|
||||
border: solid 1px $light-fg-color;
|
||||
padding: 8px;
|
||||
|
||||
> a {
|
||||
text-decoration: none;
|
||||
flex-shrink: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_footer_link_copy {
|
||||
flex-shrink: 0;
|
||||
cursor: pointer;
|
||||
margin-left: 20px;
|
||||
display: inherit;
|
||||
|
||||
> div {
|
||||
mask-image: url($copy-button-url);
|
||||
background-color: $message-action-bar-fg-color;
|
||||
margin-left: 5px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile {
|
||||
cursor: pointer;
|
||||
padding: 5px 10px;
|
||||
@ -142,6 +214,7 @@ limitations under the License.
|
||||
|
||||
.mx_InviteDialog_roomTile_nameStack {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_name {
|
||||
@ -157,6 +230,13 @@ limitations under the License.
|
||||
margin-left: 7px;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_name,
|
||||
.mx_InviteDialog_roomTile_userId {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_roomTile_time {
|
||||
text-align: right;
|
||||
font-size: $font-12px;
|
||||
@ -210,26 +290,165 @@ limitations under the License.
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog {
|
||||
.mx_InviteDialog_other {
|
||||
// Prevent the dialog from jumping around randomly when elements change.
|
||||
height: 590px;
|
||||
height: 600px;
|
||||
padding-left: 20px; // the design wants some padding on the left
|
||||
|
||||
.mx_InviteDialog_userSections {
|
||||
height: calc(100% - 115px); // mx_InviteDialog's height minus some for the upper and lower elements
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_content {
|
||||
height: calc(100% - 36px); // full height minus the size of the header
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_transfer {
|
||||
width: 496px;
|
||||
height: 466px;
|
||||
flex-direction: column;
|
||||
|
||||
.mx_InviteDialog_content {
|
||||
flex-direction: column;
|
||||
|
||||
.mx_TabbedView {
|
||||
height: calc(100% - 60px);
|
||||
}
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_addressBar {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_userSections {
|
||||
margin-top: 10px;
|
||||
margin-top: 4px;
|
||||
overflow-y: auto;
|
||||
padding-right: 45px;
|
||||
height: 455px; // mx_InviteDialog's height minus some for the upper elements
|
||||
padding: 0 45px 4px 0;
|
||||
}
|
||||
|
||||
// Right margin for the design. We could apply this to the whole dialog, but then the scrollbar
|
||||
// for the user section gets weird.
|
||||
.mx_InviteDialog_helpText,
|
||||
.mx_InviteDialog_addressBar {
|
||||
margin-right: 45px;
|
||||
.mx_InviteDialog_hasFooter .mx_InviteDialog_userSections {
|
||||
height: calc(100% - 175px);
|
||||
}
|
||||
|
||||
.mx_InviteDialog_helpText {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_helpText .mx_AccessibleButton_kind_link {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField {
|
||||
border-top: 0;
|
||||
border-left: 0;
|
||||
border-right: 0;
|
||||
border-radius: 0;
|
||||
margin-top: 0;
|
||||
border-color: $quaternary-fg-color;
|
||||
|
||||
input {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPad .mx_InviteDialog_dialPadField:focus-within {
|
||||
border-color: $accent-color;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPadField .mx_Field_postfix {
|
||||
/* Remove border separator between postfix and field content */
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPad {
|
||||
width: 224px;
|
||||
margin-top: 16px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPad .mx_DialPad {
|
||||
row-gap: 16px;
|
||||
column-gap: 48px;
|
||||
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_transferConsultConnect {
|
||||
padding-top: 16px;
|
||||
/* This wants a drop shadow the full width of the dialog, so relative-position it
|
||||
* and make it wider, then compensate with padding
|
||||
*/
|
||||
position: relative;
|
||||
width: 496px;
|
||||
left: -24px;
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
border-top: 1px solid $message-body-panel-bg-color;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_transferConsultConnect_pushRight {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_userDirectoryIcon::before {
|
||||
mask-image: url('$(res)/img/voip/tab-userdirectory.svg');
|
||||
}
|
||||
|
||||
.mx_InviteDialog_dialPadIcon::before {
|
||||
mask-image: url('$(res)/img/voip/tab-dialpad.svg');
|
||||
}
|
||||
|
||||
.mx_InviteDialog_multiInviterError {
|
||||
> h4 {
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
color: $secondary-fg-color;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
> div {
|
||||
.mx_InviteDialog_multiInviterError_entry {
|
||||
margin-bottom: 24px;
|
||||
|
||||
.mx_InviteDialog_multiInviterError_entry_userProfile {
|
||||
.mx_InviteDialog_multiInviterError_entry_name {
|
||||
margin-left: 6px;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
font-weight: $font-semi-bold;
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
||||
.mx_InviteDialog_multiInviterError_entry_userId {
|
||||
margin-left: 6px;
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $tertiary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_InviteDialog_multiInviterError_entry_error {
|
||||
margin-left: 32px;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
color: $notice-primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -15,7 +15,7 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
// Not actually a component but things shared by settings components
|
||||
.mx_UserSettingsDialog, .mx_RoomSettingsDialog {
|
||||
.mx_UserSettingsDialog, .mx_RoomSettingsDialog, .mx_SpaceSettingsDialog {
|
||||
width: 90vw;
|
||||
max-width: 1000px;
|
||||
// set the height too since tabbed view scrolls itself.
|
||||
|
||||
@ -50,7 +50,8 @@ limitations under the License.
|
||||
margin-left: 20px;
|
||||
display: inherit;
|
||||
}
|
||||
.mx_ShareDialog_matrixto_copy > div {
|
||||
.mx_ShareDialog_matrixto_copy::after {
|
||||
content: "";
|
||||
mask-image: url($copy-button-url);
|
||||
background-color: $message-action-bar-fg-color;
|
||||
margin-left: 5px;
|
||||
|
||||
@ -15,7 +15,6 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_SpaceSettingsDialog {
|
||||
width: 480px;
|
||||
color: $primary-fg-color;
|
||||
|
||||
.mx_SpaceSettings_errorText {
|
||||
@ -32,8 +31,44 @@ limitations under the License.
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_danger {
|
||||
margin-top: 28px;
|
||||
.mx_SettingsTab_section {
|
||||
.mx_SettingsTab_section_caption {
|
||||
margin-top: 12px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
& + .mx_SettingsTab_subheading {
|
||||
border-top: 1px solid $message-body-panel-bg-color;
|
||||
margin-top: 0;
|
||||
padding-top: 24px;
|
||||
}
|
||||
|
||||
.mx_RadioButton {
|
||||
margin-top: 8px;
|
||||
margin-bottom: 4px;
|
||||
|
||||
.mx_RadioButton_content {
|
||||
font-weight: $font-semi-bold;
|
||||
line-height: $font-18px;
|
||||
color: $primary-fg-color;
|
||||
}
|
||||
|
||||
& + span {
|
||||
font-size: $font-15px;
|
||||
line-height: $font-18px;
|
||||
color: $secondary-fg-color;
|
||||
margin-left: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SettingsTab_showAdvanced {
|
||||
margin: 16px 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.mx_SettingsFlag {
|
||||
margin-top: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpaceSettingsDialog_buttons {
|
||||
@ -52,4 +87,14 @@ limitations under the License.
|
||||
.mx_AccessibleButton_hasKind {
|
||||
padding: 8px 22px;
|
||||
}
|
||||
|
||||
.mx_TabbedView_tabLabel {
|
||||
.mx_SpaceSettingsDialog_generalIcon::before {
|
||||
mask-image: url('$(res)/img/element-icons/settings.svg');
|
||||
}
|
||||
|
||||
.mx_SpaceSettingsDialog_visibilityIcon::before {
|
||||
mask-image: url('$(res)/img/element-icons/eye.svg');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -28,6 +28,7 @@ limitations under the License.
|
||||
left: 0;
|
||||
top: 2px; // alignment
|
||||
background-image: url("$(res)/img/element-icons/warning-badge.svg");
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.mx_AccessSecretStorageDialog_reset_link {
|
||||
|
||||
@ -72,7 +72,7 @@ limitations under the License.
|
||||
|
||||
.mx_AccessibleButton_kind_danger_outline {
|
||||
color: $button-danger-bg-color;
|
||||
background-color: $button-secondary-bg-color;
|
||||
background-color: transparent;
|
||||
border: 1px solid $button-danger-bg-color;
|
||||
}
|
||||
|
||||
|
||||
40
res/css/views/elements/_DialPadBackspaceButton.scss
Normal file
40
res/css/views/elements/_DialPadBackspaceButton.scss
Normal file
@ -0,0 +1,40 @@
|
||||
/*
|
||||
Copyright 2021 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_DialPadBackspaceButton {
|
||||
position: relative;
|
||||
height: 28px;
|
||||
width: 28px;
|
||||
|
||||
&::before {
|
||||
/* force this element to appear on the DOM */
|
||||
content: "";
|
||||
|
||||
background-color: #8D97A5;
|
||||
width: inherit;
|
||||
height: inherit;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
|
||||
mask-image: url('$(res)/img/element-icons/call/delete.svg');
|
||||
mask-position: 8px;
|
||||
mask-size: 20px;
|
||||
mask-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
@ -1,42 +0,0 @@
|
||||
/*
|
||||
Copyright 2019 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_FormButton {
|
||||
line-height: $font-16px;
|
||||
padding: 5px 15px;
|
||||
font-size: $font-12px;
|
||||
height: min-content;
|
||||
|
||||
&:not(:last-child) {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
&.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_AccessibleButton_kind_secondary {
|
||||
color: $secondary-fg-color;
|
||||
border: 1px solid $secondary-fg-color;
|
||||
background-color: unset;
|
||||
}
|
||||
}
|
||||
@ -14,6 +14,10 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
$button-size: 32px;
|
||||
$icon-size: 22px;
|
||||
$button-gap: 24px;
|
||||
|
||||
.mx_ImageView {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@ -22,6 +26,7 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_ImageView_image_wrapper {
|
||||
pointer-events: initial;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@ -30,7 +35,6 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_ImageView_image {
|
||||
pointer-events: all;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@ -43,7 +47,7 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_ImageView_info_wrapper {
|
||||
pointer-events: all;
|
||||
pointer-events: initial;
|
||||
padding-left: 32px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@ -63,19 +67,20 @@ limitations under the License.
|
||||
|
||||
.mx_ImageView_toolbar {
|
||||
padding-right: 16px;
|
||||
pointer-events: all;
|
||||
pointer-events: initial;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: calc($button-gap - ($button-size - $icon-size));
|
||||
}
|
||||
|
||||
.mx_ImageView_button {
|
||||
margin-left: 24px;
|
||||
padding: calc(($button-size - $icon-size) / 2);
|
||||
display: block;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
height: 22px;
|
||||
width: 22px;
|
||||
height: $icon-size;
|
||||
width: $icon-size;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
mask-position: center;
|
||||
@ -109,11 +114,12 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_ImageView_button_close {
|
||||
padding: calc($button-size - $button-size);
|
||||
border-radius: 100%;
|
||||
background: #21262c; // same on all themes
|
||||
&::before {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
width: $button-size;
|
||||
height: $button-size;
|
||||
mask-image: url('$(res)/img/image-view/close.svg');
|
||||
mask-size: 40%;
|
||||
}
|
||||
|
||||
@ -18,7 +18,11 @@ limitations under the License.
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.mx_InlineSpinner_spin img {
|
||||
.mx_InlineSpinner img, .mx_InlineSpinner_icon {
|
||||
margin: 0px 6px;
|
||||
vertical-align: -3px;
|
||||
}
|
||||
|
||||
.mx_InlineSpinner_icon {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@ -28,8 +28,7 @@ limitations under the License.
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&::before, &::after {
|
||||
content: '';
|
||||
.mx_MiniAvatarUploader_indicator {
|
||||
position: absolute;
|
||||
|
||||
height: 26px;
|
||||
@ -37,27 +36,22 @@ limitations under the License.
|
||||
|
||||
right: -6px;
|
||||
bottom: -6px;
|
||||
}
|
||||
|
||||
&::before {
|
||||
background-color: $primary-bg-color;
|
||||
border-radius: 50%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&::after {
|
||||
background-color: $secondary-fg-color;
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-image: url('$(res)/img/element-icons/camera.svg');
|
||||
mask-size: 16px;
|
||||
z-index: 2;
|
||||
}
|
||||
.mx_MiniAvatarUploader_cameraIcon {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
|
||||
&.mx_MiniAvatarUploader_busy::after {
|
||||
background: url("$(res)/img/spinner.gif") no-repeat center;
|
||||
background-size: 80%;
|
||||
mask: unset;
|
||||
background-color: $secondary-fg-color;
|
||||
mask-position: center;
|
||||
mask-repeat: no-repeat;
|
||||
mask-image: url('$(res)/img/element-icons/camera.svg');
|
||||
mask-size: 16px;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -26,3 +26,19 @@ limitations under the License.
|
||||
.mx_MatrixChat_middlePanel .mx_Spinner {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotateZ(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotateZ(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.mx_Spinner_icon {
|
||||
background-color: $primary-fg-color;
|
||||
mask: url('$(res)/img/spinner.svg');
|
||||
mask-size: contain;
|
||||
animation: 1.1s steps(12, end) infinite spin;
|
||||
}
|
||||
|
||||
@ -14,6 +14,8 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
$timelineImageBorderRadius: 4px;
|
||||
|
||||
.mx_MImageBody {
|
||||
display: block;
|
||||
margin-right: 34px;
|
||||
@ -25,7 +27,11 @@ limitations under the License.
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
border-radius: 4px;
|
||||
border-radius: $timelineImageBorderRadius;
|
||||
|
||||
> canvas {
|
||||
border-radius: $timelineImageBorderRadius;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_MImageBody_thumbnail_container {
|
||||
@ -43,7 +49,7 @@ limitations under the License.
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
// Inner img and TintableSvg should be centered around 0, 0
|
||||
// Inner img should be centered around 0, 0
|
||||
.mx_MImageBody_thumbnail_spinner > * {
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
@ -14,17 +14,15 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
import { EnhancedMap } from "./maps";
|
||||
import AwaitLock from "await-lock";
|
||||
// A "media body" is any file upload looking thing, apart from images and videos (they
|
||||
// have unique styles).
|
||||
|
||||
export type DoneFn = () => void;
|
||||
.mx_MediaBody {
|
||||
background-color: $message-body-panel-bg-color;
|
||||
border-radius: 12px;
|
||||
|
||||
export class MultiLock {
|
||||
private locks = new EnhancedMap<string, AwaitLock>();
|
||||
|
||||
public async acquire(key: string): Promise<DoneFn> {
|
||||
const lock = this.locks.getOrCreate(key, new AwaitLock());
|
||||
await lock.acquireAsync();
|
||||
return () => lock.release();
|
||||
}
|
||||
color: $message-body-panel-fg-color;
|
||||
font-size: $font-14px;
|
||||
line-height: $font-24px;
|
||||
}
|
||||
|
||||
@ -20,11 +20,12 @@ limitations under the License.
|
||||
visibility: hidden;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
height: 24px;
|
||||
height: 32px;
|
||||
line-height: $font-24px;
|
||||
border-radius: 4px;
|
||||
background: $message-action-bar-bg-color;
|
||||
top: -26px;
|
||||
border-radius: 8px;
|
||||
background: $primary-bg-color;
|
||||
border: 1px solid $input-border-color;
|
||||
top: -32px;
|
||||
right: 8px;
|
||||
user-select: none;
|
||||
// Ensure the action bar appears above over things, like the read marker.
|
||||
@ -51,31 +52,19 @@ limitations under the License.
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
border: 1px solid $message-action-bar-border-color;
|
||||
margin-left: -1px;
|
||||
margin: 2px;
|
||||
|
||||
&:hover {
|
||||
border-color: $message-action-bar-hover-border-color;
|
||||
background: $roomlist-button-bg-color;
|
||||
border-radius: 6px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
&:only-child {
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.mx_MessageActionBar_maskButton {
|
||||
width: 27px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.mx_MessageActionBar_maskButton::after {
|
||||
@ -88,7 +77,11 @@ limitations under the License.
|
||||
mask-size: 18px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
background-color: $message-action-bar-fg-color;
|
||||
background-color: $secondary-fg-color;
|
||||
}
|
||||
|
||||
.mx_MessageActionBar_maskButton:hover::after {
|
||||
background-color: $primary-fg-color;
|
||||
}
|
||||
|
||||
.mx_MessageActionBar_reactButton::after {
|
||||
|
||||
@ -14,7 +14,13 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_SenderProfile_name {
|
||||
.mx_SenderProfile_displayName {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.mx_SenderProfile_mxid {
|
||||
font-weight: 600;
|
||||
font-size: 1.1rem;
|
||||
margin-left: 5px;
|
||||
opacity: 0.5; // Match mx_TextualEvent
|
||||
}
|
||||
|
||||
@ -17,4 +17,9 @@ limitations under the License.
|
||||
.mx_TextualEvent {
|
||||
opacity: 0.5;
|
||||
overflow-y: hidden;
|
||||
|
||||
a {
|
||||
color: $accent-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
@ -21,7 +21,7 @@ limitations under the License.
|
||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: 90%;
|
||||
mask-size: 80%;
|
||||
}
|
||||
|
||||
&.mx_cryptoEvent_icon::after {
|
||||
@ -48,6 +48,7 @@ limitations under the License.
|
||||
.mx_cryptoEvent_buttons {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
.mx_cryptoEvent_state {
|
||||
|
||||
90
res/css/views/right_panel/_PinnedMessagesCard.scss
Normal file
90
res/css/views/right_panel/_PinnedMessagesCard.scss
Normal file
@ -0,0 +1,90 @@
|
||||
/*
|
||||
Copyright 2021 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_PinnedMessagesCard {
|
||||
padding-top: 0;
|
||||
|
||||
.mx_BaseCard_header {
|
||||
text-align: center;
|
||||
margin-top: 0;
|
||||
border-bottom: 1px solid $menu-border-color;
|
||||
|
||||
> h2 {
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-18px;
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
.mx_BaseCard_close {
|
||||
margin-right: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_PinnedMessagesCard_empty {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
|
||||
> div {
|
||||
height: max-content;
|
||||
text-align: center;
|
||||
margin: auto 40px;
|
||||
|
||||
.mx_PinnedMessagesCard_MessageActionBar {
|
||||
pointer-events: none;
|
||||
display: flex;
|
||||
height: 32px;
|
||||
line-height: $font-24px;
|
||||
border-radius: 8px;
|
||||
background: $primary-bg-color;
|
||||
border: 1px solid $input-border-color;
|
||||
padding: 1px;
|
||||
width: max-content;
|
||||
margin: 0 auto;
|
||||
box-sizing: border-box;
|
||||
|
||||
.mx_MessageActionBar_maskButton {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mx_MessageActionBar_optionsButton {
|
||||
background: $roomlist-button-bg-color;
|
||||
border-radius: 6px;
|
||||
z-index: 1;
|
||||
|
||||
&::after {
|
||||
background-color: $primary-fg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> h2 {
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
color: $primary-fg-color;
|
||||
margin-top: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
> span {
|
||||
font-size: $font-12px;
|
||||
line-height: $font-15px;
|
||||
color: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -36,6 +36,7 @@ limitations under the License.
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.mx_RoomSummaryCard_avatar {
|
||||
|
||||
@ -259,16 +259,6 @@ 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,
|
||||
|
||||
@ -58,7 +58,7 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_VerificationPanel_reciprocate_section {
|
||||
.mx_FormButton {
|
||||
.mx_AccessibleButton {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
|
||||
@ -45,7 +45,7 @@ limitations under the License.
|
||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: 90%;
|
||||
mask-size: 80%;
|
||||
}
|
||||
|
||||
// transparent-looking border surrounding the shield for when overlain over avatars
|
||||
@ -59,7 +59,7 @@ limitations under the License.
|
||||
}
|
||||
// shrink the infill of the badge
|
||||
&::before {
|
||||
mask-size: 65%;
|
||||
mask-size: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -16,6 +16,7 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
$left-gutter: 64px;
|
||||
$hover-select-border: 4px;
|
||||
|
||||
.mx_EventTile {
|
||||
max-width: 100%;
|
||||
@ -85,12 +86,11 @@ $left-gutter: 64px;
|
||||
}
|
||||
|
||||
.mx_EventTile_isEditing .mx_MessageTimestamp {
|
||||
visibility: hidden !important;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.mx_EventTile .mx_MessageTimestamp {
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
white-space: nowrap;
|
||||
left: 0px;
|
||||
text-align: center;
|
||||
@ -104,7 +104,7 @@ $left-gutter: 64px;
|
||||
.mx_EventTile_line, .mx_EventTile_reply {
|
||||
position: relative;
|
||||
padding-left: $left-gutter;
|
||||
border-radius: 4px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.mx_RoomView_timeline_rr_enabled,
|
||||
@ -142,27 +142,8 @@ $left-gutter: 64px;
|
||||
line-height: 57px !important;
|
||||
}
|
||||
|
||||
.mx_MessagePanel_alwaysShowTimestamps .mx_MessageTimestamp {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.mx_EventTile_selected > div > a > .mx_MessageTimestamp {
|
||||
left: 3px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
|
||||
// The first set is to handle the 'group layout' (default) and the second for the IRC layout
|
||||
.mx_EventTile_last > div > a > .mx_MessageTimestamp,
|
||||
.mx_EventTile:hover > div > a > .mx_MessageTimestamp,
|
||||
.mx_EventTile.mx_EventTile_actionBarFocused > div > a > .mx_MessageTimestamp,
|
||||
.mx_EventTile.focus-visible:focus-within > div > a > .mx_MessageTimestamp,
|
||||
.mx_IRCLayout .mx_EventTile_last > a > .mx_MessageTimestamp,
|
||||
.mx_IRCLayout .mx_EventTile:hover > a > .mx_MessageTimestamp,
|
||||
.mx_IRCLayout .mx_ReplyThread .mx_EventTile > a > .mx_MessageTimestamp,
|
||||
.mx_IRCLayout .mx_EventTile.mx_EventTile_actionBarFocused > a > .mx_MessageTimestamp,
|
||||
.mx_IRCLayout .mx_EventTile.focus-visible:focus-within > a > .mx_MessageTimestamp {
|
||||
visibility: visible;
|
||||
left: calc(-$hover-select-border);
|
||||
}
|
||||
|
||||
.mx_EventTile:hover .mx_MessageActionBar,
|
||||
@ -177,7 +158,7 @@ $left-gutter: 64px;
|
||||
*/
|
||||
.mx_EventTile_selected > .mx_EventTile_line {
|
||||
border-left: $accent-color 4px solid;
|
||||
padding-left: 60px;
|
||||
padding-left: calc($left-gutter - $hover-select-border);
|
||||
background-color: $event-selected-color;
|
||||
}
|
||||
|
||||
@ -190,8 +171,12 @@ $left-gutter: 64px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_info .mx_EventTile_line {
|
||||
padding-left: calc($left-gutter + 18px);
|
||||
}
|
||||
|
||||
.mx_EventTile_selected.mx_EventTile_info .mx_EventTile_line {
|
||||
padding-left: 78px;
|
||||
padding-left: calc($left-gutter + 18px - $hover-select-border);
|
||||
}
|
||||
|
||||
.mx_EventTile:hover .mx_EventTile_line,
|
||||
@ -280,6 +265,7 @@ $left-gutter: 64px;
|
||||
height: $font-14px;
|
||||
width: $font-14px;
|
||||
|
||||
will-change: left, top;
|
||||
transition:
|
||||
left var(--transition-short) ease-out,
|
||||
top var(--transition-standard) ease-out;
|
||||
@ -359,7 +345,7 @@ $left-gutter: 64px;
|
||||
mask-image: url('$(res)/img/e2e/normal.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: 90%;
|
||||
mask-size: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
@ -426,7 +412,7 @@ $left-gutter: 64px;
|
||||
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line,
|
||||
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line,
|
||||
.mx_EventTile:hover.mx_EventTile_unknown .mx_EventTile_line {
|
||||
padding-left: 60px;
|
||||
padding-left: calc($left-gutter - $hover-select-border);
|
||||
}
|
||||
|
||||
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line {
|
||||
@ -444,7 +430,7 @@ $left-gutter: 64px;
|
||||
.mx_EventTile:hover.mx_EventTile_verified.mx_EventTile_info .mx_EventTile_line,
|
||||
.mx_EventTile:hover.mx_EventTile_unverified.mx_EventTile_info .mx_EventTile_line,
|
||||
.mx_EventTile:hover.mx_EventTile_unknown.mx_EventTile_info .mx_EventTile_line {
|
||||
padding-left: 78px;
|
||||
padding-left: calc($left-gutter + 18px - $hover-select-border);
|
||||
}
|
||||
|
||||
/* End to end encryption stuff */
|
||||
@ -456,7 +442,7 @@ $left-gutter: 64px;
|
||||
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line > a > .mx_MessageTimestamp,
|
||||
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line > a > .mx_MessageTimestamp,
|
||||
.mx_EventTile:hover.mx_EventTile_unknown .mx_EventTile_line > a > .mx_MessageTimestamp {
|
||||
width: $MessageTimestamp_width_hover;
|
||||
left: calc(-$hover-select-border);
|
||||
}
|
||||
|
||||
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
|
||||
@ -491,8 +477,7 @@ $left-gutter: 64px;
|
||||
|
||||
pre, code {
|
||||
font-family: $monospace-font-family !important;
|
||||
// deliberate constants as we're behind an invert filter
|
||||
color: #333;
|
||||
background-color: $header-panel-bg-color;
|
||||
}
|
||||
|
||||
pre {
|
||||
@ -502,11 +487,6 @@ $left-gutter: 64px;
|
||||
overflow-x: overlay;
|
||||
overflow-y: visible;
|
||||
}
|
||||
|
||||
code {
|
||||
// deliberate constants as we're behind an invert filter
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_lineNumbers {
|
||||
|
||||
@ -24,10 +24,6 @@ $left-gutter: 64px;
|
||||
margin-left: $left-gutter;
|
||||
}
|
||||
|
||||
> .mx_EventTile_line {
|
||||
padding-left: $left-gutter;
|
||||
}
|
||||
|
||||
> .mx_EventTile_avatar {
|
||||
position: absolute;
|
||||
}
|
||||
@ -43,10 +39,6 @@ $left-gutter: 64px;
|
||||
line-height: $font-22px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_info .mx_EventTile_line {
|
||||
padding-left: calc($left-gutter + 18px);
|
||||
}
|
||||
}
|
||||
|
||||
/* Compact layout overrides */
|
||||
|
||||
@ -29,6 +29,7 @@ $irc-line-height: $font-18px;
|
||||
// timestamps are links which shouldn't be underlined
|
||||
> a {
|
||||
text-decoration: none;
|
||||
min-width: 45px;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
@ -49,18 +50,6 @@ $irc-line-height: $font-18px;
|
||||
}
|
||||
}
|
||||
|
||||
> .mx_SenderProfile {
|
||||
order: 2;
|
||||
flex-shrink: 0;
|
||||
width: var(--name-width);
|
||||
text-overflow: ellipsis;
|
||||
text-align: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: visible;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.mx_EventTile_line, .mx_EventTile_reply {
|
||||
padding: 0;
|
||||
display: flex;
|
||||
@ -115,8 +104,7 @@ $irc-line-height: $font-18px;
|
||||
.mx_EventTile_line {
|
||||
.mx_EventTile_e2eIcon,
|
||||
.mx_TextualEvent,
|
||||
.mx_MTextBody,
|
||||
.mx_ReplyThread_wrapper_empty {
|
||||
.mx_MTextBody {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
@ -174,30 +162,37 @@ $irc-line-height: $font-18px;
|
||||
border-left: 0;
|
||||
}
|
||||
|
||||
.mx_SenderProfile_hover {
|
||||
background-color: $primary-bg-color;
|
||||
overflow: hidden;
|
||||
.mx_SenderProfile {
|
||||
width: var(--name-width);
|
||||
display: flex;
|
||||
order: 2;
|
||||
flex-shrink: 0;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
|
||||
> span {
|
||||
display: flex;
|
||||
> .mx_SenderProfile_displayName {
|
||||
width: 100%;
|
||||
text-align: end;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
> .mx_SenderProfile_name {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
min-width: var(--name-width);
|
||||
text-align: end;
|
||||
}
|
||||
> .mx_SenderProfile_mxid {
|
||||
visibility: collapse;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SenderProfile:hover {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.mx_SenderProfile_hover:hover {
|
||||
overflow: visible;
|
||||
width: max(auto, 100%);
|
||||
z-index: 10;
|
||||
|
||||
> .mx_SenderProfile_displayName {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
> .mx_SenderProfile_mxid {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_ReplyThread {
|
||||
@ -205,16 +200,7 @@ $irc-line-height: $font-18px;
|
||||
.mx_SenderProfile {
|
||||
width: unset;
|
||||
max-width: var(--name-width);
|
||||
}
|
||||
|
||||
.mx_SenderProfile_hover {
|
||||
background: transparent;
|
||||
|
||||
> span {
|
||||
> .mx_SenderProfile_name {
|
||||
min-width: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mx_EventTile_emote {
|
||||
|
||||
@ -52,6 +52,7 @@ limitations under the License.
|
||||
|
||||
.mx_JumpToBottomButton_scrollDown {
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 38px;
|
||||
border-radius: 19px;
|
||||
box-sizing: border-box;
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
/*
|
||||
Copyright 2019 The Matrix.org Foundation C.I.C.
|
||||
Copyright 2021 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.
|
||||
@ -14,15 +14,25 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
/**
|
||||
* Automatically focuses the captured reference when receiving a non-null
|
||||
* object. Useful in scenarios where componentDidMount does not have a
|
||||
* useful reference to an element, but one needs to focus the element on
|
||||
* first render. Example usage: ref={focusCapturedRef}
|
||||
* @param {function} ref The React reference to focus on, if not null
|
||||
*/
|
||||
export function focusCapturedRef(ref) {
|
||||
if (ref) {
|
||||
ref.focus();
|
||||
.mx_LinkPreviewGroup {
|
||||
.mx_LinkPreviewGroup_hide {
|
||||
cursor: pointer;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
|
||||
img {
|
||||
flex: 0 0 40px;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .mx_LinkPreviewGroup_hide img,
|
||||
.mx_LinkPreviewGroup_hide.focus-visible:focus img {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
> .mx_AccessibleButton {
|
||||
color: $accent-color;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@ -33,38 +33,29 @@ limitations under the License.
|
||||
.mx_LinkPreviewWidget_caption {
|
||||
margin-left: 15px;
|
||||
flex: 1 1 auto;
|
||||
overflow-x: hidden; // cause it to wrap rather than clip
|
||||
}
|
||||
|
||||
.mx_LinkPreviewWidget_title {
|
||||
display: inline;
|
||||
font-weight: bold;
|
||||
white-space: normal;
|
||||
}
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
|
||||
.mx_LinkPreviewWidget_siteName {
|
||||
display: inline;
|
||||
.mx_LinkPreviewWidget_siteName {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LinkPreviewWidget_description {
|
||||
margin-top: 8px;
|
||||
white-space: normal;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.mx_LinkPreviewWidget_cancel {
|
||||
cursor: pointer;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
|
||||
img {
|
||||
flex: 0 0 40px;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_LinkPreviewWidget:hover .mx_LinkPreviewWidget_cancel img,
|
||||
.mx_LinkPreviewWidget_cancel.focus-visible:focus img {
|
||||
visibility: visible;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.mx_MatrixChat_useCompactLayout {
|
||||
|
||||
@ -18,8 +18,8 @@ limitations under the License.
|
||||
margin: 40px 0 48px 64px;
|
||||
|
||||
.mx_MiniAvatarUploader_hasAvatar:not(.mx_MiniAvatarUploader_busy):not(:hover) {
|
||||
&::before, &::after {
|
||||
content: unset;
|
||||
.mx_MiniAvatarUploader_indicator {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -16,62 +16,91 @@ limitations under the License.
|
||||
|
||||
.mx_PinnedEventTile {
|
||||
min-height: 40px;
|
||||
margin-bottom: 5px;
|
||||
width: 100%;
|
||||
border-radius: 5px; // for the hover
|
||||
}
|
||||
padding: 0 4px 12px;
|
||||
|
||||
.mx_PinnedEventTile:hover {
|
||||
background-color: $event-selected-color;
|
||||
}
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"avatar name remove"
|
||||
"content content content"
|
||||
"footer footer footer";
|
||||
grid-template-rows: max-content auto max-content;
|
||||
grid-template-columns: 24px auto 24px;
|
||||
grid-row-gap: 12px;
|
||||
grid-column-gap: 8px;
|
||||
|
||||
.mx_PinnedEventTile .mx_PinnedEventTile_sender,
|
||||
.mx_PinnedEventTile .mx_PinnedEventTile_timestamp {
|
||||
color: #868686;
|
||||
font-size: 0.8em;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
padding-bottom: 3px;
|
||||
}
|
||||
& + .mx_PinnedEventTile {
|
||||
padding: 12px 4px;
|
||||
border-top: 1px solid $menu-border-color;
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile .mx_PinnedEventTile_timestamp {
|
||||
padding-left: 15px;
|
||||
display: none;
|
||||
}
|
||||
.mx_PinnedEventTile_senderAvatar {
|
||||
grid-area: avatar;
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile .mx_PinnedEventTile_senderAvatar .mx_BaseAvatar {
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mx_PinnedEventTile_sender {
|
||||
grid-area: name;
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-15px;
|
||||
line-height: $font-24px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile_actions {
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
display: none;
|
||||
}
|
||||
.mx_PinnedEventTile_unpinButton {
|
||||
visibility: hidden;
|
||||
grid-area: remove;
|
||||
position: relative;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 8px;
|
||||
|
||||
.mx_PinnedEventTile:hover .mx_PinnedEventTile_timestamp {
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
background-color: $roomheader-addroom-bg-color;
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile:hover .mx_PinnedEventTile_actions {
|
||||
display: block;
|
||||
}
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
//top: 0;
|
||||
//left: 0;
|
||||
height: inherit;
|
||||
width: inherit;
|
||||
background: $secondary-fg-color;
|
||||
mask-position: center;
|
||||
mask-size: 8px;
|
||||
mask-repeat: no-repeat;
|
||||
mask-image: url('$(res)/img/image-view/close.svg');
|
||||
}
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile_unpinButton {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.mx_PinnedEventTile_message {
|
||||
grid-area: content;
|
||||
}
|
||||
|
||||
.mx_PinnedEventTile_gotoButton {
|
||||
display: inline-block;
|
||||
font-size: 0.7em; // Smaller text to avoid conflicting with the layout
|
||||
}
|
||||
.mx_PinnedEventTile_footer {
|
||||
grid-area: footer;
|
||||
font-size: 10px;
|
||||
line-height: 12px;
|
||||
|
||||
.mx_PinnedEventTile_message {
|
||||
margin-left: 50px;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
.mx_PinnedEventTile_timestamp {
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
color: $secondary-fg-color;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_kind_link {
|
||||
padding: 0;
|
||||
margin-left: 12px;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.mx_PinnedEventTile_unpinButton {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -32,14 +32,14 @@ limitations under the License.
|
||||
// first triggering the enter state with the newest breadcrumb off screen (-40px) then
|
||||
// sliding it into view.
|
||||
&.mx_RoomBreadcrumbs-enter {
|
||||
margin-left: -40px; // 32px for the avatar, 8px for the margin
|
||||
transform: translateX(-40px); // 32px for the avatar, 8px for the margin
|
||||
}
|
||||
&.mx_RoomBreadcrumbs-enter-active {
|
||||
margin-left: 0;
|
||||
transform: translateX(0);
|
||||
|
||||
// Timing function is as-requested by design.
|
||||
// NOTE: The transition time MUST match the value passed to CSSTransition!
|
||||
transition: margin-left 640ms cubic-bezier(0.66, 0.02, 0.36, 1);
|
||||
transition: transform 640ms cubic-bezier(0.66, 0.02, 0.36, 1);
|
||||
}
|
||||
|
||||
.mx_RoomBreadcrumbs_placeholder {
|
||||
|
||||
@ -277,24 +277,6 @@ limitations under the License.
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_pinnedButton::before {
|
||||
mask-image: url('$(res)/img/element-icons/room/pin.svg');
|
||||
}
|
||||
|
||||
.mx_RoomHeader_pinsIndicator {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 4px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 8px;
|
||||
background-color: $pinned-color;
|
||||
}
|
||||
|
||||
.mx_RoomHeader_pinsIndicatorUnread {
|
||||
background-color: $pinned-unread-color;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 480px) {
|
||||
.mx_RoomHeader_wrapper {
|
||||
padding: 0;
|
||||
|
||||
@ -61,8 +61,8 @@ limitations under the License.
|
||||
&.mx_RoomSublist_headerContainer_sticky {
|
||||
position: fixed;
|
||||
height: 32px; // to match the header container
|
||||
// width set by JS
|
||||
width: calc(100% - 22px);
|
||||
// width set by JS because of a compat issue between Firefox and Chrome
|
||||
width: calc(100% - 15px);
|
||||
}
|
||||
|
||||
// We don't have a top style because the top is dependent on the room list header's
|
||||
@ -198,6 +198,7 @@ limitations under the License.
|
||||
// as the box model should be top aligned. Happens in both FF and Chromium
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: stretch;
|
||||
|
||||
mask-image: linear-gradient(0deg, transparent, black 4px);
|
||||
}
|
||||
|
||||
@ -19,6 +19,10 @@ limitations under the License.
|
||||
margin-bottom: 4px;
|
||||
padding: 4px;
|
||||
|
||||
contain: content; // Not strict as it will break when resizing a sublist vertically
|
||||
height: 40px;
|
||||
box-sizing: border-box;
|
||||
|
||||
// The tile is also a flexbox row itself
|
||||
display: flex;
|
||||
|
||||
|
||||
@ -36,10 +36,10 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_VoiceRecordComposerTile_delete {
|
||||
width: 14px; // w&h are size of icon
|
||||
height: 18px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
vertical-align: middle;
|
||||
margin-right: 11px; // distance from left edge of waveform container (container has some margin too)
|
||||
margin-right: 8px; // distance from left edge of waveform container (container has some margin too)
|
||||
background-color: $voice-record-icon-color;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
|
||||
@ -16,7 +16,7 @@ limitations under the License.
|
||||
|
||||
.mx_SpaceBasicSettings {
|
||||
.mx_Field {
|
||||
margin: 32px 0;
|
||||
margin: 24px 0;
|
||||
}
|
||||
|
||||
.mx_SpaceBasicSettings_avatarContainer {
|
||||
@ -73,7 +73,7 @@ limitations under the License.
|
||||
}
|
||||
}
|
||||
|
||||
.mx_FormButton {
|
||||
.mx_AccessibleButton_hasKind {
|
||||
padding: 8px 22px;
|
||||
margin-left: auto;
|
||||
display: block;
|
||||
|
||||
@ -30,8 +30,8 @@ limitations under the License.
|
||||
pointer-events: initial; // restore pointer events so the user can leave/interact
|
||||
cursor: pointer;
|
||||
|
||||
.mx_CallView_video {
|
||||
width: 350px;
|
||||
.mx_VideoFeed_remote.mx_VideoFeed_voice {
|
||||
min-height: 150px;
|
||||
}
|
||||
|
||||
.mx_VideoFeed_local {
|
||||
@ -98,5 +98,29 @@ limitations under the License.
|
||||
line-height: $font-24px;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_IncomingCallBox_iconButton {
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
background-color: $icon-button-color;
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: contain;
|
||||
mask-position: center;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_IncomingCallBox_silence::before {
|
||||
mask-image: url('$(res)/img/voip/silence.svg');
|
||||
}
|
||||
|
||||
.mx_IncomingCallBox_unSilence::before {
|
||||
mask-image: url('$(res)/img/voip/un-silence.svg');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
21
res/css/views/voip/_CallPreview.scss
Normal file
21
res/css/views/voip/_CallPreview.scss
Normal file
@ -0,0 +1,21 @@
|
||||
/*
|
||||
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>
|
||||
|
||||
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_CallPreview {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
@ -39,7 +39,6 @@ limitations under the License.
|
||||
.mx_CallView_pip {
|
||||
width: 320px;
|
||||
padding-bottom: 8px;
|
||||
margin-top: 10px;
|
||||
background-color: $voipcall-plinth-color;
|
||||
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.20);
|
||||
border-radius: 8px;
|
||||
|
||||
@ -16,23 +16,42 @@ limitations under the License.
|
||||
|
||||
.mx_DialPad {
|
||||
display: grid;
|
||||
row-gap: 16px;
|
||||
column-gap: 0px;
|
||||
margin-top: 24px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
/* squeeze the dial pad buttons together horizontally */
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.mx_DialPad_button {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background-color: $theme-button-bg-color;
|
||||
background-color: $dialpad-button-bg-color;
|
||||
border-radius: 40px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
line-height: 40px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.mx_DialPad_deleteButton, .mx_DialPad_dialButton {
|
||||
.mx_DialPad_button .mx_DialPad_buttonSubText {
|
||||
font-size: 8px;
|
||||
}
|
||||
|
||||
.mx_DialPad_dialButton {
|
||||
/* Always show the dial button in the center grid column */
|
||||
grid-column: 2;
|
||||
background-color: $accent-color;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
@ -42,21 +61,7 @@ limitations under the License.
|
||||
mask-repeat: no-repeat;
|
||||
mask-size: 20px;
|
||||
mask-position: center;
|
||||
background-color: $primary-bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_DialPad_deleteButton {
|
||||
background-color: $notice-primary-color;
|
||||
&::before {
|
||||
mask-image: url('$(res)/img/element-icons/call/delete.svg');
|
||||
mask-position: 9px; // delete icon is right-heavy so have to be slightly to the left to look centered
|
||||
}
|
||||
}
|
||||
|
||||
.mx_DialPad_dialButton {
|
||||
background-color: $accent-color;
|
||||
&::before {
|
||||
background-color: #FFF; // on all themes
|
||||
mask-image: url('$(res)/img/element-icons/call/voice-call.svg');
|
||||
}
|
||||
}
|
||||
|
||||
@ -14,10 +14,40 @@ See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_DialPadContextMenu_dialPad .mx_DialPad {
|
||||
row-gap: 16px;
|
||||
column-gap: 32px;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenuWrapper {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_header {
|
||||
margin-top: 12px;
|
||||
margin-left: 12px;
|
||||
margin-right: 12px;
|
||||
border: none;
|
||||
margin-top: 32px;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
|
||||
/* a separator between the input line and the dial buttons */
|
||||
border-bottom: 1px solid $quaternary-fg-color;
|
||||
transition: border-bottom 0.25s;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_cancel {
|
||||
float: right;
|
||||
mask: url('$(res)/img/feather-customised/cancel.svg');
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: cover;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background-color: $dialog-close-fg-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_header:focus-within {
|
||||
border-bottom: 1px solid $accent-color;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_title {
|
||||
@ -27,21 +57,23 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_dialled {
|
||||
height: 1em;
|
||||
height: 1.5em;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
border: none;
|
||||
margin: 0px;
|
||||
}
|
||||
.mx_DialPadContextMenu_dialled input {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
overflow: hidden;
|
||||
max-width: 185px;
|
||||
text-align: left;
|
||||
direction: rtl;
|
||||
padding: 8px 0px;
|
||||
background-color: rgb(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_dialPad {
|
||||
margin: 16px;
|
||||
}
|
||||
|
||||
.mx_DialPadContextMenu_horizSep {
|
||||
position: relative;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid $input-darker-bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,14 +19,23 @@ limitations under the License.
|
||||
}
|
||||
|
||||
.mx_DialPadModal {
|
||||
width: 192px;
|
||||
height: 368px;
|
||||
width: 292px;
|
||||
height: 370px;
|
||||
padding: 16px 0px 0px 0px;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_header {
|
||||
margin-top: 12px;
|
||||
margin-left: 12px;
|
||||
margin-right: 12px;
|
||||
margin-top: 32px;
|
||||
margin-left: 40px;
|
||||
margin-right: 40px;
|
||||
|
||||
/* a separator between the input line and the dial buttons */
|
||||
border-bottom: 1px solid $quaternary-fg-color;
|
||||
transition: border-bottom 0.25s;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_header:focus-within {
|
||||
border-bottom: 1px solid $accent-color;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_title {
|
||||
@ -45,11 +54,18 @@ limitations under the License.
|
||||
height: 14px;
|
||||
background-color: $dialog-close-fg-color;
|
||||
cursor: pointer;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_field {
|
||||
border: none;
|
||||
margin: 0px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_field .mx_Field_postfix {
|
||||
/* Remove border separator between postfix and field content */
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_field input {
|
||||
@ -62,13 +78,3 @@ limitations under the License.
|
||||
margin-right: 16px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.mx_DialPadModal_horizSep {
|
||||
position: relative;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid $input-darker-bg-color;
|
||||
}
|
||||
}
|
||||
|
||||
@ -15,8 +15,6 @@ limitations under the License.
|
||||
*/
|
||||
|
||||
.mx_VideoFeed_voice {
|
||||
// We don't want to collide with the call controls that have 52px of height
|
||||
padding-bottom: 52px;
|
||||
background-color: $inverted-bg-color;
|
||||
}
|
||||
|
||||
|
||||
3
res/img/element-icons/call/dialpad.svg
Normal file
3
res/img/element-icons/call/dialpad.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="12" height="18" viewBox="0 0 12 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6 14.25C5.175 14.25 4.5 14.925 4.5 15.75C4.5 16.575 5.175 17.25 6 17.25C6.825 17.25 7.5 16.575 7.5 15.75C7.5 14.925 6.825 14.25 6 14.25ZM1.5 0.75C0.675 0.75 0 1.425 0 2.25C0 3.075 0.675 3.75 1.5 3.75C2.325 3.75 3 3.075 3 2.25C3 1.425 2.325 0.75 1.5 0.75ZM1.5 5.25C0.675 5.25 0 5.925 0 6.75C0 7.575 0.675 8.25 1.5 8.25C2.325 8.25 3 7.575 3 6.75C3 5.925 2.325 5.25 1.5 5.25ZM1.5 9.75C0.675 9.75 0 10.425 0 11.25C0 12.075 0.675 12.75 1.5 12.75C2.325 12.75 3 12.075 3 11.25C3 10.425 2.325 9.75 1.5 9.75ZM10.5 3.75C11.325 3.75 12 3.075 12 2.25C12 1.425 11.325 0.75 10.5 0.75C9.675 0.75 9 1.425 9 2.25C9 3.075 9.675 3.75 10.5 3.75ZM6 9.75C5.175 9.75 4.5 10.425 4.5 11.25C4.5 12.075 5.175 12.75 6 12.75C6.825 12.75 7.5 12.075 7.5 11.25C7.5 10.425 6.825 9.75 6 9.75ZM10.5 9.75C9.675 9.75 9 10.425 9 11.25C9 12.075 9.675 12.75 10.5 12.75C11.325 12.75 12 12.075 12 11.25C12 10.425 11.325 9.75 10.5 9.75ZM10.5 5.25C9.675 5.25 9 5.925 9 6.75C9 7.575 9.675 8.25 10.5 8.25C11.325 8.25 12 7.575 12 6.75C12 5.925 11.325 5.25 10.5 5.25ZM6 5.25C5.175 5.25 4.5 5.925 4.5 6.75C4.5 7.575 5.175 8.25 6 8.25C6.825 8.25 7.5 7.575 7.5 6.75C7.5 5.925 6.825 5.25 6 5.25ZM6 0.75C5.175 0.75 4.5 1.425 4.5 2.25C4.5 3.075 5.175 3.75 6 3.75C6.825 3.75 7.5 3.075 7.5 2.25C7.5 1.425 6.825 0.75 6 0.75Z" fill="#737D8C"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
3
res/img/element-icons/eye.svg
Normal file
3
res/img/element-icons/eye.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3094 5.96587C15.3206 7.15704 15.3417 8.85457 14.3412 10.0548C13.0889 11.5571 10.9822 13.3332 8.02104 13.3332C5.05992 13.3332 2.9532 11.5571 1.70087 10.0548C0.700398 8.85457 0.721506 7.15704 1.7327 5.96587C3.01174 4.45918 5.1391 2.6665 8.02104 2.6665C10.903 2.6665 13.0303 4.45918 14.3094 5.96587ZM11.5556 7.99984C11.5556 9.96352 9.96369 11.5554 8.00001 11.5554C6.03633 11.5554 4.44446 9.96352 4.44446 7.99984C4.44446 6.03616 6.03633 4.44428 8.00001 4.44428C9.96369 4.44428 11.5556 6.03616 11.5556 7.99984ZM8.00001 9.77761C8.98185 9.77761 9.77779 8.98168 9.77779 7.99984C9.77779 7.018 8.98185 6.22206 8.00001 6.22206C7.01817 6.22206 6.22224 7.018 6.22224 7.99984C6.22224 8.98168 7.01817 9.77761 8.00001 9.77761Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 887 B |
1
res/img/element-icons/message/chevron-up.svg
Normal file
1
res/img/element-icons/message/chevron-up.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-chevron-up"><polyline points="18 15 12 9 6 15"></polyline></svg>
|
||||
|
After Width: | Height: | Size: 268 B |
1
res/img/element-icons/message/corner-up-right.svg
Normal file
1
res/img/element-icons/message/corner-up-right.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-corner-up-right"><polyline points="15 14 20 9 15 4"></polyline><path d="M4 20v-7a4 4 0 0 1 4-4h12"></path></svg>
|
||||
|
After Width: | Height: | Size: 316 B |
3
res/img/element-icons/message/fwd.svg
Normal file
3
res/img/element-icons/message/fwd.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.9454 4.27941C10.653 3.98601 10.6539 3.51114 10.9472 3.21875C11.2406 2.92637 11.7155 2.92719 12.0079 3.22059L15.5312 6.75612C15.8229 7.0488 15.8229 7.52226 15.5312 7.81494L12.0079 11.3505C11.7155 11.6439 11.2407 11.6447 10.9473 11.3523C10.6539 11.06 10.653 10.5851 10.9454 10.2917L13.2292 8H6.36588C4.95064 8 3.75282 9.20272 3.75282 10.75C3.75282 12.2973 4.95064 13.5 6.36588 13.5H7.93524C8.34945 13.5 8.68524 13.8358 8.68524 14.25C8.68524 14.6642 8.34945 15 7.93524 15H6.36588C4.06634 15 2.25282 13.0687 2.25282 10.75C2.25282 8.43128 4.06634 6.5 6.36588 6.5H13.1583L10.9454 4.27941Z" fill="black"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 755 B |
1
res/img/element-icons/message/link.svg
Normal file
1
res/img/element-icons/message/link.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-link"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg>
|
||||
|
After Width: | Height: | Size: 371 B |
1
res/img/element-icons/message/repeat.svg
Normal file
1
res/img/element-icons/message/repeat.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-repeat"><polyline points="17 1 21 5 17 9"></polyline><path d="M3 11V9a4 4 0 0 1 4-4h14"></path><polyline points="7 23 3 19 7 15"></polyline><path d="M21 13v2a4 4 0 0 1-4 4H3"></path></svg>
|
||||
|
After Width: | Height: | Size: 392 B |
1
res/img/element-icons/message/share.svg
Normal file
1
res/img/element-icons/message/share.svg
Normal file
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-share"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"></path><polyline points="16 6 12 2 8 6"></polyline><line x1="12" y1="2" x2="12" y2="15"></line></svg>
|
||||
|
After Width: | Height: | Size: 364 B |
@ -1,7 +1,7 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M18.5151 20.0831L15.6941 17.2621L17.2621 15.6941L20.0831 18.5151C21.5741 20.0061 22.1529 21.7793 21.9661 21.9661C21.7793 22.1529 20.0061 21.5741 18.5151 20.0831Z" fill="black"/>
|
||||
<path d="M7.46196 11.3821C7.07677 11.5059 5.49073 12.0989 3.63366 12.0744C1.77658 12.0499 1.67795 10.8941 2.46811 10.1039L6.28598 6.28602L9.42196 9.42203L7.46196 11.3821Z" fill="black"/>
|
||||
<path d="M11.3821 7.46202C11.5059 7.07682 12.0989 5.49077 12.0744 3.63368C12.0499 1.77658 10.8941 1.67795 10.1039 2.46812L6.28598 6.28602L9.42196 9.42203L11.3821 7.46202Z" fill="black"/>
|
||||
<path d="M7.40596 11.438L11.4379 7.40602L14.9099 10.206L10.2059 14.9101L7.40596 11.438Z" fill="black"/>
|
||||
<path d="M11.774 11.774C9.31114 14.2369 8.61779 17.7115 9.83827 20.3213C10.3104 21.3308 11.6288 21.3273 12.4169 20.5392L20.5391 12.4169C21.3271 11.6289 21.3307 10.3104 20.3212 9.83829C17.7114 8.61779 14.2369 9.31115 11.774 11.774Z" fill="black"/>
|
||||
<path d="M18.5151 20.0831L15.6941 17.2621L17.2621 15.6941L20.0831 18.5151C21.5741 20.0061 22.1529 21.7793 21.9661 21.9661C21.7793 22.1529 20.0061 21.5741 18.5151 20.0831Z" fill="#737D8C"/>
|
||||
<path d="M7.46196 11.3821C7.07677 11.5059 5.49073 12.0989 3.63366 12.0744C1.77658 12.0499 1.67795 10.8941 2.46811 10.1039L6.28598 6.28602L9.42196 9.42203L7.46196 11.3821Z" fill="#737D8C"/>
|
||||
<path d="M11.3821 7.46202C11.5059 7.07682 12.0989 5.49077 12.0744 3.63368C12.0499 1.77658 10.8941 1.67795 10.1039 2.46812L6.28598 6.28602L9.42196 9.42203L11.3821 7.46202Z" fill="#737D8C"/>
|
||||
<path d="M7.40596 11.438L11.4379 7.40602L14.9099 10.206L10.2059 14.9101L7.40596 11.438Z" fill="#737D8C"/>
|
||||
<path d="M11.774 11.774C9.31114 14.2369 8.61779 17.7115 9.83827 20.3213C10.3104 21.3308 11.6288 21.3273 12.4169 20.5392L20.5391 12.4169C21.3271 11.6289 21.3307 10.3104 20.3212 9.83829C17.7114 8.61779 14.2369 9.31115 11.774 11.774Z" fill="#737D8C"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 1015 B After Width: | Height: | Size: 1.0 KiB |
@ -1,3 +1,3 @@
|
||||
<svg width="12" height="17" viewBox="0 0 12 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.857143 14.5C0.857143 15.4491 1.62857 16.5 2.57143 16.5H9.42857C10.3714 16.5 11.1429 15.2542 11.1429 14.3051V5.67692C11.1429 4.72781 10.3714 3.95128 9.42857 3.95128H2.57143C1.62857 3.95128 0.857143 4.72781 0.857143 5.67692V14.5ZM11.1429 1.36282H9L8.39143 0.750218C8.23714 0.59491 8.01429 0.5 7.79143 0.5H4.20857C3.98571 0.5 3.76286 0.59491 3.60857 0.750218L3 1.36282H0.857143C0.385714 1.36282 0 1.75109 0 2.22564C0 2.70019 0.385714 3.08846 0.857143 3.08846H11.1429C11.6143 3.08846 12 2.70019 12 2.22564C12 1.75109 11.6143 1.36282 11.1429 1.36282Z" fill="#737D8C"/>
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M6 19C6 20.1 6.9 21 8 21H16C17.1 21 18 20.1 18 19V9C18 7.9 17.1 7 16 7H8C6.9 7 6 7.9 6 9V19ZM18 4H15.5L14.79 3.29C14.61 3.11 14.35 3 14.09 3H9.91C9.65 3 9.39 3.11 9.21 3.29L8.5 4H6C5.45 4 5 4.45 5 5C5 5.55 5.45 6 6 6H18C18.55 6 19 5.55 19 5C19 4.45 18.55 4 18 4Z" fill="#8D99A5"/>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 679 B After Width: | Height: | Size: 397 B |
@ -1,5 +1,32 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="8" cy="8" r="8" fill="#FF4B55"/>
|
||||
<rect x="7" y="3" width="2" height="6" rx="1" fill="white"/>
|
||||
<rect x="7" y="11" width="2" height="2" rx="1" fill="white"/>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
id="svg8"
|
||||
version="1.1"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
height="24"
|
||||
width="24">
|
||||
<metadata
|
||||
id="metadata14">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<defs
|
||||
id="defs12" />
|
||||
<path
|
||||
id="path2"
|
||||
d="M 12 2 C 6.47715 2 2 6.47715 2 12 C 2 17.5228 6.47715 22 12 22 C 17.5228 22 22 17.5228 22 12 C 22 6.47715 17.5228 2 12 2 z M 11.880859 5.5039062 C 12.720859 5.4439063 13.470547 6.0746875 13.560547 6.9296875 L 13.560547 7.1699219 L 13.080078 13.169922 C 13.035078 13.724922 12.570625 14.144531 12.015625 14.144531 L 11.925781 14.144531 C 11.400781 14.099531 10.996172 13.694922 10.951172 13.169922 L 10.470703 7.1699219 C 10.395703 6.3149219 11.025859 5.5639064 11.880859 5.5039062 z M 12 15.763672 C 12.729 15.763672 13.320312 16.354884 13.320312 17.083984 C 13.320313 17.812984 12.729 18.404297 12 18.404297 C 11.271 18.404297 10.679688 17.812984 10.679688 17.083984 C 10.679688 16.354884 11.271 15.763672 12 15.763672 z "
|
||||
style="fill:#ff4b55;fill-opacity:1" />
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 283 B After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 34 KiB |
@ -1,141 +1,96 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink" preserveAspectRatio="none" viewBox="0 0 375 375" style="background-color:#FFFFFF00; overflow:visible">
|
||||
<title>start</title>
|
||||
<!-- Layers -->
|
||||
<!-- Layer: Icon -->
|
||||
<svg x="188" y="187" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="188;187.75;187.5"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="187;187.25;187.5"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<animateTransform attributeName="transform" calcMode="spline" dur="2" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1"
|
||||
repeatCount="indefinite" type="rotate" values="0;180;360"/>
|
||||
<svg x="-100" y="-100" width="200" height="200" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-100;-117.5;-100"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-100;-117.5;-100"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="200;235;200"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 1 1;0 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="200;235;200"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<!-- Layer: 1024@2x -->
|
||||
<svg x="100" y="100" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="100;117.5;100"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="100;117.5;100"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<svg x="-100" y="-100" width="200" height="200" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-100;-117.5;-100"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-100;-117.5;-100"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="200;235;200"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="200;235;200"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<!-- Layer: Path -->
|
||||
<svg x="118" y="46" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="118;138.65;118"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="46;54.05;46"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<svg x="-46" y="-46" width="92" height="92" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<path d="M0,12c0,-6.627,5.373,-12,12,-12 44.183,0,80,35.817,80,80 0,6.627,-5.373,12,-12,12 -6.627,0,-12,-5.373,-12,-12 0,-30.928,-25.072,-56,-56,-56 -6.627,0,-12,-5.373,-12,-12zM0,12" fill="#0DBD8B" id="path" stroke="#00000000" stroke-dasharray="0" stroke-dashoffset="0" stroke-miterlimit="10" stroke-width="0">
|
||||
<animate attributeName="d" calcMode="spline" dur="2s" fill="freeze" href="#path" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="M0,12c0,-6.627,5.373,-12,12,-12 44.183,0,80,35.817,80,80 0,6.627,-5.373,12,-12,12 -6.627,0,-12,-5.373,-12,-12 0,-30.928,-25.072,-56,-56,-56 -6.627,0,-12,-5.373,-12,-12zM0,12;M0,14.1c0,-7.787,6.313,-14.1,14.1,-14.1 51.915,0,94,42.085,94,94 0,7.787,-6.313,14.1,-14.1,14.1 -7.787,0,-14.1,-6.313,-14.1,-14.1 0,-36.34,-29.46,-65.8,-65.8,-65.8 -7.787,0,-14.1,-6.313,-14.1,-14.1zM0,14.1;M0,12c0,-6.627,5.373,-12,12,-12 44.183,0,80,35.817,80,80 0,6.627,-5.373,12,-12,12 -6.627,0,-12,-5.373,-12,-12 0,-30.928,-25.072,-56,-56,-56 -6.627,0,-12,-5.373,-12,-12zM0,12"/>
|
||||
</path>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<!-- Layer: Path -->
|
||||
<svg x="82" y="154" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="82;96.35;82"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="154;180.95;154"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<svg x="-46" y="-46" width="92" height="92" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<path d="M92,80c0,6.627,-5.373,12,-12,12 -44.183,0,-80,-35.817,-80,-80 0,-6.627,5.373,-12,12,-12 6.627,0,12,5.373,12,12 0,30.928,25.072,56,56,56 6.627,0,12,5.373,12,12zM92,80" fill="#0DBD8B" id="path_1" stroke="#00000000" stroke-dasharray="0" stroke-dashoffset="0" stroke-miterlimit="10" stroke-width="0">
|
||||
<animate attributeName="d" calcMode="spline" dur="2s" fill="freeze" href="#path_1" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="M92,80c0,6.627,-5.373,12,-12,12 -44.183,0,-80,-35.817,-80,-80 0,-6.627,5.373,-12,12,-12 6.627,0,12,5.373,12,12 0,30.928,25.072,56,56,56 6.627,0,12,5.373,12,12zM92,80;M108.1,94c0,7.787,-6.313,14.1,-14.1,14.1 -51.915,0,-94,-42.085,-94,-94 0,-7.787,6.313,-14.1,14.1,-14.1 7.787,0,14.1,6.313,14.1,14.1 0,36.34,29.46,65.8,65.8,65.8 7.787,0,14.1,6.313,14.1,14.1zM108.1,94;M92,80c0,6.627,-5.373,12,-12,12 -44.183,0,-80,-35.817,-80,-80 0,-6.627,5.373,-12,12,-12 6.627,0,12,5.373,12,12 0,30.928,25.072,56,56,56 6.627,0,12,5.373,12,12zM92,80"/>
|
||||
</path>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<!-- Layer: Path -->
|
||||
<svg x="46" y="82" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="46;54.05;46"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="82;96.35;82"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<svg x="-46" y="-46" width="92" height="92" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<path d="M12,92c-6.627,0,-12,-5.373,-12,-12 0,-44.183,35.817,-80,80,-80 6.627,0,12,5.373,12,12 0,6.627,-5.373,12,-12,12 -30.928,0,-56,25.072,-56,56 0,6.627,-5.373,12,-12,12zM12,92" fill="#0DBD8B" id="path_2" stroke="#00000000" stroke-dasharray="0" stroke-dashoffset="0" stroke-miterlimit="10" stroke-width="0">
|
||||
<animate attributeName="d" calcMode="spline" dur="2s" fill="freeze" href="#path_2" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="M12,92c-6.627,0,-12,-5.373,-12,-12 0,-44.183,35.817,-80,80,-80 6.627,0,12,5.373,12,12 0,6.627,-5.373,12,-12,12 -30.928,0,-56,25.072,-56,56 0,6.627,-5.373,12,-12,12zM12,92;M14.1,108.1c-7.787,0,-14.1,-6.313,-14.1,-14.1 0,-51.915,42.085,-94,94,-94 7.787,0,14.1,6.313,14.1,14.1 0,7.787,-6.313,14.1,-14.1,14.1 -36.34,0,-65.8,29.46,-65.8,65.8 0,7.787,-6.313,14.1,-14.1,14.1zM14.1,108.1;M12,92c-6.627,0,-12,-5.373,-12,-12 0,-44.183,35.817,-80,80,-80 6.627,0,12,5.373,12,12 0,6.627,-5.373,12,-12,12 -30.928,0,-56,25.072,-56,56 0,6.627,-5.373,12,-12,12zM12,92"/>
|
||||
</path>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
<!-- Layer: Path -->
|
||||
<svg x="154" y="118" width="0.01" height="0.01" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="154;180.95;154"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="118;138.65;118"/>
|
||||
<g transform="scale(1 1)">
|
||||
<g transform="rotate(0)">
|
||||
<svg x="-46" y="-46" width="92" height="92" style ="overflow:visible" opacity="1">
|
||||
<animate attributeName="x" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="y" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="-46;-54.05;-46"/>
|
||||
<animate attributeName="width" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<animate attributeName="height" calcMode="spline" dur="2s" fill="freeze" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="92;108.1;92"/>
|
||||
<g clip-path="">
|
||||
<g filter="">
|
||||
<path d="M80,0c6.627,0,12,5.373,12,12 0,44.183,-35.817,80,-80,80 -6.627,0,-12,-5.373,-12,-12 0,-6.627,5.373,-12,12,-12 30.928,0,56,-25.072,56,-56 0,-6.627,5.373,-12,12,-12zM80,0" fill="#0DBD8B" id="path_3" stroke="#00000000" stroke-dasharray="0" stroke-dashoffset="0" stroke-miterlimit="10" stroke-width="0">
|
||||
<animate attributeName="d" calcMode="spline" dur="2s" fill="freeze" href="#path_3" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" keyTimes="0;0.5;1" repeatCount="indefinite" values="M80,0c6.627,0,12,5.373,12,12 0,44.183,-35.817,80,-80,80 -6.627,0,-12,-5.373,-12,-12 0,-6.627,5.373,-12,12,-12 30.928,0,56,-25.072,56,-56 0,-6.627,5.373,-12,12,-12zM80,0;M94,0c7.787,0,14.1,6.313,14.1,14.1 0,51.915,-42.085,94,-94,94 -7.787,0,-14.1,-6.313,-14.1,-14.1 0,-7.787,6.313,-14.1,14.1,-14.1 36.34,0,65.8,-29.46,65.8,-65.8 0,-7.787,6.313,-14.1,14.1,-14.1zM94,0;M80,0c6.627,0,12,5.373,12,12 0,44.183,-35.817,80,-80,80 -6.627,0,-12,-5.373,-12,-12 0,-6.627,5.373,-12,12,-12 30.928,0,56,-25.072,56,-56 0,-6.627,5.373,-12,12,-12zM80,0"/>
|
||||
</path>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="128"
|
||||
height="128"
|
||||
viewBox="0 0 33.866666 33.866668"
|
||||
version="1.1"
|
||||
id="svg920"
|
||||
inkscape:version="1.0.2 (e86c870879, 2021-01-15)"
|
||||
sodipodi:docname="spinner.svg">
|
||||
<defs
|
||||
id="defs914" />
|
||||
<metadata
|
||||
id="metadata917">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1">
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.30000001"
|
||||
d="M 59,95.605469 V 123 c 0,2.77 2.23,5 5,5 2.77,0 5,-2.23 5,-5 V 95.605469 A 31.999998,31.999998 0 0 1 64,96 31.999998,31.999998 0 0 1 59,95.605469 Z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2350" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.7020452"
|
||||
d="M 64,0 C 61.23,0 59,2.2300001 59,5 V 32.394531 A 31.999998,31.999998 0 0 1 64,32 31.999998,31.999998 0 0 1 69,32.394531 V 5 C 69,2.2300001 66.77,0 64,0 Z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2283" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.30000001"
|
||||
d="M 43.867188,88.871094 30.169922,112.5957 c -1.385,2.39889 -0.568812,5.44508 1.830078,6.83008 2.39889,1.385 5.445078,0.56881 6.830078,-1.83008 L 52.527344,93.873047 a 31.999998,31.999998 0 0 1 -8.660156,-5.001953 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2346" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.80019373"
|
||||
d="m 93.150391,7.9121094 c -1.599848,0.111837 -3.114844,0.992881 -3.980469,2.4921876 L 75.472656,34.126953 a 31.999998,31.999998 0 0 1 8.660156,5.001953 L 97.830078,15.404297 C 99.215078,13.005407 98.39889,9.9592187 96,8.5742188 95.100416,8.0548438 94.110299,7.8450072 93.150391,7.9121094 Z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2285" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.30000001"
|
||||
d="M 34.126953,75.474609 10.404297,89.169922 C 8.0054066,90.554922 7.1892188,93.60111 8.5742188,96 c 1.3849999,2.39889 4.4311882,3.215078 6.8300782,1.830078 L 39.128906,84.132812 a 31.999998,31.999998 0 0 1 -5.001953,-8.658203 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2342" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.90226436"
|
||||
d="m 115.44531,29.507812 c -0.95991,-0.0671 -1.95002,0.142735 -2.84961,0.66211 L 88.871094,43.867188 a 31.999998,31.999998 0 0 1 5.001953,8.658203 L 117.5957,38.830078 c 2.39889,-1.385 3.21508,-4.431188 1.83008,-6.830078 -0.86562,-1.499306 -2.38062,-2.38035 -3.98047,-2.492188 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2287" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:1"
|
||||
d="M 95.605469,59 A 31.999998,31.999998 0 0 1 96,64 31.999998,31.999998 0 0 1 95.605469,69 H 123 c 2.77,0 5,-2.23 5,-5 0,-2.77 -2.23,-5 -5,-5 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2338" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.40288368"
|
||||
d="m 5,59 c -2.7699999,0 -5,2.23 -5,5 0,2.77 2.2300001,5 5,5 H 32.394531 A 31.999998,31.999998 0 0 1 32,64 31.999998,31.999998 0 0 1 32.394531,59 Z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2289" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.30000001"
|
||||
d="m 93.873047,75.472656 a 31.999998,31.999998 0 0 1 -5.001953,8.660156 L 112.5957,97.830078 c 2.39889,1.385 5.44508,0.568812 6.83008,-1.830078 1.385,-2.39889 0.56881,-5.445078 -1.83008,-6.830078 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2334" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.49898377"
|
||||
d="M 12.554688,29.507812 C 10.95484,29.61965 9.4398437,30.500694 8.5742188,32 c -1.385,2.39889 -0.5688122,5.445078 1.8300782,6.830078 l 23.722656,13.697266 a 31.999998,31.999998 0 0 1 5.001953,-8.660156 L 15.404297,30.169922 c -0.899584,-0.519375 -1.889701,-0.729212 -2.849609,-0.66211 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2291" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.30000001"
|
||||
d="m 84.132812,88.871094 a 31.999998,31.999998 0 0 1 -8.658203,5.001953 L 89.169922,117.5957 c 1.385,2.39889 4.431188,3.21508 6.830078,1.83008 2.39889,-1.385 3.215078,-4.43119 1.830078,-6.83008 z"
|
||||
transform="scale(0.26458333)"
|
||||
id="path2330" />
|
||||
<path
|
||||
style="stroke-width:0;fill-opacity:0.5998317"
|
||||
d="M 34.849609,7.9121094 C 33.889701,7.8450072 32.899584,8.0548438 32,8.5742188 29.60111,9.9592187 28.784922,13.005407 30.169922,15.404297 l 13.697266,23.724609 a 31.999998,31.999998 0 0 1 8.658203,-5.001953 L 38.830078,10.404297 C 37.964453,8.9049904 36.449457,8.0239464 34.849609,7.9121094 Z"
|
||||
transform="scale(0.26458333)"
|
||||
id="rect2293" />
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 5.1 KiB |
3
res/img/voip/silence.svg
Normal file
3
res/img/voip/silence.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M7.56986 1.82566L4 4.80054L1.5 4.80054C0.671573 4.80054 0 5.47212 0 6.30054V9.70054C0 10.529 0.671573 11.2005 1.5 11.2005L4 11.2005L7.56986 14.1754C8.05836 14.5825 8.8 14.2351 8.8 13.5993L8.8 9.70054V6.30054L8.8 2.40182C8.8 1.76595 8.05836 1.41858 7.56986 1.82566ZM14.1546 2.76877C13.9162 2.46224 13.4745 2.40702 13.1679 2.64543L13.0443 3.6318L13.0446 3.63212L13.0448 3.63238L13.0536 3.64417C13.0623 3.65582 13.0764 3.67498 13.0951 3.7013C13.1325 3.75399 13.1883 3.83518 13.2564 3.94222C13.3929 4.15668 13.5774 4.47271 13.7624 4.86922C14.1345 5.66647 14.4965 6.763 14.4965 8.00044C14.4965 9.23789 14.1345 10.3344 13.7624 11.1317C13.5774 11.5282 13.3929 11.8442 13.2564 12.0587C13.1883 12.1657 13.1325 12.2469 13.0951 12.2996C13.0764 12.3259 13.0623 12.3451 13.0536 12.3567L13.0448 12.3685L13.0446 12.3688L13.0443 12.3691L13.0441 12.3694L13.0438 12.3698L13.0436 12.37C12.8063 12.6765 12.8618 13.1174 13.1679 13.3555C13.4745 13.5939 13.9162 13.5386 14.1546 13.2321L13.5996 12.8004C14.1546 13.2321 14.1548 13.2319 14.1549 13.2317L14.1552 13.2313L14.156 13.2303L14.158 13.2278L14.1636 13.2204L14.1815 13.1966C14.1963 13.1768 14.2166 13.1491 14.2416 13.1138C14.2917 13.0433 14.3609 12.9423 14.4428 12.8136C14.6063 12.5567 14.8218 12.187 15.0368 11.7264C15.4647 10.8093 15.9027 9.50586 15.9027 8.00044C15.9027 6.49503 15.4647 5.19156 15.0368 4.27453C14.8218 3.8139 14.6063 3.44421 14.4428 3.18724C14.3609 3.05857 14.2917 2.95762 14.2416 2.88709C14.2166 2.8518 14.1963 2.82408 14.1815 2.80426L14.1636 2.78048L14.158 2.7731L14.156 2.77055L14.1552 2.76956L14.1549 2.76914C14.1548 2.76895 14.1546 2.76877 13.5996 3.20045L14.1546 2.76877ZM11.7552 5.16879C11.5168 4.86227 11.075 4.80705 10.7685 5.04546C10.4628 5.28321 10.4071 5.72319 10.6432 6.02961L10.6452 6.03231C10.6481 6.03609 10.6535 6.04353 10.6613 6.05445C10.6768 6.07633 10.7014 6.11199 10.732 6.1601C10.7935 6.2567 10.878 6.4013 10.963 6.58353C11.1351 6.95221 11.2971 7.44874 11.2971 8.00047C11.2971 8.5522 11.1351 9.04873 10.963 9.41741C10.878 9.59964 10.7935 9.74424 10.732 9.84084C10.7014 9.88895 10.6768 9.92461 10.6613 9.94648C10.6535 9.95741 10.6481 9.96484 10.6452 9.96863L10.6432 9.97132C10.4071 10.2777 10.4628 10.7177 10.7685 10.9555C11.075 11.1939 11.5168 11.1387 11.7552 10.8321L11.2002 10.4005C11.7552 10.8321 11.7553 10.832 11.7555 10.8318L11.7558 10.8314L11.7564 10.8305L11.758 10.8286L11.7619 10.8234L11.7731 10.8085C11.782 10.7966 11.7937 10.7806 11.8078 10.7607C11.8361 10.721 11.874 10.6656 11.9184 10.5958C12.0069 10.4567 12.1224 10.2584 12.2374 10.0121C12.4653 9.52364 12.7033 8.82017 12.7033 8.00047C12.7033 7.18077 12.4653 6.4773 12.2374 5.98884C12.1224 5.74249 12.0069 5.54424 11.9184 5.40512C11.874 5.33538 11.8361 5.27996 11.8078 5.24023C11.7937 5.22035 11.782 5.20435 11.7731 5.1924L11.7619 5.17752L11.758 5.17238L11.7564 5.17039L11.7558 5.16954L11.7555 5.16916C11.7553 5.16897 11.7552 5.16879 11.2002 5.60047L11.7552 5.16879Z" fill="#8D99A5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
3
res/img/voip/tab-dialpad.svg
Normal file
3
res/img/voip/tab-dialpad.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 19C10.9 19 10 19.9 10 21C10 22.1 10.9 23 12 23C13.1 23 14 22.1 14 21C14 19.9 13.1 19 12 19ZM6 1C4.9 1 4 1.9 4 3C4 4.1 4.9 5 6 5C7.1 5 8 4.1 8 3C8 1.9 7.1 1 6 1ZM6 7C4.9 7 4 7.9 4 9C4 10.1 4.9 11 6 11C7.1 11 8 10.1 8 9C8 7.9 7.1 7 6 7ZM6 13C4.9 13 4 13.9 4 15C4 16.1 4.9 17 6 17C7.1 17 8 16.1 8 15C8 13.9 7.1 13 6 13ZM18 5C19.1 5 20 4.1 20 3C20 1.9 19.1 1 18 1C16.9 1 16 1.9 16 3C16 4.1 16.9 5 18 5ZM12 13C10.9 13 10 13.9 10 15C10 16.1 10.9 17 12 17C13.1 17 14 16.1 14 15C14 13.9 13.1 13 12 13ZM18 13C16.9 13 16 13.9 16 15C16 16.1 16.9 17 18 17C19.1 17 20 16.1 20 15C20 13.9 19.1 13 18 13ZM18 7C16.9 7 16 7.9 16 9C16 10.1 16.9 11 18 11C19.1 11 20 10.1 20 9C20 7.9 19.1 7 18 7ZM12 7C10.9 7 10 7.9 10 9C10 10.1 10.9 11 12 11C13.1 11 14 10.1 14 9C14 7.9 13.1 7 12 7ZM12 1C10.9 1 10 1.9 10 3C10 4.1 10.9 5 12 5C13.1 5 14 4.1 14 3C14 1.9 13.1 1 12 1Z" fill="#8D97A5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 979 B |
7
res/img/voip/tab-userdirectory.svg
Normal file
7
res/img/voip/tab-userdirectory.svg
Normal file
@ -0,0 +1,7 @@
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<mask id="path-1-inside-1" fill="white">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.1502 21.1214C16.3946 22.3074 14.2782 23 12 23C9.52367 23 7.23845 22.1817 5.4 20.8008C2.72821 18.794 1 15.5988 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 15.797 21.0762 19.1446 18.1502 21.1214ZM12 12.55C13.8225 12.55 15.3 10.9494 15.3 8.975C15.3 7.00058 13.8225 5.4 12 5.4C10.1775 5.4 8.7 7.00058 8.7 8.975C8.7 10.9494 10.1775 12.55 12 12.55ZM12 20.8C14.3782 20.8 16.536 19.8566 18.1197 18.3237C17.1403 15.9056 14.7693 14.2 12 14.2C9.23066 14.2 6.85969 15.9056 5.88028 18.3237C7.46399 19.8566 9.62183 20.8 12 20.8Z"/>
|
||||
</mask>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.1502 21.1214C16.3946 22.3074 14.2782 23 12 23C9.52367 23 7.23845 22.1817 5.4 20.8008C2.72821 18.794 1 15.5988 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12C23 15.797 21.0762 19.1446 18.1502 21.1214ZM12 12.55C13.8225 12.55 15.3 10.9494 15.3 8.975C15.3 7.00058 13.8225 5.4 12 5.4C10.1775 5.4 8.7 7.00058 8.7 8.975C8.7 10.9494 10.1775 12.55 12 12.55ZM12 20.8C14.3782 20.8 16.536 19.8566 18.1197 18.3237C17.1403 15.9056 14.7693 14.2 12 14.2C9.23066 14.2 6.85969 15.9056 5.88028 18.3237C7.46399 19.8566 9.62183 20.8 12 20.8Z" fill="#8D97A5"/>
|
||||
<path d="M18.1502 21.1214L18.9339 22.2814L18.1502 21.1214ZM5.4 20.8008L4.55919 21.9202H4.55919L5.4 20.8008ZM18.1197 18.3237L19.0934 19.3296L19.7717 18.6731L19.4173 17.7981L18.1197 18.3237ZM5.88028 18.3237L4.58268 17.7981L4.22829 18.6731L4.90659 19.3296L5.88028 18.3237ZM12 24.4C14.5662 24.4 16.9541 23.619 18.9339 22.2814L17.3665 19.9613C15.835 20.9959 13.9902 21.6 12 21.6V24.4ZM4.55919 21.9202C6.63176 23.477 9.21011 24.4 12 24.4V21.6C9.83723 21.6 7.84514 20.8865 6.24081 19.6814L4.55919 21.9202ZM-0.399998 12C-0.399998 16.0577 1.55052 19.6603 4.55919 21.9202L6.24081 19.6814C3.90591 17.9276 2.4 15.1399 2.4 12H-0.399998ZM12 -0.399998C5.15167 -0.399998 -0.399998 5.15167 -0.399998 12H2.4C2.4 6.69807 6.69807 2.4 12 2.4V-0.399998ZM24.4 12C24.4 5.15167 18.8483 -0.399998 12 -0.399998V2.4C17.3019 2.4 21.6 6.69807 21.6 12H24.4ZM18.9339 22.2814C22.2288 20.0554 24.4 16.2815 24.4 12H21.6C21.6 15.3124 19.9236 18.2337 17.3665 19.9613L18.9339 22.2814ZM13.9 8.975C13.9 10.2838 12.9459 11.15 12 11.15V13.95C14.6991 13.95 16.7 11.615 16.7 8.975H13.9ZM12 6.8C12.9459 6.8 13.9 7.66616 13.9 8.975H16.7C16.7 6.335 14.6991 4 12 4V6.8ZM10.1 8.975C10.1 7.66616 11.0541 6.8 12 6.8V4C9.30086 4 7.3 6.335 7.3 8.975H10.1ZM12 11.15C11.0541 11.15 10.1 10.2838 10.1 8.975H7.3C7.3 11.615 9.30086 13.95 12 13.95V11.15ZM17.146 17.3178C15.8129 18.6081 14.0004 19.4 12 19.4V22.2C14.756 22.2 17.2591 21.1051 19.0934 19.3296L17.146 17.3178ZM12 15.6C14.1797 15.6 16.0494 16.9415 16.8221 18.8493L19.4173 17.7981C18.2312 14.8697 15.359 12.8 12 12.8V15.6ZM7.17788 18.8493C7.95058 16.9415 9.8203 15.6 12 15.6V12.8C8.64102 12.8 5.7688 14.8697 4.58268 17.7981L7.17788 18.8493ZM12 19.4C9.99963 19.4 8.18709 18.6081 6.85397 17.3178L4.90659 19.3296C6.74088 21.1051 9.24402 22.2 12 22.2V19.4Z" fill="#8D97A5" mask="url(#path-1-inside-1)"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
4
res/img/voip/un-silence.svg
Normal file
4
res/img/voip/un-silence.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1.18262 0.960693L14.3815 14.1596" stroke="#8D99A5" stroke-width="1.61751" stroke-miterlimit="10" stroke-linecap="round"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M5.57061 4.20635L5.19539 4.51904H3.58059L10.2419 11.1804V8.87764L5.57061 4.20635ZM10.2419 6.59013V2.15546C10.2419 1.42405 9.38884 1.0245 8.82695 1.49274L6.81834 3.16658L10.2419 6.59013ZM5.19526 11.2479H2.7146C1.76172 11.2479 0.989258 10.4754 0.989258 9.52254V6.24438C0.989258 5.69051 1.25024 5.1976 1.65595 4.88191L10.2419 13.4679V13.6117C10.2419 14.3431 9.38884 14.7426 8.82695 14.2744L5.19526 11.248V11.2479Z" fill="#8D99A5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 713 B |
@ -118,6 +118,7 @@ $voipcall-plinth-color: #394049;
|
||||
// ********************
|
||||
|
||||
$theme-button-bg-color: #e3e8f0;
|
||||
$dialpad-button-bg-color: #394049;
|
||||
|
||||
$roomlist-button-bg-color: rgba(141, 151, 165, 0.2); // Buttons include the filter box, explore button, and sublist buttons
|
||||
$roomlist-filter-active-bg-color: $bg-color;
|
||||
@ -212,8 +213,6 @@ $message-body-panel-icon-fg-color: #21262C; // "Separator"
|
||||
$message-body-panel-icon-bg-color: $tertiary-fg-color;
|
||||
|
||||
$voice-record-stop-border-color: $quaternary-fg-color;
|
||||
$voice-record-waveform-bg-color: $message-body-panel-bg-color;
|
||||
$voice-record-waveform-fg-color: $message-body-panel-fg-color;
|
||||
$voice-record-waveform-incomplete-fg-color: $quaternary-fg-color;
|
||||
$voice-record-icon-color: $quaternary-fg-color;
|
||||
$voice-playback-button-bg-color: $message-body-panel-icon-bg-color;
|
||||
@ -273,24 +272,7 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
|
||||
}
|
||||
|
||||
// markdown overrides:
|
||||
.mx_EventTile_content .markdown-body pre:hover {
|
||||
border-color: #808080 !important; // inverted due to rules below
|
||||
scrollbar-color: rgba(0, 0, 0, 0.2) transparent; // copied from light theme due to inversion below
|
||||
// the code above works only in Firefox, this is for other browsers
|
||||
// see https://developer.mozilla.org/en-US/docs/Web/CSS/scrollbar-color
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: rgba(0, 0, 0, 0.2); // copied from light theme due to inversion below
|
||||
}
|
||||
}
|
||||
.mx_EventTile_content .markdown-body {
|
||||
pre, code {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
pre code {
|
||||
filter: none;
|
||||
}
|
||||
|
||||
table {
|
||||
tr {
|
||||
background-color: #000000;
|
||||
@ -300,18 +282,9 @@ $composer-shadow-color: rgba(0, 0, 0, 0.28);
|
||||
background-color: #080808;
|
||||
}
|
||||
}
|
||||
|
||||
blockquote {
|
||||
color: #919191;
|
||||
}
|
||||
}
|
||||
|
||||
// diff highlight colors
|
||||
// intentionally swapped to avoid inversion
|
||||
.hljs-addition {
|
||||
background: #fdd;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
background: #dfd;
|
||||
// highlight.js overrides
|
||||
.hljs-tag {
|
||||
color: inherit; // Without this they'd be weirdly blue which doesn't match the theme
|
||||
}
|
||||
|
||||
@ -9,3 +9,4 @@
|
||||
@import "_dark.scss";
|
||||
@import "../../light/css/_mods.scss";
|
||||
@import "../../../../res/css/_components.scss";
|
||||
@import url("highlight.js/styles/atom-one-dark.css");
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user