diff --git a/app/dashboard/src/components/ListCheckBox/index.tsx b/app/dashboard/src/components/ListCheckBox/index.tsx
@@ -3,23 +3,27 @@
import {
Box,
} from '@chakra-ui/react';
-import { forwardRef, ReactNode, Ref } from 'react';
+import { ReactNode, Ref } from 'react';
type ListCheckboxProps = {
isChecked: boolean;
onChange: () => void;
renderContent: () => ReactNode;
value: string;
+ ref?: Ref<HTMLDivElement>;
}
-export const ListCheckBox = forwardRef(
- (
- { isChecked, onChange, renderContent, ...props }: ListCheckboxProps,
- ref: Ref<HTMLDivElement>
- ) => (
+
+export const ListCheckBox = (
+ { isChecked, onChange, renderContent, ref, ...props }: ListCheckboxProps,
+
+) => {
+ const darkStyle = { bg: isChecked ? 'gray.800' : 'transparent' };
+
+ return (
<Box
ref={ref}
- border={isChecked ? '5px' : '2px'}
+ border={isChecked ? '5px' : '3px'}
w="full"
borderColor={isChecked ? 'primary.500' : 'gray.600'}
boxShadow={
@@ -27,7 +31,8 @@ export const ListCheckBox = forwardRef(
? '0 0 0 3px rgba(102, 126, 234, 0.6)'
: '0 0 0 1px rgba(102, 126, 234, 0.6)'
}
- bg={isChecked ? 'gray.100' : 'white'}
+ bg={isChecked ? 'gray.100' : 'transparent'}
+ _dark={darkStyle}
py="4px"
px="8px"
borderRadius="md"
@@ -43,5 +48,5 @@ export const ListCheckBox = forwardRef(
>
{renderContent()}
</Box>
- )
-);
+ );
+}
diff --git a/app/dashboard/src/components/ServiceDialog/InboundsField.tsx b/app/dashboard/src/components/ServiceDialog/InboundsField.tsx
@@ -30,7 +30,7 @@ export const InboundsField = ({ form, t, inbounds }: InboundsFieldProps) => {
list={inbounds}
renderCheckboxContent={(inbound: InboundType) => (
<>
- <Text fontSize="sm" color="gray.700" fontWeight="medium">
+ <Text fontSize="sm" color="gray.700" _dark={{ color: 'gray.100' }} fontWeight="medium">
{inbound.tag} {inbound.protocol}
</Text>
<Spacer />
diff --git a/app/dashboard/src/components/UserDialog/ServicesField.tsx b/app/dashboard/src/components/UserDialog/ServicesField.tsx
@@ -1,4 +1,4 @@
-import { FormControl, FormLabel, FormErrorMessage, Center, Spinner, Text, Spacer, Flex, chakra } from '@chakra-ui/react';
+import { FormControl, FormLabel, FormErrorMessage, Center, Spinner, Text, Flex, chakra } from '@chakra-ui/react';
import { UsersIcon, ServerStackIcon } from '@heroicons/react/24/outline';
import { IconBaseStyle } from 'constants/IconBaseStyle';
import { TFunction } from 'i18next';
@@ -11,9 +11,9 @@ const UsersServiceIcon = chakra(UsersIcon, IconBaseStyle);
const InboundsServiceIcon = chakra(ServerStackIcon, IconBaseStyle);
interface ServicesFieldProps {
- form: any;
- services: Service[];
- t: TFunction<'translation', undefined, 'translation'>;
+ form: any;
+ services: Service[];
+ t: TFunction<'translation', undefined, 'translation'>;
}
export const ServicesField = ({ form, t, services }: ServicesFieldProps) => {
@@ -34,17 +34,16 @@ export const ServicesField = ({ form, t, services }: ServicesFieldProps) => {
<ServicesSelectList
list={services}
renderCheckboxContent={(service) => (
- <>
- <Text fontSize="sm" color="gray.700" fontWeight="medium">
+ <Flex alignItems="center" justifyContent="space-between" flexDir="row" w="full">
+ <Text fontSize="sm" color="gray.700" _dark={{ color: 'gray.100' }} fontWeight="medium">
{service.name}
</Text>
- <Spacer />
<Flex flexDirection="row" alignItems="center">
<ServicePropertyStatus value={service.users.length} StatusIcon={UsersServiceIcon} />
- <Text color="primary.600" mx="8px">/</Text>
+ <Text color="primary.600" _dark={{ color: 'gray.100' }} mx="8px" fontSize="sm">/</Text>
<ServicePropertyStatus value={service.inbounds.length} StatusIcon={InboundsServiceIcon} />
</Flex>
- </>
+ </Flex>
)}
/>
);
@@ -52,8 +51,8 @@ export const ServicesField = ({ form, t, services }: ServicesFieldProps) => {
/>
<FormErrorMessage>
{t(
- form.formState.errors.services
- ?.message as string
+ form.formState.errors.services
+ ?.message as string
)}
</FormErrorMessage>
</FormControl>
diff --git a/config.py b/config.py
@@ -50,7 +50,11 @@ CUSTOM_TEMPLATES_DIRECTORY = config("CUSTOM_TEMPLATES_DIRECTORY", default=None)
CLASH_SUBSCRIPTION_TEMPLATE = config("CLASH_SUBSCRIPTION_TEMPLATE", default="clash/default.yml")
SUBSCRIPTION_PAGE_TEMPLATE = config("SUBSCRIPTION_PAGE_TEMPLATE", default="subscription/index.html")
HOME_PAGE_TEMPLATE = config("HOME_PAGE_TEMPLATE", default="home/index.html")
-SINGBOX_SUBSCRIPTION_TEMPLATE = config("SINGBOX_SUBSCRIPTION_TEMPLATE", default="singbox/default.json")
+
+SINGBOX_SUBSCRIPTION_TEMPLATE = config(
+ "SINGBOX_SUBSCRIPTION_TEMPLATE",
+ default="singbox/default.json"
+)
# USERNAME: PASSWORD