Michael Telatynski
2da52372d4
Add arrow key controls to emoji and reaction pickers ( #10637 )
...
* Add arrow key controls to emoji and reaction pickers
* Iterate types
* Switch to using aria-activedescendant
* Add tests
* Fix tests
* Iterate
* Update test
* Tweak header keyboard navigation behaviour
* Also handle scrolling on left/right arrow keys
* Iterate
2023-04-20 14:56:21 +00:00
fahadNoufal
eaf152ceef
resolved emoji description text overflowing issue ( #10028 )
...
Co-authored-by: Germain <germains@element.io>
Resolves https://github.com/vector-im/element-web/issues/22126
2023-01-31 16:28:47 +00:00
Michael Weimann
526645c791
Apply prettier formatting
2022-12-12 12:24:14 +01:00
Michael Telatynski
01f4bb8c78
Rename PostCSS files to `.pcss` ( #9013 )
...
* Rename PostCSS files to `.pcss`
* Make Stylelint happy
* Delint
* Rename new files too
* delint
* Fix bad comment placement
2022-07-15 14:53:23 +01:00
Šimon Brandner
9abb2f5ff4
Color cleanup 8 ( #7108 )
...
* $accent-color -> $accent
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $notice-primary-color -> $alert
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $notice-primary-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-50pct
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $warning-color -> $alert
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $accent-darker
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $orange-warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $warning-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $info-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-11-11 13:37:29 +00:00
Šimon Brandner
07d9e93d67
Color cleanup number six ( #7050 )
...
* Remove $voip-decline-color and $voip-accept-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Remove $dialog-background-bg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $mention-user-pill-bg-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $plinth-bg-color -> $secondary-accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-lighter-fg-color -> $input-darker-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-valid-border-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $input-invalid-border-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $avatar-bg-color -> $background
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $preview-widget-fg-color -> $greyed-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $settings-profile-button-fg-color -> $settings-profile-overlay-placeholder-fg-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $presence-online -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $pinned-unread-color -> $notice-primary-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $event-highlight-fg-color -> $warning-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $tab-label-active-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-primary-bg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-danger-bg-color -> $notice-primary-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $button-link-fg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $togglesw-on-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $slider-selection-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $progressbar-fg-color -> $accent-color
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* $authpage-body-bg-color -> $background
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix merge issue
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
* Fix second merge issue
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-11-08 11:50:53 +00:00
Šimon Brandner
e5fd19c332
$primary-fg-color -> $primary-content
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:18:18 +02:00
Šimon Brandner
2afee596a9
$primary-bg-color -> $background
...
Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>
2021-08-12 17:17:34 +02:00
Michael Telatynski
db6853e022
Fix Emoji Picker footer being too small if text overflows
...
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2020-05-24 20:00:02 +01: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
J. Ryan Stinnett
e661e3b115
Fix quick reactions to be aligned with other emoji
...
This uses center alignment for quick reactions as well, so that they line up
with the larger emoji categories above.
2019-10-28 13:17:59 +00:00
Michael Telatynski
2e6899be93
Improve Accessibility of the new Emoji picker
...
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2019-10-23 18:39:39 +01:00
Michael Telatynski
190fccea15
delint scss
2019-10-22 16:35:36 +01:00
Tulir Asokan
438ad54701
Remove space between emojis in picker
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-20 12:31:28 +03:00
Tulir Asokan
be829980f6
Split inline SVGs to their own files
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-20 12:13:32 +03:00
Tulir Asokan
6ce2e3d796
Make selected emojis more transparent
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-15 19:10:10 +03:00
Tulir Asokan
318754d31c
Reorganize reaction sending and show if emoji is selected
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-15 19:07:04 +03:00
Tulir Asokan
a6e0986bf8
Improve style
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-14 20:38:09 +03:00
Tulir Asokan
e16d0bfa4d
Underline visible sections in header
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-14 20:14:44 +03:00
Tulir Asokan
088c9bff9e
Add recently used section and scroll to category
...
Signed-off-by: Tulir Asokan <tulir@maunium.net>
2019-10-14 19:41:10 +03: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