Files
tom goriunovandGitHub f0e713b877 Add support for customizing the UI color theme (#2923)
* UI customizations: new features

Fixes #2905

* colors for graphs

* introduce env variable

* colors for topbar, stats, selected state and tabs

* fix build

* fix validator

* refactor link.primary.hover color token

* refactor selected colors

* update styles for switch and fix some color tokens

* change color for selectable controls

* icon color tokens refactoring

* UI customizations: new features

Fixes #2905

* test for common components

* tweaks

* migrate from color-mode-hex cookie to color-theme cookie

* clean up

* update screenshots

* more screenshot updates

* update default color of chart line

* update envs for mega eth
2025-08-19 11:58:05 +02:00

35 lines
909 B
TypeScript

import { Icon } from '@chakra-ui/react';
import React from 'react';
import ArrowIcon from 'icons/arrows/east.svg';
import type { IconButtonProps } from '../../chakra/icon-button';
import { IconButton } from '../../chakra/icon-button';
import { Link } from '../../chakra/link';
import { Tooltip } from '../../chakra/tooltip';
export interface BackToButtonProps extends IconButtonProps {
href?: string;
hint?: string;
}
export const BackToButton = ({ href, hint, boxSize = 6, ...rest }: BackToButtonProps) => {
const button = (
<IconButton { ...rest } boxSize={ boxSize } variant="icon_secondary">
<Icon
transform="rotate(180deg)"
boxSize={ boxSize }
>
<ArrowIcon/>
</Icon>
</IconButton>
);
return (
<Tooltip content={ hint } disabled={ !hint }>
{ href ? <Link href={ href } asChild>{ button }</Link> : button }
</Tooltip>
);
};