@coorpacademy/components 11.12.2 → 11.12.3-alpha.9
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/es/molecule/expandable-item/index.d.ts +26 -0
- package/es/molecule/expandable-item/index.d.ts.map +1 -0
- package/es/molecule/expandable-item/index.js +51 -0
- package/es/molecule/expandable-item/index.js.map +1 -0
- package/es/molecule/expandable-item/style.css +129 -0
- package/es/molecule/expandable-list/index.d.ts +16 -0
- package/es/molecule/expandable-list/index.d.ts.map +1 -0
- package/es/molecule/expandable-list/index.js +34 -0
- package/es/molecule/expandable-list/index.js.map +1 -0
- package/es/molecule/expandable-list/style.css +25 -0
- package/es/molecule/hero/index.d.ts +2 -0
- package/es/molecule/hero/index.d.ts.map +1 -1
- package/es/molecule/hero/index.js +14 -4
- package/es/molecule/hero/index.js.map +1 -1
- package/es/molecule/hero/style.css +42 -0
- package/es/molecule/menu-links/index.d.ts +18 -0
- package/es/molecule/menu-links/index.d.ts.map +1 -0
- package/es/molecule/menu-links/index.js +43 -0
- package/es/molecule/menu-links/index.js.map +1 -0
- package/es/molecule/menu-links/style.css +87 -0
- package/es/molecule/privacy-policy-contact/index.d.ts +18 -0
- package/es/molecule/privacy-policy-contact/index.d.ts.map +1 -0
- package/es/molecule/privacy-policy-contact/index.js +31 -0
- package/es/molecule/privacy-policy-contact/index.js.map +1 -0
- package/es/molecule/privacy-policy-contact/style.css +37 -0
- package/es/molecule/privacy-policy-download/index.d.ts +30 -0
- package/es/molecule/privacy-policy-download/index.d.ts.map +1 -0
- package/es/molecule/privacy-policy-download/index.js +30 -0
- package/es/molecule/privacy-policy-download/index.js.map +1 -0
- package/es/molecule/privacy-policy-download/style.css +42 -0
- package/es/template/common/privacy-policy-page/index.d.ts +59 -0
- package/es/template/common/privacy-policy-page/index.d.ts.map +1 -0
- package/es/template/common/privacy-policy-page/index.js +47 -0
- package/es/template/common/privacy-policy-page/index.js.map +1 -0
- package/es/template/common/privacy-policy-page/style.css +78 -0
- package/lib/molecule/expandable-item/index.d.ts +26 -0
- package/lib/molecule/expandable-item/index.d.ts.map +1 -0
- package/lib/molecule/expandable-item/index.js +66 -0
- package/lib/molecule/expandable-item/index.js.map +1 -0
- package/lib/molecule/expandable-item/style.css +129 -0
- package/lib/molecule/expandable-list/index.d.ts +16 -0
- package/lib/molecule/expandable-list/index.d.ts.map +1 -0
- package/lib/molecule/expandable-list/index.js +48 -0
- package/lib/molecule/expandable-list/index.js.map +1 -0
- package/lib/molecule/expandable-list/style.css +25 -0
- package/lib/molecule/hero/index.d.ts +2 -0
- package/lib/molecule/hero/index.d.ts.map +1 -1
- package/lib/molecule/hero/index.js +14 -4
- package/lib/molecule/hero/index.js.map +1 -1
- package/lib/molecule/hero/style.css +42 -0
- package/lib/molecule/menu-links/index.d.ts +18 -0
- package/lib/molecule/menu-links/index.d.ts.map +1 -0
- package/lib/molecule/menu-links/index.js +54 -0
- package/lib/molecule/menu-links/index.js.map +1 -0
- package/lib/molecule/menu-links/style.css +87 -0
- package/lib/molecule/privacy-policy-contact/index.d.ts +18 -0
- package/lib/molecule/privacy-policy-contact/index.d.ts.map +1 -0
- package/lib/molecule/privacy-policy-contact/index.js +44 -0
- package/lib/molecule/privacy-policy-contact/index.js.map +1 -0
- package/lib/molecule/privacy-policy-contact/style.css +37 -0
- package/lib/molecule/privacy-policy-download/index.d.ts +30 -0
- package/lib/molecule/privacy-policy-download/index.d.ts.map +1 -0
- package/lib/molecule/privacy-policy-download/index.js +41 -0
- package/lib/molecule/privacy-policy-download/index.js.map +1 -0
- package/lib/molecule/privacy-policy-download/style.css +42 -0
- package/lib/template/common/privacy-policy-page/index.d.ts +59 -0
- package/lib/template/common/privacy-policy-page/index.d.ts.map +1 -0
- package/lib/template/common/privacy-policy-page/index.js +61 -0
- package/lib/template/common/privacy-policy-page/index.js.map +1 -0
- package/lib/template/common/privacy-policy-page/style.css +78 -0
- package/package.json +2 -2
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/// <reference path="../../../src/globals.d.ts" />
|
|
2
|
+
export namespace ICONS {
|
|
3
|
+
export { ArrowIcon as arrow };
|
|
4
|
+
}
|
|
5
|
+
export default ExpandableItem;
|
|
6
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from "@coorpacademy/nova-icons";
|
|
7
|
+
declare function ExpandableItem({ icon, title, isExpended, content, onClick, image }: {
|
|
8
|
+
icon: any;
|
|
9
|
+
title: any;
|
|
10
|
+
isExpended: any;
|
|
11
|
+
content: any;
|
|
12
|
+
onClick: any;
|
|
13
|
+
image: any;
|
|
14
|
+
}): JSX.Element;
|
|
15
|
+
declare namespace ExpandableItem {
|
|
16
|
+
namespace propTypes {
|
|
17
|
+
const title: PropTypes.Requireable<string>;
|
|
18
|
+
const icon: PropTypes.Requireable<string>;
|
|
19
|
+
const isExpended: PropTypes.Requireable<boolean>;
|
|
20
|
+
const content: PropTypes.Requireable<string>;
|
|
21
|
+
const image: PropTypes.Requireable<string>;
|
|
22
|
+
const onClick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
import PropTypes from "prop-types";
|
|
26
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandable-item/index.js"],"names":[],"mappings":";;;;;;AAWA;;;;;;;gBAqBC"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import _keys from "lodash/fp/keys";
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import classnames from 'classnames';
|
|
5
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from '@coorpacademy/nova-icons';
|
|
6
|
+
import styles from './style.css';
|
|
7
|
+
export const ICONS = {
|
|
8
|
+
arrow: ArrowIcon
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
const ExpandableItem = ({
|
|
12
|
+
icon,
|
|
13
|
+
title,
|
|
14
|
+
isExpended,
|
|
15
|
+
content,
|
|
16
|
+
onClick,
|
|
17
|
+
image
|
|
18
|
+
}) => {
|
|
19
|
+
const Icon = ICONS[icon];
|
|
20
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
21
|
+
className: isExpended ? styles.expendedContainer : styles.container,
|
|
22
|
+
onClick: onClick
|
|
23
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
24
|
+
className: classnames(styles.header, isExpended ? styles.expendedHeader : null)
|
|
25
|
+
}, /*#__PURE__*/React.createElement("h3", {
|
|
26
|
+
className: styles.title
|
|
27
|
+
}, title), Icon ? /*#__PURE__*/React.createElement(Icon, {
|
|
28
|
+
className: classnames(styles.icon, isExpended ? styles.expendedIcon : null)
|
|
29
|
+
}) : null), isExpended ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
|
|
30
|
+
className: styles.content // eslint-disable-next-line react/no-danger
|
|
31
|
+
,
|
|
32
|
+
dangerouslySetInnerHTML: {
|
|
33
|
+
__html: content
|
|
34
|
+
}
|
|
35
|
+
}), image ? /*#__PURE__*/React.createElement("img", {
|
|
36
|
+
className: styles.image,
|
|
37
|
+
src: image,
|
|
38
|
+
alt: ''
|
|
39
|
+
}) : null) : null);
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
ExpandableItem.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
43
|
+
title: PropTypes.string,
|
|
44
|
+
icon: PropTypes.oneOf(_keys(ICONS)),
|
|
45
|
+
isExpended: PropTypes.bool,
|
|
46
|
+
content: PropTypes.string,
|
|
47
|
+
image: PropTypes.string,
|
|
48
|
+
onClick: PropTypes.func
|
|
49
|
+
} : {};
|
|
50
|
+
export default ExpandableItem;
|
|
51
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","NovaCompositionNavigationArrowDown","ArrowIcon","styles","ICONS","arrow","ExpandableItem","icon","title","isExpended","content","onClick","image","Icon","expendedContainer","container","header","expendedHeader","expendedIcon","__html","propTypes","string","oneOf","bool","func"],"sources":["../../../src/molecule/expandable-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {keys} from 'lodash/fp';\nimport {NovaCompositionNavigationArrowDown as ArrowIcon} from '@coorpacademy/nova-icons';\nimport styles from './style.css';\n\nexport const ICONS = {\n arrow: ArrowIcon\n};\n\nconst ExpandableItem = ({icon, title, isExpended, content, onClick, image}) => {\n const Icon = ICONS[icon];\n return (\n <div className={isExpended ? styles.expendedContainer : styles.container} onClick={onClick}>\n <div className={classnames(styles.header, isExpended ? styles.expendedHeader : null)}>\n <h3 className={styles.title}>{title}</h3>\n {Icon ? (\n <Icon className={classnames(styles.icon, isExpended ? styles.expendedIcon : null)} />\n ) : null}\n </div>\n {isExpended ? (\n <div>\n <div\n className={styles.content} // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML={{__html: content}}\n />\n {image ? <img className={styles.image} src={image} alt={''} /> : null}\n </div>\n ) : null}\n </div>\n );\n};\n\nExpandableItem.propTypes = {\n title: PropTypes.string,\n icon: PropTypes.oneOf(keys(ICONS)),\n isExpended: PropTypes.bool,\n content: PropTypes.string,\n image: PropTypes.string,\n onClick: PropTypes.func\n};\n\nexport default ExpandableItem;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,SAAQC,kCAAkC,IAAIC,SAA9C,QAA8D,0BAA9D;AACA,OAAOC,MAAP,MAAmB,aAAnB;AAEA,OAAO,MAAMC,KAAK,GAAG;EACnBC,KAAK,EAAEH;AADY,CAAd;;AAIP,MAAMI,cAAc,GAAG,CAAC;EAACC,IAAD;EAAOC,KAAP;EAAcC,UAAd;EAA0BC,OAA1B;EAAmCC,OAAnC;EAA4CC;AAA5C,CAAD,KAAwD;EAC7E,MAAMC,IAAI,GAAGT,KAAK,CAACG,IAAD,CAAlB;EACA,oBACE;IAAK,SAAS,EAAEE,UAAU,GAAGN,MAAM,CAACW,iBAAV,GAA8BX,MAAM,CAACY,SAA/D;IAA0E,OAAO,EAAEJ;EAAnF,gBACE;IAAK,SAAS,EAAEX,UAAU,CAACG,MAAM,CAACa,MAAR,EAAgBP,UAAU,GAAGN,MAAM,CAACc,cAAV,GAA2B,IAArD;EAA1B,gBACE;IAAI,SAAS,EAAEd,MAAM,CAACK;EAAtB,GAA8BA,KAA9B,CADF,EAEGK,IAAI,gBACH,oBAAC,IAAD;IAAM,SAAS,EAAEb,UAAU,CAACG,MAAM,CAACI,IAAR,EAAcE,UAAU,GAAGN,MAAM,CAACe,YAAV,GAAyB,IAAjD;EAA3B,EADG,GAED,IAJN,CADF,EAOGT,UAAU,gBACT,8CACE;IACE,SAAS,EAAEN,MAAM,CAACO,OADpB,CAC6B;IAD7B;IAEE,uBAAuB,EAAE;MAACS,MAAM,EAAET;IAAT;EAF3B,EADF,EAKGE,KAAK,gBAAG;IAAK,SAAS,EAAET,MAAM,CAACS,KAAvB;IAA8B,GAAG,EAAEA,KAAnC;IAA0C,GAAG,EAAE;EAA/C,EAAH,GAA2D,IALnE,CADS,GAQP,IAfN,CADF;AAmBD,CArBD;;AAuBAN,cAAc,CAACc,SAAf,2CAA2B;EACzBZ,KAAK,EAAET,SAAS,CAACsB,MADQ;EAEzBd,IAAI,EAAER,SAAS,CAACuB,KAAV,CAAgB,MAAKlB,KAAL,CAAhB,CAFmB;EAGzBK,UAAU,EAAEV,SAAS,CAACwB,IAHG;EAIzBb,OAAO,EAAEX,SAAS,CAACsB,MAJM;EAKzBT,KAAK,EAAEb,SAAS,CAACsB,MALQ;EAMzBV,OAAO,EAAEZ,SAAS,CAACyB;AANM,CAA3B;AASA,eAAelB,cAAf"}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value breakpoints: "../../variables/breakpoints.css";
|
|
3
|
+
@value mobile from breakpoints;
|
|
4
|
+
@value tablet from breakpoints;
|
|
5
|
+
@value cm_primary_blue from colors;
|
|
6
|
+
@value cm_grey_500 from colors;
|
|
7
|
+
@value cm_grey_600 from colors;
|
|
8
|
+
@value cm_grey_800 from colors;
|
|
9
|
+
@value white from colors;
|
|
10
|
+
|
|
11
|
+
.container {
|
|
12
|
+
display: flex;
|
|
13
|
+
flex-direction: column;
|
|
14
|
+
background: white;
|
|
15
|
+
gap: 16px;
|
|
16
|
+
border-radius: 2px;
|
|
17
|
+
width: 100%;
|
|
18
|
+
display: flex;
|
|
19
|
+
height: 80px;
|
|
20
|
+
justify-content: center;
|
|
21
|
+
}
|
|
22
|
+
.header {
|
|
23
|
+
display: flex;
|
|
24
|
+
flex-direction: row;
|
|
25
|
+
flex: none;
|
|
26
|
+
order: 0;
|
|
27
|
+
flex-grow: 0;
|
|
28
|
+
justify-content: space-between;
|
|
29
|
+
align-items: center;
|
|
30
|
+
cursor: pointer;
|
|
31
|
+
height: 80px;
|
|
32
|
+
padding: 12px 40px;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.expendedContainer {
|
|
36
|
+
display: flex;
|
|
37
|
+
flex-direction: column;
|
|
38
|
+
background: white;
|
|
39
|
+
gap: 16px;
|
|
40
|
+
border-radius: 2px;
|
|
41
|
+
width: 100%;
|
|
42
|
+
display: flex;
|
|
43
|
+
justify-content: center;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.expendedHeader {
|
|
47
|
+
padding: 24px 40px 0px 40px;
|
|
48
|
+
border-radius: 10px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.title {
|
|
52
|
+
font-family: Gilroy;
|
|
53
|
+
font-size: 24px;
|
|
54
|
+
font-weight: 600;
|
|
55
|
+
line-height: 32px;
|
|
56
|
+
letter-spacing: 0px;
|
|
57
|
+
text-align: left;
|
|
58
|
+
color: cm_grey_800;
|
|
59
|
+
margin: 0;
|
|
60
|
+
font-weight: inherit;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.icon {
|
|
64
|
+
width: 16px;
|
|
65
|
+
height: 16px;
|
|
66
|
+
width: 14px;
|
|
67
|
+
left: 5px;
|
|
68
|
+
top: 9px;
|
|
69
|
+
border-radius: 0px;
|
|
70
|
+
color: cm_grey_800;
|
|
71
|
+
flex-shrink: 0;
|
|
72
|
+
min-width: 16px;
|
|
73
|
+
flex-basis: 16px;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.expendedIcon {
|
|
77
|
+
transform: rotateZ(180deg);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.content {
|
|
81
|
+
font-family: Gilroy;
|
|
82
|
+
font-size: 20px;
|
|
83
|
+
font-weight: 400;
|
|
84
|
+
line-height: 28px;
|
|
85
|
+
letter-spacing: 0px;
|
|
86
|
+
text-align: left;
|
|
87
|
+
padding: 0px 40px 32px 40px;
|
|
88
|
+
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.image {
|
|
92
|
+
width: 100%;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.content span{
|
|
96
|
+
font-family: Gilroy;
|
|
97
|
+
font-size: 20px;
|
|
98
|
+
font-weight: 400;
|
|
99
|
+
line-height: 28px;
|
|
100
|
+
letter-spacing: 0px;
|
|
101
|
+
text-align: left;
|
|
102
|
+
color: cm_grey_600;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
@media mobile {
|
|
106
|
+
.container {
|
|
107
|
+
display: flex;
|
|
108
|
+
flex-direction: column;
|
|
109
|
+
background: white;
|
|
110
|
+
gap: 16px;
|
|
111
|
+
border-radius: 2px;
|
|
112
|
+
width: 100%;
|
|
113
|
+
display: flex;
|
|
114
|
+
justify-content: center;
|
|
115
|
+
height: max-content;
|
|
116
|
+
}
|
|
117
|
+
.header {
|
|
118
|
+
display: flex;
|
|
119
|
+
flex-direction: row;
|
|
120
|
+
flex: none;
|
|
121
|
+
order: 0;
|
|
122
|
+
flex-grow: 0;
|
|
123
|
+
justify-content: space-between;
|
|
124
|
+
align-items: center;
|
|
125
|
+
cursor: pointer;
|
|
126
|
+
padding: 12px 40px;
|
|
127
|
+
height: max-content;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/// <reference path="../../../src/globals.d.ts" />
|
|
2
|
+
export namespace ICONS {
|
|
3
|
+
export { ArrowIcon as arrow };
|
|
4
|
+
}
|
|
5
|
+
export default ExpandableList;
|
|
6
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from "@coorpacademy/nova-icons";
|
|
7
|
+
declare function ExpandableList({ items }: {
|
|
8
|
+
items: any;
|
|
9
|
+
}): JSX.Element;
|
|
10
|
+
declare namespace ExpandableList {
|
|
11
|
+
namespace propTypes {
|
|
12
|
+
const items: PropTypes.Requireable<any[]>;
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
import PropTypes from "prop-types";
|
|
16
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/expandable-list/index.js"],"names":[],"mappings":";;;;;;AAUA;;gBAaC"}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
3
|
+
import React from 'react';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
5
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from '@coorpacademy/nova-icons';
|
|
6
|
+
import ExpandableItem from '../expandable-item';
|
|
7
|
+
import styles from './style.css';
|
|
8
|
+
export const ICONS = {
|
|
9
|
+
arrow: ArrowIcon
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
const ExpandableList = ({
|
|
13
|
+
items
|
|
14
|
+
}) => {
|
|
15
|
+
return /*#__PURE__*/React.createElement("ul", {
|
|
16
|
+
className: styles.list,
|
|
17
|
+
"data-name": "expandable-item"
|
|
18
|
+
}, items.map((item, index) => {
|
|
19
|
+
const handleClick = item.onClick;
|
|
20
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
21
|
+
onClick: handleClick,
|
|
22
|
+
key: `menu-link-item-${index}`,
|
|
23
|
+
className: styles.item
|
|
24
|
+
}, /*#__PURE__*/React.createElement(ExpandableItem, _extends({}, item, {
|
|
25
|
+
className: styles.expandableItem
|
|
26
|
+
})));
|
|
27
|
+
}));
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
ExpandableList.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
31
|
+
items: PropTypes.arrayOf(ExpandableItem.propTypes)
|
|
32
|
+
} : {};
|
|
33
|
+
export default ExpandableList;
|
|
34
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","NovaCompositionNavigationArrowDown","ArrowIcon","ExpandableItem","styles","ICONS","arrow","ExpandableList","items","list","map","item","index","handleClick","onClick","expandableItem","propTypes","arrayOf"],"sources":["../../../src/molecule/expandable-list/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {NovaCompositionNavigationArrowDown as ArrowIcon} from '@coorpacademy/nova-icons';\nimport ExpandableItem from '../expandable-item';\nimport styles from './style.css';\n\nexport const ICONS = {\n arrow: ArrowIcon\n};\n\nconst ExpandableList = ({items}) => {\n return (\n <ul className={styles.list} data-name=\"expandable-item\">\n {items.map((item, index) => {\n const handleClick = item.onClick;\n return (\n <li onClick={handleClick} key={`menu-link-item-${index}`} className={styles.item}>\n <ExpandableItem {...item} className={styles.expandableItem} />\n </li>\n );\n })}\n </ul>\n );\n};\n\nExpandableList.propTypes = {\n items: PropTypes.arrayOf(ExpandableItem.propTypes)\n};\n\nexport default ExpandableList;\n"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAAQC,kCAAkC,IAAIC,SAA9C,QAA8D,0BAA9D;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,MAAP,MAAmB,aAAnB;AAEA,OAAO,MAAMC,KAAK,GAAG;EACnBC,KAAK,EAAEJ;AADY,CAAd;;AAIP,MAAMK,cAAc,GAAG,CAAC;EAACC;AAAD,CAAD,KAAa;EAClC,oBACE;IAAI,SAAS,EAAEJ,MAAM,CAACK,IAAtB;IAA4B,aAAU;EAAtC,GACGD,KAAK,CAACE,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,KAAiB;IAC1B,MAAMC,WAAW,GAAGF,IAAI,CAACG,OAAzB;IACA,oBACE;MAAI,OAAO,EAAED,WAAb;MAA0B,GAAG,EAAG,kBAAiBD,KAAM,EAAvD;MAA0D,SAAS,EAAER,MAAM,CAACO;IAA5E,gBACE,oBAAC,cAAD,eAAoBA,IAApB;MAA0B,SAAS,EAAEP,MAAM,CAACW;IAA5C,GADF,CADF;EAKD,CAPA,CADH,CADF;AAYD,CAbD;;AAeAR,cAAc,CAACS,SAAf,2CAA2B;EACzBR,KAAK,EAAER,SAAS,CAACiB,OAAV,CAAkBd,cAAc,CAACa,SAAjC;AADkB,CAA3B;AAIA,eAAeT,cAAf"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value breakpoints: "../../variables/breakpoints.css";
|
|
3
|
+
@value mobile from breakpoints;
|
|
4
|
+
@value tablet from breakpoints;
|
|
5
|
+
@value cm_primary_blue from colors;
|
|
6
|
+
@value cm_grey_500 from colors;
|
|
7
|
+
@value cm_grey_800 from colors;
|
|
8
|
+
|
|
9
|
+
.list {
|
|
10
|
+
list-style: none;
|
|
11
|
+
cursor: pointer;
|
|
12
|
+
margin: 0;
|
|
13
|
+
padding: 0;
|
|
14
|
+
gap: 24px;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.item {
|
|
18
|
+
display: flex;
|
|
19
|
+
flex-direction: row;
|
|
20
|
+
margin-bottom: 24px;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.expandableItem {
|
|
24
|
+
|
|
25
|
+
}
|
|
@@ -26,6 +26,8 @@ declare namespace Hero {
|
|
|
26
26
|
}
|
|
27
27
|
namespace propTypes {
|
|
28
28
|
const image: PropTypes.Requireable<string>;
|
|
29
|
+
const mode: PropTypes.Requireable<string>;
|
|
30
|
+
const description: PropTypes.Requireable<string>;
|
|
29
31
|
const title: PropTypes.Requireable<string>;
|
|
30
32
|
const author: PropTypes.Requireable<string>;
|
|
31
33
|
const progress: PropTypes.Requireable<number>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/hero/index.js"],"names":[],"mappings":";AASA,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/hero/index.js"],"names":[],"mappings":";AASA,6DAkDC"}
|
|
@@ -17,7 +17,9 @@ const Hero = (props, context) => {
|
|
|
17
17
|
author,
|
|
18
18
|
progress,
|
|
19
19
|
onClick,
|
|
20
|
-
submitValue
|
|
20
|
+
submitValue,
|
|
21
|
+
description,
|
|
22
|
+
mode = MODES.HERO
|
|
21
23
|
} = props;
|
|
22
24
|
|
|
23
25
|
const primaryColor = _get('common.primary', skin);
|
|
@@ -35,12 +37,18 @@ const Hero = (props, context) => {
|
|
|
35
37
|
backgroundColor: primaryColor,
|
|
36
38
|
backgroundImage: image ? `url('${image}')` : 'none'
|
|
37
39
|
}
|
|
38
|
-
})), /*#__PURE__*/React.createElement(CardContentInfo, {
|
|
40
|
+
})), mode === MODES.HERO ? /*#__PURE__*/React.createElement(CardContentInfo, {
|
|
39
41
|
mode: MODES.HERO,
|
|
40
42
|
author: author,
|
|
41
43
|
progress: progress,
|
|
42
44
|
title: title
|
|
43
|
-
})
|
|
45
|
+
}) : /*#__PURE__*/React.createElement("div", {
|
|
46
|
+
className: style.infoWrapper
|
|
47
|
+
}, /*#__PURE__*/React.createElement("h1", {
|
|
48
|
+
className: style.title
|
|
49
|
+
}, title), /*#__PURE__*/React.createElement("p", {
|
|
50
|
+
className: style.description
|
|
51
|
+
}, description)), mode === MODES.HERO ? /*#__PURE__*/React.createElement("div", {
|
|
44
52
|
className: style.heroButtonWrapper
|
|
45
53
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
46
54
|
type: "link",
|
|
@@ -51,7 +59,7 @@ const Hero = (props, context) => {
|
|
|
51
59
|
style: {
|
|
52
60
|
backgroundColor: primaryColor
|
|
53
61
|
}
|
|
54
|
-
})));
|
|
62
|
+
})) : null);
|
|
55
63
|
};
|
|
56
64
|
|
|
57
65
|
Hero.contextTypes = {
|
|
@@ -59,6 +67,8 @@ Hero.contextTypes = {
|
|
|
59
67
|
};
|
|
60
68
|
Hero.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
61
69
|
image: PropTypes.string,
|
|
70
|
+
mode: PropTypes.string,
|
|
71
|
+
description: PropTypes.string,
|
|
62
72
|
title: CardContentInfo.propTypes.title,
|
|
63
73
|
author: CardContentInfo.propTypes.author,
|
|
64
74
|
progress: CardContentInfo.propTypes.progress,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","Button","CardContentInfo","MODES","style","Hero","props","context","skin","image","title","author","progress","onClick","submitValue","primaryColor","cardStyle","hero","lazy","imageWrapper","backgroundColor","backgroundImage","
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","Provider","Button","CardContentInfo","MODES","style","Hero","props","context","skin","image","title","author","progress","onClick","submitValue","description","mode","HERO","primaryColor","cardStyle","hero","lazy","imageWrapper","backgroundColor","backgroundImage","infoWrapper","heroButtonWrapper","heroButton","contextTypes","childContextTypes","propTypes","string"],"sources":["../../../src/molecule/hero/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport {get} from 'lodash/fp';\nimport Provider from '../../atom/provider';\nimport Button from '../../atom/button';\nimport CardContentInfo, {MODES} from '../card-content';\nimport style from './style.css';\n\nconst Hero = (props, context) => {\n const {skin} = context;\n const {\n image,\n title,\n author,\n progress,\n onClick,\n submitValue,\n description,\n mode = MODES.HERO\n } = props;\n\n const primaryColor = get('common.primary', skin);\n const cardStyle = classnames(style.hero, title ? null : style.lazy);\n\n return (\n <div className={cardStyle} data-name=\"hero\">\n <div className={style.imageWrapper}>\n <div\n data-name=\"cover\"\n className={style.image}\n style={{\n backgroundColor: primaryColor,\n backgroundImage: image ? `url('${image}')` : 'none'\n }}\n />\n </div>\n {mode === MODES.HERO ? (\n <CardContentInfo mode={MODES.HERO} author={author} progress={progress} title={title} />\n ) : (\n <div className={style.infoWrapper}>\n <h1 className={style.title}>{title}</h1>\n <p className={style.description}>{description}</p>\n </div>\n )}\n {mode === MODES.HERO ? (\n <div className={style.heroButtonWrapper}>\n <Button\n type=\"link\"\n data-name=\"hero-button\"\n onClick={onClick}\n submitValue={submitValue}\n className={style.heroButton}\n style={{backgroundColor: primaryColor}}\n />\n </div>\n ) : null}\n </div>\n );\n};\n\nHero.contextTypes = {\n skin: Provider.childContextTypes.skin\n};\n\nHero.propTypes = {\n image: PropTypes.string,\n mode: PropTypes.string,\n description: PropTypes.string,\n title: CardContentInfo.propTypes.title,\n author: CardContentInfo.propTypes.author,\n progress: CardContentInfo.propTypes.progress,\n onClick: Button.propTypes.onClick,\n submitValue: Button.propTypes.submitValue\n};\n\nexport default Hero;\n"],"mappings":";AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA,OAAOC,QAAP,MAAqB,qBAArB;AACA,OAAOC,MAAP,MAAmB,mBAAnB;AACA,OAAOC,eAAP,IAAyBC,KAAzB,QAAqC,iBAArC;AACA,OAAOC,KAAP,MAAkB,aAAlB;;AAEA,MAAMC,IAAI,GAAG,CAACC,KAAD,EAAQC,OAAR,KAAoB;EAC/B,MAAM;IAACC;EAAD,IAASD,OAAf;EACA,MAAM;IACJE,KADI;IAEJC,KAFI;IAGJC,MAHI;IAIJC,QAJI;IAKJC,OALI;IAMJC,WANI;IAOJC,WAPI;IAQJC,IAAI,GAAGb,KAAK,CAACc;EART,IASFX,KATJ;;EAWA,MAAMY,YAAY,GAAG,KAAI,gBAAJ,EAAsBV,IAAtB,CAArB;;EACA,MAAMW,SAAS,GAAGpB,UAAU,CAACK,KAAK,CAACgB,IAAP,EAAaV,KAAK,GAAG,IAAH,GAAUN,KAAK,CAACiB,IAAlC,CAA5B;EAEA,oBACE;IAAK,SAAS,EAAEF,SAAhB;IAA2B,aAAU;EAArC,gBACE;IAAK,SAAS,EAAEf,KAAK,CAACkB;EAAtB,gBACE;IACE,aAAU,OADZ;IAEE,SAAS,EAAElB,KAAK,CAACK,KAFnB;IAGE,KAAK,EAAE;MACLc,eAAe,EAAEL,YADZ;MAELM,eAAe,EAAEf,KAAK,GAAI,QAAOA,KAAM,IAAjB,GAAuB;IAFxC;EAHT,EADF,CADF,EAWGO,IAAI,KAAKb,KAAK,CAACc,IAAf,gBACC,oBAAC,eAAD;IAAiB,IAAI,EAAEd,KAAK,CAACc,IAA7B;IAAmC,MAAM,EAAEN,MAA3C;IAAmD,QAAQ,EAAEC,QAA7D;IAAuE,KAAK,EAAEF;EAA9E,EADD,gBAGC;IAAK,SAAS,EAAEN,KAAK,CAACqB;EAAtB,gBACE;IAAI,SAAS,EAAErB,KAAK,CAACM;EAArB,GAA6BA,KAA7B,CADF,eAEE;IAAG,SAAS,EAAEN,KAAK,CAACW;EAApB,GAAkCA,WAAlC,CAFF,CAdJ,EAmBGC,IAAI,KAAKb,KAAK,CAACc,IAAf,gBACC;IAAK,SAAS,EAAEb,KAAK,CAACsB;EAAtB,gBACE,oBAAC,MAAD;IACE,IAAI,EAAC,MADP;IAEE,aAAU,aAFZ;IAGE,OAAO,EAAEb,OAHX;IAIE,WAAW,EAAEC,WAJf;IAKE,SAAS,EAAEV,KAAK,CAACuB,UALnB;IAME,KAAK,EAAE;MAACJ,eAAe,EAAEL;IAAlB;EANT,EADF,CADD,GAWG,IA9BN,CADF;AAkCD,CAlDD;;AAoDAb,IAAI,CAACuB,YAAL,GAAoB;EAClBpB,IAAI,EAAER,QAAQ,CAAC6B,iBAAT,CAA2BrB;AADf,CAApB;AAIAH,IAAI,CAACyB,SAAL,2CAAiB;EACfrB,KAAK,EAAEX,SAAS,CAACiC,MADF;EAEff,IAAI,EAAElB,SAAS,CAACiC,MAFD;EAGfhB,WAAW,EAAEjB,SAAS,CAACiC,MAHR;EAIfrB,KAAK,EAAER,eAAe,CAAC4B,SAAhB,CAA0BpB,KAJlB;EAKfC,MAAM,EAAET,eAAe,CAAC4B,SAAhB,CAA0BnB,MALnB;EAMfC,QAAQ,EAAEV,eAAe,CAAC4B,SAAhB,CAA0BlB,QANrB;EAOfC,OAAO,EAAEZ,MAAM,CAAC6B,SAAP,CAAiBjB,OAPX;EAQfC,WAAW,EAAEb,MAAM,CAAC6B,SAAP,CAAiBhB;AARf,CAAjB;AAWA,eAAeT,IAAf"}
|
|
@@ -156,3 +156,45 @@
|
|
|
156
156
|
opacity: 0;
|
|
157
157
|
}
|
|
158
158
|
}
|
|
159
|
+
|
|
160
|
+
.infoWrapper {
|
|
161
|
+
display: flex;
|
|
162
|
+
flex-direction: column;
|
|
163
|
+
position: relative;
|
|
164
|
+
justify-content: center;
|
|
165
|
+
padding: 0 40px;
|
|
166
|
+
width: 100%;
|
|
167
|
+
box-sizing: border-box;
|
|
168
|
+
color: white;
|
|
169
|
+
align-self: center;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
.title {
|
|
173
|
+
font-family: Gilroy;
|
|
174
|
+
font-size: 40px;
|
|
175
|
+
font-weight: 600;
|
|
176
|
+
line-height: 48px;
|
|
177
|
+
letter-spacing: 0px;
|
|
178
|
+
text-align: center;
|
|
179
|
+
overflow: hidden;
|
|
180
|
+
user-select: none;
|
|
181
|
+
margin: 0;
|
|
182
|
+
align-self: center;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
.description {
|
|
186
|
+
text-align: center;
|
|
187
|
+
margin-top: 12px;
|
|
188
|
+
font-size: 17px;
|
|
189
|
+
font-family: Gilroy;
|
|
190
|
+
font-size: 16px;
|
|
191
|
+
font-weight: 400;
|
|
192
|
+
line-height: 24px;
|
|
193
|
+
letter-spacing: 0px;
|
|
194
|
+
overflow: hidden;
|
|
195
|
+
user-select: none;
|
|
196
|
+
max-width: 650px;
|
|
197
|
+
padding: 0;
|
|
198
|
+
margin: 0;
|
|
199
|
+
align-self: center;
|
|
200
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export default MenuLinks;
|
|
2
|
+
declare function MenuLinks({ items, title }: {
|
|
3
|
+
items: any;
|
|
4
|
+
title: any;
|
|
5
|
+
}): JSX.Element;
|
|
6
|
+
declare namespace MenuLinks {
|
|
7
|
+
namespace propTypes {
|
|
8
|
+
const title: PropTypes.Requireable<string>;
|
|
9
|
+
const items: PropTypes.Requireable<(PropTypes.InferProps<{
|
|
10
|
+
text: PropTypes.Requireable<string>;
|
|
11
|
+
isSelected: PropTypes.Requireable<boolean>;
|
|
12
|
+
onclick: PropTypes.Requireable<(...args: any[]) => any>;
|
|
13
|
+
isShowMoreItem: PropTypes.Requireable<boolean>;
|
|
14
|
+
}> | null | undefined)[]>;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
import PropTypes from "prop-types";
|
|
18
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/menu-links/index.js"],"names":[],"mappings":";AAKA;;;gBAwBC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import classnames from 'classnames';
|
|
4
|
+
import styles from './style.css';
|
|
5
|
+
|
|
6
|
+
const MenuLinks = ({
|
|
7
|
+
items,
|
|
8
|
+
title
|
|
9
|
+
}) => {
|
|
10
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
11
|
+
className: styles.container
|
|
12
|
+
}, /*#__PURE__*/React.createElement("h2", {
|
|
13
|
+
className: styles.title
|
|
14
|
+
}, title), /*#__PURE__*/React.createElement("ul", {
|
|
15
|
+
className: styles.list,
|
|
16
|
+
"data-name": "menu-links"
|
|
17
|
+
}, items.map((item, index) => {
|
|
18
|
+
const {
|
|
19
|
+
onClick
|
|
20
|
+
} = item;
|
|
21
|
+
return /*#__PURE__*/React.createElement("li", {
|
|
22
|
+
key: `menu-link-item-${index}`,
|
|
23
|
+
className: styles.item
|
|
24
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
25
|
+
onClick: onClick,
|
|
26
|
+
className: item.isSelected ? styles.border : null
|
|
27
|
+
}), /*#__PURE__*/React.createElement("span", {
|
|
28
|
+
className: classnames(item.isShowMoreItem ? styles.showMoreItem : styles.itemText, item.isSelected ? styles.selectedItem : undefined)
|
|
29
|
+
}, item.text));
|
|
30
|
+
})));
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
MenuLinks.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
34
|
+
title: PropTypes.string,
|
|
35
|
+
items: PropTypes.arrayOf(PropTypes.shape({
|
|
36
|
+
text: PropTypes.string,
|
|
37
|
+
isSelected: PropTypes.bool,
|
|
38
|
+
onclick: PropTypes.func,
|
|
39
|
+
isShowMoreItem: PropTypes.bool
|
|
40
|
+
}))
|
|
41
|
+
} : {};
|
|
42
|
+
export default MenuLinks;
|
|
43
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["React","PropTypes","classnames","styles","MenuLinks","items","title","container","list","map","item","index","onClick","isSelected","border","isShowMoreItem","showMoreItem","itemText","selectedItem","undefined","text","propTypes","string","arrayOf","shape","bool","onclick","func"],"sources":["../../../src/molecule/menu-links/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\nimport styles from './style.css';\n\nconst MenuLinks = ({items, title}) => {\n return (\n <div className={styles.container}>\n <h2 className={styles.title}>{title}</h2>\n <ul className={styles.list} data-name=\"menu-links\">\n {items.map((item, index) => {\n const {onClick} = item;\n return (\n <li key={`menu-link-item-${index}`} className={styles.item}>\n <div onClick={onClick} className={item.isSelected ? styles.border : null} />\n <span\n className={classnames(\n item.isShowMoreItem ? styles.showMoreItem : styles.itemText,\n item.isSelected ? styles.selectedItem : undefined\n )}\n >\n {item.text}\n </span>\n </li>\n );\n })}\n </ul>\n </div>\n );\n};\n\nMenuLinks.propTypes = {\n title: PropTypes.string,\n items: PropTypes.arrayOf(\n PropTypes.shape({\n text: PropTypes.string,\n isSelected: PropTypes.bool,\n onclick: PropTypes.func,\n isShowMoreItem: PropTypes.bool\n })\n )\n};\n\nexport default MenuLinks;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AACA,OAAOC,MAAP,MAAmB,aAAnB;;AAEA,MAAMC,SAAS,GAAG,CAAC;EAACC,KAAD;EAAQC;AAAR,CAAD,KAAoB;EACpC,oBACE;IAAK,SAAS,EAAEH,MAAM,CAACI;EAAvB,gBACE;IAAI,SAAS,EAAEJ,MAAM,CAACG;EAAtB,GAA8BA,KAA9B,CADF,eAEE;IAAI,SAAS,EAAEH,MAAM,CAACK,IAAtB;IAA4B,aAAU;EAAtC,GACGH,KAAK,CAACI,GAAN,CAAU,CAACC,IAAD,EAAOC,KAAP,KAAiB;IAC1B,MAAM;MAACC;IAAD,IAAYF,IAAlB;IACA,oBACE;MAAI,GAAG,EAAG,kBAAiBC,KAAM,EAAjC;MAAoC,SAAS,EAAER,MAAM,CAACO;IAAtD,gBACE;MAAK,OAAO,EAAEE,OAAd;MAAuB,SAAS,EAAEF,IAAI,CAACG,UAAL,GAAkBV,MAAM,CAACW,MAAzB,GAAkC;IAApE,EADF,eAEE;MACE,SAAS,EAAEZ,UAAU,CACnBQ,IAAI,CAACK,cAAL,GAAsBZ,MAAM,CAACa,YAA7B,GAA4Cb,MAAM,CAACc,QADhC,EAEnBP,IAAI,CAACG,UAAL,GAAkBV,MAAM,CAACe,YAAzB,GAAwCC,SAFrB;IADvB,GAMGT,IAAI,CAACU,IANR,CAFF,CADF;EAaD,CAfA,CADH,CAFF,CADF;AAuBD,CAxBD;;AA0BAhB,SAAS,CAACiB,SAAV,2CAAsB;EACpBf,KAAK,EAAEL,SAAS,CAACqB,MADG;EAEpBjB,KAAK,EAAEJ,SAAS,CAACsB,OAAV,CACLtB,SAAS,CAACuB,KAAV,CAAgB;IACdJ,IAAI,EAAEnB,SAAS,CAACqB,MADF;IAEdT,UAAU,EAAEZ,SAAS,CAACwB,IAFR;IAGdC,OAAO,EAAEzB,SAAS,CAAC0B,IAHL;IAIdZ,cAAc,EAAEd,SAAS,CAACwB;EAJZ,CAAhB,CADK;AAFa,CAAtB;AAYA,eAAerB,SAAf"}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
@value colors: "../../variables/colors.css";
|
|
2
|
+
@value breakpoints: "../../variables/breakpoints.css";
|
|
3
|
+
@value mobile from breakpoints;
|
|
4
|
+
@value tablet from breakpoints;
|
|
5
|
+
@value cm_primary_blue from colors;
|
|
6
|
+
@value cm_grey_500 from colors;
|
|
7
|
+
@value cm_grey_800 from colors;
|
|
8
|
+
|
|
9
|
+
.container {
|
|
10
|
+
display: flex;
|
|
11
|
+
flex-direction: column;
|
|
12
|
+
align-items: flex-start;
|
|
13
|
+
padding: 40px 40px 40px 0px;
|
|
14
|
+
gap: 24px;
|
|
15
|
+
background: #FFFFFF;
|
|
16
|
+
border-radius: 10px;
|
|
17
|
+
/* Inside auto layout */
|
|
18
|
+
flex: none;
|
|
19
|
+
order: 0;
|
|
20
|
+
flex-grow: 0;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.title {
|
|
24
|
+
padding: 0px 0px 0px 40px;
|
|
25
|
+
margin: 0;
|
|
26
|
+
font-family: 'Gilroy';
|
|
27
|
+
font-style: normal;
|
|
28
|
+
font-weight: 600;
|
|
29
|
+
font-size: 24px;
|
|
30
|
+
line-height: 32px;
|
|
31
|
+
order: 0;
|
|
32
|
+
flex-grow: 0;
|
|
33
|
+
z-index: 0;
|
|
34
|
+
color: cm_grey_500;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
.list {
|
|
38
|
+
list-style: none;
|
|
39
|
+
cursor: pointer;
|
|
40
|
+
margin: 0;
|
|
41
|
+
padding: 0;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.item {
|
|
45
|
+
display: flex;
|
|
46
|
+
flex-direction: row;
|
|
47
|
+
gap: 36px;
|
|
48
|
+
margin-bottom: 16px;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.itemText {
|
|
52
|
+
font-family: Gilroy;
|
|
53
|
+
font-size: 20px;
|
|
54
|
+
font-weight: 500;
|
|
55
|
+
line-height: 28px;
|
|
56
|
+
letter-spacing: 0px;
|
|
57
|
+
font-style: normal;
|
|
58
|
+
text-align: left;
|
|
59
|
+
margin: 0;
|
|
60
|
+
color: cm_grey_800;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.border {
|
|
64
|
+
width: 4px;
|
|
65
|
+
font-weight: inherit;
|
|
66
|
+
background-color: cm_primary_blue;
|
|
67
|
+
flex-shrink: 0;
|
|
68
|
+
min-width: 4px;
|
|
69
|
+
flex-basis: 4px;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
.showMoreItem {
|
|
73
|
+
font-family: 'Gilroy';
|
|
74
|
+
font-style: normal;
|
|
75
|
+
font-weight: 200;
|
|
76
|
+
font-size: 24px;
|
|
77
|
+
line-height: 32px;
|
|
78
|
+
color: cm_primary_blue;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.selectedItem {
|
|
82
|
+
color: cm_primary_blue;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
.item:hover{
|
|
86
|
+
text-decoration: underline;
|
|
87
|
+
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/// <reference path="../../../src/globals.d.ts" />
|
|
2
|
+
export namespace ICONS {
|
|
3
|
+
export { ArrowIcon as arrow };
|
|
4
|
+
}
|
|
5
|
+
export default PrivacyPolicyContact;
|
|
6
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from "@coorpacademy/nova-icons";
|
|
7
|
+
declare function PrivacyPolicyContact({ title, content }: {
|
|
8
|
+
title: any;
|
|
9
|
+
content: any;
|
|
10
|
+
}): JSX.Element;
|
|
11
|
+
declare namespace PrivacyPolicyContact {
|
|
12
|
+
namespace propTypes {
|
|
13
|
+
const title: PropTypes.Requireable<string>;
|
|
14
|
+
const content: PropTypes.Requireable<string>;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
import PropTypes from "prop-types";
|
|
18
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/privacy-policy-contact/index.js"],"names":[],"mappings":";;;;;;AASA;;;gBAWC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import { NovaCompositionNavigationArrowDown as ArrowIcon } from '@coorpacademy/nova-icons';
|
|
4
|
+
import styles from './style.css';
|
|
5
|
+
export const ICONS = {
|
|
6
|
+
arrow: ArrowIcon
|
|
7
|
+
};
|
|
8
|
+
|
|
9
|
+
const PrivacyPolicyContact = ({
|
|
10
|
+
title,
|
|
11
|
+
content
|
|
12
|
+
}) => {
|
|
13
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
14
|
+
className: styles.container
|
|
15
|
+
}, /*#__PURE__*/React.createElement("h3", {
|
|
16
|
+
className: styles.title // eslint-disable-next-line react/no-danger
|
|
17
|
+
,
|
|
18
|
+
dangerouslySetInnerHTML: {
|
|
19
|
+
__html: title
|
|
20
|
+
}
|
|
21
|
+
}), /*#__PURE__*/React.createElement("p", {
|
|
22
|
+
className: styles.content
|
|
23
|
+
}, content));
|
|
24
|
+
};
|
|
25
|
+
|
|
26
|
+
PrivacyPolicyContact.propTypes = process.env.NODE_ENV !== "production" ? {
|
|
27
|
+
title: PropTypes.string,
|
|
28
|
+
content: PropTypes.string
|
|
29
|
+
} : {};
|
|
30
|
+
export default PrivacyPolicyContact;
|
|
31
|
+
//# sourceMappingURL=index.js.map
|