fix: Prevent layout shift when error message appears

Co-authored-by: aider (gemini/gemini-2.5-pro) <aider@aider.chat>
This commit is contained in:
2025-11-21 22:39:34 +00:00
parent e9ee231954
commit 15aa413584
2 changed files with 8 additions and 14 deletions

View File

@@ -57,14 +57,10 @@ function Article({ cache }) {
return ( return (
<div className='article-container'> <div className='article-container'>
{error ? <details style={{marginBottom: '1rem', visibility: error ? 'visible' : 'hidden'}}>
<details style={{marginBottom: '1rem'}}> <summary>Connection error? Click to expand.</summary>
<summary>Connection error? Click to expand.</summary> <p>{error}</p>
<p>{error}</p> </details>
</details>
:
<div style={{marginBottom: '2rem'}}></div>
}
{story ? {story ?
<div className='article'> <div className='article'>
<Helmet> <Helmet>

View File

@@ -96,12 +96,10 @@ function Feed({ updateCache }) {
<title>QotNews</title> <title>QotNews</title>
<meta name="robots" content="index" /> <meta name="robots" content="index" />
</Helmet> </Helmet>
{error && <details style={{marginBottom: '1rem', visibility: error ? 'visible' : 'hidden'}}>
<details style={{marginBottom: '1rem'}}> <summary>Connection error? Click to expand.</summary>
<summary>Connection error? Click to expand.</summary> <p>{error}</p>
<p>{error}</p> </details>
</details>
}
{stories ? {stories ?
<div> <div>
{stories.map(x => {stories.map(x =>