@omniumretail/component-library 1.1.68 → 1.1.70
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/dist/bundle.js +1 -1
- package/dist/main.css +1 -1
- package/dist/types/components/CategoryResponse/index.d.ts +1 -1
- package/dist/types/components/Header/Header.data.d.ts +1 -1
- package/dist/types/components/Header/Header.types.d.ts +2 -0
- package/dist/types/components/Header/index.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/CategoryResponse/index.tsx +4 -5
- package/src/components/Header/Header.data.ts +2 -1
- package/src/components/Header/Header.stories.tsx +12 -0
- package/src/components/Header/Header.types.ts +2 -0
- package/src/components/Header/index.tsx +19 -10
- package/src/components/Header/styles.module.scss +26 -10
package/dist/main.css
CHANGED
|
@@ -30,4 +30,4 @@
|
|
|
30
30
|
.nkyL3EtE9Zsnc5VOW43L{display:flex;flex-wrap:wrap;flex-direction:column}.nkyL3EtE9Zsnc5VOW43L .ant-table-thead>tr>th{background-color:rgba(0,0,0,0);border:0px;color:var(--color-blue)}.nkyL3EtE9Zsnc5VOW43L .ant-table-thead>tr>th:before{display:none}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper{margin-bottom:12px}.nkyL3EtE9Zsnc5VOW43L .ant-table-cell{word-break:break-word}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr{cursor:pointer}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr:last-child>td{border-bottom:1px solid var(--color-grey-light) !important}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr:first-child>td{border-top:1px solid var(--color-blue) !important}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr:hover td{border-radius:0 !important;border-bottom-color:var(--color-grey-light) !important}.nkyL3EtE9Zsnc5VOW43L .ant-space{align-self:flex-end}.nkyL3EtE9Zsnc5VOW43L .ant-select-selection-placeholder{color:var(--color-black)}.nkyL3EtE9Zsnc5VOW43L .ant-select-selector,.nkyL3EtE9Zsnc5VOW43L .ant-select-focused .ant-select-selection-search{border:none !important;box-shadow:none !important}.nkyL3EtE9Zsnc5VOW43L .ant-select-selector:focus,.nkyL3EtE9Zsnc5VOW43L .ant-select-selector:hover,.nkyL3EtE9Zsnc5VOW43L .ant-select-focused .ant-select-selection-search:focus,.nkyL3EtE9Zsnc5VOW43L .ant-select-focused .ant-select-selection-search:hover{border:none !important;box-shadow:none !important}.nkyL3EtE9Zsnc5VOW43L .ant-pagination{max-width:calc(100% - 200px);margin-left:auto !important}.nkyL3EtE9Zsnc5VOW43L button[type=button].ant-pagination-item-link{margin-top:0 !important}.nkyL3EtE9Zsnc5VOW43L button[type=button]{margin-top:-50px}@media screen and (max-width: 1024px){.nkyL3EtE9Zsnc5VOW43L .ant-table-thead>tr>th{font-size:12px}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr>td{font-size:12px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-thead>tr>th{padding:8px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-tbody>tr>td{padding:8px}}@media screen and (max-width: 767px){.nkyL3EtE9Zsnc5VOW43L .ant-table-thead>tr>th{font-size:10px}.nkyL3EtE9Zsnc5VOW43L .ant-table-tbody>tr>td{font-size:10px}.nkyL3EtE9Zsnc5VOW43L .ant-table-content table{width:100%}.nkyL3EtE9Zsnc5VOW43L .ant-table-content{width:100%}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table .ant-table-title,.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table .ant-table-header{word-break:break-all}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-thead>tr>th{padding:4px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-tbody>tr>td{padding:4px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-column-sorter{margin-inline-start:0px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-column-sorter-up{font-size:8px}.nkyL3EtE9Zsnc5VOW43L .ant-table-wrapper .ant-table-column-sorter-down{font-size:8px}.nkyL3EtE9Zsnc5VOW43L .ant-pagination{max-width:unset}}
|
|
31
31
|
.aZEBTQus3Y3MyodeDwkf{display:flex;flex-direction:column;align-items:center;justify-content:center}.cc1pbQlAgw2CmXVml3bs{height:300px;width:400px}.aTf_CXAsyp0tySsoZdD_{display:flex;justify-content:space-between;margin:10px 10px 0px 10px;font-size:20px}.kuu1hf_JTvYD55IW6Nxl{color:#ff4d4f}.N8ODEO3zDbY7gmecjTrp{color:#52c41a}.WIsL9Shu6c0mGJq9qSSz{margin-top:20px;border-radius:4px;overflow:hidden}.WIsL9Shu6c0mGJq9qSSz img{width:100%;height:auto}
|
|
32
32
|
.OJKeuXyOSPIeCCssVum2{display:flex;gap:32px}.jzxszvL7wzCV5nztJL0S{padding:12px}.OGA8oJw8RDyohcRftjmo{width:100%}.y2_7QVPOhjRZlAHCRWKf{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.Smkcs3LGp1uPuQge2GxE{margin-top:16px}Label{margin-bottom:8px}.djarlYFkE9Kb7wUjUnrY{height:36px}
|
|
33
|
-
:root{--color-grey: #e4e4e4;--color-grey-100: #E5E5E5
|
|
33
|
+
:root{--color-grey: #e4e4e4;--color-grey-100: #E5E5E5}.SF5f_Q_Ggz_4JHUHS2Xa{display:flex;align-items:center;padding:13px 20px;box-sizing:border-box;height:72px}.SF5f_Q_Ggz_4JHUHS2Xa *{box-sizing:border-box}.gSVYvBn1sLbcMsGI32b9{display:flex;flex-grow:1;align-items:flex-end;justify-content:center}.gSVYvBn1sLbcMsGI32b9 img{max-width:196px}.gSVYvBn1sLbcMsGI32b9 .fVSt3bSZBcJGsOdA5nIN{font-weight:var(--font-weight-semibold);text-transform:uppercase;color:var(--color-black)}.BIBQmS_NwoMw2Ncq5yuN{cursor:pointer;padding:4px 4px 4px 0;font-size:20px}.ZinSgUtysxITkbGRKdux{position:fixed;top:0;left:-100%;bottom:0;width:100%;max-width:430px;background-color:var(--color-white);padding-inline:15px;z-index:999;box-shadow:0 3px 12px rgba(0,0,0,.45);transition:.6s ease-out}.ZinSgUtysxITkbGRKdux.FW1pOdad0uN5LO9h5PgQ{left:0;transition:.3s ease-in}.ZfA8OEmbRzRsNqLAmdtn{background-color:rgba(0,0,0,.3);backdrop-filter:blur(1px);position:absolute;left:0;top:0;right:0;bottom:0;z-index:998;pointer-events:none;opacity:0;transition:.3s}.ZfA8OEmbRzRsNqLAmdtn.FW1pOdad0uN5LO9h5PgQ{opacity:1;pointer-events:all}.YKSQJmdRP_7tKwvQpeuV{width:calc(100% + 30px);margin-left:-15px;background-color:var(--color-orange);display:flex;align-items:center;justify-content:center}.ISssYC5Uz452JVWP0xDc img{max-width:160px}.E6YZPpa60LxA7qqIW7jQ{position:absolute;top:23px;right:15px;font-size:25px;cursor:pointer;color:var(--color-white)}.YYp3pzktjEDEyW8knAZQ{overflow-y:auto;height:calc(100% - 51px);margin:0;padding:0}.u7k2VQ30AQDk6mKA22GX{height:60px;padding:10px;display:flex;align-items:center;border-bottom:1px solid var(--color-black);cursor:pointer;transition:.3s;text-transform:uppercase;width:100%}.u7k2VQ30AQDk6mKA22GX:hover{background-color:var(--color-grey);color:var(--color-black)}.QQoDB9XPcAK18l2DIym4{list-style:none}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN{height:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding-bottom:0}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX{position:relative}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa{position:absolute;width:60px;height:100%;background:var(--color-black);right:0;display:flex;align-items:center;justify-content:center}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .NytmT59TmaWHc4FLM2wa:hover{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN>.u7k2VQ30AQDk6mKA22GX .zo7CFksIKx7Fahu4e4S_{color:var(--color-white)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E{background:var(--color-grey)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .NytmT59TmaWHc4FLM2wa{background-color:var(--color-orange)}.QQoDB9XPcAK18l2DIym4.wrXCksst57UpQuCNgGkN.yk4DnBgiUlzk23Yg_q6E .uLgjMU9sbvfaa0qKEguP{height:auto;opacity:1}.uLgjMU9sbvfaa0qKEguP{padding:0;width:100%;margin:0;background-color:var(--color-orange);color:var(--color-white);height:0;opacity:0;overflow:hidden;transition:height .3s ease,opacity .3s ease}.uLgjMU9sbvfaa0qKEguP .u7k2VQ30AQDk6mKA22GX{min-height:60px;height:auto;padding-inline:40px}.efnjUnudkE0UTVQ6wrgH{cursor:pointer}.u7k2VQ30AQDk6mKA22GX .fjNRYZMP1O0pTvBDBB3L span{margin-left:8px;transform:translateY(-2px);display:inline-block;font-size:var(--font-size-body-3);text-transform:capitalize}
|
|
@@ -6,7 +6,7 @@ interface CategoryResponse {
|
|
|
6
6
|
onNextCategoryAvailabilityChange: (hasNext: boolean) => void;
|
|
7
7
|
onPreviousCategoryAvailabilityChange: (hasPrevious: boolean) => void;
|
|
8
8
|
selectYesNoOption?: any;
|
|
9
|
-
addAction?: (questionId: string) => void;
|
|
9
|
+
addAction?: (questionId: string, questionAnswerId: string) => void;
|
|
10
10
|
addButtons?: boolean;
|
|
11
11
|
fileList?: React.Dispatch<React.SetStateAction<Record<string, UploadFile<any>[]>>>;
|
|
12
12
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { MenuItem } from './Header.types';
|
|
2
2
|
export declare const getMenuTopList: (onHome: () => void) => MenuItem[];
|
|
3
|
-
export declare const getMenuBottomList: (onProfile: () => void, onLogout: () => void) => MenuItem[];
|
|
3
|
+
export declare const getMenuBottomList: (onProfile: () => void, onLogout: () => void, userName?: string) => MenuItem[];
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { HeaderProps } from './Header.types';
|
|
2
|
-
export declare const Header: ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const Header: ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage, userName, pageTitle }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default Header;
|
package/package.json
CHANGED
|
@@ -16,7 +16,7 @@ interface CategoryResponse {
|
|
|
16
16
|
onNextCategoryAvailabilityChange: (hasNext: boolean) => void;
|
|
17
17
|
onPreviousCategoryAvailabilityChange: (hasPrevious: boolean) => void;
|
|
18
18
|
selectYesNoOption?: any;
|
|
19
|
-
addAction?: (questionId: string) => void;
|
|
19
|
+
addAction?: (questionId: string, questionAnswerId:string) => void;
|
|
20
20
|
addButtons?: boolean;
|
|
21
21
|
fileList?: React.Dispatch<React.SetStateAction<Record<string, UploadFile<any>[]>>>;
|
|
22
22
|
};
|
|
@@ -162,10 +162,9 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
162
162
|
imgWindow?.document.write(image.outerHTML);
|
|
163
163
|
};
|
|
164
164
|
|
|
165
|
-
const handleAddAction = (questionId: string) => {
|
|
165
|
+
const handleAddAction = (questionId: string, questionAnswerId: string) => {
|
|
166
166
|
if (props.addAction) {
|
|
167
|
-
|
|
168
|
-
props.addAction(questionId);
|
|
167
|
+
props.addAction(questionId, questionAnswerId);
|
|
169
168
|
}
|
|
170
169
|
};
|
|
171
170
|
|
|
@@ -346,7 +345,7 @@ export const CategoryResponse = React.forwardRef((props: CategoryResponse, ref)
|
|
|
346
345
|
{form.getFieldValue(`Questions`)?.[index].Note ? t('components.categoryResponse.editNote') : t('components.categoryResponse.addNote')}
|
|
347
346
|
</Button>
|
|
348
347
|
|
|
349
|
-
<Button customClass={styles.actionsButtons} onClick={() => handleAddAction(question.Id)}>
|
|
348
|
+
<Button customClass={styles.actionsButtons} onClick={() => handleAddAction(question.QuestionId, question.Id)}>
|
|
350
349
|
{t('components.categoryResponse.createAction')}
|
|
351
350
|
</Button>
|
|
352
351
|
</div>
|
|
@@ -12,9 +12,10 @@ export const getMenuTopList = (
|
|
|
12
12
|
export const getMenuBottomList= (
|
|
13
13
|
onProfile: () => void,
|
|
14
14
|
onLogout: () => void,
|
|
15
|
+
userName?: string,
|
|
15
16
|
): MenuItem[] => [
|
|
16
17
|
{
|
|
17
|
-
name:
|
|
18
|
+
name: `Profile${userName ? ` <span>(${userName})</span>` : ''}`,
|
|
18
19
|
action: onProfile,
|
|
19
20
|
},
|
|
20
21
|
{
|
|
@@ -37,6 +37,16 @@ const mockMenu = [
|
|
|
37
37
|
action: () => mockAction(),
|
|
38
38
|
targetRoute: "reports",
|
|
39
39
|
dropdownMenu: [
|
|
40
|
+
{
|
|
41
|
+
name: "Análises",
|
|
42
|
+
action: () => mockAction(),
|
|
43
|
+
targetRoute: "analyse",
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
name: "Análises2",
|
|
47
|
+
action: () => mockAction(),
|
|
48
|
+
targetRoute: "analyse2",
|
|
49
|
+
}
|
|
40
50
|
]
|
|
41
51
|
}
|
|
42
52
|
];
|
|
@@ -47,5 +57,7 @@ Primary.args = {
|
|
|
47
57
|
logout: () => console.log('Logout'), // in here logout from auth0 should be passed
|
|
48
58
|
homeUrl: homeUrl,
|
|
49
59
|
profileUrl: profileUrl,
|
|
60
|
+
userName: 'Diogo Carvalho',
|
|
61
|
+
pageTitle: 'Page Title',
|
|
50
62
|
};
|
|
51
63
|
|
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { useRef, useState } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { DownOutlined, UpOutlined, BarsOutlined, CloseOutlined } from '@ant-design/icons';
|
|
3
3
|
import omniumIcon from '../../assets/images/omnium-retail-logo.png';
|
|
4
|
+
import omniumWhiteIcon from '../../assets/images/omnium-retail-logo-white.png';
|
|
4
5
|
import styles from './styles.module.scss';
|
|
5
6
|
import classNames from 'classnames';
|
|
6
7
|
import { HeaderProps, MenuItem } from './Header.types';
|
|
7
8
|
import { getMenuTopList, getMenuBottomList } from './Header.data';
|
|
8
9
|
|
|
9
|
-
export const Header = ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage }: HeaderProps) => {
|
|
10
|
+
export const Header = ({ menuList, actionButton, logout, homeUrl, profileUrl, onLeavingPage, userName, pageTitle }: HeaderProps) => {
|
|
10
11
|
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
|
11
12
|
const [activeDropdown, setActiveDropdown] = useState<number | null>(null);
|
|
12
13
|
const headerRef = useRef<HTMLDivElement>(null);
|
|
@@ -34,7 +35,8 @@ export const Header = ({ menuList, actionButton, logout, homeUrl, profileUrl, on
|
|
|
34
35
|
|
|
35
36
|
const menuBottomList = getMenuBottomList(
|
|
36
37
|
onProfile,
|
|
37
|
-
onLogout
|
|
38
|
+
onLogout,
|
|
39
|
+
userName
|
|
38
40
|
);
|
|
39
41
|
|
|
40
42
|
const combinedMenuList = [...menuTopList, ...(menuList || []), ...menuBottomList];
|
|
@@ -68,13 +70,16 @@ export const Header = ({ menuList, actionButton, logout, homeUrl, profileUrl, on
|
|
|
68
70
|
}
|
|
69
71
|
}}
|
|
70
72
|
>
|
|
71
|
-
|
|
73
|
+
<p
|
|
74
|
+
className={ styles.name }
|
|
75
|
+
dangerouslySetInnerHTML={{ __html: link.name }}></p>
|
|
76
|
+
|
|
72
77
|
{
|
|
73
78
|
link.dropdownMenu && link.dropdownMenu.length > 0 && <div className={styles.arrow} onClick={(event) => handleDropdownClick(event, index)}>
|
|
74
79
|
{
|
|
75
80
|
activeDropdown === index ?
|
|
76
|
-
<
|
|
77
|
-
<
|
|
81
|
+
<UpOutlined className={styles.arrowIcon} /> :
|
|
82
|
+
<DownOutlined className={styles.arrowIcon} />
|
|
78
83
|
}
|
|
79
84
|
</div>
|
|
80
85
|
}
|
|
@@ -105,13 +110,17 @@ export const Header = ({ menuList, actionButton, logout, homeUrl, profileUrl, on
|
|
|
105
110
|
<BarsOutlined onClick={onToggleMenu} className={ styles.toggleMenuOpen } />
|
|
106
111
|
|
|
107
112
|
<div className={styles.logoContainer}>
|
|
108
|
-
|
|
113
|
+
{
|
|
114
|
+
pageTitle
|
|
115
|
+
? <p className={ styles.title}>{pageTitle}</p>
|
|
116
|
+
: <img src={omniumIcon} alt="Omnium Retail Blue Logo" />
|
|
117
|
+
}
|
|
109
118
|
</div>
|
|
110
119
|
|
|
111
120
|
<div className={classNames(styles.menu, { [styles.active]: isMenuOpen })}>
|
|
112
|
-
<div className={styles.
|
|
113
|
-
<p className={styles.
|
|
114
|
-
|
|
121
|
+
<div className={styles.head}>
|
|
122
|
+
<p className={styles.logoWrapper}>
|
|
123
|
+
<img src={omniumWhiteIcon} alt="Omnium Retail White Logo" />
|
|
115
124
|
</p>
|
|
116
125
|
<CloseOutlined color={'#FFFFFF'} className={styles.toggleMenuClose} onClick={onToggleMenu} />
|
|
117
126
|
</div>
|
|
@@ -2,16 +2,14 @@
|
|
|
2
2
|
:root {
|
|
3
3
|
--color-grey: #e4e4e4;
|
|
4
4
|
--color-grey-100: #E5E5E5;
|
|
5
|
-
--color-white: #FFFFFF;
|
|
6
|
-
--color-black: #2C2D2E;
|
|
7
5
|
}
|
|
8
6
|
|
|
9
7
|
.header {
|
|
10
8
|
display: flex;
|
|
11
9
|
align-items: center;
|
|
12
10
|
padding: 13px 20px;
|
|
13
|
-
border-bottom: 2px solid var(--color-grey-100);
|
|
14
11
|
box-sizing: border-box;
|
|
12
|
+
height: 72px;
|
|
15
13
|
|
|
16
14
|
* {
|
|
17
15
|
box-sizing: border-box;
|
|
@@ -27,6 +25,12 @@
|
|
|
27
25
|
img {
|
|
28
26
|
max-width: 196px;
|
|
29
27
|
}
|
|
28
|
+
|
|
29
|
+
.title {
|
|
30
|
+
font-weight: var(--font-weight-semibold);
|
|
31
|
+
text-transform: uppercase;
|
|
32
|
+
color: var(--color-black);
|
|
33
|
+
}
|
|
30
34
|
}
|
|
31
35
|
|
|
32
36
|
.toggleMenuOpen {
|
|
@@ -41,7 +45,7 @@
|
|
|
41
45
|
left: -100%;
|
|
42
46
|
bottom: 0;
|
|
43
47
|
width: 100%;
|
|
44
|
-
max-width:
|
|
48
|
+
max-width: 430px;
|
|
45
49
|
background-color: var(--color-white);
|
|
46
50
|
padding-inline: 15px;
|
|
47
51
|
z-index: 999;
|
|
@@ -73,7 +77,7 @@
|
|
|
73
77
|
}
|
|
74
78
|
}
|
|
75
79
|
|
|
76
|
-
.
|
|
80
|
+
.head {
|
|
77
81
|
width: calc(100% + 30px);
|
|
78
82
|
margin-left: -15px;
|
|
79
83
|
background-color: var(--color-orange);
|
|
@@ -82,15 +86,15 @@
|
|
|
82
86
|
justify-content: center;
|
|
83
87
|
}
|
|
84
88
|
|
|
85
|
-
.
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
+
.logoWrapper {
|
|
90
|
+
img {
|
|
91
|
+
max-width: 160px;
|
|
92
|
+
}
|
|
89
93
|
}
|
|
90
94
|
|
|
91
95
|
.toggleMenuClose {
|
|
92
96
|
position: absolute;
|
|
93
|
-
top:
|
|
97
|
+
top: 23px;
|
|
94
98
|
right: 15px;
|
|
95
99
|
font-size: 25px;
|
|
96
100
|
cursor: pointer;
|
|
@@ -191,3 +195,15 @@
|
|
|
191
195
|
.actionButton {
|
|
192
196
|
cursor: pointer;
|
|
193
197
|
}
|
|
198
|
+
|
|
199
|
+
.listName {
|
|
200
|
+
.name {
|
|
201
|
+
span {
|
|
202
|
+
margin-left: 8px;
|
|
203
|
+
transform: translateY(-2px);
|
|
204
|
+
display: inline-block;
|
|
205
|
+
font-size: var(--font-size-body-3);
|
|
206
|
+
text-transform: capitalize;
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
}
|