diff --git a/.changeset/tender-icons-flow.md b/.changeset/tender-icons-flow.md new file mode 100644 index 0000000000..b90dcdb107 --- /dev/null +++ b/.changeset/tender-icons-flow.md @@ -0,0 +1,5 @@ +--- +'web-neutron': major +--- + +update tokenomics component and color scheme diff --git a/apps/web-neutron/src/chain.json b/apps/web-neutron/src/chain.json index d930acf451..a2d89ac4ec 100644 --- a/apps/web-neutron/src/chain.json +++ b/apps/web-neutron/src/chain.json @@ -16,47 +16,47 @@ ], "dark": { "primary": { - "main": "rgba(253,59,76,0.7)", + "main": "#FF835B", "contrastText": "#FFFFFF" }, "background": { - "default": "#0A0A0A", + "default": "#000000", "paper": "#131316" }, - "divider": "#3D3D43", + "divider": "#282828", "text": { "primary": "#E6E6E6", - "secondary": "#AAAAAB" + "secondary": "#C4C4C4" }, "custom": { "general": { - "background": "#0A0A0A", + "background": "#000000", "surfaceOne": "#131316", - "surfaceTwo": "#19191D", + "surfaceTwo": "#212123", "icon": "#999999" }, "fonts": { "fontOne": "#E6E6E6", - "fontTwo": "#AAAAAB", + "fontTwo": "#C4C4C4", "fontThree": "#818181", "fontFour": "#999999", "fontFive": "#FFFFFF", - "highlight": "#1D86FF" + "highlight": "#4092CD" }, "primaryData": { - "one": "#af2929", - "two": "#b44516", - "three": "#b14237", - "four": "#b16919" + "one": "#F87255", + "two": "#FA9147", + "three": "#43BE7C", + "four": "#43A1BE" }, "results": { - "pass": "#198a65", - "fail": "#b12a34" + "pass": "#1EC490", + "fail": "#FD3B4C" }, "tokenomics": { - "one": "#50B6D7", - "two": "#F4CD69", - "three": "#45A884" + "one": "#43A1BE", + "two": "#E3BB55", + "three": "#20D292" }, "condition": { "zero": "#E6E6E6", @@ -65,26 +65,26 @@ "three": "#FF608A" }, "charts": { - "zero": "#6D6D6C", - "one": "#45A884", - "two": "#50B6D7", - "three": "#F4CD69", - "four": "#F2A46B", - "five": "#C975F0" + "zero": "#E6E6E6", + "one": "#43BE7C", + "two": "#FA9147", + "three": "#F44747", + "four": "#43A1BE", + "five": "#C25396" }, "tags": { "zero": "#E8E8E8", "one": "#2460FA", - "two": "#2BA896", - "three": "#E79725", - "four": "#F17052", + "two": "#2BA897", + "three": "#E79726", + "four": "#F17053", "five": "#DA4B4B", "six": "#9438DC", "seven": "#1A869D", - "eight": "#2C9949", - "nine": "#B49F36", - "ten": "#E9A851", - "eleven": "#E94686", + "eight": "#2C9950", + "nine": "#B49F37", + "ten": "#E9A852", + "eleven": "#E94687", "twelve": "#C15EC4", "thirteen": "#C388D9", "fourteen": "#46AEE9", @@ -111,7 +111,7 @@ }, "light": { "primary": { - "main": "#488D98", + "main": "#FF835B", "contrastText": "#FFFFFF" }, "background": { @@ -136,22 +136,22 @@ "fontThree": "#777777", "fontFour": "#999999", "fontFive": "#FFFFFF", - "highlight": "#0075FF" + "highlight": "#4092CD" }, "primaryData": { - "one": "#488D98", - "two": "#45A884", - "three": "#48A2B0", - "four": "#47B0AA" + "one": "#F87255", + "two": "#FA9147", + "three": "#20D494", + "four": "#2FB6E0" }, "results": { "pass": "#1EC490", "fail": "#FD3B4C" }, "tokenomics": { - "one": "#50B6D7", - "two": "#F4CD69", - "three": "#45A884" + "one": "#2FB6E0", + "two": "#FFC93D", + "three": "#20D494" }, "condition": { "zero": "#E6E6E6", @@ -161,11 +161,11 @@ }, "charts": { "zero": "#E6E6E6", - "one": "#45A884", - "two": "#50B6D7", - "three": "#F4CD69", - "four": "#F2A46B", - "five": "#C975F0" + "one": "#20D494", + "two": "#FF8732", + "three": "#F44747", + "four": "#2FB6E0", + "five": "#E95EB1" }, "tags": { "zero": "#E8E8E8", diff --git a/apps/web-neutron/src/screens/home/components/tokenomics/index.tsx b/apps/web-neutron/src/screens/home/components/tokenomics/index.tsx new file mode 100644 index 0000000000..e14bb98c68 --- /dev/null +++ b/apps/web-neutron/src/screens/home/components/tokenomics/index.tsx @@ -0,0 +1,23 @@ +import Box from '@/components/box'; +import useStyles from '@/screens/home/components/tokenomics/styles'; +import Typography from '@mui/material/Typography'; +import useAppTranslation from '@/hooks/useAppTranslation'; +import { FC } from 'react'; + +const Tokenomics: FC = ({ className }) => { + const { t } = useAppTranslation('home'); + const { classes, cx } = useStyles(); + + return ( + + + {t('tokenomics')} + +
+ {t('notAvailable')} +
+ + ); +}; + +export default Tokenomics; diff --git a/apps/web-neutron/src/screens/home/components/tokenomics/styles.ts b/apps/web-neutron/src/screens/home/components/tokenomics/styles.ts new file mode 100644 index 0000000000..48ca9b39d1 --- /dev/null +++ b/apps/web-neutron/src/screens/home/components/tokenomics/styles.ts @@ -0,0 +1,25 @@ +import { makeStyles } from 'tss-react/mui'; + +const useStyles = makeStyles()(theme => ({ + root: { + height: '100%', + display: 'flex', + justifyContent: 'center', + flexDirection: 'column', + }, + label: { + marginBottom: theme.spacing(2), + }, + content: { + flex: 1, + display: 'flex', + alignItems: 'center', + justifyContent: 'space-around', + color: theme.palette.custom.fonts.fontThree, + backgroundColor: theme.palette.custom.general.surfaceTwo, + borderRadius: '8px', + marginBottom: theme.spacing(3), + }, +})); + +export default useStyles; diff --git a/packages/ui/public/locales/en/home.json b/packages/ui/public/locales/en/home.json index 3b905700d0..f1a86143d2 100644 --- a/packages/ui/public/locales/en/home.json +++ b/packages/ui/public/locales/en/home.json @@ -31,5 +31,6 @@ "powerChange": "<0>{{change}} at block ", "validators": "Validators", "priceHistory": "Price (~48h)", - "dataFrom": "Data from" + "dataFrom": "Data from", + "notAvailable": "Not available" } diff --git a/packages/ui/public/locales/it/home.json b/packages/ui/public/locales/it/home.json index 4e2a899e45..75158e8665 100644 --- a/packages/ui/public/locales/it/home.json +++ b/packages/ui/public/locales/it/home.json @@ -31,5 +31,6 @@ "powerChange": "<0>{{change}} a blocco ", "validators": "Validatori", "priceHistory": "Prezzo (~48 ore)", - "dataFrom": "Dati da" + "dataFrom": "Dati da", + "notAvailable": "Non disponibile" } diff --git a/packages/ui/public/locales/pl/home.json b/packages/ui/public/locales/pl/home.json index 2ea1fd3c4a..1d9192ba18 100644 --- a/packages/ui/public/locales/pl/home.json +++ b/packages/ui/public/locales/pl/home.json @@ -31,5 +31,6 @@ "powerChange": "<0>{{change}} na wysokości ", "validators": "Walidatorzy", "priceHistory": "Cena (~48h)", - "dataFrom": "Dane z" + "dataFrom": "Dane z", + "notAvailable": "Niedostępne" } diff --git a/packages/ui/public/locales/zhs/home.json b/packages/ui/public/locales/zhs/home.json index 90de107cfe..75bd977fdd 100644 --- a/packages/ui/public/locales/zhs/home.json +++ b/packages/ui/public/locales/zhs/home.json @@ -31,5 +31,6 @@ "powerChange": "<0>{{change}} 在区块 ", "validators": "验证人", "priceHistory": "价格（~48 小时）", - "dataFrom": "数据来自" + "dataFrom": "数据来自", + "notAvailable": "不可用" } diff --git a/packages/ui/public/locales/zht/home.json b/packages/ui/public/locales/zht/home.json index bca42af4fb..69a965a0d2 100644 --- a/packages/ui/public/locales/zht/home.json +++ b/packages/ui/public/locales/zht/home.json @@ -31,5 +31,6 @@ "powerChange": "<0>{{change}} 在區塊 ", "validators": "驗證者", "priceHistory": "價格（~48 小時）", - "dataFrom": "數據來自" + "dataFrom": "數據來自", + "notAvailable": "不可用" }