kopia lustrzana https://github.com/bugout-dev/moonstream
dashboard edit
Anton Mushnin
rodzic
86102c90c7
commit
9a8961e3e3
|
|
@ -160,7 +160,8 @@ const Analytics = () => {
|
|||
})
|
||||
}
|
||||
size="md"
|
||||
colorScheme="blue"
|
||||
color="orange.1000"
|
||||
borderColor="1000"
|
||||
variant="outline"
|
||||
icon={<BsGear />}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -53,8 +53,13 @@ const AutoCompleter = ({
|
|||
return (
|
||||
<Box pos="relative">
|
||||
<Box {...getRootProps({}, { suppressRefError: true })}>
|
||||
<InputGroup>
|
||||
<InputGroup
|
||||
border="1px solid white"
|
||||
bg="black.300"
|
||||
borderRadius="7px"
|
||||
>
|
||||
<InputLeftAddon
|
||||
borderStyle="none"
|
||||
isTruncated
|
||||
maxW="60px"
|
||||
fontSize={ui.isMobileView ? "xs" : "sm"}
|
||||
|
|
@ -75,6 +80,9 @@ const AutoCompleter = ({
|
|||
</InputLeftAddon>
|
||||
|
||||
<Input
|
||||
variant="bw"
|
||||
borderStyle="none none none"
|
||||
borderLeft="1px solid white"
|
||||
placeholder={placeholder}
|
||||
isTruncated
|
||||
fontSize="sm"
|
||||
|
|
@ -82,9 +90,10 @@ const AutoCompleter = ({
|
|||
// defaultValue: getDefaultValue(selectedItem),
|
||||
})}
|
||||
></Input>
|
||||
<InputRightAddon>
|
||||
<InputRightAddon bg="black.300">
|
||||
{" "}
|
||||
<button
|
||||
style={{ backgroundColor: "black.300" }}
|
||||
{...getToggleButtonProps()}
|
||||
aria-label={"toggle menu"}
|
||||
>
|
||||
|
|
@ -99,7 +108,7 @@ const AutoCompleter = ({
|
|||
direction="column"
|
||||
className="menuListTim"
|
||||
{...getMenuProps()}
|
||||
bgColor="gray.300"
|
||||
bgColor="black.300"
|
||||
borderRadius="md"
|
||||
boxShadow="lg"
|
||||
pos="absolute"
|
||||
|
|
@ -123,6 +132,7 @@ const AutoCompleter = ({
|
|||
px={4}
|
||||
py={1}
|
||||
alignItems="center"
|
||||
border="1px solid white"
|
||||
key={`autocomplete-item-${index}`}
|
||||
{...getItemProps({
|
||||
index,
|
||||
|
|
@ -130,13 +140,8 @@ const AutoCompleter = ({
|
|||
})}
|
||||
direction="row"
|
||||
w="100%"
|
||||
bgColor={
|
||||
index === highlightedIndex
|
||||
? "orange.900"
|
||||
: "inherit"
|
||||
}
|
||||
color={
|
||||
index === highlightedIndex ? "gray.100" : "inherit"
|
||||
fontWeight={
|
||||
index === highlightedIndex ? "600" : "inherit"
|
||||
}
|
||||
>
|
||||
{dropdownItem(item)}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,7 @@ const CheckboxGroupped = ({
|
|||
px={2}
|
||||
key={`list-item-checkbox-${idx}`}
|
||||
direction="row"
|
||||
bgColor={idx % 2 == 0 ? "gray.50" : "gray.100"}
|
||||
bgColor={idx % 2 == 0 ? "black.400" : "black.300"}
|
||||
>
|
||||
<Checkbox
|
||||
isChecked={isItemChecked(listItem)}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ import {
|
|||
FormLabel,
|
||||
Stack,
|
||||
Button,
|
||||
Badge,
|
||||
Spinner,
|
||||
Accordion,
|
||||
AccordionItem,
|
||||
|
|
@ -13,6 +12,7 @@ import {
|
|||
AccordionIcon,
|
||||
Box,
|
||||
IconButton,
|
||||
Text,
|
||||
} from "@chakra-ui/react";
|
||||
import { useSubscriptions } from "../core/hooks";
|
||||
import color from "color";
|
||||
|
|
@ -78,7 +78,7 @@ const NewDashboardChart = () => {
|
|||
});
|
||||
}
|
||||
return (
|
||||
<AccordionItem key={`new-chart-component-${idx}`}>
|
||||
<AccordionItem pt="5px" key={`new-chart-component-${idx}`}>
|
||||
{subscribedItem?.subscription_id &&
|
||||
subscriptionItemFromCache && (
|
||||
<>
|
||||
|
|
@ -246,31 +246,24 @@ const NewDashboardChart = () => {
|
|||
dropdownItem={(item) => {
|
||||
const badgeColor = color(`${item.color}`);
|
||||
return (
|
||||
<>
|
||||
<Stack cursor="pointer" direction="row">
|
||||
<chakra.span whiteSpace="nowrap">
|
||||
{item.label}
|
||||
</chakra.span>
|
||||
<Badge
|
||||
size="sm"
|
||||
placeSelf="self-end"
|
||||
colorScheme={item.abi ? "green" : "gray"}
|
||||
<Text
|
||||
fontSize="md"
|
||||
color={item.abi ? "white" : "gray"}
|
||||
>
|
||||
ABI
|
||||
</Badge>
|
||||
<Badge
|
||||
</Text>
|
||||
<Text
|
||||
isTruncated
|
||||
size="sm"
|
||||
placeSelf="self-end"
|
||||
bgColor={item.color}
|
||||
color={
|
||||
badgeColor.isDark()
|
||||
? badgeColor.lighten(100).hex()
|
||||
: badgeColor.darken(0.6).hex()
|
||||
}
|
||||
fontSize="md"
|
||||
placeSelf="self-center"
|
||||
>
|
||||
{item.address}
|
||||
</Badge>
|
||||
</>
|
||||
</Text>
|
||||
</Stack>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
|
|
@ -299,7 +292,8 @@ const NewDashboardChart = () => {
|
|||
)}
|
||||
|
||||
<Button
|
||||
colorScheme="green"
|
||||
variant="plainOrange"
|
||||
fontSize="md"
|
||||
size="md"
|
||||
onClick={() =>
|
||||
ui.dispatchDashboardUpdate({
|
||||
|
|
|
|||
|
|
@ -270,7 +270,7 @@ const OverlayProvider = ({ children }) => {
|
|||
<ModalOverlay backdropFilter="auto" backdropBrightness="60%" />
|
||||
|
||||
<ModalContent
|
||||
bg="#1A1D22"
|
||||
bg="black.300"
|
||||
borderRadius="15px"
|
||||
border="1px white solid"
|
||||
p="30px"
|
||||
|
|
@ -357,8 +357,8 @@ const OverlayProvider = ({ children }) => {
|
|||
}
|
||||
}}
|
||||
>
|
||||
<DrawerOverlay />
|
||||
<DrawerContent overflowY="scroll" textColor="black">
|
||||
<DrawerOverlay backdropFilter="auto" backdropBrightness="60%" />
|
||||
<DrawerContent overflowY="scroll" textColor="white" bg="black.300">
|
||||
<DrawerCloseButton />
|
||||
<DrawerHeader borderBottomWidth="1px">
|
||||
{drawer.type === DRAWER_TYPES.NEW_DASHBOARD && "New dashboard"}
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue