trepur_components 1.0.11 → 1.0.13
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/src/lib/components/Card/style.module.css +5 -21
- package/dist/src/lib/components/Card/style.module.css.map +1 -1
- package/dist/src/lib/components/CardWithTopImage/style.module.css +5 -1
- package/dist/src/lib/components/CardWithTopImage/style.module.css.map +1 -1
- package/dist/src/lib/components/Carousel/Carousel.d.ts +3 -0
- package/dist/src/lib/components/Carousel/Carousel.js +19 -20
- package/dist/src/lib/components/Carousel/Carousel.js.map +1 -1
- package/dist/src/lib/components/ComponentWrapper/ComponentWrapper.d.ts +12 -0
- package/dist/src/lib/components/ComponentWrapper/ComponentWrapper.js +15 -0
- package/dist/src/lib/components/ComponentWrapper/ComponentWrapper.js.map +1 -0
- package/dist/src/lib/components/ComponentWrapper/style.module.css +83 -0
- package/dist/src/lib/components/ComponentWrapper/style.module.css.map +1 -0
- package/dist/src/lib/components/Container/Container.js +1 -1
- package/dist/src/lib/components/Container/Container.js.map +1 -1
- package/dist/src/lib/components/Container/style.module.css +3 -3
- package/dist/src/lib/components/Container/style.module.css.map +1 -1
- package/dist/src/lib/components/Footer/Footer.js.map +1 -1
- package/dist/src/lib/components/Icon/Icon.js +4 -3
- package/dist/src/lib/components/Icon/Icon.js.map +1 -1
- package/dist/src/lib/components/Icon/style.module.css +48 -0
- package/dist/src/lib/components/Icon/style.module.css.map +1 -1
- package/dist/src/lib/components/InformationIcon/InformationIcon.js +1 -1
- package/dist/src/lib/components/InformationIcon/InformationIcon.js.map +1 -1
- package/dist/src/lib/components/InformationIcon/style.module.css +8 -12
- package/dist/src/lib/components/InformationIcon/style.module.css.map +1 -1
- package/dist/src/lib/components/Nav/Nav.js.map +1 -1
- package/dist/src/lib/components/Proficiencies/Proficiencies.d.ts +13 -0
- package/dist/src/lib/components/Proficiencies/Proficiencies.js +16 -0
- package/dist/src/lib/components/Proficiencies/Proficiencies.js.map +1 -0
- package/dist/src/lib/components/Proficiencies/style.module.css +59 -0
- package/dist/src/lib/components/Proficiencies/style.module.css.map +1 -0
- package/dist/src/lib/components/SocialBlock/SocialBlock.d.ts +7 -3
- package/dist/src/lib/components/SocialBlock/SocialBlock.js +6 -16
- package/dist/src/lib/components/SocialBlock/SocialBlock.js.map +1 -1
- package/dist/src/lib/components/SocialButton/SocialButton.d.ts +11 -0
- package/dist/src/lib/components/SocialButton/SocialButton.js +22 -0
- package/dist/src/lib/components/SocialButton/SocialButton.js.map +1 -0
- package/dist/src/lib/components/SocialButton/style.module.css +111 -0
- package/dist/src/lib/components/SocialButton/style.module.css.map +1 -0
- package/dist/src/lib/components/Testimonial/Testimonial.js.map +1 -1
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.d.ts +3 -2
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.js +5 -5
- package/dist/src/lib/components/TextAndTitle/TextAndTitle.js.map +1 -1
- package/dist/src/lib/components/TextAndTitle/style.module.css +0 -12
- package/dist/src/lib/components/TextAndTitle/style.module.css.map +1 -1
- package/dist/src/lib/components/Timeline/Timeline.d.ts +5 -1
- package/dist/src/lib/components/Timeline/Timeline.js +7 -6
- package/dist/src/lib/components/Timeline/Timeline.js.map +1 -1
- package/dist/src/lib/components/Timeline/style.module.css +12 -24
- package/dist/src/lib/components/Timeline/style.module.css.map +1 -1
- package/dist/src/lib/utils/controls.d.ts +1 -1
- package/dist/tailwind.config.d.ts +9 -0
- package/dist/tailwind.config.js +9 -0
- package/dist/tailwind.config.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Proficiencies.js","sourceRoot":"","sources":["../../../../../src/lib/components/Proficiencies/Proficiencies.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AACtC,OAAO,gBAAgB,MAAM,+CAA+C,CAAA;AAC5E,OAAO,KAA8B,MAAM,yBAAyB,CAAA;AACpE,OAAO,MAAM,MAAM,2BAA2B,CAAA;AAY9C,MAAM,aAAa,GAAG,CAAC,EACrB,EAAE,EACF,SAAS,EACT,KAAK,EACL,WAAW,EACX,aAAa,EACb,QAAQ,EACF,EAAe,EAAE;IACvB,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAExD,OAAO,CACL,oBAAC,gBAAgB,IACf,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ;QAElB,6BAAK,SAAS,EAAE,KAAK,CAAC,aAAa,IAChC,aAAa,CAAC,GAAG,CAAC,CAAC,WAAW,EAAE,CAAC,EAAE,EAAE;YACpC,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,QAAQ,CAAC,EAAE,EAChB,SAAS,EAAE,KAAK,CAAC,MAAM,EACvB,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,CAAC;gBAEL,oBAAC,KAAK,IACJ,KAAK,EAAE,WAAW,CAAC,KAAK,EACxB,WAAW,EAAE,WAAW,CAAC,WAAW,EACpC,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,CAAC,GACT,CACK,CACV,CAAA;QACH,CAAC,CAAC,CACE,CACW,CACpB,CAAA;AACH,CAAC,CAAA;AAED,eAAe,aAAa,CAAA"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
.classList {
|
|
2
|
+
|
|
3
|
+
margin-left: auto;
|
|
4
|
+
|
|
5
|
+
margin-right: auto;
|
|
6
|
+
|
|
7
|
+
width: 100%
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.container {
|
|
11
|
+
|
|
12
|
+
padding-top: 2rem;
|
|
13
|
+
|
|
14
|
+
padding-bottom: 2rem
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.heading {
|
|
18
|
+
|
|
19
|
+
padding-top: 0px
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.title {
|
|
23
|
+
|
|
24
|
+
padding-bottom: 0.5rem;
|
|
25
|
+
|
|
26
|
+
font-size: 32px;
|
|
27
|
+
|
|
28
|
+
font-weight: 500;
|
|
29
|
+
|
|
30
|
+
--tw-text-opacity: 1;
|
|
31
|
+
|
|
32
|
+
color: rgb(44 55 59 / var(--tw-text-opacity))
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
.description {
|
|
36
|
+
|
|
37
|
+
padding-bottom: 2rem;
|
|
38
|
+
|
|
39
|
+
font-size: 24px;
|
|
40
|
+
|
|
41
|
+
font-weight: 500;
|
|
42
|
+
|
|
43
|
+
--tw-text-opacity: 1;
|
|
44
|
+
|
|
45
|
+
color: rgb(44 55 59 / var(--tw-text-opacity))
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.columnWrapper {
|
|
49
|
+
|
|
50
|
+
display: flex;
|
|
51
|
+
|
|
52
|
+
flex-wrap: wrap
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.column {
|
|
56
|
+
|
|
57
|
+
padding-bottom: 1rem
|
|
58
|
+
}
|
|
59
|
+
/*# sourceMappingURL=style.module.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/lib/components/Proficiencies/style.module.css"],"names":[],"mappings":"AACI;;IAAA,iBAAqB;;IAArB,kBAAqB;;IAArB;AAAqB;;AAIvB;;IAAA,iBAAW;;IAAX;AAAW;;AAIX;;IAAA;AAAW;;AAIX;;IAAA,sBAAyC;;IAAzC,eAAyC;;IAAzC,gBAAyC;;IAAzC,oBAAyC;;IAAzC;AAAyC;;AAIzC;;IAAA,oBAAyC;;IAAzC,eAAyC;;IAAzC,gBAAyC;;IAAzC,oBAAyC;;IAAzC;AAAyC;;AAIzC;;IAAA,aAAqB;;IAArB;AAAqB;;AAIrB;;IAAA;AAAW","file":"style.module.css","sourcesContent":[".classList {\n @apply mx-auto w-full;\n}\n\n.container {\n @apply py-8;\n}\n\n.heading {\n @apply pt-0;\n}\n\n.title {\n @apply pb-2 font-medium text-md text-grey;\n}\n\n.description {\n @apply pb-8 font-medium text-sm text-grey;\n}\n\n.columnWrapper {\n @apply flex flex-wrap;\n}\n\n.column {\n @apply pb-4;\n}"]}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { Props as buttonProps } from '../Button/Button';
|
|
3
|
+
import { Colours } from '../../utils/controls';
|
|
3
4
|
export interface Props {
|
|
4
5
|
id?: string;
|
|
5
6
|
className?: string;
|
|
6
7
|
title?: string;
|
|
7
|
-
|
|
8
|
+
description?: string;
|
|
9
|
+
bgColour?: Colours;
|
|
8
10
|
withLiveUpdates?: boolean;
|
|
9
11
|
onSave?: (arr: any[], id: string | undefined) => void;
|
|
10
12
|
saveButtonProps?: buttonProps;
|
|
@@ -14,8 +16,10 @@ export interface Props {
|
|
|
14
16
|
editInputClasses?: string;
|
|
15
17
|
buttonWrapperClasses?: string;
|
|
16
18
|
textWrapperClasses?: string;
|
|
17
|
-
socialButtons?:
|
|
19
|
+
socialButtons?: Array<{
|
|
20
|
+
type: string;
|
|
21
|
+
}>;
|
|
18
22
|
theme: 'light' | 'dark';
|
|
19
23
|
}
|
|
20
|
-
declare const SocialBlock: ({ id, className, title,
|
|
24
|
+
declare const SocialBlock: ({ id, className, title, description, bgColour, withLiveUpdates, onSave, saveButtonProps, cancelButtonProps, editTitleClasses, editTextClasses, editInputClasses, buttonWrapperClasses, textWrapperClasses, socialButtons, theme }: Props) => JSX.Element;
|
|
21
25
|
export default SocialBlock;
|
|
@@ -4,24 +4,22 @@ import Button from '../Button/Button';
|
|
|
4
4
|
import classNames from 'classnames';
|
|
5
5
|
import style from './style.module.css';
|
|
6
6
|
import Container from '../Container/Container';
|
|
7
|
-
|
|
7
|
+
import ComponentWrapper from '../ComponentWrapper/ComponentWrapper';
|
|
8
|
+
import SocialButton from '../SocialButton/SocialButton';
|
|
9
|
+
const SocialBlock = ({ id, className, title, description, bgColour, withLiveUpdates, onSave, saveButtonProps, cancelButtonProps, editTitleClasses, editTextClasses, editInputClasses, buttonWrapperClasses, textWrapperClasses, socialButtons, theme = 'light' }) => {
|
|
8
10
|
const colours = theme === 'dark' ? style.dark : style.light;
|
|
9
11
|
const defaultComponentData = {
|
|
10
12
|
title: {
|
|
11
13
|
text: title
|
|
12
14
|
},
|
|
13
15
|
text: {
|
|
14
|
-
text
|
|
16
|
+
text: description
|
|
15
17
|
}
|
|
16
18
|
};
|
|
17
19
|
const [isInEditingMode, setIsInEditingMode] = useState(false);
|
|
18
|
-
const [isHovering, setIsHovering] = useState(false);
|
|
19
20
|
const [componentData, setComponentData] = useState(defaultComponentData);
|
|
20
21
|
const classList = classNames(className, colours);
|
|
21
22
|
const buttonWrapperClasslist = classNames(buttonWrapperClasses, style.buttonWrapperClassList);
|
|
22
|
-
const hoverClassList = classNames({
|
|
23
|
-
[style.hoverClassList]: withLiveUpdates !== undefined && !isInEditingMode && isHovering
|
|
24
|
-
}, textWrapperClasses);
|
|
25
23
|
const toggleEditState = () => {
|
|
26
24
|
withLiveUpdates === true && setIsInEditingMode(!isInEditingMode);
|
|
27
25
|
};
|
|
@@ -31,11 +29,9 @@ const SocialBlock = ({ id, className, title, text, withLiveUpdates, onSave, save
|
|
|
31
29
|
arr.push({ key: 'text', value: componentData.text.text });
|
|
32
30
|
toggleEditState();
|
|
33
31
|
onSave === null || onSave === void 0 ? void 0 : onSave(arr, id);
|
|
34
|
-
setIsHovering(false);
|
|
35
32
|
};
|
|
36
33
|
const handleButtonCancel = () => {
|
|
37
34
|
toggleEditState();
|
|
38
|
-
setIsHovering(false);
|
|
39
35
|
};
|
|
40
36
|
const handleChange = (e) => {
|
|
41
37
|
let id = e.target.id;
|
|
@@ -44,21 +40,15 @@ const SocialBlock = ({ id, className, title, text, withLiveUpdates, onSave, save
|
|
|
44
40
|
text: e.target.value
|
|
45
41
|
} }));
|
|
46
42
|
};
|
|
47
|
-
|
|
48
|
-
withLiveUpdates === true && setIsHovering(!isHovering);
|
|
49
|
-
};
|
|
50
|
-
return (React.createElement("div", { id: id, className: classList }, withLiveUpdates === true && isInEditingMode
|
|
43
|
+
return (React.createElement(ComponentWrapper, { id: id, className: classList, title: title, description: description, bgColour: bgColour }, withLiveUpdates === true && isInEditingMode
|
|
51
44
|
? (React.createElement("div", { className: colours },
|
|
52
45
|
React.createElement(Input, { className: editTitleClasses, inputClasses: editInputClasses, autoFocus: true, value: componentData.title.text, onChange: (e) => handleChange(e), type: 'text', theme: theme }),
|
|
53
46
|
React.createElement(Input, { className: editTextClasses, inputClasses: editInputClasses, value: componentData.text.text, onChange: (e) => handleChange(e), type: 'text', theme: theme }),
|
|
54
47
|
React.createElement(Button, { className: style.saveButton, onClick: handleButtonSave }, "Save"),
|
|
55
48
|
React.createElement(Button, { className: style.cancelButton, onClick: handleButtonCancel }, "Cancel")))
|
|
56
49
|
: (React.createElement(Container, { withPadding: true },
|
|
57
|
-
React.createElement("div", { onMouseOver: () => toggleHoverState(), onMouseOut: () => toggleHoverState(), onClick: toggleEditState, className: hoverClassList },
|
|
58
|
-
React.createElement("h2", { className: style.title }, componentData.title.text),
|
|
59
|
-
React.createElement("p", { className: style.text }, componentData.text.text)),
|
|
60
50
|
React.createElement("div", { className: buttonWrapperClasslist }, socialButtons === null || socialButtons === void 0 ? void 0 : socialButtons.map((button, i) => {
|
|
61
|
-
return React.createElement(
|
|
51
|
+
return (React.createElement(SocialButton, { key: `socual_button_${i}`, className: 'mx-2', type: button.type }));
|
|
62
52
|
}))))));
|
|
63
53
|
};
|
|
64
54
|
export default SocialBlock;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SocialBlock.js","sourceRoot":"","sources":["../../../../../src/lib/components/SocialBlock/SocialBlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,MAAM,yBAAyB,CAAA;AAC3C,OAAO,MAAgC,MAAM,2BAA2B,CAAA;AACxE,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AACtC,OAAO,SAAS,MAAM,iCAAiC,CAAA;
|
|
1
|
+
{"version":3,"file":"SocialBlock.js","sourceRoot":"","sources":["../../../../../src/lib/components/SocialBlock/SocialBlock.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface Props {
|
|
3
|
+
id?: string;
|
|
4
|
+
className?: string;
|
|
5
|
+
onClick?: React.MouseEventHandler;
|
|
6
|
+
type?: 'facebook' | 'instagram' | 'github' | 'email';
|
|
7
|
+
href?: string;
|
|
8
|
+
openInNewTab?: boolean;
|
|
9
|
+
}
|
|
10
|
+
declare const SocialButton: ({ id, className, onClick, type, href, openInNewTab }: Props) => JSX.Element;
|
|
11
|
+
export default SocialButton;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import Icon from '../Icon/Icon';
|
|
3
|
+
import classNames from 'classnames';
|
|
4
|
+
import style from './style.module.css';
|
|
5
|
+
import Button from '../Button/Button';
|
|
6
|
+
const SocialButton = ({ id, className, onClick, type = 'facebook', href, openInNewTab = false }) => {
|
|
7
|
+
const classList = classNames(style.classList, style[type], className, style.hover);
|
|
8
|
+
const iconType = {
|
|
9
|
+
facebook: 'facebook',
|
|
10
|
+
instagram: 'instagram',
|
|
11
|
+
github: 'github',
|
|
12
|
+
email: 'envelope'
|
|
13
|
+
};
|
|
14
|
+
const getColours = (type) => {
|
|
15
|
+
return `interactive-${type}`;
|
|
16
|
+
};
|
|
17
|
+
const hoverColour = getColours(type);
|
|
18
|
+
return (React.createElement(Button, Object.assign({ id: id, className: classList }, (openInNewTab && { target: '_blank' }), { href: href, type: 'icon' }, ((onClick != null) && { onClick }), { variant: 'secondary', rounded: true }),
|
|
19
|
+
React.createElement(Icon, { type: iconType[type], size: 3, brand: type !== 'email', rounded: true, bgColour: type, colour: 'white', hoverBgColour: hoverColour, hoverColour: hoverColour })));
|
|
20
|
+
};
|
|
21
|
+
export default SocialButton;
|
|
22
|
+
//# sourceMappingURL=SocialButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SocialButton.js","sourceRoot":"","sources":["../../../../../src/lib/components/SocialButton/SocialButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,IAAI,MAAM,uBAAuB,CAAA;AACxC,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,oBAAoB,CAAA;AACtC,OAAO,MAAM,MAAM,2BAA2B,CAAA;AAY9C,MAAM,YAAY,GAAG,CAAC,EACpB,EAAE,EACF,SAAS,EACT,OAAO,EACP,IAAI,GAAG,UAAU,EACjB,IAAI,EACJ,YAAY,GAAG,KAAK,EACd,EAAe,EAAE;IACvB,MAAM,SAAS,GAAG,UAAU,CAC1B,KAAK,CAAC,SAAS,EACf,KAAK,CAAC,IAAI,CAAC,EACX,SAAS,EACT,KAAK,CAAC,KAAK,CACZ,CAAA;IAED,MAAM,QAAQ,GAAG;QACf,QAAQ,EAAE,UAAU;QACpB,SAAS,EAAE,WAAW;QACtB,MAAM,EAAE,QAAQ;QAChB,KAAK,EAAE,UAAU;KAClB,CAAA;IAED,MAAM,UAAU,GAAG,CAAC,IAAa,EAAW,EAAE;QAC5C,OAAO,eAAe,IAAI,EAAa,CAAA;IACzC,CAAC,CAAA;IAED,MAAM,WAAW,GAAG,UAAU,CAAC,IAAe,CAAC,CAAA;IAE/C,OAAO,CACL,oBAAC,MAAM,kBACL,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,SAAS,IAChB,CAAC,YAAY,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,IAC1C,IAAI,EAAE,IAAI,EACV,IAAI,EAAC,MAAM,IACP,CAAC,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC,IACtC,OAAO,EAAC,WAAW,EACnB,OAAO;QAEP,oBAAC,IAAI,IACH,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,EACpB,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,IAAI,KAAK,OAAO,EACvB,OAAO,QACP,QAAQ,EAAE,IAAI,EACd,MAAM,EAAC,OAAO,EACd,aAAa,EAAE,WAAW,EAC1B,WAAW,EAAE,WAAW,GACxB,CACK,CACV,CAAA;AACH,CAAC,CAAA;AAED,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
.classList {
|
|
2
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
3
|
+
border-radius: 9999px;
|
|
4
|
+
transition-duration: 500ms;
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
.facebook {
|
|
8
|
+
--tw-bg-opacity: 1;
|
|
9
|
+
background-color: rgb(59 89 153 / var(--tw-bg-opacity));
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.facebook:hover {
|
|
13
|
+
--tw-bg-opacity: 1;
|
|
14
|
+
background-color: rgb(45 68 116 / var(--tw-bg-opacity));
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
.instagram:hover {
|
|
18
|
+
--tw-bg-opacity: 1;
|
|
19
|
+
background-color: rgb(109 46 146 / var(--tw-bg-opacity));
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
.instagram {
|
|
23
|
+
background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.github {
|
|
27
|
+
--tw-bg-opacity: 1;
|
|
28
|
+
background-color: rgb(23 21 21 / var(--tw-bg-opacity));
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
.github:hover {
|
|
32
|
+
--tw-bg-opacity: 1;
|
|
33
|
+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.email {
|
|
37
|
+
--tw-bg-opacity: 1;
|
|
38
|
+
background-color: rgb(199 22 16 / var(--tw-bg-opacity));
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.email:hover {
|
|
42
|
+
--tw-bg-opacity: 1;
|
|
43
|
+
background-color: rgb(159 17 12 / var(--tw-bg-opacity));
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.facebook.hover:hover div {
|
|
47
|
+
--tw-bg-opacity: 1;
|
|
48
|
+
background-color: rgb(45 68 116 / var(--tw-bg-opacity));
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
.facebook.hover:hover span {
|
|
52
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
53
|
+
--tw-bg-opacity: 1;
|
|
54
|
+
background-color: rgb(45 68 116 / var(--tw-bg-opacity));
|
|
55
|
+
--tw-text-opacity: 1;
|
|
56
|
+
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
57
|
+
transition-duration: 500ms;
|
|
58
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
59
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
60
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.instagram.hover:hover div {
|
|
64
|
+
background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
.instagram.hover:hover span {
|
|
68
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
69
|
+
--tw-text-opacity: 1;
|
|
70
|
+
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
71
|
+
transition-duration: 500ms;
|
|
72
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
73
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
74
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
.github.hover:hover div {
|
|
78
|
+
--tw-bg-opacity: 1;
|
|
79
|
+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.github.hover:hover span {
|
|
83
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
84
|
+
--tw-bg-opacity: 1;
|
|
85
|
+
background-color: rgb(0 0 0 / var(--tw-bg-opacity));
|
|
86
|
+
--tw-text-opacity: 1;
|
|
87
|
+
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
88
|
+
transition-duration: 500ms;
|
|
89
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
90
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
91
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
.email.hover:hover div {
|
|
95
|
+
--tw-bg-opacity: 1;
|
|
96
|
+
background-color: rgb(159 17 12 / var(--tw-bg-opacity));
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
.email.hover:hover span {
|
|
100
|
+
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
|
101
|
+
--tw-bg-opacity: 1;
|
|
102
|
+
background-color: rgb(159 17 12 / var(--tw-bg-opacity));
|
|
103
|
+
--tw-text-opacity: 1;
|
|
104
|
+
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
105
|
+
transition-duration: 500ms;
|
|
106
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
|
|
107
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
|
|
108
|
+
transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
/*# sourceMappingURL=style.module.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../src/lib/components/SocialButton/style.module.css"],"names":[],"mappings":"AACI;IAAA,+LAA0C;IAA1C,qBAA0C;IAA1C;AAA0C;;AAI1C;IAAA,kBAAgD;IAAhD;AAAgD;;AAAhD;IAAA,kBAAgD;IAAhD;AAAgD;;AAIhD;IAAA,kBAAqC;IAArC;AAAqC;;AADzC;IAEI,6nBAA6nB;AACjoB;;AAGI;IAAA,kBAA4C;IAA5C;AAA4C;;AAA5C;IAAA,kBAA4C;IAA5C;AAA4C;;AAI5C;IAAA,kBAA0C;IAA1C;AAA0C;;AAA1C;IAAA,kBAA0C;IAA1C;AAA0C;;AAI1C;IAAA,kBAA8B;IAA9B;AAA8B;;AAI9B;IAAA,+LAAgE;IAAhE,kBAAgE;IAAhE,uDAAgE;IAAhE,oBAAgE;IAAhE,gDAAgE;IAAhE,0BAAgE;IAChE,kJAA0I;IAA1I,0IAA0I;IAA1I;AADgE;;AAIpE;IACI,6nBAA6nB;AACjoB;;AAGI;IAAA,+LAAwC;IAAxC,oBAAwC;IAAxC,gDAAwC;IAAxC,0BAAwC;IACxC,kJAA0I;IAA1I,0IAA0I;IAA1I;AADwC;;AAKxC;IAAA,kBAA4B;IAA5B;AAA4B;;AAI5B;IAAA,+LAA8D;IAA9D,kBAA8D;IAA9D,mDAA8D;IAA9D,oBAA8D;IAA9D,gDAA8D;IAA9D,0BAA8D;IAC9D,kJAA0I;IAA1I,0IAA0I;IAA1I;AAD8D;;AAK9D;IAAA,kBAA2B;IAA3B;AAA2B;;AAI3B;IAAA,+LAA6D;IAA7D,kBAA6D;IAA7D,uDAA6D;IAA7D,oBAA6D;IAA7D,gDAA6D;IAA7D,0BAA6D;IAC7D,kJAA0I;IAA1I,0IAA0I;IAA1I;AAD6D","file":"style.module.css","sourcesContent":[".classList {\n @apply duration-500 transform rounded-full;\n}\n\n.facebook {\n @apply bg-facebook hover:bg-interactive-facebook;\n}\n\n.instagram {\n @apply hover:bg-interactive-instagram;\n background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.github {\n @apply bg-github hover:bg-interactive-github;\n}\n\n.email {\n @apply bg-email hover:bg-interactive-email;\n}\n\n.facebook.hover:hover div {\n @apply bg-interactive-facebook;\n}\n\n.facebook.hover:hover span {\n @apply bg-interactive-facebook text-white duration-500 transform;\n transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n}\n\n.instagram.hover:hover div {\n background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);\n}\n\n.instagram.hover:hover span {\n @apply text-white duration-500 transform;\n transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n}\n\n.github.hover:hover div {\n @apply bg-interactive-github;\n}\n\n.github.hover:hover span {\n @apply bg-interactive-github text-white duration-500 transform;\n transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n}\n\n.email.hover:hover div {\n @apply bg-interactive-email;\n}\n\n.email.hover:hover span {\n @apply bg-interactive-email text-white duration-500 transform;\n transition-property: color, background-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Testimonial.js","sourceRoot":"","sources":["../../../../../src/lib/components/Testimonial/Testimonial.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAA8B,MAAM,yBAAyB,CAAA;AACpE,OAAO,KAAK,MAAM,oBAAoB,CAAA;AACtC,OAAO,SAAS,MAAM,iCAAiC,CAAA;AAgBvD,MAAM,WAAW,GAAG,CAAC,EACnB,EAAE,EACF,SAAS,EACT,IAAI,EACJ,UAAU,EACV,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,eAAe,EACT,EAAe,EAAE;IACvB,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAExD,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS;QAC/B,oBAAC,SAAS,IAAC,WAAW
|
|
1
|
+
{"version":3,"file":"Testimonial.js","sourceRoot":"","sources":["../../../../../src/lib/components/Testimonial/Testimonial.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAA8B,MAAM,yBAAyB,CAAA;AACpE,OAAO,KAAK,MAAM,oBAAoB,CAAA;AACtC,OAAO,SAAS,MAAM,iCAAiC,CAAA;AAgBvD,MAAM,WAAW,GAAG,CAAC,EACnB,EAAE,EACF,SAAS,EACT,IAAI,EACJ,UAAU,EACV,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,eAAe,EACT,EAAe,EAAE;IACvB,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAExD,OAAO,CACL,6BAAK,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS;QAC/B,oBAAC,SAAS,IAAC,WAAW;YACpB,6BAAK,SAAS,EAAE,KAAK,CAAC,YAAY;gBAChC,oBAAC,KAAK,oBAAK,UAAU,EAAI,CACrB;YACN;gBACE,4BAAI,SAAS,EAAE,KAAK,CAAC,WAAW;oBAAG,WAAW;wBAAO;gBACrD,2BAAG,SAAS,EAAE,KAAK,CAAC,QAAQ,IAAG,QAAQ,CAAK;gBAC5C;oBAAI,iBAAiB;;oBAAK,eAAe,CAAK;gBAC9C,+BAAI,IAAI,CAAK;gBACb;oBAAI,WAAW;;oBAAK,eAAe;;oBAAI,IAAI,CAAK,CAC5C,CACI,CACR,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -4,6 +4,9 @@ import { Colours } from '../../utils/controls';
|
|
|
4
4
|
export interface Props {
|
|
5
5
|
id: string;
|
|
6
6
|
className?: string;
|
|
7
|
+
title?: string;
|
|
8
|
+
description?: string;
|
|
9
|
+
bgColour?: Colours;
|
|
7
10
|
titleClasses?: string;
|
|
8
11
|
editTitleClasses?: string;
|
|
9
12
|
editTextClasses?: string;
|
|
@@ -12,7 +15,6 @@ export interface Props {
|
|
|
12
15
|
textLineOne?: string | object;
|
|
13
16
|
textLineTwo?: string | object;
|
|
14
17
|
textLineThree?: string | object;
|
|
15
|
-
title?: string;
|
|
16
18
|
titleBold?: boolean;
|
|
17
19
|
textCenter?: boolean;
|
|
18
20
|
titleCenter?: boolean;
|
|
@@ -22,7 +24,6 @@ export interface Props {
|
|
|
22
24
|
cancelButtonProps?: buttonProps;
|
|
23
25
|
isHorizontal?: boolean;
|
|
24
26
|
children?: any;
|
|
25
|
-
bgColour?: Colours;
|
|
26
27
|
}
|
|
27
28
|
declare const TextAndTitle: React.FC<Props>;
|
|
28
29
|
export default TextAndTitle;
|
|
@@ -5,7 +5,8 @@ import classNames from 'classnames';
|
|
|
5
5
|
import TextArea from '../TextArea/TextArea';
|
|
6
6
|
import style from './style.module.css';
|
|
7
7
|
import Container from '../Container/Container';
|
|
8
|
-
|
|
8
|
+
import ComponentWrapper from '../ComponentWrapper/ComponentWrapper';
|
|
9
|
+
const TextAndTitle = ({ id, className, title, description, bgColour, titleClasses, editTitleClasses, editTextClasses, editInputClasses, textClasses, textLineOne, textLineTwo, textLineThree, titleBold, textCenter, titleCenter, withLiveUpdates = false, onSave, saveButtonProps, cancelButtonProps, isHorizontal = true, children }) => {
|
|
9
10
|
const getLineHeight = (id) => {
|
|
10
11
|
const element = document.getElementById(id);
|
|
11
12
|
const divHeight = (element === null || element === void 0 ? void 0 : element.offsetHeight) !== undefined ? element.offsetHeight : 0;
|
|
@@ -30,7 +31,7 @@ const TextAndTitle = ({ id, className, titleClasses, editTitleClasses, editTextC
|
|
|
30
31
|
const [isInEditingMode, setIsInEditingMode] = useState(false);
|
|
31
32
|
const [componentData, setComponentData] = useState(defaultComponentData);
|
|
32
33
|
const borderClasses = style.bordered;
|
|
33
|
-
const classList =
|
|
34
|
+
const classList = className;
|
|
34
35
|
const titleClassList = classNames({
|
|
35
36
|
[style.fontBold]: titleBold,
|
|
36
37
|
[style.textCenter]: titleCenter,
|
|
@@ -63,8 +64,7 @@ const TextAndTitle = ({ id, className, titleClasses, editTitleClasses, editTextC
|
|
|
63
64
|
};
|
|
64
65
|
const wrapperClassList = classNames({
|
|
65
66
|
[style.horizontalWrapperClassList]: isHorizontal,
|
|
66
|
-
[style.liveUpdatesWrapperClassList]: withLiveUpdates && !isInEditingMode
|
|
67
|
-
[style[bgColour]]: withLiveUpdates && !isInEditingMode
|
|
67
|
+
[style.liveUpdatesWrapperClassList]: withLiveUpdates && !isInEditingMode
|
|
68
68
|
}, style.wrapperClassList);
|
|
69
69
|
const titleWrapperClassList = classNames({
|
|
70
70
|
[style.horizontalTitleWrapperClassList]: isHorizontal
|
|
@@ -74,7 +74,7 @@ const TextAndTitle = ({ id, className, titleClasses, editTitleClasses, editTextC
|
|
|
74
74
|
});
|
|
75
75
|
const inputClassList = classNames(editInputClasses, textClassList);
|
|
76
76
|
const node = document.getElementById('textLineOne');
|
|
77
|
-
return (React.createElement(
|
|
77
|
+
return (React.createElement(ComponentWrapper, { id: id, className: classList, title: title, description: description, bgColour: bgColour }, withLiveUpdates && isInEditingMode
|
|
78
78
|
? (React.createElement(Container, { withPadding: true },
|
|
79
79
|
React.createElement("div", { className: wrapperClassList },
|
|
80
80
|
React.createElement("div", { className: titleWrapperClassList }, (componentData === null || componentData === void 0 ? void 0 : componentData.title) !== undefined
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextAndTitle.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextAndTitle/TextAndTitle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,MAAM,yBAAyB,CAAA;AAC3C,OAAO,MAAgC,MAAM,2BAA2B,CAAA;AACxE,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,QAAQ,MAAM,+BAA+B,CAAA;AACpD,OAAO,KAAK,MAAM,oBAAoB,CAAA;AAEtC,OAAO,SAAS,MAAM,iCAAiC,CAAA;
|
|
1
|
+
{"version":3,"file":"TextAndTitle.js","sourceRoot":"","sources":["../../../../../src/lib/components/TextAndTitle/TextAndTitle.tsx"],"names":[],"mappings":"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"}
|
|
@@ -134,14 +134,6 @@
|
|
|
134
134
|
|
|
135
135
|
width: 50%;
|
|
136
136
|
|
|
137
|
-
padding-top: 2rem;
|
|
138
|
-
|
|
139
|
-
padding-bottom: 2rem;
|
|
140
|
-
|
|
141
|
-
padding-left: 2rem;
|
|
142
|
-
|
|
143
|
-
padding-right: 2rem;
|
|
144
|
-
|
|
145
137
|
text-align: center
|
|
146
138
|
}
|
|
147
139
|
|
|
@@ -149,10 +141,6 @@
|
|
|
149
141
|
|
|
150
142
|
width: 50%;
|
|
151
143
|
|
|
152
|
-
padding-left: 2rem;
|
|
153
|
-
|
|
154
|
-
padding-right: 2rem;
|
|
155
|
-
|
|
156
144
|
text-align: center
|
|
157
145
|
}
|
|
158
146
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/lib/components/TextAndTitle/style.module.css"],"names":[],"mappings":"AACI;;IAAA,kBAA4B;;IAA5B,sDAA4B;;IAA5B,oBAA4B;;IAA5B;AAA4B;;AAI5B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAA8B;;IAA9B,uDAA8B;;IAA9B,oBAA8B;;IAA9B;AAA8B;;AAI9B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAAe;;IAAf;AAAe;;AAIf;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAA0B;;IAA1B,mDAA0B;;IAA1B,oBAA0B;;IAA1B;AAA0B;;AAI1B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,iBAAkC;;IAAlC;AAAkC;;AAIlC;;IAAA;AAAgB;;AAIhB;;IAAA;AAAkB;;AAIlB;;IAAA,yBAA0B;;IAA1B;AAA0B;;AAI1B;;IAAA,kBAAgB;;IAAhB;AAAgB;;AAIhB;;IAAA,iBAAkC;;IAAlC;AAAkC;;AAIlC;;IAAA,aAAoD;;IAApD,eAAoD;;IAApD;AAAoD;;AAApD;;IAAA;;QAAA;IAAoD;AAAA;;AAIpD;;IAAA,iBAA6B;;IAA7B;AAA6B;;AAI7B;;IAAA;;QAAA,
|
|
1
|
+
{"version":3,"sources":["../../../../../src/lib/components/TextAndTitle/style.module.css"],"names":[],"mappings":"AACI;;IAAA,kBAA4B;;IAA5B,sDAA4B;;IAA5B,oBAA4B;;IAA5B;AAA4B;;AAI5B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAA8B;;IAA9B,uDAA8B;;IAA9B,oBAA8B;;IAA9B;AAA8B;;AAI9B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAAe;;IAAf;AAAe;;AAIf;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,kBAA0B;;IAA1B,mDAA0B;;IAA1B,oBAA0B;;IAA1B;AAA0B;;AAI1B;;IAAA,sBAAmB;;IAAnB;AAAmB;;AAInB;;IAAA,iBAAkC;;IAAlC;AAAkC;;AAIlC;;IAAA;AAAgB;;AAIhB;;IAAA;AAAkB;;AAIlB;;IAAA,yBAA0B;;IAA1B;AAA0B;;AAI1B;;IAAA,kBAAgB;;IAAhB;AAAgB;;AAIhB;;IAAA,iBAAkC;;IAAlC;AAAkC;;AAIlC;;IAAA,aAAoD;;IAApD,eAAoD;;IAApD;AAAoD;;AAApD;;IAAA;;QAAA;IAAoD;AAAA;;AAIpD;;IAAA,iBAA6B;;IAA7B;AAA6B;;AAI7B;;IAAA;;QAAA,UAA8B;;QAA9B;IAA8B;;IAI9B;;QAAA,UAA8B;;QAA9B;IAA8B;AAJA;;AAQ9B;;IAAA,oBAAuB;;IAAvB;AAAuB","file":"style.module.css","sourcesContent":[".primary {\n @apply bg-primary text-white;\n}\n\n.primary:hover {\n @apply border-white;\n}\n\n.secondary {\n @apply bg-secondary text-white;\n}\n\n.secondary:hover {\n @apply border-white;\n}\n\n.white {\n @apply bg-white;\n}\n\n.white:hover {\n @apply border-black;\n}\n\n.black {\n @apply bg-black text-white;\n}\n\n.black:hover {\n @apply border-white;\n}\n\n.bordered {\n @apply border-4 border-transparent;\n}\n\n.fontBold {\n @apply font-bold;\n}\n\n.textCenter {\n @apply text-center;\n}\n\n.titleClassList {\n @apply text-md break-words;\n}\n\n.textClassList {\n @apply pt-2 mt-2;\n}\n\n.wrapperClassList {\n @apply border-4 border-transparent;\n}\n\n.horizontalWrapperClassList {\n @apply flex flex-wrap justify-center md:items-center;\n}\n\n.liveUpdatesWrapperClassList:hover {\n @apply border-4 border-dashed;\n}\n\n.horizontalTextWrapperClassList {\n @apply md:w-1/2 md:text-center;\n}\n\n.horizontalTitleWrapperClassList {\n @apply md:w-1/2 md:text-center;\n}\n\n.buttonWrapper {\n @apply text-center pb-8;\n}"]}
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import { Colours } from '../../utils/controls';
|
|
2
3
|
export interface Props {
|
|
3
4
|
id?: string;
|
|
4
5
|
className?: string;
|
|
6
|
+
title?: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
bgColour?: Colours;
|
|
5
9
|
isHorizontal?: boolean;
|
|
6
10
|
items?: object[];
|
|
7
11
|
reverse?: boolean;
|
|
@@ -10,5 +14,5 @@ export interface Props {
|
|
|
10
14
|
horizontalComponentClasses?: string;
|
|
11
15
|
isSm?: boolean;
|
|
12
16
|
}
|
|
13
|
-
declare const Timeline: ({ id, className, isHorizontal, items, reverse, textCenter, useImages, horizontalComponentClasses, isSm }: Props) => JSX.Element;
|
|
17
|
+
declare const Timeline: ({ id, className, title, description, bgColour, isHorizontal, items, reverse, textCenter, useImages, horizontalComponentClasses, isSm }: Props) => JSX.Element;
|
|
14
18
|
export default Timeline;
|
|
@@ -4,7 +4,8 @@ import Image from '../Image/Image';
|
|
|
4
4
|
import Column from '../Column/Column';
|
|
5
5
|
import Row from '../Row/Row';
|
|
6
6
|
import style from './style.module.css';
|
|
7
|
-
|
|
7
|
+
import ComponentWrapper from '../ComponentWrapper/ComponentWrapper';
|
|
8
|
+
const Timeline = ({ id, className, title, description, bgColour, isHorizontal = false, items, reverse = false, textCenter, useImages = true, horizontalComponentClasses, isSm = false }) => {
|
|
8
9
|
const classList = classNames(className, style.classList);
|
|
9
10
|
const ulClasses = classNames({
|
|
10
11
|
[`${style.ulHorizontal} none-reverse`]: !reverse && isHorizontal,
|
|
@@ -24,7 +25,7 @@ const Timeline = ({ id, className, isHorizontal = false, items, reverse = false,
|
|
|
24
25
|
horizontal: isHorizontal && !isSm,
|
|
25
26
|
vertical: !isHorizontal
|
|
26
27
|
}, style.circle);
|
|
27
|
-
return (React.createElement(
|
|
28
|
+
return (React.createElement(ComponentWrapper, { id: id, className: classList, title: title, description: description, bgColour: bgColour },
|
|
28
29
|
React.createElement("div", { className: ulClasses }, items === null || items === void 0 ? void 0 : items.map((item, i) => {
|
|
29
30
|
let before;
|
|
30
31
|
if (i % 2 === 0) {
|
|
@@ -75,11 +76,11 @@ const Timeline = ({ id, className, isHorizontal = false, items, reverse = false,
|
|
|
75
76
|
else if (circlePos === 'circle' && !isSm) {
|
|
76
77
|
horizontalCircleStylesBefore = style.circleHorizontalBefore;
|
|
77
78
|
}
|
|
78
|
-
else if (circlePos === '
|
|
79
|
-
horizontalCircleStylesBefore = style.
|
|
79
|
+
else if (circlePos === 'last-circle' && isSm) {
|
|
80
|
+
horizontalCircleStylesBefore = style.lastCircleHorizontalCollapseBefore;
|
|
80
81
|
}
|
|
81
|
-
else if (circlePos === '
|
|
82
|
-
horizontalCircleStylesBefore = style.
|
|
82
|
+
else if (circlePos === 'last-circle' && !isSm) {
|
|
83
|
+
horizontalCircleStylesBefore = style.lastCircleHorizontalBefore;
|
|
83
84
|
}
|
|
84
85
|
let horizontalCircleStylesAfter;
|
|
85
86
|
if (circlePos === 'circle' && isSm) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../../../src/lib/components/Timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,UAAU,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,yBAAyB,CAAA;AAC3C,OAAO,MAAM,MAAM,2BAA2B,CAAA;AAC9C,OAAO,GAAG,MAAM,qBAAqB,CAAA;AACrC,OAAO,KAAK,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../../../src/lib/components/Timeline/Timeline.tsx"],"names":[],"mappings":"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"}
|