chore: tweak page styles

This commit is contained in:
Steven 2024-03-06 00:35:04 +08:00
parent 98d73e81c0
commit d866268a7a
8 changed files with 11 additions and 11 deletions

View File

@ -23,7 +23,7 @@ const AnalyticsView: React.FC<Props> = (props: Props) => {
}, []); }, []);
return ( return (
<div className={classNames("w-full", className)}> <div className={classNames("relative w-full", className)}>
{analytics ? ( {analytics ? (
<> <>
<div className="w-full"> <div className="w-full">
@ -138,7 +138,7 @@ const AnalyticsView: React.FC<Props> = (props: Props) => {
</div> </div>
</> </>
) : ( ) : (
<div className="py-12 w-full flex flex-row justify-center items-center opacity-80"> <div className="absolute py-12 w-full flex flex-row justify-center items-center opacity-80">
<Icon.Loader className="mr-2 w-5 h-auto animate-spin" /> <Icon.Loader className="mr-2 w-5 h-auto animate-spin" />
{t("common.loading")} {t("common.loading")}
</div> </div>

View File

@ -171,8 +171,8 @@ const CreateCollectionDrawer: React.FC<Props> = (props: Props) => {
<Drawer anchor="right" open={true} onClose={onClose}> <Drawer anchor="right" open={true} onClose={onClose}>
<DialogTitle>{isCreating ? "Create Collection" : "Edit Collection"}</DialogTitle> <DialogTitle>{isCreating ? "Create Collection" : "Edit Collection"}</DialogTitle>
<ModalClose /> <ModalClose />
<DialogContent className="w-full max-w-full sm:max-w-[24rem]"> <DialogContent className="w-full max-w-full">
<div className="overflow-y-auto w-full mt-2 px-3 pb-4"> <div className="overflow-y-auto w-full mt-2 px-4 pb-4 sm:w-[24rem]">
<div className="w-full flex flex-col justify-start items-start mb-3"> <div className="w-full flex flex-col justify-start items-start mb-3">
<span className="mb-2"> <span className="mb-2">
Name <span className="text-red-600">*</span> Name <span className="text-red-600">*</span>

View File

@ -225,8 +225,8 @@ const CreateShortcutDrawer: React.FC<Props> = (props: Props) => {
<Drawer anchor="right" open={true} onClose={onClose}> <Drawer anchor="right" open={true} onClose={onClose}>
<DialogTitle>{isCreating ? "Create Shortcut" : "Edit Shortcut"}</DialogTitle> <DialogTitle>{isCreating ? "Create Shortcut" : "Edit Shortcut"}</DialogTitle>
<ModalClose /> <ModalClose />
<DialogContent className="w-full max-w-full sm:max-w-[24rem]"> <DialogContent className="w-full max-w-full">
<div className="overflow-y-auto w-full mt-2 px-3 pb-4"> <div className="overflow-y-auto w-full mt-2 px-4 pb-4 sm:w-[24rem]">
<div className="w-full flex flex-col justify-start items-start mb-3"> <div className="w-full flex flex-col justify-start items-start mb-3">
<span className="mb-2"> <span className="mb-2">
Name <span className="text-red-600">*</span> Name <span className="text-red-600">*</span>

View File

@ -30,7 +30,7 @@ const Header: React.FC = () => {
return ( return (
<> <>
<div className="w-full bg-gray-50 dark:bg-zinc-800 border-b border-b-gray-200 dark:border-b-zinc-800"> <div className="w-full bg-gray-50 dark:bg-zinc-800 border-b border-b-gray-200 dark:border-b-zinc-800">
<div className="w-full max-w-8xl mx-auto px-3 md:px-12 py-3 flex flex-row justify-between items-center"> <div className="w-full max-w-8xl mx-auto px-4 sm:px-6 md:px-12 py-3 flex flex-row justify-between items-center">
<div className="flex flex-row justify-start items-center shrink mr-2"> <div className="flex flex-row justify-start items-center shrink mr-2">
<Link to="/" className="cursor-pointer flex flex-row justify-start items-center dark:text-gray-400" unstable_viewTransition> <Link to="/" className="cursor-pointer flex flex-row justify-start items-center dark:text-gray-400" unstable_viewTransition>
<img id="logo-img" src="/logo.png" className="w-7 h-auto mr-2 -mt-0.5 dark:opacity-80 rounded-full shadow" alt="" /> <img id="logo-img" src="/logo.png" className="w-7 h-auto mr-2 -mt-0.5 dark:opacity-80 rounded-full shadow" alt="" />

View File

@ -45,7 +45,7 @@ const CollectionDashboard: React.FC = () => {
return ( return (
<> <>
<div className="mx-auto max-w-8xl w-full px-3 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start"> <div className="mx-auto max-w-8xl w-full px-4 sm:px-6 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start">
<div className="w-full flex flex-row justify-between items-center mb-4"> <div className="w-full flex flex-row justify-between items-center mb-4">
<div> <div>
<Input <Input

View File

@ -45,7 +45,7 @@ const Home: React.FC = () => {
return ( return (
<> <>
<div className="mx-auto max-w-8xl w-full px-3 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start"> <div className="mx-auto max-w-8xl w-full px-4 sm:px-6 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start">
<ShortcutsNavigator /> <ShortcutsNavigator />
<div className="w-full flex flex-row justify-between items-center mb-4"> <div className="w-full flex flex-row justify-between items-center mb-4">
<div className="flex flex-row justify-start items-center"> <div className="flex flex-row justify-start items-center">

View File

@ -43,7 +43,7 @@ const MemoDashboard: React.FC = () => {
return ( return (
<> <>
<div className="mx-auto max-w-8xl w-full px-3 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start"> <div className="mx-auto max-w-8xl w-full px-4 sm:px-6 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start">
<div className="w-full flex flex-row justify-between items-center mb-4"> <div className="w-full flex flex-row justify-between items-center mb-4">
<div> <div>
<Input <Input

View File

@ -77,7 +77,7 @@ const ShortcutDetail = () => {
return ( return (
<> <>
<div className="mx-auto max-w-8xl w-full px-3 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start"> <div className="mx-auto max-w-8xl w-full px-4 sm:px-6 md:px-12 pt-4 pb-6 flex flex-col justify-start items-start">
<div className="mt-4 sm:mt-8 w-12 h-12 flex justify-center items-center overflow-clip"> <div className="mt-4 sm:mt-8 w-12 h-12 flex justify-center items-center overflow-clip">
{favicon ? ( {favicon ? (
<img className="w-full h-auto rounded-lg" src={favicon} decoding="async" loading="lazy" /> <img className="w-full h-auto rounded-lg" src={favicon} decoding="async" loading="lazy" />