@bytebrand/fe-ui-core 4.1.57 → 4.1.59

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.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/source/components/PriceRating/PriceRating.styl +1 -0
  3. package/source/components/VehicleSmallCard/VehicleData/VehicleInfo/VehicleInfo.styl +11 -9
  4. package/source/components/_common/UserMenu/MaterialMenu.styled.tsx +4 -0
  5. package/source/components/_common/UserMenu/MaterialMenu.tsx +21 -18
  6. package/source/theme/priceReviewColors.styl +7 -7
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bytebrand/fe-ui-core",
3
- "version": "4.1.57",
3
+ "version": "4.1.59",
4
4
  "description": "UI components for the auto.de project",
5
5
  "main": "index.ts",
6
6
  "module": "dist/common.js",
package/source/components/PriceRating/PriceRating.styl CHANGED
@@ -21,6 +21,7 @@
21
21
  display: flex
22
22
  justify-content: center;
23
23
  gap: 4px;
24
+ flex-direction: row-reverse;
24
25
 
25
26
  .segment
26
27
  display: inline-flex;
package/source/components/VehicleSmallCard/VehicleData/VehicleInfo/VehicleInfo.styl CHANGED
@@ -90,9 +90,11 @@
90
90
  +media-tablet-landscape-up()
91
91
  grid-auto-rows: 36px;
92
92
 
93
- & .priceRatingSegmentWrapSRL > div
94
- width: 13px;
95
- height: 12px;
93
+ & .priceRatingSegmentWrapSRL
94
+ gap: 2px;
95
+ & > div
96
+ width: 13px;
97
+ height: 12px;
96
98
 
97
99
  & .priceRatingSRL span
98
100
  font-size: 10px;
@@ -140,9 +142,9 @@
140
142
  border: none;
141
143
 
142
144
  & .carIconSearch
143
- width: 23px;
144
- height: 23px;
145
- max-width: 23px;
145
+ width: 30px;
146
+ height: 30px;
147
+ max-width: 28px;
146
148
 
147
149
  & .priceRatingSRL
148
150
  margin: auto;
@@ -176,9 +178,9 @@
176
178
  border: none;
177
179
 
178
180
  & .carIconSearch
179
- width: 25px;
180
- height: 25px;
181
- max-width: 25px;
181
+ width: 30px;
182
+ height: 30px;
183
+ max-width: 28px;
182
184
 
183
185
  & .priceRatingSRL
184
186
  margin: auto;
package/source/components/_common/UserMenu/MaterialMenu.styled.tsx CHANGED
@@ -61,6 +61,10 @@ export const AmountBlock = styled('span')({
61
61
  fontWeight: 'bold'
62
62
  });
63
63
 
64
+ export const HeaderComponent = styled('div')({
65
+ cursor: 'pointer'
66
+ });
67
+
64
68
  export const FlexContainer = styled('div')({
65
69
  display: 'flex'
66
70
  });
package/source/components/_common/UserMenu/MaterialMenu.tsx CHANGED
@@ -2,7 +2,7 @@ import React, { useState, useRef } from 'react';
2
2
  import Menu from '@mui/material/Menu';
3
3
  import ListItem from './MaterialMenuItem';
4
4
  import { ThemeProvider } from '@mui/material/styles';
5
- import { Theme, FlexContainer } from './MaterialMenu.styled';
5
+ import { Theme, FlexContainer, HeaderComponent } from './MaterialMenu.styled';
6
6
  import IconSVG from '../IconSVG/IconSVG';
7
7
 
8
8
  export interface ILoggedInUserInfoProps {
@@ -36,29 +36,29 @@ const MaterialMenu = ({ menuItems, headerComponent, onChange, isLang, containerC
36
36
  }
37
37
  };
38
38
 
39
- const containerRef = useRef(null);
40
-
41
39
  return (
42
40
  <ThemeProvider theme={Theme}>
43
- <div className={containerClassname} ref={containerRef} onClick={handleClick} onMouseEnter={handleClick}>
44
- {headerComponent && headerComponent}
45
- {(isLang && !!value) &&
46
- <FlexContainer>
47
- <IconSVG
48
- customDimensions
49
- width='42px'
50
- height='27px'
51
- name={`new_lang_${value}`}
52
- />
53
- </FlexContainer>
54
- }
41
+ <div className={containerClassname}>
42
+ <HeaderComponent
43
+ onClick={handleClick}
44
+ >
45
+ {headerComponent && headerComponent}
46
+ {(isLang && !!value) &&
47
+ <FlexContainer>
48
+ <IconSVG
49
+ customDimensions
50
+ width='42px'
51
+ height='27px'
52
+ name={`new_lang_${value}`}
53
+ />
54
+ </FlexContainer>
55
+ }
56
+ </HeaderComponent>
55
57
  <Menu
56
58
  anchorEl={anchorEl}
57
59
  open={open}
58
60
  onClose={handleClose}
59
- onClick={handleClose}
60
61
  PaperProps={{
61
- onMouseLeave: handleClose,
62
62
  elevation: 0
63
63
  }}
64
64
  transformOrigin={{ horizontal: 'right', vertical: 'top' }}
@@ -69,7 +69,10 @@ const MaterialMenu = ({ menuItems, headerComponent, onChange, isLang, containerC
69
69
  <ListItem
70
70
  key={listItemProps.text}
71
71
  selected={index === selectedIndex}
72
- onClick={() => onHandleChange(listItemProps.value, index)}
72
+ onClick={() => {
73
+ onHandleChange(listItemProps.value, index);
74
+ handleClose();
75
+ }}
73
76
  isSelect={isSelect}
74
77
  Link={Link}
75
78
  { ...listItemProps }
package/source/theme/priceReviewColors.styl CHANGED
@@ -1,10 +1,10 @@
1
1
 
2
2
  $priceReviewColors = {
3
- noRating: #c4c4c4
4
- darkBackground: #c4c4c4
5
- highPrice: #E26C00
6
- increasedPrice: #ED9D37
7
- fairPrice: #8ABF5B
8
- goodPrice: #699540
9
- topPrice: #096718
3
+ noRating: rgba(76, 78, 100, 0.22)
4
+ darkBackground: rgba(76, 78, 100, 0.22)
5
+ highPrice: rgba(226, 108, 0, 1)
6
+ increasedPrice: rgba(237, 157, 55, 1)
7
+ fairPrice: rgba(173, 208, 66, 1)
8
+ goodPrice: rgba(102, 212, 102, 1)
9
+ topPrice: rgba(0, 184, 0, 1)
10
10
  }