add beta notice

src/App.tsx

@@ -2,7 +2,7 @@ import { createTheme, CssBaseline, GlobalStyles, styled, ThemeProvider, useMedia
 import { grey } from "@mui/material/colors";
 import { ThemeOptions } from "@mui/material/styles/createTheme";
 import i18next from "i18next";
-import { enqueueSnackbar, MaterialDesignContent, SnackbarProvider } from "notistack";
+import { enqueueSnackbar, MaterialDesignContent, SnackbarProvider, useSnackbar } from "notistack";
 import { Suspense, useEffect, useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { Outlet } from "react-router-dom";
@@ -21,7 +21,7 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
     ...themeConfig,
     shape: {
       ...themeConfig.shape,
-      borderRadius: 12,
+      borderRadius: 4,
     },
     components: {
       MuiCssBaseline: {
@@ -31,6 +31,18 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
           },
         },
       },
+      MuiBackdrop: {
+        styleOverrides: {
+          root: {
+            backgroundColor: "rgba(255, 255, 255, 0.15)",
+            backdropFilter: "blur(8px)",
+            "&.MuiBackdrop-invisible": {
+              backgroundColor: "transparent",
+              backdropFilter: "none",
+            },
+          },
+        },
+      },
       MuiTooltip: {
         defaultProps: {
           enterDelay: 500,
@@ -63,7 +75,7 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
       MuiListItemButton: {
         styleOverrides: {
           root: {
-            borderRadius: 12,
+            borderRadius: 4,
           },
         },
       },
@@ -82,7 +94,7 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
       MuiMenu: {
         styleOverrides: {
           paper: {
-            borderRadius: "8px",
+            borderRadius: "4px",
           },
           list: {
             padding: "4px 0",
@@ -106,7 +118,7 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
       MuiMenuItem: {
         styleOverrides: {
           root: {
-            borderRadius: "8px",
+            borderRadius: "4px",
             margin: "0px 4px",
             paddingLeft: "8px",
             paddingRight: "8px",
@@ -127,7 +139,7 @@ export const applyThemeWithOverrides = (themeConfig: ThemeOptions): ThemeOptions
             "&:hover:not(.Mui-disabled, .Mui-error):before": {
               borderBottom: "none",
             },
-            borderRadius: 12,
+            borderRadius: 4,
             // '&:hover:not(.Mui-disabled, .Mui-error):before': {
             //   borderBottom: '2px solid var(--TextField-brandBorderHoverColor)',
             // },
@@ -271,7 +283,7 @@ const getPreferredTheme = (
 
 const StyledMaterialDesignContent = styled(MaterialDesignContent)(({ theme }) => ({
   "&.notistack-MuiContent": {
-    borderRadius: 12,
+    borderRadius: 4,
   },
   "&.notistack-MuiContent-success": {
     backgroundColor: theme.palette.success.main,
@@ -288,6 +300,15 @@ const AppContent = () => {
   const title = useAppSelector((state) => state.siteConfig.basic.config.title);
   const theme = useTheme();
   const isMobile = useMediaQuery(theme.breakpoints.down("sm"));
+  const { enqueueSnackbar } = useSnackbar();
+
+  useEffect(() => {
+    // 显示测试网站提示
+    enqueueSnackbar("请注意，本网站是测试网站", {
+      variant: "warning",
+      autoHideDuration: 5000,
+    });
+  }, [enqueueSnackbar]);
   const scrollBar = {
     "&::-webkit-scrollbar-button": {
       width: 0,

src/component/Admin/Settings/Appearance/CustomHTML.tsx

@@ -64,6 +64,7 @@ const HeadlessFooterPreview = ({ footer, bottom }: { footer?: string; bottom?: s
                   maxHeight: "40px",
                   mb: 2,
                 }}
+                style={{ display: "flex", justifyContent: "center", alignItems: "center" }}
               />
               <div>
                 <Box

src/component/Admin/Settings/Appearance/ThemeOptionEditDialog.tsx

@@ -163,7 +163,7 @@ const ThemeOptionEditDialog = ({ open, onClose, id, config, onSave }: ThemeOptio
                         label={t("settings.previewTitle")}
                         icon={<Setting fontSize="small" color="action" />}
                       />
-                      <TextField label={t("settings.previewTextField")} variant="outlined" size="small" />
+                      <TextField label={t("settings.previewTextField")} variant="filled" size="small" />
                       <Box>
                         <Badge badgeContent={10} color="secondary">
                           <Button variant="contained" color="primary">
@@ -195,7 +195,7 @@ const ThemeOptionEditDialog = ({ open, onClose, id, config, onSave }: ThemeOptio
                         label={t("settings.previewTitle")}
                         icon={<Setting fontSize="small" color="action" />}
                       />
-                      <TextField label={t("settings.previewTextField")} variant="outlined" size="small" />
+                      <TextField label={t("settings.previewTextField")} variant="filled" size="small" />
                       <Box>
                         <Badge badgeContent={10} color="secondary">
                           <Button variant="contained" color="primary">

src/component/Common/Captcha/DefaultCaptcha.tsx

@@ -41,7 +41,7 @@ const DefaultCaptcha = ({ onStateChange, generation, noLabel, ...rest }: Default
           pr: 0.5,
         },
       }}
-      variant={"outlined"}
+      variant={"filled"}
       label={noLabel ? undefined : t("login.captcha")}
       onChange={(e) => setCaptcha(e.target.value)}
       value={captcha}

src/component/Common/Form/OutlineIconTextField.tsx

@@ -10,6 +10,7 @@ export const OutlineIconTextField = ({ icon, ...rest }: OutlineIconTextFieldProp
   return (
     <TextField
       {...rest}
+      variant="standard"
       slotProps={{
         input: {
           startAdornment: !isMobile && <InputAdornment position="start">{icon}</InputAdornment>,

src/component/FileManager/Dialogs/DirectLinks.tsx

@@ -115,7 +115,7 @@ const DirectLinks = () => {
           label={t("modals.sourceLink")}
           multiline
           value={contents}
-          variant="outlined"
+          variant="filled"
           fullWidth
           slotProps={{
             htmlInput: { readonly: true },

src/component/FileManager/Dialogs/Share/ShareSetting.tsx

@@ -187,7 +187,7 @@ const ShareSettingContent = ({ setting, file, editing, onSettingChange }: ShareS
                       },
                     }}
                     value={setting.password ?? ""}
-                    onChange={(e) => {
+                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                       const value = e.target.value.trim();
                       if (!/^[a-zA-Z0-9]*$/.test(value) || value.length > 32) return;
                       onSettingChange({ ...setting, password: value });
@@ -292,7 +292,7 @@ const ShareSettingContent = ({ setting, file, editing, onSettingChange }: ShareS
               getOptionLabel={(option: string | valueOption) => (typeof option === "string" ? option : t(option.label))}
               disableClearable
               options={expireOptions}
-              renderInput={(params) => <TextField sx={{ width: 150 }} {...params} variant={"standard"} />}
+              renderInput={(params) => <TextField sx={{ width: 150 }} {...params} variant={"filled"} />}
             />
           </FormControl>
           <Typography>{t("application:modals.expireSuffix")}</Typography>
@@ -368,7 +368,7 @@ const ShareSettingContent = ({ setting, file, editing, onSettingChange }: ShareS
                 }
                 disableClearable
                 options={downloadOptions}
-                renderInput={(params) => <TextField sx={{ width: 200 }} {...params} variant={"standard"} />}
+                renderInput={(params) => <TextField sx={{ width: 200 }} {...params} variant={"filled"} />}
               />
             </FormControl>
             <Typography>{t("application:modals.expireSuffix")}</Typography>

src/component/Frame/HeadlessFrame.tsx

@@ -1,4 +1,5 @@
-import { Box, Container, Grid, Paper } from "@mui/material";
+import { Box, Container, Grid, Paper, AppBar, Toolbar, IconButton, Typography, Button } from "@mui/material";
+import MenuIcon from "@mui/icons-material/Menu";
 import { Outlet, useNavigation } from "react-router-dom";
 import { useAppDispatch, useAppSelector } from "../../redux/hooks.ts";
 import AutoHeight from "../Common/AutoHeight.tsx";
@@ -40,6 +41,35 @@ const HeadlessFrame = () => {
         overflow: "auto",
       }}
     >
+      <Box sx={{ flexGrow: 1 }}>
+        <AppBar
+          sx={{
+            backgroundColor: "#f5f5f5",
+          }}
+        >
+          <Toolbar>
+            {/* <IconButton
+            size="large"
+            edge="start"
+            color="inherit"
+            aria-label="menu"
+            sx={{ mr: 2 }}
+          >
+            <MenuIcon />
+          </IconButton> */}
+            {/* <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
+            News
+          </Typography> */}
+            <Logo
+              sx={{
+                maxWidth: "40%",
+                maxHeight: "40px",
+                mb: 2,
+              }}
+            />
+          </Toolbar>
+        </AppBar>
+      </Box>
       <Container maxWidth={"xs"}>
         <Grid
           container

src/component/Frame/PoweredBy.tsx

@@ -1,6 +1,5 @@
 import { Box, BoxProps, Typography, useTheme } from "@mui/material";
-import LogoIcon from "./assets/logo.svg";
+import Logo from "../Common/Logo";
-import LogoIconDark from "./assets/logo_light.svg";
 
 export interface PoweredByProps extends BoxProps {}
 
@@ -11,7 +10,6 @@ const PoweredBy = ({ ...rest }: PoweredByProps) => {
       <Box
         component="a"
         marginBottom={2}
-        href="https://cloudreve.org"
         target="_blank"
         sx={{
           width: "100%",
@@ -38,16 +36,8 @@ const PoweredBy = ({ ...rest }: PoweredByProps) => {
           }}
           fontWeight={500}
         >
-          Powered by
+          Powered by Miaostars
         </Typography>
-        <Box
-          component="img"
-          alt="Cloudreve"
-          sx={{
-            height: 20,
-          }}
-          src={theme.palette.mode === "dark" ? LogoIconDark : LogoIcon}
-        />
       </Box>
     </Box>
   );

src/component/Pages/Login/Signin/PasskeyLoginButton.tsx

@@ -32,7 +32,7 @@ export default function PasskeyLoginButton({ autoComplete, ...rest }: PasskeyLog
       window.PublicKeyCredential &&
       PublicKeyCredential.isConditionalMediationAvailable
     ) {
-      PublicKeyCredential.isConditionalMediationAvailable().then((v) => {
+      PublicKeyCredential.isConditionalMediationAvailable().then(() => {
         if (!abortRef.current.signal.aborted) startLogin(true)();
       });
     }
@@ -43,12 +43,7 @@ export default function PasskeyLoginButton({ autoComplete, ...rest }: PasskeyLog
 
   const startLogin = (conditional: boolean) => async () => {
     if (!navigator.credentials || !window.PublicKeyCredential) {
-      enqueueSnackbar({
+      enqueueSnackbar(t("setting.browserNotSupported"), { variant: "error", action: DefaultCloseAction });
-        message: t("setting.browserNotSupported"),
-        variant: "warning",
-        action: DefaultCloseAction,
-      });
-
       return;
     }
 

src/component/Pages/Setting/Security/PasskeyList.tsx

@@ -37,12 +37,7 @@ const PasskeyList = (props: PasskeyProps) => {
   const [deleteLoading, setDeleteLoading] = useState(false);
   const addPasskey = async () => {
     if (!navigator.credentials || !window.PublicKeyCredential) {
-      enqueueSnackbar({
+      dispatch(confirmOperation(t("setting.browserNotSupported")));
-        message: t("setting.browserNotSupported"),
-        variant: "warning",
-        action: DefaultCloseAction,
-      });
-
       return;
     }
 

src/component/Pages/Tasks/DownloadFileList.tsx

@@ -136,7 +136,7 @@ const DownloadFileList = ({ taskId, summary, downloading, readonly }: DownloadFi
             <Stack direction="row" spacing={1} sx={{ mb: 1 }}>
               <TextField
                 label={t("download.filterByName")}
-                variant="outlined"
+                variant="filled"
                 size="small"
                 value={filterText}
                 onChange={(e) => setFilterText(e.target.value)}
@@ -184,7 +184,7 @@ const DownloadFileList = ({ taskId, summary, downloading, readonly }: DownloadFi
                 <>
                   <TableCell component="th" scope="row" sx={{ height: 33, minWidth: 50 }}>
                     <StyledCheckbox
-                      onChange={(e) => {
+                      onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                         setFileSelected(value, e.target.checked);
                       }}
                       disabled={!downloading || readonly}