emoji-picker-react 4.7.7 → 4.7.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "4.7.7",
2
+ "version": "4.7.8",
3
3
  "license": "MIT",
4
4
  "main": "dist/index.js",
5
5
  "typings": "dist/index.d.ts",
@@ -23,7 +23,7 @@ export function BtnPlus() {
23
23
  const styles = stylesheet.create({
24
24
  plusSign: {
25
25
  fontSize: '20px',
26
- padding: '18px',
26
+ padding: '17px',
27
27
  color: 'var(--epr-text-color)',
28
28
  borderRadius: '50%',
29
29
  textAlign: 'center',
@@ -33,7 +33,7 @@ const styles = stylesheet.create({
33
33
  display: 'flex',
34
34
  justifyContent: 'center',
35
35
  alignItems: 'center',
36
- transition: 'background-color 0.1s ease-in-out',
36
+ transition: 'background-color 0.2s ease-in-out',
37
37
  ':after': {
38
38
  content: '',
39
39
  minWidth: '20px',
@@ -46,16 +46,15 @@ const styles = stylesheet.create({
46
46
  },
47
47
  ':hover': {
48
48
  color: 'var(--epr-highlight-color)',
49
- backgroundColor: 'var(--epr-hover-bg-color)',
49
+ backgroundColor: 'var(--epr-hover-bg-color-reduced-opacity)',
50
50
  // @ts-ignore
51
51
  ':after': {
52
- backgroundPositionY: '-20px',
53
- transform: 'scale(1.2)'
52
+ backgroundPositionY: '-20px'
54
53
  }
55
54
  },
56
55
  ':focus': {
57
56
  color: 'var(--epr-highlight-color)',
58
- backgroundColor: 'var(--epr-hover-bg-color)',
57
+ backgroundColor: 'var(--epr-hover-bg-color-reduced-opacity)',
59
58
  // @ts-ignore
60
59
  ':after': {
61
60
  backgroundPositionY: '-40px'
@@ -77,6 +77,8 @@ function PickerRootElement({ children }: RootProps) {
77
77
  const DarkTheme = {
78
78
  '--epr-emoji-variation-picker-bg-color':
79
79
  'var(--epr-dark-emoji-variation-picker-bg-color)',
80
+ '--epr-hover-bg-color-reduced-opacity':
81
+ 'var(--epr-dark-hover-bg-color-reduced-opacity)',
80
82
  '--epr-highlight-color': 'var(--epr-dark-highlight-color)',
81
83
  '--epr-text-color': 'var(--epr-dark-text-color)',
82
84
  '--epr-hover-bg-color': 'var(--epr-dark-hover-bg-color)',
@@ -119,6 +121,7 @@ const styles = stylesheet.create({
119
121
  '--': {
120
122
  '--epr-highlight-color': '#007aeb',
121
123
  '--epr-hover-bg-color': '#f1f8ff',
124
+ '--epr-hover-bg-color-reduced-opacity': '#f1f8ff80',
122
125
  '--epr-focus-bg-color': '#e0f0ff',
123
126
  '--epr-text-color': '#858585',
124
127
  '--epr-search-input-bg-color': '#f6f6f6',
@@ -195,6 +198,7 @@ const styles = stylesheet.create({
195
198
  '--epr-dark-highlight-color': '#c0c0c0',
196
199
  '--epr-dark-text-color': 'var(--epr-highlight-color)',
197
200
  '--epr-dark-hover-bg-color': '#363636f6',
201
+ '--epr-dark-hover-bg-color-reduced-opacity': '#36363680',
198
202
  '--epr-dark-focus-bg-color': '#474747',
199
203
  '--epr-dark-search-input-bg-color': '#333333',
200
204
  '--epr-dark-category-label-bg-color': '#222222e6',