[Embeds] Tweak homepage styles (#3526)

* tweak error styles

* reduce error horizontal padding
zio/stable
Samuel Newman 2024-04-13 11:18:50 +01:00 committed by GitHub
parent 826f6b043c
commit c1137c3984
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 11 additions and 11 deletions

View File

@ -110,9 +110,8 @@ function LandingPage() {
<img src={logo as string} className="h-10" /> <img src={logo as string} className="h-10" />
</Link> </Link>
<h1 className="text-4xl font-bold">Embed a Bluesky Post</h1> <h1 className="text-4xl font-bold text-center">Embed a Bluesky Post</h1>
<div className="w-full max-w-[600px] flex flex-col gap-2">
<input <input
type="text" type="text"
value={uri} value={uri}
@ -120,7 +119,6 @@ function LandingPage() {
className="border rounded-lg py-3 w-full max-w-[600px] px-4" className="border rounded-lg py-3 w-full max-w-[600px] px-4"
placeholder={DEFAULT_POST} placeholder={DEFAULT_POST}
/> />
</div>
<img src={arrowBottom as string} className="w-6" /> <img src={arrowBottom as string} className="w-6" />
@ -128,7 +126,9 @@ function LandingPage() {
{uri && !error && thread && <Snippet thread={thread} />} {uri && !error && thread && <Snippet thread={thread} />}
{!error && thread && <Post thread={thread} key={thread.post.uri} />} {!error && thread && <Post thread={thread} key={thread.post.uri} />}
{error && ( {error && (
<p className={`text-red-500 ${error ? '' : 'invisible'}`}>{error}</p> <div className="w-full border border-red-500 bg-red-50 px-4 py-3 rounded-lg">
<p className="text-red-500 text-center">{error}</p>
</div>
)} )}
</div> </div>
</main> </main>