adjust style

This commit is contained in:
zizifn
2022-12-14 00:11:06 +08:00
committed by zizifn
parent 1d9a130a72
commit 31ee27586d
4 changed files with 9 additions and 10 deletions

View File

@@ -9,9 +9,9 @@ export function App() {
setText(text); setText(text);
} }
return ( return (
<div className="flex flex-col h-screen"> <div className="flex flex-col items-center h-screen">
<Warning></Warning> <Warning></Warning>
<div className="flex flex-col items-center h-full"> <div className="flex flex-col h-full ite">
<QRcodeImg text={text}></QRcodeImg> <QRcodeImg text={text}></QRcodeImg>
<Actions handleShare={handleShare}></Actions> <Actions handleShare={handleShare}></Actions>
<Anything handleShare={handleShare}></Anything> <Anything handleShare={handleShare}></Anything>
@@ -20,7 +20,6 @@ export function App() {
); );
} }
function ClipboardCopy(text: string) {}
function QRcodeImg({ text }: { text: string }) { function QRcodeImg({ text }: { text: string }) {
const [codeImg, setcodeImg] = useState(''); const [codeImg, setcodeImg] = useState('');
const [copy, setCopy] = useState(false); const [copy, setCopy] = useState(false);
@@ -92,7 +91,7 @@ function QRcodeImg({ text }: { text: string }) {
function Anything({ handleShare }: { handleShare: (text: string) => void }) { function Anything({ handleShare }: { handleShare: (text: string) => void }) {
const [text, setText] = useState(''); const [text, setText] = useState('');
return ( return (
<div className="mt-4 w-60"> <div className="mt-4">
<label <label
htmlFor="comment" htmlFor="comment"
className="block text-sm font-medium text-gray-700" className="block text-sm font-medium text-gray-700"
@@ -132,7 +131,7 @@ function Actions({ handleShare }: { handleShare: (text: string) => void }) {
return `vless://${uuid}@${url.hostname}:443?encryption=none&security=tls&type=ws#deno-vless`; return `vless://${uuid}@${url.hostname}:443?encryption=none&security=tls&type=ws#deno-vless`;
} }
return ( return (
<span className="inline-flex rounded-md shadow-sm isolate"> <span className="inline-flex self-center mt-4 rounded-md shadow-sm isolate">
<button <button
onClick={() => handleShare(getPageURL())} onClick={() => handleShare(getPageURL())}
type="button" type="button"
@@ -153,7 +152,7 @@ function Actions({ handleShare }: { handleShare: (text: string) => void }) {
function Warning() { function Warning() {
return ( return (
<div className="flex justify-center p-4 rounded-md bg-yellow-50"> <div className="flex justify-center w-full p-4 rounded-md bg-yellow-50">
<div className="flex"> <div className="flex">
<div className="flex-shrink-0"> <div className="flex-shrink-0">
<ExclamationTriangleIcon <ExclamationTriangleIcon

View File

@@ -8,8 +8,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" /> <link rel="icon" type="image/x-icon" href="/favicon.ico" />
<script type="module" crossorigin src="/assets/index.7e535eca.js"></script> <script type="module" crossorigin src="/assets/index.7cb573a1.js"></script>
<link rel="stylesheet" href="/assets/index.135437cb.css"> <link rel="stylesheet" href="/assets/index.66da34c3.css">
</head> </head>
<body> <body>