mirror of
https://github.com/woodchen-ink/Q58Connect.git
synced 2025-07-19 06:21:55 +08:00
修复一下移动端效果
This commit is contained in:
parent
54b3d8e661
commit
0fe8bfc6aa
@ -148,7 +148,7 @@ export default function HomePage() {
|
||||
<Section className="border-t bg-gray-50 py-24 dark:bg-gray-800">
|
||||
<Container>
|
||||
<div className="mx-auto max-w-4xl">
|
||||
<Card className="overflow-hidden border-2 p-6">
|
||||
<Card className="overflow-hidden border-2 p-2 sm:p-6">
|
||||
<CardHeader className="bg-white dark:bg-gray-900">
|
||||
<CardTitle className="text-2xl">
|
||||
接入应用 (授权码模式)
|
||||
@ -159,7 +159,7 @@ export default function HomePage() {
|
||||
适用于有后端服务器的应用。
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="bg-white p-0 dark:bg-gray-900">
|
||||
<CardContent className="overflow-x-auto bg-white p-0 dark:bg-gray-900">
|
||||
<Tabs defaultValue="auth" className="w-full">
|
||||
<TabsList className="grid w-full grid-cols-3">
|
||||
<TabsTrigger value="auth">
|
||||
@ -202,7 +202,7 @@ export default function HomePage() {
|
||||
<Alert className="border-l-4 border-l-primary">
|
||||
<Code2 className="h-4 w-4" />
|
||||
<AlertTitle>请求地址</AlertTitle>
|
||||
<AlertDescription className="font-mono">
|
||||
<AlertDescription className="whitespace-pre-wrap break-words font-mono text-xs sm:text-sm">
|
||||
GET https://connect.q58.club/oauth/authorize
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
@ -229,7 +229,7 @@ window.location.href = authUrl;`}
|
||||
<p className="mb-2">
|
||||
用户授权后,将重定向到您的回调地址:
|
||||
</p>
|
||||
<pre className="mt-2 overflow-x-auto rounded bg-gray-100 p-4 dark:bg-gray-800">
|
||||
<pre className="mt-2 overflow-x-auto whitespace-pre-wrap break-words rounded bg-gray-100 p-2 text-xs dark:bg-gray-800 sm:p-4 sm:text-sm">
|
||||
<code className="text-sm">
|
||||
https://your-app.com/callback?code=ac_xxxxxx...
|
||||
</code>
|
||||
@ -267,7 +267,7 @@ window.location.href = authUrl;`}
|
||||
<Alert className="border-l-4 border-l-primary">
|
||||
<Code2 className="h-4 w-4" />
|
||||
<AlertTitle>请求地址</AlertTitle>
|
||||
<AlertDescription className="font-mono">
|
||||
<AlertDescription className="whitespace-pre-wrap break-words font-mono text-xs sm:text-sm">
|
||||
POST
|
||||
https://connect.q58.club/api/oauth/access_token
|
||||
</AlertDescription>
|
||||
@ -294,7 +294,7 @@ window.location.href = authUrl;`}
|
||||
<ArrowDownToLine className="h-4 w-4" />
|
||||
<AlertTitle>响应数据</AlertTitle>
|
||||
<AlertDescription>
|
||||
<pre className="mt-2 overflow-x-auto rounded bg-gray-100 p-4 dark:bg-gray-800">
|
||||
<pre className="mt-2 overflow-x-auto whitespace-pre-wrap break-words rounded bg-gray-100 p-2 text-xs dark:bg-gray-800 sm:p-4 sm:text-sm">
|
||||
<code className="text-sm">
|
||||
{`{
|
||||
"access_token": "at_xxxxxxxx", // 访问令牌
|
||||
@ -328,7 +328,7 @@ window.location.href = authUrl;`}
|
||||
<Alert className="border-l-4 border-l-primary">
|
||||
<Code2 className="h-4 w-4" />
|
||||
<AlertTitle>请求地址</AlertTitle>
|
||||
<AlertDescription className="font-mono">
|
||||
<AlertDescription className="whitespace-pre-wrap break-words font-mono text-xs sm:text-sm">
|
||||
GET https://connect.q58.club/api/oauth/user
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
@ -348,7 +348,7 @@ window.location.href = authUrl;`}
|
||||
<ArrowDownToLine className="h-4 w-4" />
|
||||
<AlertTitle>响应数据</AlertTitle>
|
||||
<AlertDescription>
|
||||
<pre className="mt-2 overflow-x-auto rounded bg-gray-100 p-4 dark:bg-gray-800">
|
||||
<pre className="mt-2 overflow-x-auto whitespace-pre-wrap break-words rounded bg-gray-100 p-2 text-xs dark:bg-gray-800 sm:p-4 sm:text-sm">
|
||||
<code className="text-sm">
|
||||
{`{
|
||||
"id": "user_xxx", // 用户唯一标识
|
||||
|
@ -3,6 +3,8 @@
|
||||
import { useState } from "react";
|
||||
import { Check, Copy } from "lucide-react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
function CopyButton({ text }: { text: string }) {
|
||||
const [copied, setCopied] = useState(false);
|
||||
|
||||
@ -26,10 +28,16 @@ function CopyButton({ text }: { text: string }) {
|
||||
);
|
||||
}
|
||||
|
||||
export function CodeBlock({ children }: { children: string }) {
|
||||
export function CodeBlock({
|
||||
children,
|
||||
className,
|
||||
}: {
|
||||
children: string;
|
||||
className?: string;
|
||||
}) {
|
||||
return (
|
||||
<div className="relative">
|
||||
<pre className="overflow-x-auto rounded-lg bg-gray-100 p-4 dark:bg-gray-800">
|
||||
<div className={cn("relative", className)}>
|
||||
<pre className="overflow-x-auto rounded-lg bg-gray-100 p-4 dark:bg-gray-800 sm:text-sm">
|
||||
<code className="text-sm">{children}</code>
|
||||
</pre>
|
||||
<CopyButton text={children} />
|
||||
|
Loading…
x
Reference in New Issue
Block a user