Commit graph

756 commits

Author SHA1 Message Date
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
J. Ryan Stinnett
530c92e03d Rename event edit button to options button
This naming is clearer as it doesn't really edit at all (it shows a context
menu). This should also be less confusing with actual editing when it arrives.
2019-04-29 15:20:50 +01:00
J. Ryan Stinnett
26f732723e Animate tooltips when hiding as well as showing
This uses the same animation style as on show, but twice as fast.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
0b42ded007 Style complexity progress bars more heavily
This disables the native progress appearance and uses the green color from our
themes.
2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
67d7091dcd Password score progress should be full width in tooltip 2019-04-25 14:29:10 +01:00
J. Ryan Stinnett
a7c37733b8 Rebalance margins in validation tooltip 2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
37e09b5569 Add check and x icons for validation feedback
Adds icons from the Feather set with the same color as text. Tweaks validation
item spacing to match the design.
2019-04-25 14:29:09 +01:00
J. Ryan Stinnett
338d83ab55 Add validation feedback helper
This adds a general validation feedback mechanism for checking input values. An
initial example is wired up for the username input on registration.
2019-04-25 14:29:09 +01:00
Luca Weiss
12f92c49a6
Mark a few CSS classes as not selectable
Should be enough to make copy-pasting not a nightmare.

For vector-im/riot-web#7460

Also remove an instance where the vendor prefixes were used, but a build
step adds those automatically

Signed-off-by: Luca Weiss <luca@z3ntu.xyz>
2019-04-23 19:52:48 +02:00
Bruno Windels
faecceb3b4 remove manual order so component order follows markup order 2019-04-18 09:20:26 +02:00
Bruno Windels
22874f62ab Merge branch 'develop' into bwindels/stylepreviewbar 2019-04-17 11:06:21 +02:00
Bruno Windels
1100320351 make non-member inviter name also bold 2019-04-17 11:02:58 +02:00
Bruno Windels
86620839ae make username clickable 2019-04-17 10:57:45 +02:00
Bruno Windels
8a371080d7 colored inviter name and layout 2019-04-17 10:22:35 +02: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
Bruno Windels
e40757a801 make sure long subtitles dont overflow 2019-04-16 16:19:50 +02:00
Bruno Windels
c1ff5f2fba implement style 2019-04-15 17:11:26 +02:00
J. Ryan Stinnett
32f28a7184
Merge pull request #2918 from jryans/bold-for-all
Ensure `<b>` tags appear bold for all browsers
2019-04-15 09:55:09 +01:00
Travis Ralston
e8d141fc3c
Merge pull request #2908 from matrix-org/travis/upgrades/linkback
Add a link in room settings to get at the tombstoned room if it exists
2019-04-12 10:21:39 -06:00
J. Ryan Stinnett
11bd82ee4c Ensure <b> tags appear bold for all browsers
In Firefox, the default <b> style is such that it doesn't appear bold with our
current selection of specific font weights. This specifically sets a working
font weight.
2019-04-12 15:09:32 +01:00
Bruno Windels
01e9de9a3a differentiate style based on preview or not 2019-04-12 12:54:13 +02:00
Travis Ralston
aadc1a8d75 Add a generic error page element for startup errors
Used by Riot to communicate configuration problems.
2019-04-11 15:52:37 -06:00
Bruno Windels
0553a6f1d6 some style changes 2019-04-11 13:07:54 +02:00
Travis Ralston
15e8ce7a7f Add a link in room settings to get at the tombstoned room if it exists
Fixes https://github.com/vector-im/riot-web/issues/8542
2019-04-10 15:00:02 -06:00
David Baker
04b69116ee Fix tedious CSS stuff with stylelint --fix 2019-04-09 15:05:39 +01:00
David Baker
eb6f3f6008 Fix up some CSS things stylelint was complaining about
And also disable a load of rules that feel like they're probably
causing more headaches than they fix.
2019-04-09 15:03:13 +01:00
David Baker
acdcf6639e Put width / height first in css 2019-04-08 19:11:04 +01:00
David Baker
670f6e4f99 Simplify settings dialog CSS
Stop the settings dialogs from requiring special styles on the
mx_Dialog which required passing in a classname from anywhere the
settings dialogs were opened (although this still requires
static=true). Some of the things have now been adopted for all dialogs
(border-radius), others have been moved to within the dialog content.
2019-04-08 16:48:42 +01:00
David Baker
7b5658e3b1 Fix CSS silliness
Meant to replace the existing block rather than add another one
with the same name! Also meant vw rather than width.
2019-04-08 14:21:12 +01:00
David Baker
833b46d040 Move SettingsDialog width override to fixedWidth
Move the width overrides to the container so it's the same thing
dictating its size as the rest of the dialogs
2019-04-08 14:17:18 +01:00
David Baker
3fdf822d46 Fix fixed width dialogs
Move the max-width to the fixedWidth div rather than the dialog,
otherwise the fixedWidth keeps getting bigger with bigger windows
but the dialog doesn't so it scrolls.
2019-04-08 13:37:29 +01:00
David Baker
c87c4ef5a4 Fix settings dialog layout
The close 'x' was ending up off the right hand side which made
everything else overlap with the left panel, depending on how wide
your window was.

This isn't the end of the dialog problems but it will at least stop
settings from being mangled on develop.
2019-04-08 11:56:08 +01:00
David Baker
3fe6d51fbe
Merge pull request #2868 from matrix-org/dbkr/dialog_redesign
Design tweaks to dialogs
2019-04-08 09:33:34 +01:00
Travis Ralston
223498a979
Merge pull request #2874 from matrix-org/travis/breadcrumbs/dms
Add an indicator to show a room is a direct chat in breadcrumbs
2019-04-05 08:15:12 -06:00
Travis Ralston
b7e557e49a Autohide the scrollbar on breadcrumbs
Fixes https://github.com/vector-im/riot-web/issues/9349
2019-04-04 16:27:00 -06:00
Travis Ralston
095e6a3ba6 Add an indicator to show a room is a direct chat
Fixes https://github.com/vector-im/riot-web/issues/8797
2019-04-04 14:31:23 -06:00
Travis Ralston
9618187d2e
Merge pull request #2855 from YaoiFangirl420/rotate_images
Add option to rotate images
2019-04-04 09:46:06 -06:00
YaoiFangirl420
9bd1ba60f5 Add option to rotate images
cf. https://github.com/vector-im/riot-web/issues/9257

Add rotate clockwise/counterclockwise buttons to <ImageView>

Signed-off-by: YaoiFangirl420 <48789208+YaoiFangirl420@users.noreply.github.com>
2019-04-04 01:48:41 -07:00
Travis Ralston
f5600fd4d7 Add badges to breadcrumb rooms
Fixes https://github.com/vector-im/riot-web/issues/8606
2019-04-03 15:29:15 -06:00
David Baker
0a61d05ba2 Make fixed width dialogs actually fixed width again
Settings overrode that to be larger, so do the corresponding
override for the other part.
2019-04-03 17:53:38 +01:00
David Baker
7925e7169a Design tweaks to dialogs
Little bit of a mix of things in this one:
 * Support variable-width dialogs. Default is fixed-width as before,
   only UploadConformDialog is variable-width. Controlled by a prop
   to BaseDialog.
 * Fixes to the cancel 'x' - scale the mask image, tweak size & colour
 * Colour & boldness of dialog titles
 * Align the dialog title & cancel 'x'
 * Remove gap between dialog buttons & right hand side of dialog(!)
 * Round corners on dialogs
 * Add grey border on image preview in upload confirm dialog
 * and, squeezing in slightly randomly, finish the partially renamed
   ChatInviteDialog to AddressPickerDialog.
2019-04-03 16:27:45 +01:00
Travis Ralston
c3d3dd1fd7
Merge pull request #2860 from matrix-org/travis/breadcrumbs/parted
Apply 50% opacity to left breadcrumbs
2019-04-03 08:42:39 -06:00
David Baker
24ccfa69f4
Merge pull request #2858 from matrix-org/dbkr/upload_redesign
Implement redesigned upload confirmation screens
2019-04-02 11:00:16 +01:00
Travis Ralston
7e2291592c Apply 50% opacity to left breadcrumbs
Fixes https://github.com/vector-im/riot-web/issues/8564

We listen for membership changes to make sure the state is kept up to date.
2019-04-01 11:59:39 -06:00
J. Ryan Stinnett
3948520eaa Use Field component in bug report dialog
This uses the field component in the bug report dialog, which generally improves
the styling to fit in more naturally with the rest of the app so that it feels
more trustworthy.

Fixes https://github.com/vector-im/riot-web/issues/9343
2019-04-01 17:50:12 +01:00
David Baker
5b2cee2fc1 Implement redesigned upload confirmation screens
Also fairly significant refactor of the uploading code: there are
a number of different ways of triggerring a file upload and each
went through a different code path (the media config size limit
worked on one of those paths). Basically take a lot of code out
of the views and put it into ContentMessages.

Sorry about the size of this patch.

https://github.com/vector-im/riot-web/issues/7565
2019-04-01 16:42:41 +01:00
Bruno Windels
a326c83016
Merge pull request #2842 from matrix-org/bwindels/bacat-scrolling-merged-develop
BACAT Scrolling
2019-03-29 14:02:15 +00:00
Travis Ralston
9b64dd0cd7 Support horizontal scrolling on breadcrumbs
Fixes https://github.com/vector-im/riot-web/issues/8714
Fixes https://github.com/vector-im/riot-web/issues/8890
Fixes https://github.com/vector-im/riot-web/issues/9034
Fixes https://github.com/vector-im/riot-web/issues/8954

This turned out to be much more complicated than it needed to be. We use an IndicatorScrollbar to do all the math for us and some minor changes have been made so it can flag left/right overflow. The complicated part is the css changes which make the gradients work: unlike the RoomSubList, we have to calculate the offset of the indicators (gradients) on our own because position:sticky doesn't work horizontally.

The changes to the css (well, mostly pointer-events:none) make it so the gradient doesn't interfere with the room avatars. 

9034 and 8954 are fixed by this because they represent an overflow-x:none style breakage where browsers won't let you scroll without a scrollbar. The gradient offset problem is also demonstrated in 8954.
2019-03-27 17:52:05 -06:00