Commit Graph

343 Commits (fee8677ec566c835fb55a94d5e60a4c037896e65)

Author SHA1 Message Date
Germain 53ae7817bc
Merge pull request #6291 from matrix-org/gsouquet/message-bubbles-4635 2021-07-20 10:22:41 +01:00
Germain Souquet 06c9a060b4 Merge branch 'develop' into gsouquet/message-bubbles-4635 2021-07-20 10:16:21 +02:00
Šimon Brandner 5db20d9431
Fix placeholder centering
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-20 08:54:32 +02:00
Travis Ralston 31d7de628e Small tweaks 2021-07-16 16:04:23 -06:00
Travis Ralston b57fff5739 Update visual style and sandbox properly 2021-07-16 15:55:07 -06:00
Šimon Brandner 16ed5c6645
Merge remote-tracking branch 'upstream/develop' into feature/call-event-tile
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-16 21:43:33 +02:00
Šimon Brandner 68640a4dbd
Fix icon postion
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-15 15:16:05 +02:00
Šimon Brandner f26c75bdcc
Use margin instead of padding
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-14 10:23:10 +02:00
Šimon Brandner 18355599e8
Fix senderProfile getting cutoff
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-14 10:07:41 +02:00
Šimon Brandner 866a11d7e3
Fix image alignment issues
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-13 11:49:49 +02:00
Šimon Brandner 722c360de0
Use the correct color for silence button
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-08 14:42:05 +02:00
Šimon Brandner 2615ea7f3f
Add icons to buttons
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-08 14:35:06 +02:00
Šimon Brandner 9ec3d93402
Better handling of call types
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-08 14:19:02 +02:00
Šimon Brandner 6f1fc3fc7e
Fix call button spacing issues
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-08 13:43:59 +02:00
Germain Souquet 10bdb3cefa Merge branch 'develop' into gsouquet/message-bubbles-4635 2021-07-07 13:07:43 +02:00
Šimon Brandner e582b1559b
Fix redacted messages (again)
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-02 15:09:02 +02:00
Šimon Brandner 0fe10e4502
Fix replies to deleted messages
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-02 14:22:46 +02:00
Šimon Brandner b014763cd2
Merge remote-tracking branch 'upstream/develop' into feature/call-event-tile
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-07-02 13:14:14 +02:00
Tulir Asokan 5240209529 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-07-02 12:39:51 +03:00
Michael Telatynski 1f337b28ac Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into travis/blurhash
 Conflicts:
	src/ContentMessages.tsx
	src/components/structures/UploadBar.tsx
	src/components/views/messages/MImageBody.js
	src/components/views/messages/MStickerBody.js
	src/components/views/messages/MVideoBody.tsx
2021-07-01 20:48:34 +01:00
David Baker 5e3c8fae5c put this just on the buttons 2021-07-01 15:22:44 +01:00
David Baker 66d95ed7b2 Fix button styling in verification bubbles 2021-07-01 14:51:20 +01:00
Travis Ralston 12d7be2b6a Merge branch 'develop' into travis/new-audio 2021-06-30 13:25:41 -06:00
Germain Souquet d9eec1c03b Merge branch 'develop' into gsouquet/message-bubbles-4635 2021-06-30 08:58:20 +01:00
Germain Souquet fdced3da1b Remove reminescent references to the tinter 2021-06-30 08:09:55 +01:00
Travis Ralston 964a97d59e Merge remote-tracking branch 'origin/develop' into travis/new-audio 2021-06-28 20:52:44 -06:00
Travis Ralston 9c752680ba Tile styling and early behaviour 2021-06-24 13:56:11 -06:00
Travis Ralston ffef2e58cb Unify audio message types to new media body 2021-06-24 11:38:35 -06:00
Travis Ralston 9f2eba4351 Fix class identifiers 2021-06-24 11:38:35 -06:00
Šimon Brandner 0fe6a28853
Merge remote-tracking branch 'upstream/develop' into feature/pinned-click 2021-06-24 10:57:09 +02:00
Šimon Brandner 8d47ea63c2
Make pinned message text clickable
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-24 10:41:55 +02:00
Michael Telatynski 5d93216c94 Decrease e2e shield fill mask size so that it doesn't overlap 2021-06-23 16:10:47 +01:00
Šimon Brandner 202cb0f5d8
Fix styling of buttons
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-21 17:05:36 +02:00
Šimon Brandner 401fe1d05b
Add call silencing to CallEvent
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-19 20:03:09 +02:00
Germain Souquet 6271c5c3d8 first iteration for message bubble layout 2021-06-18 18:59:22 +01:00
Šimon Brandner 62de75ab00
Increase height
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-18 16:19:57 +02:00
Šimon Brandner 9b6195317e
Improve padding
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-18 16:14:54 +02:00
Šimon Brandner a781d6f128
Adjust padding and line-height a bit
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-17 18:13:52 +02:00
Šimon Brandner 512c054656
Add call type icon
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-17 17:55:18 +02:00
Šimon Brandner 02e6559330
Set text color to secondary-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-17 17:04:56 +02:00
Šimon Brandner 7b6c3aec63
Change some styling to better match the designs
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-17 16:33:00 +02:00
Šimon Brandner 949532c297
Merge remote-tracking branch 'upstream/develop' into feature/call-event-tile 2021-06-17 15:53:25 +02:00
Tulir Asokan cdd2773aa6 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-06-15 17:37:49 +03:00
Michael Telatynski 660a849cdd Merge branch 'develop' of github.com:matrix-org/matrix-react-sdk into travis/blurhash
 Conflicts:
	package.json
	src/ContentMessages.tsx
	yarn.lock
2021-06-15 12:58:29 +01:00
Šimon Brandner 8174973cfe
Use the same styling as for mx_TextualEvent
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-10 15:31:27 +02:00
Šimon Brandner fccd71f82e
Update styling based on review
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-09 06:23:51 +02:00
Šimon Brandner 025148d9fc
Merge branch 'develop' into show-username
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-07 19:37:22 +02:00
Tulir Asokan 059241b5cc Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-06-07 19:26:12 +03:00
Šimon Brandner 70a5715b3d
Support hangup reasons
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-01 14:46:41 +02:00
Šimon Brandner 0785997983
Handle missed calls
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-01 11:28:45 +02:00
Šimon Brandner 86402e9788
Add some styling
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-01 10:03:23 +02:00
Šimon Brandner 5e4a10ab84
Reorganize HTML
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-06-01 07:55:55 +02:00
Šimon Brandner f94230c292
Fix css
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-05-30 19:44:17 +02:00
Šimon Brandner 5e8df03724
Fix styling a bit
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-05-30 19:44:17 +02:00
Šimon Brandner 4ae92d8adc
Hook up TimelineCallEventStore and add Avatar
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-05-30 19:44:17 +02:00
Šimon Brandner cd67d50a85
Add basic CallEvent styling
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-05-30 19:44:17 +02:00
Nique Woodhouse 153d0ae66d
Merge pull request #6066 from matrix-org/niquewoodhouse-message-action-bar-refine-ui
Improve styling of the message action bar
2021-05-24 13:30:27 +01:00
Michael Telatynski 3f9b6caacd fix missing rounded corners on blurhash placeholder 2021-05-21 21:46:18 +01:00
Nique Woodhouse 8d072cedff Update _MessageActionBar.scss
Correct error on css hover for message action button background colour change
2021-05-19 12:11:24 +01:00
Nique Woodhouse 5daca41bfb Update _MessageActionBar.scss
Increase size of buttons
2021-05-19 11:17:34 +01:00
Nique Woodhouse 8a3db3b40a Update _MessageActionBar.scss
Refine UI of message action bar to increase usability and focus on bar content.
2021-05-19 10:25:54 +01:00
Michael Telatynski f0a0d7f998 Fix add reactions prompt button jumping timeline if font set lower than default 2021-05-17 10:01:24 +01:00
Michael Telatynski 76afc1100a Convert to Typescript and move from ClientPeg to Context 2021-05-13 14:13:00 +01:00
Michael Telatynski 87ae47bd61 tweak reactions row some more, third try lucky 2021-05-13 13:59:10 +01:00
Michael Telatynski 36633ec025 Tweak alignment of reactions row, move add reaction to right and only show on hover 2021-05-13 13:32:38 +01:00
Michael Telatynski b5fa4d88bf Add extra add reactions button to encourage more diverse reactions to content 2021-05-13 10:56:51 +01:00
Michael Telatynski 3af0138e9d Update emoji icons to new style 2021-05-13 10:28:35 +01:00
Tulir Asokan cc919452b5 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-05-07 00:07:51 +03:00
Travis Ralston b0cb996cac Update visual style of plain files in the timeline 2021-05-04 21:13:37 -06:00
Travis Ralston 3f4ee9742a Simple rendering of voice messages in the timeline
Fixes https://github.com/vector-im/element-web/issues/17138
2021-05-03 11:41:14 -06:00
Tulir Asokan 09f9916916 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-05-01 15:37:32 +03:00
Jaiwanth f766f985e4 Change cursor to not-allowed 2021-04-30 08:25:58 +05:30
Travis Ralston c5dd6b4dfb Update action bar to incorporate sending states
This moves most of them out of the context menu.
2021-04-21 16:24:17 -06:00
Šimon Brandner 9658a760c8
Use timestamp color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-04-21 17:41:21 +02:00
Šimon Brandner eee1294374
Make both have the same baseline
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-04-21 17:37:25 +02:00
Šimon Brandner faca498523
Don't use gap
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-04-20 11:12:16 +02:00
Šimon Brandner 61a260cd40
Format mxid 2021-04-18 20:02:22 +02:00
Tulir Asokan 99717db762 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-03-19 21:58:30 +02:00
Tulir Asokan 8c8b46b984 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-03-12 14:18:12 +02:00
Travis Ralston a7debdd946 Fix tinting for download icon
As shown in https://github.com/vector-im/element-web/issues/16546
2021-03-10 12:32:18 -07:00
Travis Ralston 5d6e3d5711 UI refresh for uploaded files
Fixes https://github.com/vector-im/element-web/issues/16557
Fixes https://github.com/vector-im/element-web/issues/9482 (technically)

There's two changes in this:
1. The actual file body in the timeline now has a placeholder thing.
2. We're intentionally dropping all the "Travis uploaded a file" sender profile states.
2021-03-04 20:07:48 -07:00
J. Ryan Stinnett 3db6a45010 Revert "Merge pull request #5637 from williamkray/wreck/clean-thumbnail-changes"
This reverts commit 5c1b38a48c, reversing
changes made to ec4a39a694.
2021-02-23 12:03:08 +00:00
Tulir Asokan dfcf701449 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2021-02-19 21:47:10 +02:00
William Kray e72a7567f7 drop video preview max-height to 300px 2021-02-08 09:25:08 -08:00
Šimon Brandner 84eba59afa
Merge branch 'develop' into improve-codeblock 2021-02-08 15:26:50 +01:00
Šimon Brandner cdb0d1c12e
Move and use icons from widget dir
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-02-08 15:22:10 +01:00
Šimon Brandner eee9cf153b
Fix trash alignment
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-02-03 08:15:59 +01:00
Michael Telatynski 44649ca372
Merge pull request #5333 from resynth1943/add-border-radius-for-video
Add border-radius for video
2020-11-19 11:00:07 +00:00
Michael Telatynski 602232a524
Update res/css/views/messages/_CreateEvent.scss
Co-authored-by: Travis Ralston <travpc@gmail.com>
2020-11-05 16:08:36 +00:00
Michael Telatynski 81f1e1d8d7 delint 2020-11-05 15:54:21 +00:00
Michael Telatynski 664079a127 Use MiniAvatarUploader for the new NewRoomIntro component 2020-11-05 15:50:42 +00:00
Michael Telatynski af71b0735d Change icon for the Create Event bubble tile 2020-11-04 17:24:03 +00:00
Michael Telatynski ff25a9b45d Consolidate all EventTile bubble stuff into its own component and use it for the room continuation plinth 2020-11-04 17:06:38 +00:00
Resynth 091143db52 Add border-radius for video
Images have a rounded border, so we may as well add it to videos.
Works fine in Chrome, and in other spec-compliant browsers.

Signed-off-by: Resynth <resynth1943@tutanota.com>
2020-10-18 22:40:19 +01:00
Tulir Asokan 2bb7b6535f Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2020-10-02 17:28:45 +03:00
Travis Ralston b4af0140d4 Render Jitsi widget state events in a more obvious way
A clear improvement to this would be to include join/leave buttons in the tiles, however this is currently deferred.
2020-09-16 12:38:47 -06:00
Tulir Asokan 75a0178dad Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2020-09-04 12:41:38 +03:00
Michael Telatynski 6e2a26443d Fix corner rounding on images not always affecting right side 2020-08-17 10:55:54 +01:00
J. Ryan Stinnett 3ece2dd21d Fix action bar safe area regression
The action bar was recently moved, but the safe area was not, which left a gap
between the event and the action bar, making it quite easy to trigger hover on a
different event instead of reaching the action bar.

Fixes https://github.com/vector-im/element-web/issues/14953
Regressed by https://github.com/matrix-org/matrix-react-sdk/pull/5056
2020-08-13 19:24:11 +01:00
Tulir Asokan db5121aeca Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2020-08-03 16:49:43 +03:00
Jorik Schellekens 8460175389 Move actions above tile 2020-07-27 16:21:44 +01:00
Jorik Schellekens 1d6c2b786e File panel spacing and corner rounding 2020-07-27 16:21:41 +01:00
Michael Telatynski b02175793e Use OpenType tabular numbers in timestamps
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-23 14:52:01 +01:00
Michael Telatynski ee8d885e70
Merge pull request #5020 from matrix-org/t3chguy/fix/14649
Update crypto event icon to match rest of app styling
2020-07-20 15:21:03 +01:00
Michael Telatynski ce398c0b34
Merge pull request #5019 from matrix-org/t3chguy/fix/14650
Fix Reactions Row Button vertical misalignment due to forced height
2020-07-20 15:20:14 +01:00
Michael Telatynski dfed3342b6 Fix white infill and verified/warning icons too
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-20 14:09:16 +01:00
Michael Telatynski 519ebdb67a Update crypto event icon to match rest of app styling
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-20 14:05:07 +01:00
Michael Telatynski 80c65b97a8 Fix Reactions Row Button vertical misalignment due to forced height
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-20 11:17:09 +01:00
Michael Telatynski e9633b2e3b Use mouseleave instead of mouseout for hover events. Fix tooltip flicker
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-18 12:01:51 +01:00
Michael Telatynski d5f2d43429 Improve Tooltip font/layout consistency
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-16 15:15:00 +01:00
Bruno Windels 8fd9dbf1d8 moar icon changes 2020-07-06 18:28:54 +02:00
Tulir Asokan 4e5680de85 Merge remote-tracking branch 'upstream/develop' into compact-reply-rendering 2020-05-25 19:21:19 +03:00
Michael Telatynski 004f75f289 Rename `trash (custom).svg` as electron doesn't like serving files with spaces
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-05-12 16:16:47 +01:00
Michael Telatynski 6ff093f5a3 Bring back UnknownBody for UISIs
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-05-08 19:15:59 +01:00
Michael Telatynski 4d6cd3c050 Update padding-left to 20px as per Nad's iteration
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-05-07 12:50:04 +01:00
Michael Telatynski d3b0e008c1 first draft of Redaction ELS
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-04-24 15:39:23 +01:00
Michael Telatynski e16f511527 Redesign redactions
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-04-24 15:07:39 +01:00
Michael Telatynski 8d3119ddb4
Merge pull request #4396 from matrix-org/t3chguy/fix_MVideoBody_FilePanel
Fix width of MVideoBody in FilePanel
2020-04-14 15:02:28 +01:00
Michael Telatynski a7d95d396e fix copyright
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-04-14 14:46:04 +01:00
Michael Telatynski 3e057070fd Fix width of MVideoBody in FilePanel
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-04-12 00:56:21 +01:00
Michael Telatynski 71b4aab5dc Fix emoji tooltip flickering because onMouseOut&onMouseOver fired when moving between children
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-04-12 00:12:58 +01:00
Tulir Asokan b554d59ed1 Prevent reply thumbnail image from overflowing 2020-04-10 17:05:29 +03:00
Tulir Asokan e7ad9b82e0 Fix stylelint issue and update header 2020-04-10 16:27:39 +03:00
Tulir Asokan 25af26323c Make image reply rendering even more compact 2020-04-10 15:45:59 +03:00
Jorik Schellekens 6cf9166c4a Use variables for the rem values.
It's become obvious that these random floating points everywhere
are unwieldy. Now they're all in one place with some fairly logical
variable names which will help out in design->implementation phase.
2020-03-31 15:26:23 +01:00
Jorik Schellekens da34e6241d Make all 'font-size's and 'line-height's rem
Font size of the whole app would ideally be controlled by a single
value. This value is currently hard coded using the :root CSS selector.
It is the intention to make this value configurable within riot. In the
interim all font-sizes have been converted to rem by the simple process
of regex. Replacing px values with their equivalent rem values assuming
a font size of 15px and then rounded to three decimal places, which was
the base at the time of this transformation.

I'm expecting another commit cleaning up rem values but I thought it
best to leave that to review.

This commit doesn't address any scaling issues. I thought it better to
land this unwieldy, mechanical, invisible change before the others
otherwise the pr would be impossible to review thoroughly.
2020-03-30 18:23:46 +01:00
David Baker 39e9bffe1f Make encryption events into bubble-style tiles
Factors out the verification tile stuff into encryption event
styles so we can reuse them betwen all the encryption event tiles.
Also makes the event list summary stuff even more gnarly by
putting the encryption event tile above the group. We really need
to refactor that. :/

Fixes https://github.com/vector-im/riot-web/issues/12006
2020-01-30 20:03:26 +00:00
Bruno Windels 309633181d use FormButton in verification request tile too and dedupe styles 2019-11-22 16:32:50 +01:00
Bruno Windels 92292003c8 make shield on verification request scale correctly
by not overriding `mask-size` using `mask` for `mask-image`
2019-11-19 12:51:02 +01:00
Bruno Windels e3f7fe51dc use normal shield for verification requests 2019-11-15 16:14:18 +01:00
Travis Ralston 6d0b388fa2
Merge branch 'develop' into travis/mjolnir 2019-11-12 10:00:01 -07:00
Bruno Windels 0d2f9c4215 add verification request tile + styling 2019-11-07 19:54:56 +01:00
Travis Ralston 3c45a39caa Appease the other linter 2019-10-31 16:30:51 -06:00
Travis Ralston 11068d189c Hide messages blocked by ban lists 2019-10-31 16:19:42 -06:00
Tulir Asokan 497b779334 Add full emoji picker for reactions
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-14 00:32:11 +03:00
Travis Ralston 0491b742c2 Use a mask instead of an img for "Show image" eye
See https://github.com/matrix-org/matrix-react-sdk/pull/3492#pullrequestreview-296223646
2019-10-02 12:52:07 -06:00
Travis Ralston 4b0596b6b7 Apply lipstick to hidden image design 2019-10-01 17:00:01 -06:00
Travis Ralston 59b29e4a7f Add an option to hide image previews
Applies to images, stickers, and URL previews.

Fixes https://github.com/vector-im/riot-web/issues/10735
2019-09-27 21:08:31 -06:00
J. Ryan Stinnett fc8cdc5661 Improve interactive tooltip safe mousing area
This adds a more complex trapezoidal safe area between the button that triggers
the tooltip and the tooltip itself. It should be easier to move from the button
into the tooltip without accidentally closing it.

Fixes https://github.com/vector-im/riot-web/issues/10185
2019-07-17 14:11:27 +01:00
J. Ryan Stinnett 58a75949c3 Add a previous event safe area around action bar
This adds a previous event safe area so that you can't accidentally hover the
previous event while trying to mouse into the action bar or from the react
button to its tooltip.

Part of https://github.com/vector-im/riot-web/issues/10185
Fixes https://github.com/vector-im/riot-web/issues/9650
2019-07-17 10:10:08 +01:00
J. Ryan Stinnett 38d6953bf6 Manually fix remaining stylelint issues 2019-07-10 16:56:40 +01:00
J. Ryan Stinnett dd2079bffc Auto-fix stylelint issues
These `stylelint` issues were autofixed by the tool itself and look sane to me.
2019-07-10 16:56:40 +01:00
Bruno Windels 7a482461dd
Merge pull request #3180 from matrix-org/bwindels/history-actions
Edit history actions
2019-07-08 08:19:27 +00:00
J. Ryan Stinnett eb0e1eade4 Clamp reaction content width to at most 100px
Part of https://github.com/vector-im/riot-web/issues/10256
2019-07-05 16:18:16 +01:00
Bruno Windels 375976575b add redact button 2019-07-04 11:07:22 +02:00
J. Ryan Stinnett 59b4a3398d Limit reactions row on initial display
This limits the reactions row below messages to initially show at most 8 keys.
For those messages with more than that, a "Show all" option appears to reveal
all the keys.

Fixes https://github.com/vector-im/riot-web/issues/9570
2019-06-27 13:17:23 +01:00
J. Ryan Stinnett e287362a8b Reaction buttons should use pointer cursor 2019-06-27 11:19:36 +01:00
Bruno Windels c9aa7efe54 don't require EventTile for default timestamp style 2019-06-26 11:59:56 +02:00
J. Ryan Stinnett 93384f91f5 Show reaction title and shortcode on hover
This shows the title and shortcode for the hovered reaction at the bottom of the
tooltip. If nothing is hovered, a blank space is shown for now, but will
eventually become a link to a full emoji picker in future work.

Part of https://github.com/vector-im/riot-web/issues/9753
2019-06-25 18:15:03 +01:00
J. Ryan Stinnett c1821fabd3 Remove toggling reaction dimensions
This removes the v1 Reactions UX which only allowed you to choose only one emoji
out of each pair. It is replaced by a different UX inside a tooltip and without
these constraints.

Part of https://github.com/vector-im/riot-web/issues/9753
2019-06-25 16:23:31 +01:00
J. Ryan Stinnett 088bbbfb91 Scale up reaction buttons on hover 2019-06-25 16:23:31 +01:00
J. Ryan Stinnett c6f2bb4ba7 Arrange buttons in a grid 2019-06-25 16:23:30 +01:00
J. Ryan Stinnett fd2723585f Add quick reaction buttons in tooltip
This adds the set of quick reactions as buttons in a new tooltip accessed via
the react action in the message action bar.

Part of https://github.com/vector-im/riot-web/issues/9753
2019-06-25 16:23:13 +01:00
J. Ryan Stinnett 8926992feb Add react button to action bar
This adds a (temporarily non-functional) react button to the action bar.

Part of https://github.com/vector-im/riot-web/issues/9753
2019-06-25 15:12:30 +01:00
J. Ryan Stinnett 5280d8469b Add comment 2019-06-12 17:23:11 +01:00
J. Ryan Stinnett 4d8809882f Raise action bar above read marker
Use `z-index` to ensure the action bar appears above over things, like the read
marker.

Fixes https://github.com/vector-im/riot-web/issues/9619
2019-06-12 14:41:49 +01:00
J. Ryan Stinnett 3320fd9929 Remove highlight from reactions
This explicitly sets `color` for the reactions row to ensure it's always the fg
colour, even if the event is highlighted.

Fixes https://github.com/vector-im/riot-web/issues/9697
2019-06-07 15:57:34 +01:00
J. Ryan Stinnett 3a405701a3 Debug: Show all events 2019-05-17 16:34:01 +01:00
J. Ryan Stinnett 43c9e6d942 Reactions / editing tooltip tweaks 2019-05-17 15:10:35 +01:00
J. Ryan Stinnett 059988ff5c Extract tooltip styling to a shared class
We want to use the same styling with edited tooltip as well, so this extracts
the shared bits.
2019-05-17 12:11:01 +01:00
J. Ryan Stinnett 3da1f73ea4 Add a basic tooltip showing who reacted
This adds a first attempt at tooltip showing who reacted to a message. It
doesn't limit senders or position the tooltip nicely, but the info is there at
least.

Part of https://github.com/vector-im/riot-web/issues/9722
2019-05-17 12:11:01 +01:00
Bruno Windels edc100163f
Merge pull request #2952 from matrix-org/bwindels/message-edit-editor
Initial support for editing messages
2019-05-15 09:23:01 +00:00
J. Ryan Stinnett a2e0dc2f7e Tweak message action bar position
This moves the message action bar up slightly to avoid covering message text.
2019-05-14 16:52:02 +01:00
Bruno Windels 6599d605cd wire up editor component (somewhat hacky) 2019-05-14 15:38:16 +01:00
J. Ryan Stinnett 6a3708d51b Disable select for reaction buttons 2019-05-10 18:09:32 +01:00
J. Ryan Stinnett 576241236c Extract `ReactionDimension` out of `MessageActionBar`
The reactions bits were cluttering up `MessageActionBar` so they have now been
extracted to a separate component.
2019-05-08 13:53:41 +01:00
J. Ryan Stinnett 87f737b8a3 Increment an existing reaction
This allows you to increment an existing reaction below a message by clicking on
it.

At the moment, this is not linked to the action bar, so they each are using
local state. We'll likely want to add some mechanism so that we can local echo
to both of these UI areas at the same time, but that can be done separately.

Fixes https://github.com/vector-im/riot-web/issues/9486
2019-05-02 12:05:17 +01:00
J. Ryan Stinnett 15c5893278 Display existing reactions below the message
This displays the existing reactions a message has from all users below the
message.

Since we don't currently have an API to actually get these events yet,
adds a temporary hook that looks for a specific message to inject some sample
data. This helps build out the UI for now and can be removed once it exists.

Fixes https://github.com/vector-im/riot-web/issues/9573
2019-05-02 12:05:17 +01:00
J. Ryan Stinnett 784599d9e9 Add primary reactions to action bar
This adds the primary reactions to the action bar. They act as toggles where you
can only select one from each group at a time.

Note that currently we aren't actually sending the reaction at all. That's left
for a separate task.

Fixes https://github.com/vector-im/riot-web/issues/9576
2019-04-30 18:09:10 +01:00
J. Ryan Stinnett 4b50d2a2bf Update action bar colors for dark theme
In addition, this also adjusts the event hover colors to match the palette.

Fixes https://github.com/vector-im/riot-web/issues/9591
2019-04-30 17:42:17 +01:00
J. Ryan Stinnett 739c8c0314 Promote reply button up to message action bar
This moves the reply action out of the existing options menu and up to the
message action bar for easier access.
2019-04-29 15:53:03 +01:00
J. Ryan Stinnett 8ef9fe951d Update styling of message action bar for multiple buttons
This applies the new design for multiple buttons in the message action bar,
paving the way for more things to appear here.

In addition, this changes the existing options button to use the three vertical
dots icon. Some theme colors are also tweaked to align with what they were meant
to be from the unified palette.
2019-04-29 15:20:51 +01:00
J. Ryan Stinnett ed8bbc7082 Extract message options button to action bar
This adds a new action bar component to hold multiple per-message actions. This
existing options button has moved to this new component, and is currently the
only action.
2019-04-29 15:20:50 +01:00
Bruno Windels eeaa7143ac move name coloring out of sender profile
so we can reuse it in room preview bar
2019-04-17 10:21:30 +02:00
Travis Ralston 8a6ae6b48e Use a mask for the continuation icon
Fixes https://github.com/vector-im/riot-web/issues/7990
2019-03-01 15:59:19 -07:00
David Baker 54898a6c35 Fix black-on-black GIF icon for stickers
Text colour ended up being the link colour on images because the
whole image is in an `a`, but stickers are not so it got the default
font colour, which might be black. Define an explicit colour.

Also set pointer-events: none so you can hover over the gif icon
too (I managed to make the message panel small which made the icon
cover most the image, so this prevented the gif from animating
at all).

Fixes https://github.com/vector-im/riot-web/issues/8004
2019-01-07 13:49:01 +00:00
Bruno Windels 67e0030ccd Merge branch 'develop' into experimental 2018-11-26 13:10:29 +01:00
Maxwell Kepler 5d35ce9449 Changed letter case. 2018-10-24 19:06:48 +01:00
Bruno Windels b7ab207778 move sendername colors to theme 2018-10-23 15:48:44 +02:00
Bruno Windels f2efbc15f4 apply color categories to sender profile name 2018-10-23 10:49:44 +02:00
Bruno Windels 2a264f36b7 style date separator 2018-10-23 10:25:04 +02:00
Maxwell Kepler 54f9231582 Added badge to GIFs (https://github.com/vector-im/riot-web/issues/7344) 2018-10-22 20:57:58 +01:00
David Baker cd4b520574 Add image dimensions
To avoid popping when the image loads & make sure the SVG appears
the right size
2018-08-21 17:52:13 +01:00
David Baker ab10b5493b Support room creation events
For https://github.com/vector-im/riot-web/issues/7164
2018-08-20 16:20:59 +01:00
Luke Barnard 7029e9ac74
Merge pull request #1912 from matrix-org/luke/kill-mimage-fixupheight
Implement slightly magical CSS soln. to thumbnail sizing
2018-06-14 11:17:15 +01:00
Michael Telatynski a257dc27c5
move css rule to be more generic; remove overriden rule
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2018-06-13 19:08:24 +01:00
Luke Barnard 836dc8b0ef Factor out all shared logic between MStickerBody and MImageBody
The benefits of this:
 - One code path for determining spinner/placeholder and it's position
   for loading images/stickers. This includes spinner used in e2e
   decryption of images.
 - Very small definition for MStickerBody, only overriding the minimal
   differences is has from MImageBody.

The disadvantages:
 - Slightly more complicated MImageBody, but hopefully not less
   readable.
2018-05-21 16:59:13 +01:00
Luke Barnard 015093b371 Move inline style to stylesheet 2018-05-18 11:34:41 +01:00
Luke Barnard 6699c4faed Spelling/grammar 2018-05-18 11:29:30 +01:00
Luke Barnard 7e7e2a7473 Add more comments to explain thumbnail sizing 2018-05-18 10:27:22 +01:00
Luke Barnard b28ed6075b Implement slightly hacky CSS soln. to thumbnail sizing
As the slightly nicer alternative to fixupHeight being applied once
we actually have a timelineWidth.

The niceness comes from not needing timelineWidth, which means we can
implement at render time with CSS. (Despite still calculating aspect
ratios when we render.)
2018-05-17 18:15:34 +01:00
Matthew Hodgson 45c0c0eddd add CSS destroyed by stickerpacks
fixing mangling from 9fc7435ea2 (diff-be2f1d72c9704840ceddf019c825e825)
and 38efebb8d3 (diff-be2f1d72c9704840ceddf019c825e825)

also fixes https://github.com/vector-im/riot-web/issues/6492
2018-04-29 04:50:44 +01:00
Matthew Hodgson 79d3cca6e9 move components' CSS to be in the same repo as their JS 2018-04-12 00:23:58 +01:00