Commit Graph

90 Commits (82537562768f492550584e46dc2e9b1a858adc2f)

Author SHA1 Message Date
Travis Ralston 17dba01993 Fix style lint 2020-07-15 03:49:59 -06:00
Bruno Windels 7ff3e6a26d bring back padding between show more and resize handle 2020-07-14 15:09:53 +02:00
Bruno Windels b6a5fa38e1 Merge branch 'element' into 'nadonomy/ui-tweaks-part-deux'
# Conflicts:
#   res/css/views/rooms/_RoomSublist2.scss
2020-07-14 12:40:52 +00:00
Bruno Windels 4fe4788c2e Merge branch 'develop' into element 2020-07-14 14:31:31 +02:00
J. Ryan Stinnett a09f773edd Tweak sticky header hiding to avoid pop
When transitioning between sublists, there can be a visibly observable jump in
the positioning of list items when the header container is restored to normal
size outside of sticky mode.

To avoid this problem, this leaves all headers at normal size. This creates a
new issue of a permanent gap at the top of the list for the first header, but
this can be solved by always hiding (since it can only ever appear stuck to
top).

Fixes https://github.com/vector-im/riot-web/issues/14429
2020-07-14 12:16:17 +01:00
Nad Chishtie d0d61e7e3c Improve legibility of room headers 2020-07-14 00:06:12 +01:00
Nad Chishtie 9007653ec6 Make room clipping list mask softer 2020-07-13 21:52:52 +01:00
Michael Telatynski 69929134c5 add spacing between sublists of 4px
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-13 20:40:42 +01:00
Michael Telatynski 4244c67aca Fix even spacing between sticky and non-sticky headers
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-13 20:29:08 +01:00
Nad Chishtie dec377a448 Temporarily apply Joriks CSS fix 2020-07-13 20:15:09 +01:00
Jorik Schellekens c9e231c3eb Add fad 2020-07-13 19:03:31 +01:00
J. Ryan Stinnett 995a7879a1 Merge remote-tracking branch 'origin/develop' into element 2020-07-13 18:49:55 +01:00
Travis Ralston bdb641279a Merge branch 'develop' into travis/room-list/enable 2020-07-10 11:11:25 -06:00
Bruno Windels 952200f031 Merge branch 'develop' into element 2020-07-10 19:04:45 +02:00
Travis Ralston 477472c178 Merge branch 'develop' into travis/room-list/showmore2 2020-07-10 10:57:17 -06:00
Bruno Windels 85ac256231 cleanup 2020-07-10 18:40:09 +02:00
Bruno Windels 725b7f8950 make show more button a bit less tall 2020-07-10 18:30:52 +02:00
Bruno Windels d5a3071518 put show more button inside resizer
this way we have a flexbox layout in the resizer with:
 - the resize handle (fixed)
 - the show more/less button, if any (fixed)
 - the list of tiles (grabbing whatever is left)
2020-07-10 18:29:39 +02:00
Travis Ralston bf0a503e44 [WITH CONFLICTS] Merge branch 'develop' into travis/room-list/enable 2020-07-10 10:18:12 -06:00
Travis Ralston 2bf2a08e7a Mark safari hacks 2020-07-10 08:52:46 -06:00
Travis Ralston 75dbd5f1d4 Merge branch 'develop' into travis/room-list/enable 2020-07-09 22:28:16 -06:00
Jorik Schellekens edb556f22e Stop safari from agressivly shrinking 2020-07-10 02:15:46 +01:00
Travis Ralston 859f65659c Attempt to support a hard cutoff with the show more button
Known issues:
* Causes scroll jumps when the button gets added to DOM
* Resize handle is invisible when there's a show more button

TODO:
* Clean up comments
* Clean up useless code (all the padding stuff isn't needed)
2020-07-09 13:07:13 -06:00
Bruno Windels ce68314de9 Revert "Merge pull request #4932 from matrix-org/travis/room-list/invisible-show-more"
This reverts commit f58a0a7538.
2020-07-09 12:13:12 -06:00
Bruno Windels 00f0f6dd34 add color for room list header color 2020-07-09 19:17:34 +02:00
Bruno Windels d90fc57469 Merge branch 'develop' into element 2020-07-09 17:59:56 +02:00
Bruno Windels f58a0a7538
Merge pull request #4932 from matrix-org/travis/room-list/invisible-show-more
Potential solution to supporting transparent 'show more' buttons
2020-07-09 14:43:20 +00:00
Travis Ralston 8972cf9378 Potential solution to supporting transparent 'show more' buttons
In this demonstration, we remove the cutting line (as it collides with the tile in a weird spot) and instead replace the tile with a placeholder when the text is about to collide with the avatar in the tile. We use a `round()` for this because through some amazing coincidence the collision happens at 0.47, which is close enough to 0.5 for people not to notice.
2020-07-08 16:09:45 -06:00
Travis Ralston f9aca7c05e Avoid bounding box usage in sticky headers & improve reliability
We now use offsets and scroll information to determine where the headers should be stuck to, still supporting the transparent background.

Some scroll jumps were originally introduced as part of the change in numbering, so they have been fixed here. By proxy, some additional scroll jump/instability should be fixed as well.

This has a lingering problem of still causing a huge number of no-op UI updates though, which will be dealt with in a future commit.
2020-07-08 14:37:35 -06:00
Bruno Windels d5747ad6c0 Merge branch 'develop' into element 2020-07-08 18:07:45 +02:00
Travis Ralston 3912f2d21c Merge remote-tracking branch 'origin/develop' into travis/room-list/resizable 2020-07-08 07:55:10 -06:00
Bruno Windels 7dad56ca86 Merge branch 'develop' into element 2020-07-08 15:50:17 +02:00
Bruno Windels 269c30f8e8 Revert "also blur the sticky headers"
This reverts commit 82e0816d86.
2020-07-08 15:47:01 +02:00
Bruno Windels a8085f4e3b remove background on sticky headers 2020-07-08 14:50:08 +02:00
Travis Ralston 15b6a273c9 Swap out the resizer lib for something more stable
react-resizer appears to be okay at tracking state, but it often desyncs from reality. re-resizer is more maintained and more broadly used (160k downloads vs 110k), and appears to generally do a better job of tracking the cursor.

The new library has some oddities though, such as deltas, touch support (hence the polyfill), and calling handles "Enable".

For https://github.com/vector-im/riot-web/issues/14022
2020-07-07 22:21:00 -06:00
Jorik Schellekens 0906da01ba Fix gaps 2020-07-08 00:18:58 +01:00
Jorik Schellekens 92dec8ddd8 Fix gaps 2020-07-08 00:16:24 +01:00
Travis Ralston a59a8b76a9 Update TODO comments to point to new issue 2020-07-07 14:51:43 -06:00
Travis Ralston d14dd777b7 Revert "don't need to set width with javascript?"
This reverts commit a2cf641c0e.
2020-07-06 15:23:20 -06:00
Travis Ralston 70eebc978f Revert "Minor cleanup of sticky header CSS"
This reverts commit 5bf14d8427.
2020-07-06 15:22:40 -06:00
Travis Ralston 5bf14d8427 Minor cleanup of sticky header CSS 2020-07-06 14:37:38 -06:00
Bruno Windels a2cf641c0e don't need to set width with javascript? 2020-07-06 14:35:53 -06:00
Bruno Windels 8fd9dbf1d8 moar icon changes 2020-07-06 18:28:54 +02:00
Bruno Windels 08c44333cf Update develop 2020-07-06 09:29:23 +02:00
Travis Ralston afa71c7b7c Fix minor issues with the badges in the new room list
Fixes https://github.com/vector-im/riot-web/issues/14225
2020-07-03 14:26:59 -06:00
Bruno Windels b370e3f078 don't need to set width with javascript? 2020-07-03 16:52:01 +02:00
Bruno Windels 82e0816d86 also blur the sticky headers
added a DOM element so we can set the background on the parent and
the blur on the new element
2020-07-03 16:50:01 +02:00
Michael Telatynski 9cf162e267 Merge branches 'develop' and 't3chguy/room-list/6' of github.com:matrix-org/matrix-react-sdk into t3chguy/room-list/6
 Conflicts:
	src/components/views/rooms/RoomSublist2.tsx
	src/components/views/rooms/RoomTile2.tsx
2020-07-03 00:02:37 +01:00
Michael Telatynski 289f40ce29 First step towards a11y in the new room list
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-07-02 22:21:10 +01:00
Jorik Schellekens aab372c648 Add tooltips 2020-07-01 01:50:31 +01:00