oddsgate-ds 1.0.164 → 1.0.166
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/index.js +4 -4
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/atoms/Separator/Separator.component.d.ts +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/atoms/Separator/Separator.component.d.ts +1 -1
- package/package.json +1 -1
- package/src/components/atoms/Separator/Separator.component.tsx +10 -8
- package/src/components/atoms/Separator/Separator.theme.ts +0 -19
- package/src/components/molecules/CareersCard/CareersCard.theme.ts +1 -1
- package/src/components/molecules/NewsCard/NewsCard.component.tsx +11 -3
- package/src/components/molecules/NewsCard/NewsCard.theme.ts +1 -1
- package/src/components/molecules/ProductCard/ProductCard.component.tsx +16 -11
- package/dist/public/assets/dots.svg +0 -53
- package/public/assets/dots.svg +0 -53
package/package.json
CHANGED
|
@@ -1,17 +1,19 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import { StyledSeparator } from './Separator.theme'
|
|
1
|
+
import { ISeparator } from './Separator.interface';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { StyledSeparator } from './Separator.theme';
|
|
5
4
|
|
|
6
5
|
const Separator = ({ type, color, height, margin, ...props }: ISeparator) => {
|
|
7
6
|
return (
|
|
8
7
|
<StyledSeparator
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
8
|
+
style={{
|
|
9
|
+
borderColor: color ? color : ``,
|
|
10
|
+
borderTopWidth: height,
|
|
11
|
+
borderStyle: type,
|
|
12
|
+
margin: margin ? margin : ''
|
|
13
|
+
}}
|
|
13
14
|
{...props}
|
|
14
15
|
/>
|
|
15
16
|
)
|
|
16
17
|
}
|
|
18
|
+
|
|
17
19
|
export default Separator
|
|
@@ -5,24 +5,5 @@ import { ISeparator } from './Separator.interface';
|
|
|
5
5
|
export const StyledSeparator = styled.div<ISeparator>`
|
|
6
6
|
display: block;
|
|
7
7
|
width: 100%;
|
|
8
|
-
${({ type, color, height, margin }) => css`
|
|
9
|
-
border-style: ${type || 'solid'};
|
|
10
|
-
border-color: ${color || 'black'};
|
|
11
|
-
border-width: 0 0 ${height || 1} 0;
|
|
12
|
-
margin: ${margin || 0};
|
|
13
|
-
|
|
14
|
-
${type === 'dotted' &&
|
|
15
|
-
css`
|
|
16
|
-
border-style: dotted;
|
|
17
|
-
border-image-source: url('./assets/dots.svg');
|
|
18
|
-
border-image-source: -webkit-image-set(url('/assets/dots.svg'));
|
|
19
|
-
border-image-slice: 33% 33%;
|
|
20
|
-
border-image-repeat: round;
|
|
21
|
-
|
|
22
|
-
svg{
|
|
23
|
-
fill: red;
|
|
24
|
-
}
|
|
25
|
-
`}
|
|
26
|
-
`}
|
|
27
8
|
`;
|
|
28
9
|
|
|
@@ -4,7 +4,7 @@ import styled, { css } from 'styled-components';
|
|
|
4
4
|
import { ICareersCard } from './CareersCard.interface';
|
|
5
5
|
|
|
6
6
|
export const StyledCareersCard = styled.div <ICareersCard>`
|
|
7
|
-
color: ${colors.
|
|
7
|
+
color: ${colors.third50};
|
|
8
8
|
background-color: ${colors.secondary50};
|
|
9
9
|
padding: 2rem;
|
|
10
10
|
border-radius: ${radius.md};
|
|
@@ -3,7 +3,7 @@ import Heading from '@/components/atoms/Heading'
|
|
|
3
3
|
import { INewsCard } from './NewsCard.interface'
|
|
4
4
|
import ImageWrapper from '@/components/atoms/ImageWrapper'
|
|
5
5
|
import React from 'react'
|
|
6
|
-
|
|
6
|
+
|
|
7
7
|
import { StyledNewsCard } from './NewsCard.theme'
|
|
8
8
|
|
|
9
9
|
const NewsCard = ({
|
|
@@ -26,7 +26,11 @@ const NewsCard = ({
|
|
|
26
26
|
}
|
|
27
27
|
>
|
|
28
28
|
<div>
|
|
29
|
-
<Heading
|
|
29
|
+
<Heading
|
|
30
|
+
tag={'h3'}
|
|
31
|
+
size={variant === 'featured' ? 'h3' : 'h4'}
|
|
32
|
+
className={'fw-bold textEllipsis'}
|
|
33
|
+
>
|
|
30
34
|
{title}
|
|
31
35
|
</Heading>
|
|
32
36
|
<Heading tag={'span'} size={'captions'} className={'textEllipsis mt-3'}>
|
|
@@ -34,7 +38,11 @@ const NewsCard = ({
|
|
|
34
38
|
</Heading>
|
|
35
39
|
</div>
|
|
36
40
|
{date && (
|
|
37
|
-
<Heading
|
|
41
|
+
<Heading
|
|
42
|
+
tag={'span'}
|
|
43
|
+
size={variant === 'featured' ? 'h5' : 'texts'}
|
|
44
|
+
className={'fw-bold mt-4'}
|
|
45
|
+
>
|
|
38
46
|
{date}
|
|
39
47
|
</Heading>
|
|
40
48
|
)}
|
|
@@ -8,7 +8,7 @@ import { StyledChip } from '@/components/atoms/Chip/Chip.theme';
|
|
|
8
8
|
export const StyledNewsCard = styled(Card) <INewsCard>`
|
|
9
9
|
padding: 1rem;
|
|
10
10
|
color: ${colors.secondary50};
|
|
11
|
-
background-color: ${colors.
|
|
11
|
+
background-color: ${colors.third50};
|
|
12
12
|
border-radius: ${radius.md};
|
|
13
13
|
text-align:left;
|
|
14
14
|
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
StyledProductCard,
|
|
3
|
+
StyledProductCardWrapper
|
|
4
|
+
} from './ProductCard.theme'
|
|
2
5
|
|
|
3
6
|
import Heading from '@/components/atoms/Heading'
|
|
4
7
|
import { IProductCard } from './ProductCard.interface'
|
|
@@ -15,25 +18,23 @@ const ProductCard = ({
|
|
|
15
18
|
style,
|
|
16
19
|
...props
|
|
17
20
|
}: IProductCard) => {
|
|
18
|
-
|
|
19
|
-
const
|
|
20
|
-
const half = parts ? parts.length / 2 : 0;
|
|
21
|
+
const parts = title ? title.split(' ') : []
|
|
22
|
+
const half = parts ? parts.length / 2 : 0
|
|
21
23
|
|
|
22
24
|
// const firstRowTitle = Array.prototype.join.call({
|
|
23
25
|
// ...parts,
|
|
24
26
|
// length: half,
|
|
25
27
|
// }, " ");
|
|
26
|
-
let firstRowTitle
|
|
27
|
-
let secondRowTitle
|
|
28
|
+
let firstRowTitle
|
|
29
|
+
let secondRowTitle
|
|
28
30
|
|
|
29
31
|
if (parts.length > 1) {
|
|
30
|
-
firstRowTitle = parts.slice(0, half).join(
|
|
31
|
-
secondRowTitle = parts.slice(half, parts?.length).join(
|
|
32
|
+
firstRowTitle = parts.slice(0, half).join(' ')
|
|
33
|
+
secondRowTitle = parts.slice(half, parts?.length).join(' ')
|
|
32
34
|
} else {
|
|
33
|
-
firstRowTitle = title
|
|
35
|
+
firstRowTitle = title
|
|
34
36
|
}
|
|
35
37
|
|
|
36
|
-
|
|
37
38
|
return (
|
|
38
39
|
<StyledProductCard className={className} style={style}>
|
|
39
40
|
<StyledProductCardWrapper>
|
|
@@ -45,7 +46,11 @@ const ProductCard = ({
|
|
|
45
46
|
{secondRowTitle}
|
|
46
47
|
</Heading>
|
|
47
48
|
</StyledProductCardWrapper>
|
|
48
|
-
{description &&
|
|
49
|
+
{description && (
|
|
50
|
+
<RichText tag="p" className="color-secondary50 mt-8">
|
|
51
|
+
{description}
|
|
52
|
+
</RichText>
|
|
53
|
+
)}
|
|
49
54
|
|
|
50
55
|
{linkElement}
|
|
51
56
|
</StyledProductCard>
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
-
<svg width="25px" height="25px" viewBox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
|
3
|
-
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
|
|
4
|
-
<title>dots</title>
|
|
5
|
-
<desc>Created with Sketch.</desc>
|
|
6
|
-
<defs></defs>
|
|
7
|
-
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
|
8
|
-
<g id="Artboard-1" sketch:type="MSArtboardGroup" transform="translate(-140.000000, -154.000000)" fill="#440E3F">
|
|
9
|
-
<g id="dots" sketch:type="MSLayerGroup" transform="translate(140.000000, 154.000000)">
|
|
10
|
-
<g id="dot" sketch:type="MSShapeGroup">
|
|
11
|
-
<g>
|
|
12
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
13
|
-
</g>
|
|
14
|
-
</g>
|
|
15
|
-
<g id="dot" transform="translate(0.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
16
|
-
<g>
|
|
17
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
18
|
-
</g>
|
|
19
|
-
</g>
|
|
20
|
-
<g id="dot" transform="translate(0.000000, 10.000000)" sketch:type="MSShapeGroup">
|
|
21
|
-
<g>
|
|
22
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
23
|
-
</g>
|
|
24
|
-
</g>
|
|
25
|
-
<g id="dot" transform="translate(10.000000, 0.000000)" sketch:type="MSShapeGroup">
|
|
26
|
-
<g>
|
|
27
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
28
|
-
</g>
|
|
29
|
-
</g>
|
|
30
|
-
<g id="dot" transform="translate(10.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
31
|
-
<g>
|
|
32
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
33
|
-
</g>
|
|
34
|
-
</g>
|
|
35
|
-
<g id="dot" transform="translate(20.000000, 0.000000)" sketch:type="MSShapeGroup">
|
|
36
|
-
<g>
|
|
37
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
38
|
-
</g>
|
|
39
|
-
</g>
|
|
40
|
-
<g id="dot" transform="translate(20.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
41
|
-
<g>
|
|
42
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
43
|
-
</g>
|
|
44
|
-
</g>
|
|
45
|
-
<g id="dot" transform="translate(20.000000, 10.000000)" sketch:type="MSShapeGroup">
|
|
46
|
-
<g>
|
|
47
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
48
|
-
</g>
|
|
49
|
-
</g>
|
|
50
|
-
</g>
|
|
51
|
-
</g>
|
|
52
|
-
</g>
|
|
53
|
-
</svg>
|
package/public/assets/dots.svg
DELETED
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
2
|
-
<svg width="25px" height="25px" viewBox="0 0 25 25" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
|
3
|
-
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
|
|
4
|
-
<title>dots</title>
|
|
5
|
-
<desc>Created with Sketch.</desc>
|
|
6
|
-
<defs></defs>
|
|
7
|
-
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
|
8
|
-
<g id="Artboard-1" sketch:type="MSArtboardGroup" transform="translate(-140.000000, -154.000000)" fill="#440E3F">
|
|
9
|
-
<g id="dots" sketch:type="MSLayerGroup" transform="translate(140.000000, 154.000000)">
|
|
10
|
-
<g id="dot" sketch:type="MSShapeGroup">
|
|
11
|
-
<g>
|
|
12
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
13
|
-
</g>
|
|
14
|
-
</g>
|
|
15
|
-
<g id="dot" transform="translate(0.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
16
|
-
<g>
|
|
17
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
18
|
-
</g>
|
|
19
|
-
</g>
|
|
20
|
-
<g id="dot" transform="translate(0.000000, 10.000000)" sketch:type="MSShapeGroup">
|
|
21
|
-
<g>
|
|
22
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
23
|
-
</g>
|
|
24
|
-
</g>
|
|
25
|
-
<g id="dot" transform="translate(10.000000, 0.000000)" sketch:type="MSShapeGroup">
|
|
26
|
-
<g>
|
|
27
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
28
|
-
</g>
|
|
29
|
-
</g>
|
|
30
|
-
<g id="dot" transform="translate(10.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
31
|
-
<g>
|
|
32
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
33
|
-
</g>
|
|
34
|
-
</g>
|
|
35
|
-
<g id="dot" transform="translate(20.000000, 0.000000)" sketch:type="MSShapeGroup">
|
|
36
|
-
<g>
|
|
37
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
38
|
-
</g>
|
|
39
|
-
</g>
|
|
40
|
-
<g id="dot" transform="translate(20.000000, 20.000000)" sketch:type="MSShapeGroup">
|
|
41
|
-
<g>
|
|
42
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
43
|
-
</g>
|
|
44
|
-
</g>
|
|
45
|
-
<g id="dot" transform="translate(20.000000, 10.000000)" sketch:type="MSShapeGroup">
|
|
46
|
-
<g>
|
|
47
|
-
<circle cx="2.5" cy="2.5" r="2.5"></circle>
|
|
48
|
-
</g>
|
|
49
|
-
</g>
|
|
50
|
-
</g>
|
|
51
|
-
</g>
|
|
52
|
-
</g>
|
|
53
|
-
</svg>
|