@platformatic/ui-components 0.1.60 → 0.1.62

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.
Files changed (27) hide show
  1. package/dist/assets/index.560569d1.css +1 -0
  2. package/dist/assets/index.86ac9c31.js +40 -0
  3. package/dist/index.html +2 -2
  4. package/index.js +6 -4
  5. package/package.json +1 -1
  6. package/src/components/Common.module.css +16 -2
  7. package/src/components/LoadingSpinner.jsx +30 -0
  8. package/src/components/LoadingSpinner.module.css +8 -0
  9. package/src/components/Tag.jsx +55 -0
  10. package/src/components/Tag.module.css +7 -0
  11. package/src/components/constants.js +7 -1
  12. package/src/components/icons/LoadingAppIcon.jsx +54 -0
  13. package/src/components/icons/SocialGitHubIcon.jsx +9 -9
  14. package/src/components/icons/WorkspaceGitHubIcon.jsx +132 -0
  15. package/src/components/icons/index.js +4 -0
  16. package/src/components/logos/BasicLogo.jsx +60 -0
  17. package/src/components/logos/FreeLogo.jsx +58 -0
  18. package/src/components/logos/index.js +7 -0
  19. package/src/stories/{Loader.stories.jsx → LoadingSpinner.stories.jsx} +10 -10
  20. package/src/stories/{BorderedText.stories.jsx → Tag.stories.jsx} +8 -6
  21. package/src/stories/logos/Logos.stories.jsx +78 -0
  22. package/dist/assets/index.0de95a32.css +0 -1
  23. package/dist/assets/index.d6543e3d.js +0 -40
  24. package/src/components/BorderedText.jsx +0 -8
  25. package/src/components/BorderedText.module.css +0 -3
  26. package/src/components/Loader.jsx +0 -22
  27. package/src/components/Loader.module.css +0 -13
package/dist/index.html CHANGED
@@ -4,8 +4,8 @@
4
4
  <meta charset="UTF-8" />
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
6
  <title>Platformatic UI Components</title>
7
- <script type="module" crossorigin src="/assets/index.d6543e3d.js"></script>
8
- <link rel="stylesheet" href="/assets/index.0de95a32.css">
7
+ <script type="module" crossorigin src="/assets/index.86ac9c31.js"></script>
8
+ <link rel="stylesheet" href="/assets/index.560569d1.css">
9
9
  </head>
10
10
  <body>
11
11
  <div id="root"></div>
package/index.js CHANGED
@@ -1,7 +1,6 @@
1
1
  'use strict'
2
2
 
3
3
  import BorderedBox from './src/components/BorderedBox'
4
- import BorderedText from './src/components/BorderedText'
5
4
  import Box from './src/components/Box'
6
5
  import Button from './src/components/Button'
7
6
  import ButtonFullRounded from './src/components/ButtonFullRounded'
@@ -19,9 +18,10 @@ import Layout from './src/components/layouts/Layout'
19
18
  import List from './src/components/List'
20
19
  import ListElement from './src/components/ListElement'
21
20
  import Loadable from './src/components/Loadable'
22
- import Loader from './src/components/Loader'
21
+ import LoadingSpinner from './src/components/LoadingSpinner'
23
22
  import LoginButton from './src/components/LoginButton'
24
23
  import Logo from './src/components/Logo'
24
+ import Logos from './src/components/logs'
25
25
  import Modal from './src/components/Modal'
26
26
  import PlatformaticIcon from './src/components/PlatformaticIcon'
27
27
  import Playground from './src/components/Playground'
@@ -29,6 +29,7 @@ import SearchBar from './src/components/SearchBar'
29
29
  import SimpleMetric from './src/components/SimpleMetric'
30
30
  import Status from './src/components/Status'
31
31
  import TabbedWindow from './src/components/TabbedWindow'
32
+ import Tag from './src/components/Tag'
32
33
  import TextWithLabel from './src/components/TextWithLabel'
33
34
  import TwoColumnsLayout from './src/components/layouts/TwoColumnsLayout'
34
35
  import Versions from './src/components/Versions'
@@ -36,7 +37,6 @@ import VerticalSeparator from './src/components/VerticalSeparator'
36
37
 
37
38
  export {
38
39
  BorderedBox,
39
- BorderedText,
40
40
  Box,
41
41
  Button,
42
42
  ButtonFullRounded,
@@ -48,13 +48,14 @@ export {
48
48
  GHLoginButton,
49
49
  Forms,
50
50
  Icons,
51
+ Logos,
51
52
  InfoBox,
52
53
  Sidebar,
53
54
  Layout,
54
55
  List,
55
56
  ListElement,
56
57
  Loadable,
57
- Loader,
58
+ LoadingSpinner,
58
59
  LoginButton,
59
60
  Logo,
60
61
  Modal,
@@ -64,6 +65,7 @@ export {
64
65
  SimpleMetric,
65
66
  Status,
66
67
  TabbedWindow,
68
+ Tag,
67
69
  TextWithLabel,
68
70
  TwoColumnsLayout,
69
71
  Versions,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@platformatic/ui-components",
3
3
  "description": "Platformatic UI Components",
4
- "version": "0.1.60",
4
+ "version": "0.1.62",
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",
7
7
  "repository": {
package/src/components/Common.module.css CHANGED
@@ -28,7 +28,13 @@
28
28
  @apply px-2 py-2.5;
29
29
  }
30
30
 
31
- .text--green {
31
+ .text--error-red {
32
+ @apply text-error-red
33
+ }
34
+ .text--white {
35
+ @apply text-white
36
+ }
37
+ .text--main-green {
32
38
  @apply text-main-green
33
39
  }
34
40
  .text--main-dark-blue {
@@ -65,10 +71,18 @@
65
71
  .background-color-transparent{
66
72
  @apply bg-transparent;
67
73
  }
74
+ .background-color-opaque-100 {
75
+ @apply bg-opacity-100 !important;
76
+ }
77
+ .background-color-opaque-60 {
78
+ @apply bg-opacity-60 !important;
79
+ }
80
+ .background-color-opaque-30 {
81
+ @apply bg-opacity-30 !important;
82
+ }
68
83
  .apply-opacity-30 {
69
84
  @apply opacity-30;
70
85
  }
71
-
72
86
  .padding--small {
73
87
  @apply p-1 ;
74
88
  }
package/src/components/LoadingSpinner.jsx ADDED
@@ -0,0 +1,30 @@
1
+ import React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import styles from './LoadingSpinner.module.css'
4
+ import { SpinnerCircular } from 'spinners-react'
5
+
6
+ function LoadingSpinner ({ loading }) {
7
+ // If null then loading not started, if true then loading, if false then done loading
8
+ return loading
9
+ ? (
10
+ <div className={styles.container} data-testid='loading-spinner'>
11
+ <div data-testid='loading-spinner-content' className={styles.relative}>
12
+ <SpinnerCircular className={styles.spinner} thickness={180} size={60} />
13
+ </div>
14
+ </div>
15
+ )
16
+ : <></>
17
+ }
18
+
19
+ LoadingSpinner.propTypes = {
20
+ /**
21
+ * loading
22
+ */
23
+ loading: PropTypes.bool
24
+ }
25
+
26
+ LoadingSpinner.defaultProps = {
27
+ loading: false
28
+ }
29
+
30
+ export default LoadingSpinner
package/src/components/LoadingSpinner.module.css ADDED
@@ -0,0 +1,8 @@
1
+ .container {
2
+ @apply fixed top-0 left-0 h-screen w-full min-h-screen min-w-full overflow-y-auto bg-main-dark-blue z-50 bg-opacity-70;
3
+ }
4
+ .spinner {
5
+ @apply z-50 absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2
6
+ }
7
+
8
+
package/src/components/Tag.jsx ADDED
@@ -0,0 +1,55 @@
1
+ 'use strict'
2
+ import React from 'react'
3
+ import PropTypes from 'prop-types'
4
+ import commonStyles from './Common.module.css'
5
+ import styles from './Tag.module.css'
6
+ import { COLORS_BUTTON } from './constants'
7
+
8
+ function Tag ({ text, color, backgroundColor, bordered, opaque }) {
9
+ const stylesColor = commonStyles[`text--${color}`]
10
+ let stylesBorderColor = ''
11
+ if (bordered) {
12
+ stylesBorderColor = `${styles.bordered} `
13
+ stylesBorderColor += commonStyles[`bordered--${color}`]
14
+ }
15
+ const stylesBackgroundColor = backgroundColor ? commonStyles[`background-color-${backgroundColor}`] : ''
16
+ const opacity = commonStyles[`background-color-opaque-${opaque}`]
17
+ const className = `${styles.tag} ${stylesColor} ${stylesBorderColor} ${stylesBackgroundColor} ${opacity}`
18
+
19
+ return (
20
+ <span className={className}>{text}</span>
21
+ )
22
+ }
23
+ Tag.propTypes = {
24
+ /**
25
+ * color
26
+ */
27
+ color: PropTypes.oneOf(COLORS_BUTTON),
28
+ /**
29
+ * text
30
+ */
31
+ text: PropTypes.string,
32
+ /**
33
+ * backgroundColor
34
+ */
35
+ backgroundColor: PropTypes.oneOf(COLORS_BUTTON),
36
+ /**
37
+ * bordered
38
+ */
39
+ bordered: PropTypes.bool,
40
+ /**
41
+ * opaque
42
+ */
43
+ opaque: PropTypes.oneOf([100, 60, 30])
44
+
45
+ }
46
+
47
+ Tag.defaultProps = {
48
+ backgroundColor: '',
49
+ color: 'white',
50
+ text: '',
51
+ bordered: true,
52
+ opaque: 100
53
+ }
54
+
55
+ export default Tag
package/src/components/Tag.module.css ADDED
@@ -0,0 +1,7 @@
1
+ .tag {
2
+ @apply rounded-md px-2 py-1 tracking-super-widest w-fit;
3
+ }
4
+
5
+ .bordered {
6
+ @apply border border-solid;
7
+ }
package/src/components/constants.js CHANGED
@@ -1,4 +1,10 @@
1
1
  export const COLORS_ICON = ['main-green', 'white', 'main-dark-blue', 'error-red', 'warning-yellow']
2
- export const SIZES = ['small', 'medium', 'large', 'extra-large']
3
2
  export const COLORS_BUTTON = ['main-green', 'dark-green', 'light-green', 'main-dark-blue', 'dark-blue', 'light-blue', 'white', 'error-red', 'tertiary-blue', 'transparent']
4
3
  export const COLORS_BORDERED_BOX = ['main-green', 'error-red', 'white', 'dark-blue', 'warning-yellow', 'transparent']
4
+ export const WHITE = 'white'
5
+ export const MAIN_DARK_BLUE = 'main-dark-blue'
6
+ export const SMALL = 'small'
7
+ export const MEDIUM = 'medium'
8
+ export const LARGE = 'large'
9
+ export const EXTRA_LARGE = 'extra-large'
10
+ export const SIZES = [SMALL, MEDIUM, LARGE, EXTRA_LARGE]
package/src/components/icons/LoadingAppIcon.jsx ADDED
@@ -0,0 +1,54 @@
1
+ import * as React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import styles from './Icons.module.css'
4
+ import { COLORS_ICON, SIZES } from '../constants'
5
+
6
+ const LoadingAppIcon = ({ color, size }) => {
7
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
8
+ const filledClassName = styles[`filled-${color}`]
9
+
10
+ let icon = <></>
11
+
12
+ switch (size) {
13
+ case 'medium':
14
+ icon = (
15
+ <svg
16
+ width={26}
17
+ height={26}
18
+ viewBox='0 0 26 26'
19
+ fill='none'
20
+ xmlns='http://www.w3.org/2000/svg'
21
+ className={className}
22
+ >
23
+ <rect x={1} y={21} width={24} height={4} rx={2} stroke='none' />
24
+ <rect x={2} y={22} width={17} height={2} rx={1} fill='none' className={filledClassName} />
25
+ <path d='M13.4632 14.0067L12.5 13.2229L7.24671 17L9.25329 10.8885L4 7.11146L10.4934 7.11146L12.5 1L14.5066 7.11146L21 7.11146L15.7467 10.8885L16.0918 11.4054' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
26
+ <circle cx={17.1395} cy={15.1775} r={2.75763} stroke='none' />
27
+ <path d='M21.0003 19.0382L19.3457 17.3836' stroke='none' strokeLinecap='round' strokeLinejoin='round' />
28
+ </svg>
29
+ )
30
+ break
31
+
32
+ default:
33
+ break
34
+ }
35
+ return icon
36
+ }
37
+
38
+ LoadingAppIcon.propTypes = {
39
+ /**
40
+ * color of text, icon and borders
41
+ */
42
+ color: PropTypes.oneOf(COLORS_ICON),
43
+ /**
44
+ * Size
45
+ */
46
+ size: PropTypes.oneOf(SIZES)
47
+ }
48
+
49
+ LoadingAppIcon.defaultProps = {
50
+ color: 'main-dark-blue',
51
+ size: 'medium'
52
+ }
53
+
54
+ export default LoadingAppIcon
package/src/components/icons/SocialGitHubIcon.jsx CHANGED
@@ -20,9 +20,9 @@ const SocialGitHubIcon = ({ color, size }) => {
20
20
  className={className}
21
21
  >
22
22
  <path d='M9.20977 11.1833C9.58066 11.1352 9.91607 11.0753 10.2442 10.9731C11.3996 10.6138 12.0277 9.79838 12.1937 8.57913C12.277 7.96738 12.2884 7.36152 12.0559 6.77597C11.953 6.51725 11.8152 6.27884 11.634 6.07088C11.5767 6.00506 11.5713 5.95069 11.596 5.86882C11.7597 5.32715 11.7078 4.79432 11.5298 4.26576C11.4981 4.17209 11.444 4.15605 11.3632 4.15768C11.0455 4.16391 10.7541 4.27132 10.4694 4.4033C10.2192 4.51923 9.981 4.65907 9.75359 4.81758C9.69151 4.86081 9.63862 4.86834 9.56482 4.84902C8.52215 4.57884 7.47758 4.57654 6.43522 4.84902C6.34527 4.87259 6.28731 4.84738 6.2189 4.80251C5.78625 4.51792 5.34093 4.26248 4.82529 4.17471C4.81484 4.17308 4.80471 4.17013 4.79425 4.16816C4.52503 4.12559 4.49368 4.14393 4.41608 4.41444C4.27514 4.906 4.24853 5.39985 4.40341 5.89437C4.42051 5.94906 4.42716 5.98999 4.38377 6.04043C3.78737 6.73438 3.67303 7.55998 3.77819 8.44322C3.81746 8.77366 3.88588 9.09755 4.00782 9.40768C4.36097 10.308 5.04542 10.7897 5.92244 11.0294C6.19229 11.1031 6.46785 11.1463 6.76969 11.1889C6.53753 11.4443 6.41527 11.7319 6.36744 12.0538C6.35794 12.1177 6.30885 12.1239 6.26736 12.1419C5.51671 12.4664 4.85823 12.2519 4.42115 11.5423C4.20672 11.1938 3.92515 10.9371 3.52227 10.849C3.41205 10.8247 3.30278 10.8244 3.19446 10.8624C3.08043 10.9023 3.07157 10.9751 3.14346 11.0595C3.19541 11.1201 3.25464 11.1788 3.32147 11.22C3.67715 11.4404 3.90203 11.7722 4.05343 12.1573C4.29572 12.7736 4.76385 13.0507 5.37133 13.1208C5.65005 13.1529 5.93099 13.1375 6.20528 13.0733C6.31043 13.0487 6.34052 13.0671 6.33926 13.1823C6.33482 13.5422 6.34179 13.9025 6.34369 14.2624C6.34527 14.5869 6.1451 14.7373 5.84168 14.6331C5.07899 14.3708 4.38409 13.9772 3.76584 13.4473C2.38807 12.268 1.56837 10.7589 1.37358 8.91972C1.03152 5.69034 2.90053 2.71869 5.88918 1.68972C9.55025 0.429205 13.4793 2.62667 14.4576 6.48188C15.3242 9.89564 13.4197 13.5161 10.1717 14.6298C9.84893 14.7405 9.6516 14.5981 9.65192 14.2516C9.65255 13.6461 9.65952 13.0405 9.65604 12.435C9.65319 11.9765 9.55564 11.5485 9.21008 11.1833H9.20977Z' fill='none' className={filledClassName} />
23
- <path opacity='0.1' d='M6.17644 12.3233C6.23883 12.3325 6.30693 12.3459 6.29711 12.4232C6.28698 12.5044 6.2154 12.531 6.1435 12.5333C6.08332 12.5352 6.01712 12.5179 6.01934 12.4422C6.02219 12.343 6.10549 12.3348 6.17644 12.3233V12.3233Z' fill='none' className={filledClassName} />
24
- <path opacity='0.1' d='M4.66993 12.2503C4.5936 12.2369 4.53596 12.191 4.52487 12.0983C4.5179 12.0397 4.54514 12.0047 4.60405 12.0076C4.70161 12.0125 4.75672 12.0738 4.76875 12.1678C4.77604 12.2244 4.73518 12.2529 4.66993 12.2506V12.2503Z' fill='none' className={filledClassName} />
25
- <path opacity='0.1' d='M5.65143 12.3918C5.71668 12.4 5.79206 12.4105 5.78857 12.493C5.78509 12.5798 5.70781 12.6001 5.63718 12.5965C5.5732 12.5932 5.50383 12.5712 5.51017 12.4864C5.5165 12.4023 5.5903 12.4003 5.65143 12.3918V12.3918Z' fill='none' className={filledClassName} />
23
+ <path opacity={0.1} d='M6.17644 12.3233C6.23883 12.3325 6.30693 12.3459 6.29711 12.4232C6.28698 12.5044 6.2154 12.531 6.1435 12.5333C6.08332 12.5352 6.01712 12.5179 6.01934 12.4422C6.02219 12.343 6.10549 12.3348 6.17644 12.3233V12.3233Z' fill='none' className={filledClassName} />
24
+ <path opacity={0.1} d='M4.66993 12.2503C4.5936 12.2369 4.53596 12.191 4.52487 12.0983C4.5179 12.0397 4.54514 12.0047 4.60405 12.0076C4.70161 12.0125 4.75672 12.0738 4.76875 12.1678C4.77604 12.2244 4.73518 12.2529 4.66993 12.2506V12.2503Z' fill='none' className={filledClassName} />
25
+ <path opacity={0.1} d='M5.65143 12.3918C5.71668 12.4 5.79206 12.4105 5.78857 12.493C5.78509 12.5798 5.70781 12.6001 5.63718 12.5965C5.5732 12.5932 5.50383 12.5712 5.51017 12.4864C5.5165 12.4023 5.5903 12.4003 5.65143 12.3918V12.3918Z' fill='none' className={filledClassName} />
26
26
  <path d='M5.0918 12.303C5.16654 12.308 5.23876 12.3387 5.24541 12.4258C5.25143 12.5025 5.18238 12.5146 5.1222 12.51C5.04492 12.5038 4.97302 12.4769 4.97302 12.3816C4.97302 12.3112 5.03225 12.304 5.0918 12.303Z' fill='none' className={filledClassName} />
27
27
  <path d='M4.41933 11.764C4.41965 11.8134 4.40603 11.8557 4.3525 11.855C4.26382 11.8537 4.22327 11.7934 4.21251 11.7103C4.20649 11.6628 4.22232 11.6192 4.2768 11.6199C4.36644 11.6209 4.40096 11.686 4.41933 11.7643V11.764Z' fill='none' className={filledClassName} />
28
28
  <path d='M4.14625 11.387C4.15037 11.4398 4.12661 11.4689 4.08449 11.4686C4.01291 11.4683 3.96698 11.4263 3.95558 11.353C3.94766 11.3035 3.96667 11.2609 4.02051 11.2668C4.08924 11.2747 4.12978 11.3242 4.14625 11.387V11.387Z' fill='none' className={filledClassName} />
@@ -41,9 +41,9 @@ const SocialGitHubIcon = ({ color, size }) => {
41
41
  className={className}
42
42
  >
43
43
  <path d='M13.8146 16.775C14.3709 16.7028 14.874 16.6129 15.3662 16.4596C17.0994 15.9207 18.0415 14.6976 18.2904 12.8687C18.4154 11.9511 18.4325 11.0423 18.0838 10.1639C17.9294 9.77586 17.7227 9.41824 17.451 9.10631C17.365 9.00757 17.3569 8.92603 17.3939 8.80322C17.6396 7.99071 17.5616 7.19147 17.2946 6.39862C17.2471 6.25812 17.1659 6.23405 17.0447 6.23651C16.5682 6.24584 16.1311 6.40697 15.704 6.60494C15.3287 6.77883 14.9714 6.98859 14.6303 7.22635C14.5372 7.29119 14.4579 7.30249 14.3472 7.27351C12.7832 6.86824 11.2163 6.8648 9.65278 7.27351C9.51785 7.30888 9.43091 7.27105 9.32829 7.20375C8.67931 6.77687 8.01133 6.39371 7.23788 6.26205C7.2222 6.2596 7.207 6.25518 7.19132 6.25223C6.78749 6.18837 6.74046 6.21588 6.62406 6.62164C6.41264 7.35898 6.37273 8.09977 6.60505 8.84153C6.63071 8.92357 6.64069 8.98497 6.5756 9.06062C5.681 10.1016 5.50949 11.34 5.66722 12.6648C5.72613 13.1605 5.82875 13.6463 6.01166 14.1115C6.54139 15.4619 7.56807 16.1845 8.8836 16.5441C9.28838 16.6546 9.70171 16.7195 10.1545 16.7833C9.80623 17.1665 9.62285 17.5978 9.55111 18.0807C9.53685 18.1765 9.46321 18.1858 9.40098 18.2128C8.27501 18.6997 7.28729 18.3779 6.63166 17.3134C6.31002 16.7907 5.88766 16.4056 5.28335 16.2734C5.11801 16.2371 4.95411 16.2366 4.79162 16.2936C4.62059 16.3535 4.60729 16.4626 4.71513 16.5893C4.79305 16.6802 4.88189 16.7681 4.98214 16.83C5.51567 17.1606 5.85298 17.6582 6.08008 18.2359C6.44352 19.1604 7.14571 19.576 8.05694 19.6811C8.47502 19.7293 8.89643 19.7062 9.30786 19.6099C9.46559 19.5731 9.51072 19.6006 9.50882 19.7735C9.50217 20.3134 9.51262 20.8537 9.51547 21.3936C9.51785 21.8804 9.21759 22.1059 8.76245 21.9497C7.61843 21.5562 6.57607 20.9657 5.64869 20.1709C3.58204 18.402 2.3525 16.1383 2.06031 13.3796C1.54721 8.53549 4.35074 4.07802 8.83372 2.53456C14.3253 0.643792 20.2188 3.93998 21.6864 9.72281C22.9863 14.8435 20.1295 20.2741 15.2574 21.9448C14.7733 22.1108 14.4773 21.8971 14.4778 21.3774C14.4788 20.4691 14.4892 19.5608 14.484 18.6525C14.4797 17.9648 14.3334 17.3227 13.8151 16.775H13.8146Z' fill='none' className={filledClassName} />
44
- <path opacity='0.1' d='M9.26454 18.485C9.35813 18.4987 9.46027 18.5189 9.44555 18.6348C9.43034 18.7566 9.32297 18.7964 9.21513 18.7999C9.12486 18.8028 9.02556 18.7768 9.02889 18.6633C9.03317 18.5145 9.15812 18.5022 9.26454 18.485Z' fill='none' className={filledClassName} />
45
- <path opacity='0.1' d='M7.00484 18.3754C6.89034 18.3553 6.80387 18.2865 6.78725 18.1475C6.77679 18.0596 6.81765 18.007 6.90602 18.0114C7.05235 18.0188 7.13501 18.1107 7.15307 18.2516C7.16399 18.3366 7.10271 18.3794 7.00484 18.3759V18.3754Z' fill='none' className={filledClassName} />
46
- <path opacity='0.1' d='M8.47715 18.5876C8.57501 18.5999 8.68809 18.6156 8.68286 18.7394C8.67764 18.8696 8.56171 18.9001 8.45577 18.8947C8.3598 18.8898 8.25575 18.8568 8.26525 18.7296C8.27476 18.6034 8.38545 18.6004 8.47715 18.5876Z' fill='none' className={filledClassName} />
44
+ <path opacity={0.1} d='M9.26454 18.485C9.35813 18.4987 9.46027 18.5189 9.44555 18.6348C9.43034 18.7566 9.32297 18.7964 9.21513 18.7999C9.12486 18.8028 9.02556 18.7768 9.02889 18.6633C9.03317 18.5145 9.15812 18.5022 9.26454 18.485Z' fill='none' className={filledClassName} />
45
+ <path opacity={0.1} d='M7.00484 18.3754C6.89034 18.3553 6.80387 18.2865 6.78725 18.1475C6.77679 18.0596 6.81765 18.007 6.90602 18.0114C7.05235 18.0188 7.13501 18.1107 7.15307 18.2516C7.16399 18.3366 7.10271 18.3794 7.00484 18.3759V18.3754Z' fill='none' className={filledClassName} />
46
+ <path opacity={0.1} d='M8.47715 18.5876C8.57501 18.5999 8.68809 18.6156 8.68286 18.7394C8.67764 18.8696 8.56171 18.9001 8.45577 18.8947C8.3598 18.8898 8.25575 18.8568 8.26525 18.7296C8.27476 18.6034 8.38545 18.6004 8.47715 18.5876Z' fill='none' className={filledClassName} />
47
47
  <path d='M7.63763 18.4545C7.74975 18.4619 7.85808 18.5081 7.86805 18.6387C7.87708 18.7537 7.77351 18.7719 7.68324 18.765C7.56732 18.7557 7.45947 18.7154 7.45947 18.5724C7.45947 18.4668 7.54832 18.456 7.63763 18.4545Z' fill='none' className={filledClassName} />
48
48
  <path d='M6.62893 17.646C6.62941 17.7201 6.60898 17.7835 6.52869 17.7825C6.39566 17.7806 6.33485 17.6902 6.3187 17.5654C6.30967 17.4942 6.33343 17.4288 6.41514 17.4298C6.54959 17.4313 6.60138 17.5291 6.62893 17.6465V17.646Z' fill='none' className={filledClassName} />
49
49
  <path d='M6.21925 17.0805C6.22543 17.1596 6.1898 17.2034 6.12661 17.2029C6.01924 17.2024 5.95035 17.1395 5.93325 17.0295C5.92137 16.9553 5.94988 16.8914 6.03064 16.9003C6.13374 16.9121 6.19455 16.9862 6.21925 17.0805Z' fill='none' className={filledClassName} />
@@ -63,9 +63,9 @@ const SocialGitHubIcon = ({ color, size }) => {
63
63
  className={className}
64
64
  >
65
65
  <path d='M23.0244 27.9583C23.9516 27.838 24.7901 27.6881 25.6104 27.4327C28.499 26.5346 30.0692 24.4959 30.4841 21.4478C30.6924 19.9184 30.7209 18.4038 30.1397 16.9399C29.8823 16.2931 29.5379 15.6971 29.085 15.1772C28.9416 15.0126 28.9282 14.8767 28.9899 14.672C29.3993 13.3179 29.2695 11.9858 28.8245 10.6644C28.7453 10.4302 28.6099 10.3901 28.408 10.3942C27.6138 10.4097 26.8853 10.6783 26.1734 11.0082C25.5479 11.2981 24.9524 11.6477 24.3839 12.0439C24.2287 12.152 24.0965 12.1708 23.912 12.1225C21.3053 11.4471 18.6939 11.4413 16.088 12.1225C15.8631 12.1815 15.7182 12.1184 15.5472 12.0063C14.4656 11.2948 13.3523 10.6562 12.0632 10.4368C12.037 10.4327 12.0117 10.4253 11.9856 10.4204C11.3125 10.314 11.2341 10.3598 11.0401 11.0361C10.6878 12.265 10.6213 13.4996 11.0085 14.7359C11.0512 14.8726 11.0679 14.975 10.9594 15.101C9.46837 16.8359 9.18252 18.8999 9.44541 21.108C9.5436 21.9341 9.71463 22.7439 10.0195 23.5192C10.9024 25.7699 12.6135 26.9742 14.806 27.5735C15.4807 27.7577 16.1696 27.8658 16.9242 27.9722C16.3438 28.6108 16.0381 29.3297 15.9186 30.1345C15.8948 30.2942 15.7721 30.3097 15.6683 30.3547C13.7917 31.1661 12.1455 30.6298 11.0528 28.8556C10.5167 27.9845 9.81281 27.3426 8.80562 27.1224C8.53006 27.0618 8.25688 27.061 7.98608 27.156C7.70103 27.2559 7.67885 27.4376 7.8586 27.6488C7.98846 27.8003 8.13653 27.9469 8.3036 28.05C9.19282 28.601 9.75501 29.4304 10.1335 30.3932C10.7392 31.9341 11.9096 32.6267 13.4283 32.8019C14.1251 32.8821 14.8274 32.8437 15.5131 32.6832C15.776 32.6218 15.8512 32.6676 15.8481 32.9558C15.837 33.8556 15.8544 34.7562 15.8592 35.656C15.8631 36.4673 15.3627 36.8431 14.6041 36.5828C12.6974 35.927 10.9602 34.9429 9.41453 33.6182C5.9701 30.6699 3.92087 26.8973 3.4339 22.2993C2.57873 14.2258 7.25127 6.79671 14.7229 4.22427C23.8756 1.073 33.6981 6.56665 36.1441 16.2047C38.3105 24.7391 33.5493 33.7901 25.4291 36.5746C24.6223 36.8513 24.129 36.4952 24.1297 35.629C24.1313 34.1151 24.1487 32.6013 24.14 31.0875C24.1329 29.9413 23.889 28.8712 23.0252 27.9583H23.0244Z' fill='none' className={filledClassName} />
66
- <path opacity='0.1' d='M15.441 30.8083C15.597 30.8312 15.7672 30.8648 15.7427 31.058C15.7173 31.2611 15.5384 31.3274 15.3586 31.3331C15.2082 31.338 15.0427 31.2946 15.0482 31.1055C15.0554 30.8574 15.2636 30.837 15.441 30.8083V30.8083Z' fill='none' className={filledClassName} />
67
- <path opacity='0.1' d='M11.6748 30.6257C11.4839 30.5922 11.3398 30.4775 11.3121 30.2458C11.2947 30.0993 11.3628 30.0117 11.5101 30.019C11.754 30.0313 11.8917 30.1844 11.9218 30.4194C11.94 30.561 11.8379 30.6323 11.6748 30.6265V30.6257Z' fill='none' className={filledClassName} />
68
- <path opacity='0.1' d='M14.1286 30.9794C14.2917 30.9999 14.4801 31.0261 14.4714 31.2324C14.4627 31.4494 14.2695 31.5001 14.0929 31.4911C13.933 31.4829 13.7596 31.4281 13.7754 31.216C13.7913 31.0056 13.9758 31.0007 14.1286 30.9794V30.9794Z' fill='none' className={filledClassName} />
66
+ <path opacity={0.1} d='M15.441 30.8083C15.597 30.8312 15.7672 30.8648 15.7427 31.058C15.7173 31.2611 15.5384 31.3274 15.3586 31.3331C15.2082 31.338 15.0427 31.2946 15.0482 31.1055C15.0554 30.8574 15.2636 30.837 15.441 30.8083V30.8083Z' fill='none' className={filledClassName} />
67
+ <path opacity={0.1} d='M11.6748 30.6257C11.4839 30.5922 11.3398 30.4775 11.3121 30.2458C11.2947 30.0993 11.3628 30.0117 11.5101 30.019C11.754 30.0313 11.8917 30.1844 11.9218 30.4194C11.94 30.561 11.8379 30.6323 11.6748 30.6265V30.6257Z' fill='none' className={filledClassName} />
68
+ <path opacity={0.1} d='M14.1286 30.9794C14.2917 30.9999 14.4801 31.0261 14.4714 31.2324C14.4627 31.4494 14.2695 31.5001 14.0929 31.4911C13.933 31.4829 13.7596 31.4281 13.7754 31.216C13.7913 31.0056 13.9758 31.0007 14.1286 30.9794V30.9794Z' fill='none' className={filledClassName} />
69
69
  <path d='M12.7294 30.7575C12.9163 30.7698 13.0968 30.8468 13.1135 31.0646C13.1285 31.2561 12.9559 31.2864 12.8054 31.275C12.6122 31.2594 12.4325 31.1923 12.4325 30.954C12.4325 30.778 12.5806 30.76 12.7294 30.7575Z' fill='none' className={filledClassName} />
70
70
  <path d='M11.0483 29.4099C11.0491 29.5336 11.015 29.6392 10.8812 29.6375C10.6595 29.6343 10.5581 29.4836 10.5312 29.2757C10.5162 29.157 10.5557 29.0481 10.6919 29.0497C10.916 29.0522 11.0023 29.2151 11.0483 29.4108V29.4099Z' fill='none' className={filledClassName} />
71
71
  <path d='M10.3655 28.4676C10.3758 28.5994 10.3164 28.6723 10.2111 28.6714C10.0321 28.6706 9.91733 28.5658 9.88883 28.3824C9.86903 28.2588 9.91654 28.1524 10.0512 28.1671C10.223 28.1868 10.3243 28.3104 10.3655 28.4676V28.4676Z' fill='none' className={filledClassName} />
package/src/components/icons/WorkspaceGitHubIcon.jsx ADDED
@@ -0,0 +1,132 @@
1
+ import * as React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import styles from './Icons.module.css'
4
+ import { COLORS_ICON, SIZES } from '../constants'
5
+
6
+ const WorkspaceGitHubIcon = ({ color, size }) => {
7
+ const className = `${styles.noShrinkForFlex} ` + styles[`${color}`]
8
+ const filledClassName = styles[`filled-${color}`]
9
+ let icon = <></>
10
+
11
+ switch (size) {
12
+ case 'small':
13
+ icon = (
14
+ <svg
15
+ width={16}
16
+ height={16}
17
+ viewBox='0 0 16 16'
18
+ fill='none'
19
+ xmlns='http://www.w3.org/2000/svg'
20
+ className={className}
21
+ >
22
+ <rect x={2} y={2} width={5} height={5} rx={1} stroke='none' />
23
+ <rect x={14} y={14} width={4} height={5.03496} rx={1} transform='rotate(-180 14 14)' stroke='none' />
24
+ <rect x={8} y={14} width={6} height={5.03497} rx={1} transform='rotate(-180 8 14)' stroke='none' />
25
+ <path d='M11.9536 5.69375C12.0927 5.67569 12.2185 5.65322 12.3416 5.6149C12.7748 5.48018 13.0104 5.17439 13.0726 4.71717C13.1038 4.48776 13.1081 4.26057 13.0209 4.04098C12.9823 3.94397 12.9307 3.85456 12.8627 3.77658C12.8412 3.75189 12.8392 3.73151 12.8485 3.7008C12.9099 3.49768 12.8904 3.29787 12.8237 3.09965C12.8118 3.06453 12.7915 3.05851 12.7612 3.05913C12.6421 3.06146 12.5328 3.10174 12.426 3.15123C12.3322 3.19471 12.2429 3.24715 12.1576 3.30659C12.1343 3.3228 12.1145 3.32562 12.0868 3.31838C11.6958 3.21706 11.3041 3.2162 10.9132 3.31838C10.8795 3.32722 10.8577 3.31776 10.8321 3.30094C10.6698 3.19422 10.5028 3.09843 10.3095 3.06551C10.3056 3.0649 10.3017 3.06379 10.2978 3.06306C10.1969 3.04709 10.1851 3.05397 10.156 3.15541C10.1032 3.33975 10.0932 3.52494 10.1513 3.71038C10.1577 3.73089 10.1602 3.74624 10.1439 3.76516C9.92025 4.02539 9.87737 4.33499 9.91681 4.66621C9.93153 4.79012 9.95719 4.91158 10.0029 5.02788C10.1353 5.36548 10.392 5.54613 10.7209 5.63603C10.8221 5.66366 10.9254 5.67987 11.0386 5.69584C10.9516 5.79163 10.9057 5.89945 10.8878 6.02017C10.8842 6.04412 10.8658 6.04645 10.8502 6.05321C10.5688 6.17491 10.3218 6.09447 10.1579 5.82835C10.0775 5.69768 9.97192 5.6014 9.82084 5.56836C9.7795 5.55927 9.73853 5.55915 9.69791 5.57339C9.65515 5.58838 9.65182 5.61564 9.67878 5.64733C9.69826 5.67005 9.72047 5.69203 9.74553 5.7075C9.87892 5.79015 9.96325 5.91456 10.02 6.05898C10.1109 6.29011 10.2864 6.394 10.5142 6.42028C10.6188 6.43232 10.7241 6.42655 10.827 6.40248C10.8664 6.39327 10.8777 6.40014 10.8772 6.44337C10.8755 6.57834 10.8782 6.71343 10.8789 6.8484C10.8795 6.9701 10.8044 7.02647 10.6906 6.98742C10.4046 6.88905 10.144 6.74143 9.91217 6.54273C9.39551 6.10049 9.08812 5.53459 9.01508 4.84489C8.8868 3.63387 9.58768 2.51951 10.7084 2.13364C12.0813 1.66095 13.5547 2.485 13.9216 3.9307C14.2466 5.21086 13.5324 6.56852 12.3144 6.98619C12.1933 7.0277 12.1193 6.97428 12.1195 6.84434C12.1197 6.61727 12.1223 6.3902 12.121 6.16312C12.1199 5.99119 12.0833 5.83068 11.9538 5.69375H11.9536Z' fill='none' className={filledClassName} />
26
+ <path opacity={0.1} d='M10.8163 6.12131C10.8397 6.12475 10.8652 6.12978 10.8615 6.15876C10.8577 6.18922 10.8309 6.19917 10.8039 6.20003C10.7813 6.20076 10.7565 6.19426 10.7573 6.16589C10.7584 6.12868 10.7897 6.12561 10.8163 6.12131Z' fill='none' className={filledClassName} />
27
+ <path opacity={0.1} d='M10.2513 6.09384C10.2227 6.08881 10.2011 6.07161 10.1969 6.03686C10.1943 6.01488 10.2045 6.00174 10.2266 6.00284C10.2632 6.00468 10.2839 6.02765 10.2884 6.0629C10.2911 6.08414 10.2758 6.09483 10.2513 6.09397V6.09384Z' fill='none' className={filledClassName} />
28
+ <path opacity={0.1} d='M10.6195 6.14694C10.644 6.15001 10.6723 6.15394 10.671 6.18489C10.6697 6.21743 10.6407 6.22505 10.6142 6.2237C10.5902 6.22247 10.5642 6.21424 10.5666 6.18243C10.5689 6.15087 10.5966 6.15014 10.6195 6.14694Z' fill='none' className={filledClassName} />
29
+ <path d='M10.4095 6.11356C10.4376 6.1154 10.4646 6.12694 10.4671 6.15961C10.4694 6.18835 10.4435 6.19289 10.4209 6.19117C10.392 6.18884 10.365 6.17877 10.365 6.14303C10.365 6.11663 10.3872 6.11392 10.4095 6.11356Z' fill='none' className={filledClassName} />
30
+ <path d='M10.1574 5.91146C10.1575 5.93 10.1524 5.94585 10.1323 5.9456C10.099 5.94511 10.0838 5.92251 10.0798 5.89132C10.0775 5.87351 10.0835 5.85718 10.1039 5.85742C10.1375 5.85779 10.1505 5.88223 10.1574 5.91158V5.91146Z' fill='none' className={filledClassName} />
31
+ <path d='M10.0548 5.77016C10.0564 5.78993 10.0474 5.80086 10.0317 5.80074C10.0048 5.80062 9.98759 5.7849 9.98331 5.75739C9.98034 5.73884 9.98747 5.72288 10.0077 5.72509C10.0334 5.72804 10.0486 5.74658 10.0548 5.77016Z' fill='none' className={filledClassName} />
32
+ <path d='M9.94862 5.66874C9.94755 5.6879 9.93449 5.69416 9.92036 5.69281C9.90242 5.69097 9.88437 5.68348 9.87985 5.66285C9.87605 5.64516 9.88817 5.63669 9.90408 5.63657C9.92594 5.63644 9.9409 5.64787 9.94862 5.66874Z' fill='none' className={filledClassName} />
33
+ </svg>
34
+ )
35
+ break
36
+ case 'medium':
37
+ icon = (
38
+ <svg
39
+ width={24}
40
+ height={24}
41
+ viewBox='0 0 24 24'
42
+ fill='none'
43
+ xmlns='http://www.w3.org/2000/svg'
44
+ className={className}
45
+ >
46
+ <rect x={3} y={3} width={7.5} height={7.5} rx={1} stroke='none' strokeWidth={1.5} />
47
+ <rect x={21} y={21} width={6} height={7.55245} rx={1} transform='rotate(-180 21 21)' stroke='none' strokeWidth={1.5} />
48
+ <rect x={12} y={21} width={9} height={7.55245} rx={1} transform='rotate(-180 12 21)' stroke='none' strokeWidth={1.5} />
49
+ <path d='M17.9305 8.54062C18.1391 8.51354 18.3278 8.47983 18.5123 8.42236C19.1623 8.22027 19.5156 7.76158 19.6089 7.07576C19.6558 6.73165 19.6622 6.39085 19.5314 6.06148C19.4735 5.91595 19.396 5.78184 19.2941 5.66487C19.2619 5.62784 19.2588 5.59726 19.2727 5.55121C19.3648 5.24652 19.3356 4.9468 19.2355 4.64948C19.2177 4.5968 19.1872 4.58777 19.1418 4.58869C18.9631 4.59219 18.7992 4.65261 18.639 4.72685C18.4983 4.79206 18.3643 4.87072 18.2364 4.95988C18.2015 4.9842 18.1717 4.98843 18.1302 4.97757C17.5437 4.82559 16.9561 4.8243 16.3698 4.97757C16.3192 4.99083 16.2866 4.97664 16.2481 4.95141C16.0047 4.79133 15.7542 4.64764 15.4642 4.59827C15.4583 4.59735 15.4526 4.59569 15.4467 4.59459C15.2953 4.57064 15.2777 4.58095 15.234 4.73311C15.1547 5.00962 15.1398 5.28741 15.2269 5.56557C15.2365 5.59634 15.2403 5.61936 15.2158 5.64773C14.8804 6.03808 14.8161 6.50248 14.8752 6.99931C14.8973 7.18518 14.9358 7.36737 15.0044 7.54182C15.203 8.04822 15.588 8.3192 16.0814 8.45404C16.2331 8.49549 16.3881 8.5198 16.5579 8.54375C16.4273 8.68744 16.3586 8.84918 16.3317 9.03026C16.3263 9.06618 16.2987 9.06968 16.2754 9.07981C15.8531 9.26237 15.4827 9.14171 15.2369 8.74252C15.1163 8.54652 14.9579 8.40209 14.7313 8.35254C14.6693 8.33891 14.6078 8.33872 14.5469 8.36009C14.4827 8.38257 14.4777 8.42346 14.5182 8.47099C14.5474 8.50507 14.5807 8.53804 14.6183 8.56125C14.8184 8.68523 14.9449 8.87184 15.03 9.08847C15.1663 9.43516 15.4296 9.59101 15.7714 9.63043C15.9281 9.64848 16.0862 9.63982 16.2404 9.60372C16.2996 9.5899 16.3165 9.60022 16.3158 9.66506C16.3133 9.86751 16.3172 10.0701 16.3183 10.2726C16.3192 10.4552 16.2066 10.5397 16.0359 10.4811C15.6069 10.3336 15.216 10.1121 14.8683 9.81409C14.0933 9.15074 13.6322 8.30188 13.5226 7.26734C13.3302 5.45081 14.3815 3.77926 16.0626 3.20046C18.122 2.49142 20.3321 3.72749 20.8824 5.89605C21.3698 7.81629 20.2986 9.85277 18.4715 10.4793C18.29 10.5415 18.179 10.4614 18.1792 10.2665C18.1795 9.92591 18.1835 9.58529 18.1815 9.24468C18.1799 8.98679 18.125 8.74602 17.9306 8.54062H17.9305Z' fill='none' className={filledClassName} />
50
+ <path opacity={0.1} d='M16.2241 9.18195C16.2592 9.1871 16.2975 9.19466 16.292 9.23813C16.2863 9.28382 16.2461 9.29874 16.2056 9.30003C16.1718 9.30113 16.1345 9.29137 16.1358 9.24882C16.1374 9.193 16.1842 9.18839 16.2241 9.18195Z' fill='none' className={filledClassName} />
51
+ <path opacity={0.1} d='M15.3769 9.14078C15.3339 9.13323 15.3015 9.10744 15.2953 9.0553C15.2914 9.02233 15.3067 9.00262 15.3398 9.00428C15.3947 9.00704 15.4257 9.04149 15.4325 9.09436C15.4366 9.12623 15.4136 9.14225 15.3769 9.14096V9.14078Z' fill='none' className={filledClassName} />
52
+ <path opacity={0.1} d='M15.9293 9.2204C15.966 9.225 16.0084 9.2309 16.0064 9.27732C16.0045 9.32614 15.961 9.33756 15.9213 9.33553C15.8853 9.33369 15.8463 9.32135 15.8498 9.27364C15.8534 9.22629 15.8949 9.22519 15.9293 9.2204Z' fill='none' className={filledClassName} />
53
+ <path d='M15.6142 9.17035C15.6562 9.17311 15.6968 9.19043 15.7006 9.23943C15.704 9.28254 15.6651 9.28935 15.6313 9.28677C15.5878 9.28327 15.5474 9.26817 15.5474 9.21456C15.5474 9.17495 15.5807 9.1709 15.6142 9.17035Z' fill='none' className={filledClassName} />
54
+ <path d='M15.2359 8.86719C15.2361 8.89501 15.2284 8.91877 15.1983 8.9184C15.1484 8.91767 15.1256 8.88377 15.1196 8.83698C15.1162 8.81027 15.1251 8.78577 15.1557 8.78614C15.2062 8.78669 15.2256 8.82335 15.2359 8.86738V8.86719Z' fill='none' className={filledClassName} />
55
+ <path d='M15.0823 8.65522C15.0847 8.68488 15.0713 8.70128 15.0476 8.70109C15.0073 8.70091 14.9815 8.67733 14.9751 8.63607C14.9706 8.60825 14.9813 8.5843 15.0116 8.58762C15.0503 8.59204 15.0731 8.61986 15.0823 8.65522Z' fill='none' className={filledClassName} />
56
+ <path d='M14.9228 8.50313C14.9212 8.53187 14.9016 8.54126 14.8804 8.53924C14.8535 8.53647 14.8264 8.52524 14.8197 8.49429C14.814 8.46776 14.8321 8.45505 14.856 8.45487C14.8888 8.45468 14.9112 8.47181 14.9228 8.50313Z' fill='none' className={filledClassName} />
57
+ </svg>
58
+ )
59
+ break
60
+ case 'large':
61
+ icon = (
62
+ <svg
63
+ width={40}
64
+ height={40}
65
+ viewBox='0 0 40 40'
66
+ fill='none'
67
+ xmlns='http://www.w3.org/2000/svg'
68
+ className={className}
69
+ >
70
+ <rect x={5} y={5} width={12.5} height={12.5} rx={1} stroke='none' strokeWidth={2} />
71
+ <rect x={35} y={35} width={10} height={12.5874} rx={1} transform='rotate(-180 35 35)' stroke='none' strokeWidth={2} />
72
+ <rect x={20} y={35} width={15} height={12.5874} rx={1} transform='rotate(-180 20 35)' stroke='none' strokeWidth={2} />
73
+ <path d='M29.8841 14.2344C30.2318 14.1892 30.5463 14.1331 30.8539 14.0373C31.9371 13.7005 32.5259 12.936 32.6815 11.7929C32.7596 11.2194 32.7703 10.6514 32.5524 10.1025C32.4559 9.85991 32.3267 9.6364 32.1568 9.44144C32.1031 9.37973 32.0981 9.32877 32.1212 9.25201C32.2747 8.7442 32.226 8.24467 32.0592 7.74914C32.0295 7.66133 31.9787 7.64628 31.903 7.64782C31.6051 7.65365 31.332 7.75436 31.065 7.87809C30.8304 7.98677 30.6072 8.11787 30.394 8.26647C30.3358 8.307 30.2862 8.31406 30.217 8.29594C29.2395 8.04265 28.2602 8.0405 27.283 8.29594C27.1987 8.31805 27.1443 8.29441 27.0802 8.25235C26.6746 7.98554 26.2571 7.74607 25.7737 7.66378C25.7639 7.66225 25.7544 7.65949 25.7446 7.65764C25.4922 7.61773 25.4628 7.63492 25.39 7.88852C25.2579 8.34936 25.233 8.81235 25.3782 9.27596C25.3942 9.32723 25.4004 9.36561 25.3597 9.41289C24.8006 10.0635 24.6934 10.8375 24.792 11.6655C24.8288 11.9753 24.893 12.2789 25.0073 12.5697C25.3384 13.4137 25.98 13.8653 26.8023 14.0901C27.0552 14.1591 27.3136 14.1997 27.5965 14.2396C27.3789 14.4791 27.2643 14.7486 27.2194 15.0504C27.2105 15.1103 27.1645 15.1161 27.1256 15.133C26.4219 15.4373 25.8046 15.2362 25.3948 14.5709C25.1938 14.2442 24.9298 14.0035 24.5521 13.9209C24.4488 13.8982 24.3463 13.8979 24.2448 13.9335C24.1379 13.9709 24.1296 14.0391 24.197 14.1183C24.2457 14.1751 24.3012 14.2301 24.3638 14.2688C24.6973 14.4754 24.9081 14.7864 25.05 15.1475C25.2772 15.7253 25.7161 15.985 26.2856 16.0507C26.5469 16.0808 26.8103 16.0664 27.0674 16.0062C27.166 15.9832 27.1942 16.0004 27.193 16.1084C27.1889 16.4459 27.1954 16.7836 27.1972 17.121C27.1987 17.4253 27.011 17.5662 26.7265 17.4685C26.0115 17.2226 25.36 16.8536 24.7804 16.3568C23.4888 15.2512 22.7203 13.8365 22.5377 12.1122C22.217 9.08468 23.9692 6.29876 26.7711 5.3341C30.2033 4.15237 33.8868 6.21249 34.804 9.82676C35.6164 13.0272 33.831 16.4213 30.7859 17.4655C30.4833 17.5692 30.2983 17.4357 30.2986 17.1109C30.2992 16.5432 30.3058 15.9755 30.3025 15.4078C30.2998 14.978 30.2084 14.5767 29.8844 14.2344H29.8841Z' fill='none' className={filledClassName} />
74
+ <path opacity={0.1} d='M27.0404 15.3033C27.0989 15.3118 27.1627 15.3244 27.1535 15.3969C27.144 15.473 27.0769 15.4979 27.0095 15.5001C26.9531 15.5019 26.891 15.4856 26.8931 15.4147C26.8958 15.3217 26.9739 15.314 27.0404 15.3033Z' fill='none' className={filledClassName} />
75
+ <path opacity={0.1} d='M25.6282 15.2346C25.5566 15.222 25.5026 15.1791 25.4922 15.0922C25.4857 15.0372 25.5112 15.0044 25.5664 15.0071C25.6579 15.0117 25.7096 15.0691 25.7208 15.1573C25.7277 15.2104 25.6894 15.2371 25.6282 15.2349V15.2346Z' fill='none' className={filledClassName} />
76
+ <path opacity={0.1} d='M26.5488 15.3673C26.61 15.375 26.6807 15.3848 26.6774 15.4622C26.6741 15.5436 26.6017 15.5626 26.5355 15.5592C26.4755 15.5562 26.4105 15.5356 26.4164 15.4561C26.4223 15.3772 26.4915 15.3753 26.5488 15.3673Z' fill='none' className={filledClassName} />
77
+ <path d='M26.0237 15.2839C26.0938 15.2885 26.1615 15.3174 26.1677 15.399C26.1734 15.4709 26.1086 15.4822 26.0522 15.4779C25.9798 15.4721 25.9124 15.4469 25.9124 15.3576C25.9124 15.2916 25.9679 15.2848 26.0237 15.2839Z' fill='none' className={filledClassName} />
78
+ <path d='M25.3933 14.7787C25.3936 14.825 25.3808 14.8646 25.3306 14.864C25.2475 14.8628 25.2095 14.8063 25.1994 14.7283C25.1937 14.6838 25.2086 14.6429 25.2596 14.6436C25.3437 14.6445 25.376 14.7056 25.3933 14.779V14.7787Z' fill='none' className={filledClassName} />
79
+ <path d='M25.1369 14.4254C25.1408 14.4748 25.1185 14.5021 25.079 14.5018C25.0119 14.5015 24.9688 14.4622 24.9582 14.3935C24.9507 14.3471 24.9686 14.3072 25.019 14.3127C25.0835 14.3201 25.1215 14.3664 25.1369 14.4254Z' fill='none' className={filledClassName} />
80
+ <path d='M24.8714 14.1719C24.8688 14.2198 24.8361 14.2354 24.8008 14.232C24.7559 14.2274 24.7108 14.2087 24.6995 14.1571C24.69 14.1129 24.7203 14.0917 24.7601 14.0914C24.8147 14.0911 24.8521 14.1197 24.8714 14.1719Z' fill='none' className={filledClassName} />
81
+ </svg>
82
+ )
83
+ break
84
+
85
+ case 'extra-large':
86
+ icon = (
87
+ <svg
88
+ width={120}
89
+ height={120}
90
+ viewBox='0 0 120 120'
91
+ fill='none'
92
+ xmlns='http://www.w3.org/2000/svg'
93
+ className={className}
94
+ >
95
+ <rect x={15} y={15} width={37.5} height={37.5} rx={1} stroke='none' strokeWidth={6.5} />
96
+ <rect x={105} y={105} width={30} height={37.7622} rx={1} transform='rotate(-180 105 105)' stroke='none' strokeWidth={6.5} />
97
+ <rect x={60} y={105} width={45} height={37.7622} rx={1} transform='rotate(-180 60 105)' stroke='none' strokeWidth={6.5} />
98
+ <path d='M89.6524 42.7031C90.6955 42.5677 91.6388 42.3992 92.5617 42.1118C95.8113 41.1014 97.5778 38.8079 98.0446 35.3788C98.2789 33.6582 98.3109 31.9543 97.6571 30.3074C97.3676 29.5797 96.9801 28.9092 96.4705 28.3243C96.3093 28.1392 96.2942 27.9863 96.3636 27.756C96.8242 26.2326 96.6781 24.734 96.1775 23.2474C96.0884 22.984 95.9361 22.9389 95.7089 22.9435C94.8154 22.961 93.9959 23.2631 93.1951 23.6343C92.4913 23.9603 91.8215 24.3536 91.1819 24.7994C91.0073 24.921 90.8585 24.9422 90.6509 24.8878C87.7184 24.1279 84.7806 24.1215 81.849 24.8878C81.596 24.9541 81.433 24.8832 81.2405 24.757C80.0237 23.9566 78.7712 23.2382 77.321 22.9914C77.2916 22.9867 77.2631 22.9785 77.2337 22.9729C76.4765 22.8532 76.3884 22.9048 76.1701 23.6656C75.7737 25.0481 75.6989 26.4371 76.1345 27.8279C76.1826 27.9817 76.2013 28.0968 76.0792 28.2387C74.4019 30.1904 74.0803 32.5124 74.376 34.9965C74.4865 35.9259 74.6789 36.8368 75.0219 37.7091C76.0151 40.2411 77.9401 41.596 80.4068 42.2702C81.1657 42.4774 81.9407 42.599 82.7896 42.7188C82.1367 43.4372 81.7928 44.2459 81.6583 45.1513C81.6316 45.3309 81.4935 45.3484 81.3768 45.3991C79.2656 46.3118 77.4137 45.7085 76.1844 43.7126C75.5813 42.7326 74.7894 42.0105 73.6563 41.7627C73.3463 41.6945 73.0389 41.6936 72.7343 41.8005C72.4136 41.9128 72.3887 42.1173 72.5909 42.3549C72.737 42.5253 72.9035 42.6902 73.0915 42.8063C74.0919 43.4261 74.7243 44.3592 75.1501 45.4424C75.8316 47.1758 77.1482 47.955 78.8568 48.1521C79.6407 48.2424 80.4308 48.1991 81.2022 48.0186C81.498 47.9495 81.5826 48.0011 81.579 48.3253C81.5666 49.3375 81.5862 50.3507 81.5915 51.363C81.596 52.2758 81.033 52.6985 80.1796 52.4056C78.0346 51.6678 76.0801 50.5607 74.3413 49.0704C70.4663 45.7537 68.1609 41.5094 67.6131 36.3367C66.651 27.254 71.9076 18.8963 80.3132 16.0023C90.61 12.4571 101.66 18.6375 104.412 29.4803C106.849 39.0815 101.493 49.2639 92.3577 52.3964C91.45 52.7077 90.895 52.3071 90.8959 51.3326C90.8977 49.6295 90.9173 47.9265 90.9075 46.2234C90.8995 44.9339 90.6251 43.7301 89.6532 42.7031H89.6524Z' fill='none' className={filledClassName} />
99
+ <path opacity={0.1} d='M81.121 45.9102C81.2965 45.9359 81.488 45.9737 81.4604 46.1911C81.4319 46.4195 81.2306 46.4941 81.0284 46.5006C80.8591 46.5061 80.6729 46.4573 80.6792 46.2445C80.6872 45.9654 80.9215 45.9424 81.121 45.9102Z' fill='none' className={filledClassName} />
100
+ <path opacity={0.1} d='M76.8847 45.7035C76.67 45.6657 76.5079 45.5368 76.4767 45.2761C76.4571 45.1113 76.5337 45.0127 76.6994 45.021C76.9738 45.0348 77.1288 45.207 77.1626 45.4714C77.1831 45.6307 77.0682 45.7109 76.8847 45.7044V45.7035Z' fill='none' className={filledClassName} />
101
+ <path opacity={0.1} d='M79.6462 46.1016C79.8297 46.1246 80.0417 46.1541 80.0319 46.3862C80.0221 46.6303 79.8047 46.6874 79.6061 46.6772C79.4261 46.668 79.2311 46.6063 79.2489 46.3678C79.2667 46.131 79.4743 46.1255 79.6462 46.1016Z' fill='none' className={filledClassName} />
102
+ <path d='M78.0712 45.8516C78.2814 45.8654 78.4845 45.952 78.5032 46.197C78.5201 46.4125 78.3259 46.4466 78.1567 46.4337C77.9393 46.4162 77.7371 46.3406 77.7371 46.0726C77.7371 45.8746 77.9037 45.8543 78.0712 45.8516Z' fill='none' className={filledClassName} />
103
+ <path d='M76.1799 44.336C76.1808 44.475 76.1424 44.5939 75.9919 44.592C75.7425 44.5883 75.6285 44.4188 75.5982 44.1849C75.5812 44.0513 75.6258 43.9288 75.779 43.9307C76.0311 43.9334 76.1282 44.1167 76.1799 44.3369V44.336Z' fill='none' className={filledClassName} />
104
+ <path d='M75.4111 43.2761C75.4227 43.4244 75.3559 43.5064 75.2374 43.5054C75.0361 43.5045 74.9069 43.3866 74.8748 43.1803C74.8526 43.0412 74.906 42.9215 75.0575 42.9381C75.2508 42.9602 75.3648 43.0992 75.4111 43.2761Z' fill='none' className={filledClassName} />
105
+ <path d='M74.6144 42.5157C74.6063 42.6594 74.5084 42.7064 74.4024 42.6963C74.2678 42.6825 74.1324 42.6263 74.0986 42.4715C74.0701 42.3389 74.161 42.2753 74.2803 42.2744C74.4442 42.2735 74.5565 42.3592 74.6144 42.5157Z' fill='none' className={filledClassName} />
106
+ </svg>
107
+ )
108
+ break
109
+
110
+ default:
111
+ break
112
+ }
113
+ return icon
114
+ }
115
+
116
+ WorkspaceGitHubIcon.propTypes = {
117
+ /**
118
+ * color of text, icon and borders
119
+ */
120
+ color: PropTypes.oneOf(COLORS_ICON),
121
+ /**
122
+ * Size
123
+ */
124
+ size: PropTypes.oneOf(SIZES)
125
+ }
126
+
127
+ WorkspaceGitHubIcon.defaultProps = {
128
+ color: 'main-dark-blue',
129
+ size: 'medium'
130
+ }
131
+
132
+ export default WorkspaceGitHubIcon
package/src/components/icons/index.js CHANGED
@@ -41,6 +41,7 @@ import KeyIcon from './KeyIcon'
41
41
  import LayersIcon from './LayersIcon'
42
42
  import LensIcon from './LensIcon'
43
43
  import LiveIcon from './LiveIcon'
44
+ import LoadingAppIcon from './LoadingAppIcon'
44
45
  import LogOutIcon from './LogOutIcon'
45
46
  import MetricsIcon from './MetricsIcon'
46
47
  import PlayIcon from './PlayIcon'
@@ -57,6 +58,7 @@ import TerminalIcon from './TerminalIcon'
57
58
  import TwoUsersIcon from './TwoUsersIcon'
58
59
  import UpgradeIcon from './UpgradeIcon'
59
60
  import WorkspaceDynamicIcon from './WorkspaceDynamicIcon'
61
+ import WorkspaceGitHubIcon from './WorkspaceGitHubIcon'
60
62
  import WorkspaceFailIcon from './WorkspaceFailIcon'
61
63
  import WorkspaceReadyIcon from './WorkspaceReadyIcon'
62
64
  import WorkspaceStaticIcon from './WorkspaceStaticIcon'
@@ -105,6 +107,7 @@ export default {
105
107
  LayersIcon,
106
108
  LensIcon,
107
109
  LiveIcon,
110
+ LoadingAppIcon,
108
111
  LogOutIcon,
109
112
  MetricsIcon,
110
113
  PlayIcon,
@@ -122,6 +125,7 @@ export default {
122
125
  TwoUsersIcon,
123
126
  WorkspaceDynamicIcon,
124
127
  WorkspaceFailIcon,
128
+ WorkspaceGitHubIcon,
125
129
  WorkspaceReadyIcon,
126
130
  WorkspaceStaticIcon
127
131
  }
package/src/components/logos/BasicLogo.jsx ADDED
@@ -0,0 +1,60 @@
1
+ import React from 'react'
2
+ import PropTypes from 'prop-types'
3
+ import { MAIN_DARK_BLUE, WHITE } from '../constants'
4
+
5
+ function BasicLogo ({ backgroundColor, width, height }) {
6
+ let icon = (
7
+ <svg width={width} height={height} viewBox='0 0 402 173' fill='none' xmlns='http://www.w3.org/2000/svg'>
8
+ <path d='M178 61.2H366.8C385.964 61.2 401.5 76.7357 401.5 95.9C401.5 115.064 385.964 130.6 366.8 130.6H178L204 116.72L212.5 91.9342L198 71.1142L178 61.2Z' fill='#00283D' />
9
+ <path d='M61.2622 126.636H182.647V126.597C187.247 126.383 191.74 125.141 195.795 122.962C199.851 120.783 203.365 117.724 206.08 114.008C208.795 110.293 210.641 106.016 211.482 101.493C212.323 96.9709 212.138 92.3174 210.94 87.8758C209.742 83.4342 207.562 79.3176 204.56 75.8292C201.559 72.3408 197.812 69.5694 193.596 67.7193C189.38 65.8691 184.802 64.9873 180.2 65.1387C175.598 65.2901 171.088 66.4709 167.003 68.5942C164.482 62.7803 160.666 57.6177 155.846 53.4992C151.027 49.3807 145.33 46.4149 139.19 44.8275M35.223 44.8275C26.2848 47.1298 18.3666 52.3354 12.7143 59.6253C7.062 66.9151 3.99645 75.8754 4 85.0962C4.00356 94.317 7.07603 103.275 12.734 110.56C18.3919 117.846 26.3141 123.046 35.254 125.341' stroke='#00283D' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
10
+ <path d='M83.2411 70.3236L67.0461 76.0084L74.1732 91.1083' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
11
+ <path d='M67.411 76.276C74.7957 80.6139 83.4084 82.3923 91.9095 81.3347C100.411 80.2771 108.324 76.4427 114.418 70.4279C120.512 64.4131 124.445 56.5552 125.606 48.0763C126.767 39.5975 125.09 30.973 120.837 23.5445C116.584 16.1159 109.992 10.2997 102.088 7.00052C94.1829 3.70132 85.4085 3.10409 77.1289 5.30172C68.8494 7.49935 61.529 12.3686 56.3063 19.1522C51.0836 25.9358 48.2515 34.2533 48.2504 42.8111V100.702' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
12
+ <path opacity={0.2} d='M48.2504 161.904V168.667' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
13
+ <path opacity={0.4} d='M48.3125 140.623V151.306' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
14
+ <path opacity={0.7} d='M48.2504 111.703V129.564' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
15
+ <path d='M228.15 113V78H245.25C249.65 78 252.95 78.8333 255.15 80.5C257.383 82.1667 258.5 84.3667 258.5 87.1C258.5 88.9333 258.05 90.5333 257.15 91.9C256.25 93.2333 255.017 94.2667 253.45 95C251.883 95.7333 250.083 96.1 248.05 96.1L249 94.05C251.2 94.05 253.15 94.4167 254.85 95.15C256.55 95.85 257.867 96.9 258.8 98.3C259.767 99.7 260.25 101.417 260.25 103.45C260.25 106.45 259.067 108.8 256.7 110.5C254.333 112.167 250.85 113 246.25 113H228.15ZM236.2 106.9H245.65C247.75 106.9 249.333 106.567 250.4 105.9C251.5 105.2 252.05 104.1 252.05 102.6C252.05 101.133 251.5 100.05 250.4 99.35C249.333 98.6167 247.75 98.25 245.65 98.25H235.6V92.35H244.25C246.217 92.35 247.717 92.0167 248.75 91.35C249.817 90.65 250.35 89.6 250.35 88.2C250.35 86.8333 249.817 85.8167 248.75 85.15C247.717 84.45 246.217 84.1 244.25 84.1H236.2V106.9ZM282.332 113V107.75L281.832 106.6V97.2C281.832 95.5333 281.316 94.2333 280.282 93.3C279.282 92.3667 277.732 91.9 275.632 91.9C274.199 91.9 272.782 92.1333 271.382 92.6C270.016 93.0333 268.849 93.6333 267.882 94.4L265.082 88.95C266.549 87.9167 268.316 87.1167 270.382 86.55C272.449 85.9833 274.549 85.7 276.682 85.7C280.782 85.7 283.966 86.6667 286.232 88.6C288.499 90.5333 289.632 93.55 289.632 97.65V113H282.332ZM274.132 113.4C272.032 113.4 270.232 113.05 268.732 112.35C267.232 111.617 266.082 110.633 265.282 109.4C264.482 108.167 264.082 106.783 264.082 105.25C264.082 103.65 264.466 102.25 265.232 101.05C266.032 99.85 267.282 98.9167 268.982 98.25C270.682 97.55 272.899 97.2 275.632 97.2H282.782V101.75H276.482C274.649 101.75 273.382 102.05 272.682 102.65C272.016 103.25 271.682 104 271.682 104.9C271.682 105.9 272.066 106.7 272.832 107.3C273.632 107.867 274.716 108.15 276.082 108.15C277.382 108.15 278.549 107.85 279.582 107.25C280.616 106.617 281.366 105.7 281.832 104.5L283.032 108.1C282.466 109.833 281.432 111.15 279.932 112.05C278.432 112.95 276.499 113.4 274.132 113.4ZM305.742 113.4C303.442 113.4 301.225 113.133 299.092 112.6C296.992 112.033 295.325 111.333 294.092 110.5L296.692 104.9C297.925 105.667 299.375 106.3 301.042 106.8C302.742 107.267 304.408 107.5 306.042 107.5C307.842 107.5 309.108 107.283 309.842 106.85C310.608 106.417 310.992 105.817 310.992 105.05C310.992 104.417 310.692 103.95 310.092 103.65C309.525 103.317 308.758 103.067 307.792 102.9C306.825 102.733 305.758 102.567 304.592 102.4C303.458 102.233 302.308 102.017 301.142 101.75C299.975 101.45 298.908 101.017 297.942 100.45C296.975 99.8833 296.192 99.1167 295.592 98.15C295.025 97.1833 294.742 95.9333 294.742 94.4C294.742 92.7 295.225 91.2 296.192 89.9C297.192 88.6 298.625 87.5833 300.492 86.85C302.358 86.0833 304.592 85.7 307.192 85.7C309.025 85.7 310.892 85.9 312.792 86.3C314.692 86.7 316.275 87.2833 317.542 88.05L314.942 93.6C313.642 92.8333 312.325 92.3167 310.992 92.05C309.692 91.75 308.425 91.6 307.192 91.6C305.458 91.6 304.192 91.8333 303.392 92.3C302.592 92.7667 302.192 93.3667 302.192 94.1C302.192 94.7667 302.475 95.2667 303.042 95.6C303.642 95.9333 304.425 96.2 305.392 96.4C306.358 96.6 307.408 96.7833 308.542 96.95C309.708 97.0833 310.875 97.3 312.042 97.6C313.208 97.9 314.258 98.3333 315.192 98.9C316.158 99.4333 316.942 100.183 317.542 101.15C318.142 102.083 318.442 103.317 318.442 104.85C318.442 106.517 317.942 108 316.942 109.3C315.942 110.567 314.492 111.567 312.592 112.3C310.725 113.033 308.442 113.4 305.742 113.4ZM323.254 113V86.1H331.054V113H323.254ZM327.154 82.35C325.721 82.35 324.554 81.9333 323.654 81.1C322.754 80.2667 322.304 79.2333 322.304 78C322.304 76.7667 322.754 75.7333 323.654 74.9C324.554 74.0667 325.721 73.65 327.154 73.65C328.588 73.65 329.754 74.05 330.654 74.85C331.554 75.6167 332.004 76.6167 332.004 77.85C332.004 79.15 331.554 80.2333 330.654 81.1C329.788 81.9333 328.621 82.35 327.154 82.35ZM351.293 113.4C348.393 113.4 345.81 112.817 343.543 111.65C341.277 110.45 339.493 108.8 338.193 106.7C336.927 104.6 336.293 102.217 336.293 99.55C336.293 96.85 336.927 94.4667 338.193 92.4C339.493 90.3 341.277 88.6667 343.543 87.5C345.81 86.3 348.393 85.7 351.293 85.7C354.127 85.7 356.593 86.3 358.693 87.5C360.793 88.6667 362.343 90.35 363.343 92.55L357.293 95.8C356.593 94.5333 355.71 93.6 354.643 93C353.61 92.4 352.477 92.1 351.243 92.1C349.91 92.1 348.71 92.4 347.643 93C346.577 93.6 345.727 94.45 345.093 95.55C344.493 96.65 344.193 97.9833 344.193 99.55C344.193 101.117 344.493 102.45 345.093 103.55C345.727 104.65 346.577 105.5 347.643 106.1C348.71 106.7 349.91 107 351.243 107C352.477 107 353.61 106.717 354.643 106.15C355.71 105.55 356.593 104.6 357.293 103.3L363.343 106.6C362.343 108.767 360.793 110.45 358.693 111.65C356.593 112.817 354.127 113.4 351.293 113.4Z' fill='white' />
16
+ </svg>
17
+
18
+ )
19
+
20
+ if (backgroundColor === MAIN_DARK_BLUE) {
21
+ icon = (
22
+ <svg width={width} height={height} viewBox='0 0 402 173' fill='none' xmlns='http://www.w3.org/2000/svg'>
23
+ <path d='M178 61.2H366.8C385.964 61.2 401.5 76.7357 401.5 95.9C401.5 115.064 385.964 130.6 366.8 130.6H178L204 116.72L212.5 91.9342L198 71.1142L178 61.2Z' fill='white' />
24
+ <path d='M61.2622 126.636H182.647V126.597C187.247 126.383 191.74 125.141 195.795 122.962C199.851 120.783 203.365 117.724 206.08 114.008C208.795 110.293 210.641 106.016 211.482 101.493C212.323 96.9709 212.138 92.3174 210.94 87.8758C209.742 83.4342 207.562 79.3176 204.56 75.8292C201.559 72.3408 197.812 69.5694 193.596 67.7193C189.38 65.8691 184.802 64.9873 180.2 65.1387C175.598 65.2901 171.088 66.4709 167.003 68.5942C164.482 62.7803 160.666 57.6177 155.846 53.4992C151.027 49.3807 145.33 46.4149 139.19 44.8275M35.223 44.8275C26.2848 47.1298 18.3666 52.3354 12.7143 59.6253C7.062 66.9151 3.99645 75.8754 4 85.0962C4.00356 94.317 7.07603 103.275 12.734 110.56C18.3919 117.846 26.3141 123.046 35.254 125.341' stroke='white' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
25
+ <path d='M83.2411 70.3236L67.0461 76.0084L74.1732 91.1083' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
26
+ <path d='M67.411 76.276C74.7957 80.6139 83.4084 82.3923 91.9095 81.3347C100.411 80.2771 108.324 76.4427 114.418 70.4279C120.512 64.4131 124.445 56.5552 125.606 48.0763C126.767 39.5975 125.09 30.973 120.837 23.5445C116.584 16.1159 109.992 10.2997 102.088 7.00052C94.1829 3.70132 85.4085 3.10409 77.1289 5.30172C68.8494 7.49935 61.529 12.3686 56.3063 19.1522C51.0836 25.9358 48.2515 34.2533 48.2504 42.8111V100.702' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
27
+ <path opacity={0.2} d='M48.2504 161.904V168.667' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
28
+ <path opacity={0.4} d='M48.3125 140.623V151.306' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
29
+ <path opacity={0.7} d='M48.2504 111.703V129.564' stroke='#21FA90' strokeWidth={8} strokeLinecap='round' strokeLinejoin='round' />
30
+ <path d='M228.15 113V78H245.25C249.65 78 252.95 78.8333 255.15 80.5C257.383 82.1667 258.5 84.3667 258.5 87.1C258.5 88.9333 258.05 90.5333 257.15 91.9C256.25 93.2333 255.017 94.2667 253.45 95C251.883 95.7333 250.083 96.1 248.05 96.1L249 94.05C251.2 94.05 253.15 94.4167 254.85 95.15C256.55 95.85 257.867 96.9 258.8 98.3C259.767 99.7 260.25 101.417 260.25 103.45C260.25 106.45 259.067 108.8 256.7 110.5C254.333 112.167 250.85 113 246.25 113H228.15ZM236.2 106.9H245.65C247.75 106.9 249.333 106.567 250.4 105.9C251.5 105.2 252.05 104.1 252.05 102.6C252.05 101.133 251.5 100.05 250.4 99.35C249.333 98.6167 247.75 98.25 245.65 98.25H235.6V92.35H244.25C246.217 92.35 247.717 92.0167 248.75 91.35C249.817 90.65 250.35 89.6 250.35 88.2C250.35 86.8333 249.817 85.8167 248.75 85.15C247.717 84.45 246.217 84.1 244.25 84.1H236.2V106.9ZM282.332 113V107.75L281.832 106.6V97.2C281.832 95.5333 281.316 94.2333 280.282 93.3C279.282 92.3667 277.732 91.9 275.632 91.9C274.199 91.9 272.782 92.1333 271.382 92.6C270.016 93.0333 268.849 93.6333 267.882 94.4L265.082 88.95C266.549 87.9167 268.316 87.1167 270.382 86.55C272.449 85.9833 274.549 85.7 276.682 85.7C280.782 85.7 283.966 86.6667 286.232 88.6C288.499 90.5333 289.632 93.55 289.632 97.65V113H282.332ZM274.132 113.4C272.032 113.4 270.232 113.05 268.732 112.35C267.232 111.617 266.082 110.633 265.282 109.4C264.482 108.167 264.082 106.783 264.082 105.25C264.082 103.65 264.466 102.25 265.232 101.05C266.032 99.85 267.282 98.9167 268.982 98.25C270.682 97.55 272.899 97.2 275.632 97.2H282.782V101.75H276.482C274.649 101.75 273.382 102.05 272.682 102.65C272.016 103.25 271.682 104 271.682 104.9C271.682 105.9 272.066 106.7 272.832 107.3C273.632 107.867 274.716 108.15 276.082 108.15C277.382 108.15 278.549 107.85 279.582 107.25C280.616 106.617 281.366 105.7 281.832 104.5L283.032 108.1C282.466 109.833 281.432 111.15 279.932 112.05C278.432 112.95 276.499 113.4 274.132 113.4ZM305.742 113.4C303.442 113.4 301.225 113.133 299.092 112.6C296.992 112.033 295.325 111.333 294.092 110.5L296.692 104.9C297.925 105.667 299.375 106.3 301.042 106.8C302.742 107.267 304.408 107.5 306.042 107.5C307.842 107.5 309.108 107.283 309.842 106.85C310.608 106.417 310.992 105.817 310.992 105.05C310.992 104.417 310.692 103.95 310.092 103.65C309.525 103.317 308.758 103.067 307.792 102.9C306.825 102.733 305.758 102.567 304.592 102.4C303.458 102.233 302.308 102.017 301.142 101.75C299.975 101.45 298.908 101.017 297.942 100.45C296.975 99.8833 296.192 99.1167 295.592 98.15C295.025 97.1833 294.742 95.9333 294.742 94.4C294.742 92.7 295.225 91.2 296.192 89.9C297.192 88.6 298.625 87.5833 300.492 86.85C302.358 86.0833 304.592 85.7 307.192 85.7C309.025 85.7 310.892 85.9 312.792 86.3C314.692 86.7 316.275 87.2833 317.542 88.05L314.942 93.6C313.642 92.8333 312.325 92.3167 310.992 92.05C309.692 91.75 308.425 91.6 307.192 91.6C305.458 91.6 304.192 91.8333 303.392 92.3C302.592 92.7667 302.192 93.3667 302.192 94.1C302.192 94.7667 302.475 95.2667 303.042 95.6C303.642 95.9333 304.425 96.2 305.392 96.4C306.358 96.6 307.408 96.7833 308.542 96.95C309.708 97.0833 310.875 97.3 312.042 97.6C313.208 97.9 314.258 98.3333 315.192 98.9C316.158 99.4333 316.942 100.183 317.542 101.15C318.142 102.083 318.442 103.317 318.442 104.85C318.442 106.517 317.942 108 316.942 109.3C315.942 110.567 314.492 111.567 312.592 112.3C310.725 113.033 308.442 113.4 305.742 113.4ZM323.254 113V86.1H331.054V113H323.254ZM327.154 82.35C325.721 82.35 324.554 81.9333 323.654 81.1C322.754 80.2667 322.304 79.2333 322.304 78C322.304 76.7667 322.754 75.7333 323.654 74.9C324.554 74.0667 325.721 73.65 327.154 73.65C328.588 73.65 329.754 74.05 330.654 74.85C331.554 75.6167 332.004 76.6167 332.004 77.85C332.004 79.15 331.554 80.2333 330.654 81.1C329.788 81.9333 328.621 82.35 327.154 82.35ZM351.293 113.4C348.393 113.4 345.81 112.817 343.543 111.65C341.277 110.45 339.493 108.8 338.193 106.7C336.927 104.6 336.293 102.217 336.293 99.55C336.293 96.85 336.927 94.4667 338.193 92.4C339.493 90.3 341.277 88.6667 343.543 87.5C345.81 86.3 348.393 85.7 351.293 85.7C354.127 85.7 356.593 86.3 358.693 87.5C360.793 88.6667 362.343 90.35 363.343 92.55L357.293 95.8C356.593 94.5333 355.71 93.6 354.643 93C353.61 92.4 352.477 92.1 351.243 92.1C349.91 92.1 348.71 92.4 347.643 93C346.577 93.6 345.727 94.45 345.093 95.55C344.493 96.65 344.193 97.9833 344.193 99.55C344.193 101.117 344.493 102.45 345.093 103.55C345.727 104.65 346.577 105.5 347.643 106.1C348.71 106.7 349.91 107 351.243 107C352.477 107 353.61 106.717 354.643 106.15C355.71 105.55 356.593 104.6 357.293 103.3L363.343 106.6C362.343 108.767 360.793 110.45 358.693 111.65C356.593 112.817 354.127 113.4 351.293 113.4Z' fill='#00283D' />
31
+ </svg>
32
+
33
+ )
34
+ }
35
+
36
+ return icon
37
+ }
38
+
39
+ BasicLogo.propTypes = {
40
+ /**
41
+ * background color of the button
42
+ */
43
+ backgroundColor: PropTypes.oneOf([MAIN_DARK_BLUE, WHITE]),
44
+ /**
45
+ * width
46
+ */
47
+ width: PropTypes.number,
48
+ /**
49
+ * height
50
+ */
51
+ height: PropTypes.number
52
+ }
53
+
54
+ BasicLogo.defaultProps = {
55
+ backgroundColor: WHITE,
56
+ width: 402,
57
+ height: 173
58
+ }
59
+
60
+ export default BasicLogo