@pareto-engineering/design-system 2.0.0-alpha.60 → 2.0.0-alpha.61
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/cjs/{experimental/GradientBackground/GradientBackground.js → a/ColumnLabel/ColumnLabel.js} +32 -30
- package/dist/cjs/{c/SiteMission → a/ColumnLabel}/index.js +3 -3
- package/dist/cjs/a/ColumnLabel/styles.scss +22 -0
- package/dist/cjs/{c/BlogPostsList/BlogPostsList.js → a/Label/Label.js} +27 -13
- package/dist/cjs/a/{Popover/common/Item → Label}/index.js +3 -3
- package/dist/cjs/a/Label/styles.scss +34 -0
- package/dist/cjs/a/index.js +9 -1
- package/dist/cjs/f/fields/ChoicesInput/ChoicesInput.js +1 -1
- package/dist/cjs/f/fields/ChoicesInput/common/Choice/Choice.js +2 -5
- package/dist/cjs/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +1 -1
- package/dist/cjs/f/fields/TaskRecommendationInput/styles.scss +0 -4
- package/dist/es/a/ColumnLabel/ColumnLabel.js +78 -0
- package/dist/es/a/ColumnLabel/index.js +2 -0
- package/dist/es/a/ColumnLabel/styles.scss +22 -0
- package/dist/es/{c/BlogPostsList/BlogPostsList.js → a/Label/Label.js} +28 -13
- package/dist/es/{c/BlogPostsList/common/Card → a/Label}/index.js +1 -1
- package/dist/es/a/Label/styles.scss +34 -0
- package/dist/es/a/index.js +2 -1
- package/dist/es/f/fields/ChoicesInput/ChoicesInput.js +1 -1
- package/dist/es/f/fields/ChoicesInput/common/Choice/Choice.js +2 -5
- package/dist/es/f/fields/TaskRecommendationInput/TaskRecommendationInput.js +1 -1
- package/dist/es/f/fields/TaskRecommendationInput/styles.scss +0 -4
- package/package.json +1 -1
- package/src/__snapshots__/Storyshots.test.js.snap +8270 -7917
- package/src/stories/a/Label.stories.jsx +49 -0
- package/src/stories/f/ChoicesInput.stories.jsx +10 -36
- package/src/ui/a/Label/Label.jsx +93 -0
- package/{dist/es/a/Popover/common/Item → src/ui/a/Label}/index.js +1 -1
- package/src/ui/a/Label/styles.scss +34 -0
- package/src/ui/a/index.js +1 -0
- package/src/ui/f/fields/ChoicesInput/ChoicesInput.jsx +1 -1
- package/src/ui/f/fields/ChoicesInput/common/Choice/Choice.jsx +2 -10
- package/dist/cjs/a/GradientBackground/GradientBackground.js +0 -140
- package/dist/cjs/a/GradientBackground/index.js +0 -15
- package/dist/cjs/a/GradientBackground/styles.scss +0 -191
- package/dist/cjs/a/Popover/common/Divider/Divider.js +0 -67
- package/dist/cjs/a/Popover/common/Divider/index.js +0 -15
- package/dist/cjs/a/Popover/common/Item/Item.js +0 -67
- package/dist/cjs/a/Popover/common/index.js +0 -21
- package/dist/cjs/c/AcceptCookies/AcceptCookies.js +0 -134
- package/dist/cjs/c/AcceptCookies/index.js +0 -15
- package/dist/cjs/c/AcceptCookies/styles.scss +0 -49
- package/dist/cjs/c/BlogCategoryButton/BlogCategoryButton.js +0 -95
- package/dist/cjs/c/BlogCategoryButton/index.js +0 -15
- package/dist/cjs/c/BlogContext/BlogContextProvider.js +0 -63
- package/dist/cjs/c/BlogContext/Context.js +0 -16
- package/dist/cjs/c/BlogContext/ContextProvider.js +0 -63
- package/dist/cjs/c/BlogContext/index.js +0 -31
- package/dist/cjs/c/BlogContext/useBlog.js +0 -16
- package/dist/cjs/c/BlogPost/BlogPost.js +0 -147
- package/dist/cjs/c/BlogPost/index.js +0 -15
- package/dist/cjs/c/BlogPost/styles.scss +0 -33
- package/dist/cjs/c/BlogPostsList/common/Card/Card.js +0 -170
- package/dist/cjs/c/BlogPostsList/common/Card/index.js +0 -15
- package/dist/cjs/c/BlogPostsList/common/index.js +0 -13
- package/dist/cjs/c/BlogPostsList/index.js +0 -15
- package/dist/cjs/c/BlogPostsList/styles.scss +0 -72
- package/dist/cjs/c/SiteFooter/SiteFooter.js +0 -73
- package/dist/cjs/c/SiteFooter/common/Section/Section.js +0 -95
- package/dist/cjs/c/SiteFooter/common/Section/index.js +0 -15
- package/dist/cjs/c/SiteFooter/common/index.js +0 -13
- package/dist/cjs/c/SiteFooter/index.js +0 -15
- package/dist/cjs/c/SiteFooter/styles.scss +0 -34
- package/dist/cjs/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -108
- package/dist/cjs/c/SiteHeaderCTA/index.js +0 -15
- package/dist/cjs/c/SiteHeaderCTA/styles.scss +0 -44
- package/dist/cjs/c/SiteMission/SiteMission.js +0 -113
- package/dist/cjs/c/SiteMission/styles.scss +0 -30
- package/dist/cjs/c/SiteNavigation/SiteNavigation.js +0 -130
- package/dist/cjs/c/SiteNavigation/index.js +0 -15
- package/dist/cjs/c/SiteNavigation/styles.scss +0 -118
- package/dist/cjs/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -98
- package/dist/cjs/c/SiteOnboardingStep/index.js +0 -15
- package/dist/cjs/c/SiteOnboardingStep/styles.scss +0 -51
- package/dist/cjs/c/SitePricing/SitePricing.js +0 -108
- package/dist/cjs/c/SitePricing/index.js +0 -15
- package/dist/cjs/c/SitePricing/styles.scss +0 -73
- package/dist/cjs/c/SiteServices/SiteServices.js +0 -211
- package/dist/cjs/c/SiteServices/index.js +0 -15
- package/dist/cjs/c/SiteServices/styles.scss +0 -138
- package/dist/cjs/c/TeamGallery/TeamGallery.js +0 -80
- package/dist/cjs/c/TeamGallery/common/PersonCard/PersonCard.js +0 -84
- package/dist/cjs/c/TeamGallery/common/PersonCard/index.js +0 -15
- package/dist/cjs/c/TeamGallery/common/index.js +0 -13
- package/dist/cjs/c/TeamGallery/index.js +0 -15
- package/dist/cjs/c/TeamGallery/styles.scss +0 -100
- package/dist/cjs/c/Testimonials/Testimonials.js +0 -119
- package/dist/cjs/c/Testimonials/index.js +0 -15
- package/dist/cjs/c/Testimonials/styles.scss +0 -112
- package/dist/cjs/experimental/GradientBackground/index.js +0 -15
- package/dist/cjs/experimental/GradientBackground/styles.scss +0 -64
- package/dist/cjs/experimental/index.js +0 -13
- package/dist/cjs/f/fields/IntlTelInput/IntlTelInput.js +0 -170
- package/dist/cjs/f/fields/IntlTelInput/index.js +0 -15
- package/dist/cjs/f/fields/IntlTelInput/styles.scss +0 -37
- package/dist/cjs/f/fields/PhoneIntlTelInput/PhoneIntlTelInput.js +0 -180
- package/dist/cjs/f/fields/PhoneIntlTelInput/index.js +0 -15
- package/dist/cjs/f/fields/PhoneIntlTelInput/styles.scss +0 -43
- package/dist/cjs/f/fields/QuerySelect/styles.scss +0 -21
- package/dist/cjs/f/fields/TaskRecommendation/TaskRecommendation.js +0 -129
- package/dist/cjs/f/fields/TaskRecommendation/index.js +0 -15
- package/dist/cjs/f/fields/TaskRecommendation/styles.scss +0 -37
- package/dist/cjs/f/fields/TextArea/TextArea.js +0 -141
- package/dist/cjs/f/fields/TextArea/index.js +0 -15
- package/dist/cjs/f/fields/TextArea/styles.scss +0 -19
- package/dist/cjs/test/QueryLoader/styles.scss +0 -9
- package/dist/es/a/GradientBackground/GradientBackground.js +0 -118
- package/dist/es/a/GradientBackground/index.js +0 -2
- package/dist/es/a/GradientBackground/styles.scss +0 -191
- package/dist/es/a/Popover/common/Divider/Divider.js +0 -47
- package/dist/es/a/Popover/common/Divider/index.js +0 -2
- package/dist/es/a/Popover/common/Item/Item.js +0 -47
- package/dist/es/a/Popover/common/index.js +0 -2
- package/dist/es/c/AcceptCookies/AcceptCookies.js +0 -117
- package/dist/es/c/AcceptCookies/index.js +0 -2
- package/dist/es/c/AcceptCookies/styles.scss +0 -49
- package/dist/es/c/BlogCategoryButton/BlogCategoryButton.js +0 -68
- package/dist/es/c/BlogCategoryButton/index.js +0 -2
- package/dist/es/c/BlogContext/BlogContextProvider.js +0 -45
- package/dist/es/c/BlogContext/Context.js +0 -2
- package/dist/es/c/BlogContext/ContextProvider.js +0 -45
- package/dist/es/c/BlogContext/index.js +0 -4
- package/dist/es/c/BlogContext/useBlog.js +0 -3
- package/dist/es/c/BlogPost/BlogPost.js +0 -128
- package/dist/es/c/BlogPost/index.js +0 -2
- package/dist/es/c/BlogPost/styles.scss +0 -33
- package/dist/es/c/BlogPostsList/common/Card/Card.js +0 -143
- package/dist/es/c/BlogPostsList/common/index.js +0 -1
- package/dist/es/c/BlogPostsList/index.js +0 -2
- package/dist/es/c/BlogPostsList/styles.scss +0 -72
- package/dist/es/c/SiteFooter/SiteFooter.js +0 -56
- package/dist/es/c/SiteFooter/common/Section/Section.js +0 -73
- package/dist/es/c/SiteFooter/common/Section/index.js +0 -2
- package/dist/es/c/SiteFooter/common/index.js +0 -1
- package/dist/es/c/SiteFooter/index.js +0 -2
- package/dist/es/c/SiteFooter/styles.scss +0 -34
- package/dist/es/c/SiteHeaderCTA/SiteHeaderCTA.js +0 -92
- package/dist/es/c/SiteHeaderCTA/index.js +0 -2
- package/dist/es/c/SiteHeaderCTA/styles.scss +0 -44
- package/dist/es/c/SiteMission/SiteMission.js +0 -96
- package/dist/es/c/SiteMission/index.js +0 -2
- package/dist/es/c/SiteMission/styles.scss +0 -30
- package/dist/es/c/SiteNavigation/SiteNavigation.js +0 -111
- package/dist/es/c/SiteNavigation/index.js +0 -2
- package/dist/es/c/SiteNavigation/styles.scss +0 -118
- package/dist/es/c/SiteOnboardingStep/SiteOnboardingStep.js +0 -81
- package/dist/es/c/SiteOnboardingStep/index.js +0 -2
- package/dist/es/c/SiteOnboardingStep/styles.scss +0 -51
- package/dist/es/c/SitePricing/SitePricing.js +0 -91
- package/dist/es/c/SitePricing/index.js +0 -2
- package/dist/es/c/SitePricing/styles.scss +0 -73
- package/dist/es/c/SiteServices/SiteServices.js +0 -195
- package/dist/es/c/SiteServices/index.js +0 -2
- package/dist/es/c/SiteServices/styles.scss +0 -138
- package/dist/es/c/TeamGallery/TeamGallery.js +0 -64
- package/dist/es/c/TeamGallery/common/PersonCard/PersonCard.js +0 -64
- package/dist/es/c/TeamGallery/common/PersonCard/index.js +0 -2
- package/dist/es/c/TeamGallery/common/index.js +0 -1
- package/dist/es/c/TeamGallery/index.js +0 -2
- package/dist/es/c/TeamGallery/styles.scss +0 -100
- package/dist/es/c/Testimonials/Testimonials.js +0 -99
- package/dist/es/c/Testimonials/index.js +0 -2
- package/dist/es/c/Testimonials/styles.scss +0 -112
- package/dist/es/experimental/GradientBackground/GradientBackground.js +0 -76
- package/dist/es/experimental/GradientBackground/index.js +0 -2
- package/dist/es/experimental/GradientBackground/styles.scss +0 -64
- package/dist/es/experimental/index.js +0 -1
- package/dist/es/f/fields/IntlTelInput/IntlTelInput.js +0 -152
- package/dist/es/f/fields/IntlTelInput/index.js +0 -2
- package/dist/es/f/fields/IntlTelInput/styles.scss +0 -37
- package/dist/es/f/fields/PhoneIntlTelInput/PhoneIntlTelInput.js +0 -163
- package/dist/es/f/fields/PhoneIntlTelInput/index.js +0 -2
- package/dist/es/f/fields/PhoneIntlTelInput/styles.scss +0 -43
- package/dist/es/f/fields/QuerySelect/styles.scss +0 -21
- package/dist/es/f/fields/TaskRecommendation/TaskRecommendation.js +0 -111
- package/dist/es/f/fields/TaskRecommendation/index.js +0 -2
- package/dist/es/f/fields/TaskRecommendation/styles.scss +0 -37
- package/dist/es/f/fields/TextArea/TextArea.js +0 -124
- package/dist/es/f/fields/TextArea/index.js +0 -2
- package/dist/es/f/fields/TextArea/styles.scss +0 -19
- package/dist/es/test/QueryLoader/styles.scss +0 -9
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || 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
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
4
|
-
import * as React from 'react';
|
|
5
|
-
import PropTypes from 'prop-types';
|
|
6
|
-
import styleNames from '@pareto-engineering/bem';
|
|
7
|
-
import { Link } from 'react-router-dom';
|
|
8
|
-
import format from 'date-fns/format'; // TODO need to be imported from a common dir instread
|
|
9
|
-
|
|
10
|
-
import { useBlog } from "../../../BlogContext";
|
|
11
|
-
import { BlogCategoryButton } from "../../../BlogCategoryButton"; // Local Definitions
|
|
12
|
-
|
|
13
|
-
const baseClassName = styleNames.base;
|
|
14
|
-
const componentClassName = 'article-card';
|
|
15
|
-
const wordsPerMinute = 230;
|
|
16
|
-
/**
|
|
17
|
-
* This is the component description.
|
|
18
|
-
*/
|
|
19
|
-
|
|
20
|
-
const Card = ({
|
|
21
|
-
id,
|
|
22
|
-
className: userClassName,
|
|
23
|
-
style,
|
|
24
|
-
title,
|
|
25
|
-
slug,
|
|
26
|
-
description,
|
|
27
|
-
mainImage,
|
|
28
|
-
author,
|
|
29
|
-
category,
|
|
30
|
-
wordCount,
|
|
31
|
-
publishedOn,
|
|
32
|
-
color,
|
|
33
|
-
size,
|
|
34
|
-
...otherProps
|
|
35
|
-
}) => {
|
|
36
|
-
const {
|
|
37
|
-
generateBlogPath
|
|
38
|
-
} = useBlog();
|
|
39
|
-
return /*#__PURE__*/React.createElement("div", _extends({
|
|
40
|
-
id: id,
|
|
41
|
-
className: [baseClassName, componentClassName, userClassName, `y-${color}`, `size-${size}`].filter(e => e).join(' '),
|
|
42
|
-
style: style
|
|
43
|
-
}, otherProps), /*#__PURE__*/React.createElement("div", {
|
|
44
|
-
className: "header"
|
|
45
|
-
}, /*#__PURE__*/React.createElement("span", null, format(new Date(publishedOn), 'MMMM do, yyyy')), category && /*#__PURE__*/React.createElement(BlogCategoryButton, {
|
|
46
|
-
className: "s-1",
|
|
47
|
-
categorySlug: category.slug
|
|
48
|
-
}, category.name)), /*#__PURE__*/React.createElement("div", {
|
|
49
|
-
className: "illustration"
|
|
50
|
-
}, /*#__PURE__*/React.createElement("img", {
|
|
51
|
-
src: mainImage,
|
|
52
|
-
alt: description
|
|
53
|
-
})), /*#__PURE__*/React.createElement("div", {
|
|
54
|
-
className: "title"
|
|
55
|
-
}, /*#__PURE__*/React.createElement(Link, {
|
|
56
|
-
to: generateBlogPath('SINGLE', {
|
|
57
|
-
slug
|
|
58
|
-
})
|
|
59
|
-
}, /*#__PURE__*/React.createElement("p", {
|
|
60
|
-
className: "h3"
|
|
61
|
-
}, title))), /*#__PURE__*/React.createElement("div", {
|
|
62
|
-
className: styleNames.elementContent
|
|
63
|
-
}, description && /*#__PURE__*/React.createElement("p", null, description), wordCount && /*#__PURE__*/React.createElement("p", {
|
|
64
|
-
className: "word-count"
|
|
65
|
-
}, "Reading Time :", ' ', Math.floor(wordCount / wordsPerMinute), ' ', "minutes.")));
|
|
66
|
-
};
|
|
67
|
-
|
|
68
|
-
Card.propTypes = {
|
|
69
|
-
/**
|
|
70
|
-
* The HTML id for this element
|
|
71
|
-
*/
|
|
72
|
-
id: PropTypes.string,
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* The HTML class names for this element
|
|
76
|
-
*/
|
|
77
|
-
className: PropTypes.string,
|
|
78
|
-
|
|
79
|
-
/**
|
|
80
|
-
* The React-written, css properties for this element.
|
|
81
|
-
*/
|
|
82
|
-
style: PropTypes.objectOf(PropTypes.string),
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* The article title
|
|
86
|
-
*/
|
|
87
|
-
title: PropTypes.string.isRequired,
|
|
88
|
-
|
|
89
|
-
/**
|
|
90
|
-
* String of characters that uniquely identify the article
|
|
91
|
-
*/
|
|
92
|
-
slug: PropTypes.string.isRequired,
|
|
93
|
-
|
|
94
|
-
/**
|
|
95
|
-
* The article description
|
|
96
|
-
*/
|
|
97
|
-
description: PropTypes.string.isRequired,
|
|
98
|
-
|
|
99
|
-
/**
|
|
100
|
-
* The article image
|
|
101
|
-
*/
|
|
102
|
-
mainImage: PropTypes.string,
|
|
103
|
-
|
|
104
|
-
/**
|
|
105
|
-
* The first and last name of the article's author
|
|
106
|
-
*/
|
|
107
|
-
author: PropTypes.shape({
|
|
108
|
-
firstName: PropTypes.string.isRequired,
|
|
109
|
-
lastName: PropTypes.string.isRequired
|
|
110
|
-
}).isRequired,
|
|
111
|
-
|
|
112
|
-
/**
|
|
113
|
-
* The category of the article
|
|
114
|
-
*/
|
|
115
|
-
category: PropTypes.shape({
|
|
116
|
-
name: PropTypes.string.isRequired,
|
|
117
|
-
slug: PropTypes.string.isRequired
|
|
118
|
-
}),
|
|
119
|
-
|
|
120
|
-
/**
|
|
121
|
-
* Number of words in the article
|
|
122
|
-
*/
|
|
123
|
-
wordCount: PropTypes.string,
|
|
124
|
-
|
|
125
|
-
/**
|
|
126
|
-
* The date when the article was published
|
|
127
|
-
*/
|
|
128
|
-
publishedOn: PropTypes.string.isRequired,
|
|
129
|
-
|
|
130
|
-
/**
|
|
131
|
-
* The card color
|
|
132
|
-
*/
|
|
133
|
-
color: PropTypes.string,
|
|
134
|
-
|
|
135
|
-
/**
|
|
136
|
-
* The card size
|
|
137
|
-
*/
|
|
138
|
-
size: PropTypes.oneOf(['sm', 'lg'])
|
|
139
|
-
};
|
|
140
|
-
Card.defaultProps = {
|
|
141
|
-
color: 'background'
|
|
142
|
-
};
|
|
143
|
-
export default Card;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Card } from "./Card";
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
|
|
3
|
-
@use "@pareto-engineering/bem";
|
|
4
|
-
@use "@aztlan/stylebook/src/mixins";
|
|
5
|
-
@use "@aztlan/stylebook/src/globals" as *;
|
|
6
|
-
|
|
7
|
-
$default-padding:var(--u);
|
|
8
|
-
$default-background:var(--y);
|
|
9
|
-
$default-color:var(--on-y);
|
|
10
|
-
$base-card-class:article-card;
|
|
11
|
-
$word-count-class:word-count;
|
|
12
|
-
$size-small-class:size-sm;
|
|
13
|
-
$size-large-class:size-lg;
|
|
14
|
-
|
|
15
|
-
.#{bem.$base}.blog-posts-list {
|
|
16
|
-
display: grid;
|
|
17
|
-
gap: $default-padding;
|
|
18
|
-
grid-template-columns: 1fr;
|
|
19
|
-
|
|
20
|
-
.#{$base-card-class} {
|
|
21
|
-
background: $default-background;
|
|
22
|
-
border-radius: var(--theme-border-radius);
|
|
23
|
-
overflow: hidden;
|
|
24
|
-
|
|
25
|
-
.illustration {
|
|
26
|
-
height: 12em;
|
|
27
|
-
|
|
28
|
-
img {
|
|
29
|
-
height: 100%;
|
|
30
|
-
object-fit: cover;
|
|
31
|
-
width: 100%;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
.header {
|
|
36
|
-
align-items: center;
|
|
37
|
-
display: flex;
|
|
38
|
-
justify-content: space-between;
|
|
39
|
-
padding: calc(#{$default-padding} / 2);
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
.title,
|
|
43
|
-
.#{bem.$element-content} {
|
|
44
|
-
color: $default-color;
|
|
45
|
-
padding: $default-padding;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
.title {
|
|
49
|
-
padding-bottom: 0;
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.#{bem.$element-content} {
|
|
53
|
-
.#{$word-count-class} {
|
|
54
|
-
font-size: calc(var(--s-1) * 1em);
|
|
55
|
-
opacity: .6;
|
|
56
|
-
text-transform: uppercase;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
@include mixins.media($from:$sm-md) {
|
|
62
|
-
grid-template-columns: 1fr 1fr;
|
|
63
|
-
|
|
64
|
-
.#{$base-card-class} {
|
|
65
|
-
&.#{$size-large-class} {
|
|
66
|
-
grid-column-end: span 2;
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { useLayoutEffect } from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import styleNames from '@pareto-engineering/bem';
|
|
6
|
-
import { Section } from "./common"; // Local Definitions
|
|
7
|
-
|
|
8
|
-
const baseClassName = styleNames.base;
|
|
9
|
-
const componentClassName = 'site-footer';
|
|
10
|
-
/**
|
|
11
|
-
* This is the component description.
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
const SiteFooter = ({
|
|
15
|
-
id,
|
|
16
|
-
className: userClassName,
|
|
17
|
-
style,
|
|
18
|
-
children // ...otherProps
|
|
19
|
-
|
|
20
|
-
}) => {
|
|
21
|
-
useLayoutEffect(() => {
|
|
22
|
-
import("./styles.scss");
|
|
23
|
-
}, []);
|
|
24
|
-
return /*#__PURE__*/React.createElement("footer", {
|
|
25
|
-
id: id,
|
|
26
|
-
className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
|
|
27
|
-
style: style // {...otherProps}
|
|
28
|
-
|
|
29
|
-
}, children);
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
SiteFooter.propTypes = {
|
|
33
|
-
/**
|
|
34
|
-
* The HTML id for this element
|
|
35
|
-
*/
|
|
36
|
-
id: PropTypes.string,
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* The HTML class names for this element
|
|
40
|
-
*/
|
|
41
|
-
className: PropTypes.string,
|
|
42
|
-
|
|
43
|
-
/**
|
|
44
|
-
* The React-written, css properties for this element.
|
|
45
|
-
*/
|
|
46
|
-
style: PropTypes.objectOf(PropTypes.string),
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* The children JSX
|
|
50
|
-
*/
|
|
51
|
-
children: PropTypes.node
|
|
52
|
-
};
|
|
53
|
-
SiteFooter.defaultProps = {// someProp:false
|
|
54
|
-
};
|
|
55
|
-
SiteFooter.Section = Section;
|
|
56
|
-
export default SiteFooter;
|
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types'; // Local Definitions
|
|
4
|
-
|
|
5
|
-
import styleNames from '@pareto-engineering/bem';
|
|
6
|
-
import { Title } from "../../../../b";
|
|
7
|
-
const baseClassName = styleNames.base;
|
|
8
|
-
console.log(styleNames);
|
|
9
|
-
const componentClassName = styleNames.elementSection;
|
|
10
|
-
/**
|
|
11
|
-
* This is the component description.
|
|
12
|
-
*/
|
|
13
|
-
|
|
14
|
-
const Section = ({
|
|
15
|
-
id,
|
|
16
|
-
className: userClassName,
|
|
17
|
-
style,
|
|
18
|
-
children,
|
|
19
|
-
title,
|
|
20
|
-
span // ...otherProps
|
|
21
|
-
|
|
22
|
-
}) => {
|
|
23
|
-
console.log(1);
|
|
24
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
25
|
-
id: id,
|
|
26
|
-
className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
|
|
27
|
-
style: {
|
|
28
|
-
'--span': span,
|
|
29
|
-
...style
|
|
30
|
-
} // {...otherProps}
|
|
31
|
-
|
|
32
|
-
}, title && /*#__PURE__*/React.createElement(Title, {
|
|
33
|
-
headingAs: "p",
|
|
34
|
-
headingClassName: "h4 c-on-y",
|
|
35
|
-
heading: title
|
|
36
|
-
}), children);
|
|
37
|
-
};
|
|
38
|
-
|
|
39
|
-
Section.propTypes = {
|
|
40
|
-
/**
|
|
41
|
-
* The HTML id for this element
|
|
42
|
-
*/
|
|
43
|
-
id: PropTypes.string,
|
|
44
|
-
|
|
45
|
-
/**
|
|
46
|
-
* The HTML class names for this element
|
|
47
|
-
*/
|
|
48
|
-
className: PropTypes.string,
|
|
49
|
-
|
|
50
|
-
/**
|
|
51
|
-
* The React-written, css properties for this element.
|
|
52
|
-
*/
|
|
53
|
-
style: PropTypes.objectOf(PropTypes.string),
|
|
54
|
-
|
|
55
|
-
/**
|
|
56
|
-
* The children JSX
|
|
57
|
-
*/
|
|
58
|
-
children: PropTypes.node,
|
|
59
|
-
|
|
60
|
-
/**
|
|
61
|
-
* The title of the footer section
|
|
62
|
-
*/
|
|
63
|
-
title: PropTypes.node,
|
|
64
|
-
|
|
65
|
-
/**
|
|
66
|
-
* How many fractional units should the column width be, on desktop
|
|
67
|
-
*/
|
|
68
|
-
span: PropTypes.number
|
|
69
|
-
};
|
|
70
|
-
Section.defaultProps = {
|
|
71
|
-
span: 1
|
|
72
|
-
};
|
|
73
|
-
export default Section;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Section } from "./Section";
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
|
|
3
|
-
@use "@pareto-engineering/bem";
|
|
4
|
-
@use "@aztlan/stylebook/src/mixins";
|
|
5
|
-
@use "@aztlan/stylebook/src/globals" as *;
|
|
6
|
-
|
|
7
|
-
$default-padding:1em;
|
|
8
|
-
|
|
9
|
-
.#{bem.$base}.site-footer {
|
|
10
|
-
--u: #{$default-padding};
|
|
11
|
-
background: var(--y);
|
|
12
|
-
text-align: center;
|
|
13
|
-
|
|
14
|
-
.#{bem.$base}.#{bem.$element-section} {
|
|
15
|
-
color: var(--on-y);
|
|
16
|
-
padding: var(--u);
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
/*
|
|
20
|
-
@include mixins.media($to:$sm-md) {
|
|
21
|
-
} */
|
|
22
|
-
|
|
23
|
-
@include mixins.media($from:$sm-md) {
|
|
24
|
-
display: grid;
|
|
25
|
-
grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
|
|
26
|
-
text-align: left;
|
|
27
|
-
|
|
28
|
-
.#{bem.$base}.#{bem.$element-section} {
|
|
29
|
-
grid-column-end: span var(--span);
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { useLayoutEffect } from 'react'; // import Typed from 'typed.js'
|
|
4
|
-
|
|
5
|
-
import PropTypes from 'prop-types';
|
|
6
|
-
import styleNames from '@pareto-engineering/bem';
|
|
7
|
-
import { Button, Title } from "../../b"; // Local Definitions
|
|
8
|
-
|
|
9
|
-
const baseClassName = styleNames.base;
|
|
10
|
-
const componentClassName = 'header-c-t-a';
|
|
11
|
-
/**
|
|
12
|
-
* This is the component description.
|
|
13
|
-
*/
|
|
14
|
-
|
|
15
|
-
const SiteHeaderCTA = ({
|
|
16
|
-
id,
|
|
17
|
-
className: userClassName,
|
|
18
|
-
style,
|
|
19
|
-
cta,
|
|
20
|
-
surveyLink,
|
|
21
|
-
header,
|
|
22
|
-
subHeader // ...otherProps
|
|
23
|
-
|
|
24
|
-
}) => {
|
|
25
|
-
useLayoutEffect(() => {
|
|
26
|
-
import("./styles.scss");
|
|
27
|
-
}, []);
|
|
28
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
29
|
-
id: id,
|
|
30
|
-
className: [baseClassName, componentClassName, userClassName].filter(e => e).join(' '),
|
|
31
|
-
style: style // {...otherProps}
|
|
32
|
-
|
|
33
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
34
|
-
className: "uc s-1 md-s0"
|
|
35
|
-
}, /*#__PURE__*/React.createElement(Title, {
|
|
36
|
-
heading: header,
|
|
37
|
-
headingClassName: "title uc s4 md-s6"
|
|
38
|
-
}), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("span", {
|
|
39
|
-
className: "typed-content s4 md-s6"
|
|
40
|
-
}, "startup busywork")), /*#__PURE__*/React.createElement("p", {
|
|
41
|
-
className: "description uc s0 md-s1 v2 mt-v"
|
|
42
|
-
}, subHeader), /*#__PURE__*/React.createElement("a", {
|
|
43
|
-
href: surveyLink,
|
|
44
|
-
rel: "noreferrer",
|
|
45
|
-
className: "v3 mt-v"
|
|
46
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
47
|
-
className: "s-1 md-s0"
|
|
48
|
-
}, cta)), /*#__PURE__*/React.createElement("span", {
|
|
49
|
-
className: "no-credit-card u1 mt-u md-s0 s-1"
|
|
50
|
-
}, "No credit card required"));
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
SiteHeaderCTA.propTypes = {
|
|
54
|
-
/**
|
|
55
|
-
* The HTML id for this element
|
|
56
|
-
*/
|
|
57
|
-
id: PropTypes.string,
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* The HTML class names for this element
|
|
61
|
-
*/
|
|
62
|
-
className: PropTypes.string,
|
|
63
|
-
|
|
64
|
-
/**
|
|
65
|
-
* The React-written, css properties for this element.
|
|
66
|
-
*/
|
|
67
|
-
style: PropTypes.objectOf(PropTypes.string),
|
|
68
|
-
|
|
69
|
-
/**
|
|
70
|
-
* The cta text
|
|
71
|
-
*/
|
|
72
|
-
cta: PropTypes.string,
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* The cta link
|
|
76
|
-
*/
|
|
77
|
-
surveyLink: PropTypes.string.isRequired,
|
|
78
|
-
|
|
79
|
-
/**
|
|
80
|
-
* The hero section header
|
|
81
|
-
*/
|
|
82
|
-
header: PropTypes.string.isRequired,
|
|
83
|
-
|
|
84
|
-
/**
|
|
85
|
-
* The hero section sub header
|
|
86
|
-
*/
|
|
87
|
-
subHeader: PropTypes.string.isRequired
|
|
88
|
-
};
|
|
89
|
-
SiteHeaderCTA.defaultProps = {
|
|
90
|
-
cta: 'Get started in 5 min'
|
|
91
|
-
};
|
|
92
|
-
export default SiteHeaderCTA;
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
|
|
3
|
-
@use "@pareto-engineering/bem";
|
|
4
|
-
@use "@aztlan/stylebook/src/mixins";
|
|
5
|
-
@use "@aztlan/stylebook/src/globals" as *;
|
|
6
|
-
|
|
7
|
-
$typed-cusor-font-size-sm:1.728em;
|
|
8
|
-
$typed-cusor-font-size-md:2.985984em;
|
|
9
|
-
|
|
10
|
-
.#{bem.$base}.header-c-t-a {
|
|
11
|
-
align-items: center;
|
|
12
|
-
display: flex;
|
|
13
|
-
flex-direction: column;
|
|
14
|
-
justify-content: space-between;
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
.typed-content {
|
|
18
|
-
color: var(--main1);
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
.typed-cursor {
|
|
22
|
-
color: var(--main1);
|
|
23
|
-
font-size: $typed-cusor-font-size-md;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.description {
|
|
27
|
-
color: var(--subtitle);
|
|
28
|
-
margin-bottom: 0;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.no-credit-card {
|
|
32
|
-
color: var(--metadata);
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
@include mixins.media($to:$sm-md) {
|
|
36
|
-
padding: var(--u);
|
|
37
|
-
|
|
38
|
-
.typed-cursor {
|
|
39
|
-
font-size: $typed-cusor-font-size-sm;
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
|
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
function _extends() { _extends = Object.assign || 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
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
4
|
-
import * as React from 'react';
|
|
5
|
-
import { useLayoutEffect } from 'react';
|
|
6
|
-
import PropTypes from 'prop-types';
|
|
7
|
-
import styleNames from '@pareto-engineering/bem';
|
|
8
|
-
import { TeamInfo, AnimatedCounter } from "../../a"; // Local Definitions
|
|
9
|
-
|
|
10
|
-
const baseClassName = styleNames.base;
|
|
11
|
-
const componentClassName = 'mission';
|
|
12
|
-
/**
|
|
13
|
-
* This is the component description.
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
const SiteMission = ({
|
|
17
|
-
id,
|
|
18
|
-
className: userClassName,
|
|
19
|
-
style,
|
|
20
|
-
color,
|
|
21
|
-
teamInfoMap,
|
|
22
|
-
teamReviewMap,
|
|
23
|
-
delay // ...otherProps
|
|
24
|
-
|
|
25
|
-
}) => {
|
|
26
|
-
useLayoutEffect(() => {
|
|
27
|
-
import("./styles.scss");
|
|
28
|
-
}, []);
|
|
29
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
30
|
-
id: id,
|
|
31
|
-
className: [baseClassName, componentClassName, userClassName, 'u2', `x-${color}`].filter(e => e).join(' '),
|
|
32
|
-
style: style // {...otherProps}
|
|
33
|
-
|
|
34
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
35
|
-
className: "review-content s-1 md-s0"
|
|
36
|
-
}, teamReviewMap.map(review => /*#__PURE__*/React.createElement(AnimatedCounter, _extends({
|
|
37
|
-
key: review.description
|
|
38
|
-
}, review, {
|
|
39
|
-
color: color,
|
|
40
|
-
delay: delay
|
|
41
|
-
})))), /*#__PURE__*/React.createElement("div", {
|
|
42
|
-
className: "team-info-content v2 mv-v"
|
|
43
|
-
}, teamInfoMap.map(info => /*#__PURE__*/React.createElement(TeamInfo, _extends({
|
|
44
|
-
key: info.description
|
|
45
|
-
}, info)))));
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
SiteMission.propTypes = {
|
|
49
|
-
/**
|
|
50
|
-
* The HTML id for this element
|
|
51
|
-
*/
|
|
52
|
-
id: PropTypes.string,
|
|
53
|
-
|
|
54
|
-
/**
|
|
55
|
-
* The HTML class names for this element
|
|
56
|
-
*/
|
|
57
|
-
className: PropTypes.string,
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
* The React-written, css properties for this element.
|
|
61
|
-
*/
|
|
62
|
-
style: PropTypes.objectOf(PropTypes.string),
|
|
63
|
-
|
|
64
|
-
/**
|
|
65
|
-
* The teamReviewMap
|
|
66
|
-
*/
|
|
67
|
-
teamReviewMap: PropTypes.arrayOf(PropTypes.shape({
|
|
68
|
-
number: PropTypes.number.isRequired,
|
|
69
|
-
unit: PropTypes.string.isRequired,
|
|
70
|
-
description: PropTypes.string.isRequired
|
|
71
|
-
})).isRequired,
|
|
72
|
-
|
|
73
|
-
/**
|
|
74
|
-
* The color
|
|
75
|
-
*/
|
|
76
|
-
color: PropTypes.string,
|
|
77
|
-
|
|
78
|
-
/**
|
|
79
|
-
* The teamInfoMap
|
|
80
|
-
*/
|
|
81
|
-
teamInfoMap: PropTypes.arrayOf(PropTypes.shape({
|
|
82
|
-
description: PropTypes.string.isRequired,
|
|
83
|
-
img: PropTypes.string.isRequired,
|
|
84
|
-
name: PropTypes.string.isRequired,
|
|
85
|
-
role: PropTypes.string.isRequired
|
|
86
|
-
})).isRequired,
|
|
87
|
-
|
|
88
|
-
/**
|
|
89
|
-
* Animated counter delay
|
|
90
|
-
*/
|
|
91
|
-
delay: PropTypes.number
|
|
92
|
-
};
|
|
93
|
-
SiteMission.defaultProps = {
|
|
94
|
-
color: 'main1'
|
|
95
|
-
};
|
|
96
|
-
export default SiteMission;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
/* @pareto-engineering/generator-front 1.0.12 */
|
|
2
|
-
|
|
3
|
-
@use "@pareto-engineering/bem";
|
|
4
|
-
@use "@aztlan/stylebook/src/mixins";
|
|
5
|
-
@use "@aztlan/stylebook/src/globals" as *;
|
|
6
|
-
|
|
7
|
-
$grid-gap:1em;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
.#{bem.$base}.mission {
|
|
11
|
-
height: auto;
|
|
12
|
-
|
|
13
|
-
.review-content {
|
|
14
|
-
display: grid;
|
|
15
|
-
gap: $grid-gap;
|
|
16
|
-
grid-template-columns: repeat(auto-fit, minmax(6em, 1fr));
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
.team-info-content {
|
|
20
|
-
display: grid;
|
|
21
|
-
gap: $grid-gap;
|
|
22
|
-
grid-template-columns: repeat(auto-fit, minmax(12em, 1fr));
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
@include mixins.media($to:$sm-md) {
|
|
26
|
-
padding: var(--u);
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
|