YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-02-14 18:30:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore: tweak max width

Browse Source
This commit is contained in:
Steven 2024-05-07 22:10:08 +08:00
parent e16546f80a
commit f9258e41a0
14 changed files with 17 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
web/src/components/MemoEditor/ActionButton/UploadResourceButton.tsx
View File

@ -38,12 +38,7 @@ const UploadResourceButton = () => {
if (!fileInputRef.current || !fileInputRef.current.files) {
return;
}
const filesOnInput = Array.from(fileInputRef.current.files);
for (const file of fileInputRef.current.files) {
const fileOnInput = filesOnInput.find((fileOnInput) => fileOnInput.name === file.name);
if (!fileOnInput) {
continue;
}
const { name: filename, size, type } = file;
const buffer = new Uint8Array(await file.arrayBuffer());
const resource = await resourceStore.createResource({
@ -65,7 +60,7 @@ const UploadResourceButton = () => {
};
return (
<IconButton size="sm">
<IconButton size="sm" disabled={state.uploadingFlag}>
<Icon.Paperclip className="w-5 h-5 mx-auto" />
<input
className="absolute inset-0 w-full h-full opacity-0 cursor-pointer"

9
web/src/components/MemoResourceListView.tsx
View File

@ -1,5 +1,4 @@
import { memo } from "react";
import { absolutifyLink } from "@/helpers/utils";
import { Resource } from "@/types/proto/api/v1/resource_service";
import { getResourceType, getResourceUrl } from "@/utils/resource";
import MemoResource from "./MemoResource";
@ -28,7 +27,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
showPreviewImageDialog(imgUrls, index);
};
const MediaCard = ({ resource, thumbnail }: { resource: Resource; thumbnail?: boolean }) => {
const MediaCard = ({ resource }: { resource: Resource }) => {
const type = getResourceType(resource);
const url = getResourceUrl(resource);
@ -36,7 +35,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
return (
<img
className="cursor-pointer min-h-full w-auto object-cover"
src={resource.externalLink ? url : `${url}${thumbnail ? "?thumbnail=1" : ""}`}
src={url}
onClick={() => handleImageClick(url)}
decoding="async"
loading="lazy"
@ -48,7 +47,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
className="cursor-pointer w-full h-full object-contain bg-zinc-100 dark:bg-zinc-800"
preload="metadata"
crossOrigin="anonymous"
src={absolutifyLink(url)}
src={url}
controls
/>
);
@ -73,7 +72,7 @@ const MemoResourceListView = ({ resources = [] }: { resources: Resource[] }) =>
key={resource.name}
className="flex justify-center items-center border dark:border-zinc-900 rounded overflow-hidden hide-scrollbar hover:shadow-md"
>
<MediaCard resource={resource} thumbnail />
<MediaCard resource={resource} />
</SquareDiv>
));

2
web/src/pages/About.tsx
View File

@ -4,7 +4,7 @@ import MobileHeader from "@/components/MobileHeader";
const About = () => {
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
<div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

2
web/src/pages/Archived.tsx
View File

@ -87,7 +87,7 @@ const Archived = () => {
};
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
<div className="w-full flex flex-col justify-start items-start">

2
web/src/pages/Explore.tsx
View File

@ -55,7 +55,7 @@ const Explore = () => {
};
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
{!md && (
<MobileHeader>
<ExploreSidebarDrawer />

2
web/src/pages/Home.tsx
View File

@ -69,7 +69,7 @@ const Home = () => {
}, [memoList]);
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
{!md && (
<MobileHeader>
<HomeSidebarDrawer />

2
web/src/pages/Inboxes.tsx
View File

@ -23,7 +23,7 @@ const Inboxes = () => {
}, []);
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
<div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

2
web/src/pages/MemoDetail.tsx
View File

@ -66,7 +66,7 @@ const MemoDetail = () => {
};
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
{parentMemo && (

2
web/src/pages/NotFound.tsx
View File

@ -2,7 +2,7 @@ import MobileHeader from "@/components/MobileHeader";
const NotFound = () => {
return (
<section className="@container w-full max-w-5xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 grow flex flex-col justify-center items-center sm:px-6">
<p className="font-medium">{"The page you are looking for can't be found."}</p>

2
web/src/pages/PermissionDenied.tsx
View File

@ -2,7 +2,7 @@ import MobileHeader from "@/components/MobileHeader";
const PermissionDenied = () => {
return (
<section className="@container w-full max-w-5xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-[100svh] flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 grow flex flex-col justify-center items-center sm:px-6">
<p className="font-medium">Permission denied</p>

2
web/src/pages/Resources.tsx
View File

@ -74,7 +74,7 @@ const Resources = () => {
};
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
<div className="w-full shadow flex flex-col justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-black dark:text-gray-300">

2
web/src/pages/Setting.tsx
View File

@ -57,7 +57,7 @@ const Setting = () => {
}, []);
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-start sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-start sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6">
<div className="w-full shadow flex flex-row justify-start items-start px-4 py-3 rounded-xl bg-white dark:bg-zinc-800 text-gray-600 dark:text-gray-400">

2
web/src/pages/Timeline.tsx
View File

@ -119,7 +119,7 @@ const Timeline = () => {
};
return (
<section className="@container w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="@container w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
{!md && (
<MobileHeader>
<TimelineSidebarDrawer />

2
web/src/pages/UserProfile.tsx
View File

@ -100,7 +100,7 @@ const UserProfile = () => {
};
return (
<section className="w-full max-w-5xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<section className="w-full max-w-4xl min-h-full flex flex-col justify-start items-center sm:pt-3 md:pt-6 pb-8">
<MobileHeader />
<div className="w-full px-4 sm:px-6 flex flex-col justify-start items-center">
{!loadingState.isLoading &&