63 lines
2.8 KiB
TypeScript
63 lines
2.8 KiB
TypeScript
export default function Banner({ views, url }: { views: number }) {
|
|
|
|
const copyToClipboard = (text) => {
|
|
var tempInput = document.createElement("input");
|
|
tempInput.value = text;
|
|
document.body.appendChild(tempInput);
|
|
tempInput.select();
|
|
document.execCommand("copy");
|
|
document.body.removeChild(tempInput);
|
|
|
|
alert('已复制:'+text);
|
|
}
|
|
|
|
const currentDomain = window.location.hostname;
|
|
const contentDomain = currentDomain=='gtering.com'?'Gtering.com':'Ansnid.Com';
|
|
|
|
|
|
return (
|
|
<div
|
|
className="z-10 fixed bottom-10 inset-x-0 mx-auto max-w-fit rounded-lg px-3 py-2 bg-white border border-gray-100 shadow-md flex justify-between space-x-2 items-center"
|
|
initial={{ opacity: 0, y: 100 }}
|
|
animate={{ opacity: 1, y: 0 }}
|
|
exit={{ opacity: 0, y: 100 }}
|
|
>
|
|
<div className="w-40 flex flex-col items-center justify-center">
|
|
<a
|
|
href="/"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="flex space-x-2 items-center justify-center font-medium text-gray-600 px-4 py-1.5 rounded-md hover:bg-gray-100 active:bg-gray-200 transition-all"
|
|
>
|
|
<img
|
|
alt="Ansnid.Com logo"
|
|
src="/pwa-192.png"
|
|
width={20}
|
|
height={20}
|
|
className="rounded-sm"
|
|
/>
|
|
<p>{contentDomain}</p>
|
|
</a>
|
|
</div>
|
|
<div className="border-l border-gray-200 h-12 w-1" />
|
|
|
|
<button
|
|
onClick={() =>
|
|
copyToClipboard(url())
|
|
}
|
|
className="p-2 flex flex-col space-y-1 items-center rounded-md w-12 hover:bg-gray-100 active:bg-gray-200 transition-all"
|
|
>
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 text-gray-600"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"></path></svg>
|
|
<p className="text-center text-gray-600 text-sm">Copy</p>
|
|
</button>
|
|
|
|
<div className="cursor-default p-2 flex flex-col space-y-1 items-center rounded-md w-12 hover:bg-gray-100 active:bg-gray-200 transition-all">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="h-4 w-4 text-gray-600"><path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"></path><circle cx="12" cy="12" r="3"></circle></svg>
|
|
<p className="text-center text-gray-600 text-sm">
|
|
{views}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|