feat: small mobile styles

This commit is contained in:
DIYgod 2022-11-11 22:52:14 +00:00
parent 430a3c6bc3
commit 2ab2b05233
No known key found for this signature in database
GPG Key ID: D159328F47A80DCA
2 changed files with 7 additions and 7 deletions

View File

@ -110,15 +110,15 @@ export const SiteHeader: React.FC<{
</div>
{site?.bio && (
<div
className="xlog-site-description text-gray-500 text-xs mt-1"
className="xlog-site-description text-gray-500 text-xs leading-8"
dangerouslySetInnerHTML={{ __html: site?.description || "" }}
></div>
)}
<div className="xlog-site-others mt-3 text-sm">
<div className="xlog-site-others text-sm">
<FollowingCount siteId={site?.username} />
<FollowingButton
siteId={site?.username}
className="text-accent mx-5"
className="text-accent mr-5 min-[438px]:mx-5"
variant="text"
/>
<div className="relative inline-block align-middle h-7 group">

View File

@ -23,9 +23,9 @@ export const SiteHome: React.FC<{
<Link
key={post.id}
href={`/${post.slug || post.id}`}
className="xlog-post hover:bg-zinc-100 transition-colors px-5 py-7 -mx-5 first:-mt-5 md:rounded-xl flex items-center"
className="xlog-post hover:bg-zinc-100 transition-colors px-5 py-7 -mx-5 first:-mt-5 sm:rounded-xl flex flex-col sm:flex-row items-center"
>
<div className="flex-1 flex justify-center flex-col">
<div className="flex-1 flex justify-center flex-col w-full sm:w-auto">
<h3 className="xlog-post-title text-2xl font-bold">
{post.title}
</h3>
@ -61,9 +61,9 @@ export const SiteHome: React.FC<{
</div>
</div>
{post.cover && (
<div className="xlog-post-cover flex items-center relative w-24 h-24 ml-4">
<div className="xlog-post-cover flex items-center relative w-full sm:w-24 h-24 mt-2 sm:ml-4 sm:mt-0">
<Image
className="object-cover rounded w-24 h-24"
className="object-cover rounded"
alt="cover"
fill={true}
src={post.cover}