Don't show floors if no articles

This commit is contained in:
kvakazyambra 2023-08-12 13:36:21 +03:00
parent f14b4a7049
commit c46e65abd2
2 changed files with 42 additions and 38 deletions

View File

@ -19,29 +19,31 @@ export const Row2 = (props: {
createComputed(() => setY(Math.floor(Math.random() * x.length))) createComputed(() => setY(Math.floor(Math.random() * x.length)))
return ( return (
<div class="floor"> <Show when={props.articles && props.articles.length > 0}>
<div class="wide-container"> <div class="floor">
<div class="row"> <div class="wide-container">
<For each={props.articles}> <div class="row">
{(a, i) => { <For each={props.articles}>
return ( {(a, i) => {
<Show when={!!a}> return (
<div class={`col-md-${props.isEqual ? '12' : x[y()][i()]}`}> <Show when={!!a}>
<ArticleCard <div class={`col-md-${props.isEqual ? '12' : x[y()][i()]}`}>
article={a} <ArticleCard
settings={{ article={a}
isWithCover: props.isEqual || x[y()][i()] === '16', settings={{
nodate: props.isEqual || props.nodate, isWithCover: props.isEqual || x[y()][i()] === '16',
noAuthorLink: props.noAuthorLink nodate: props.isEqual || props.nodate,
}} noAuthorLink: props.noAuthorLink
/> }}
</div> />
</Show> </div>
) </Show>
}} )
</For> }}
</For>
</div>
</div> </div>
</div> </div>
</div> </Show>
) )
} }

View File

@ -1,5 +1,5 @@
import type { JSX } from 'solid-js/jsx-runtime' import type { JSX } from 'solid-js/jsx-runtime'
import { For } from 'solid-js' import { For, Show } from 'solid-js'
import type { Shout } from '../../graphql/types.gen' import type { Shout } from '../../graphql/types.gen'
import { ArticleCard } from './ArticleCard' import { ArticleCard } from './ArticleCard'
@ -10,22 +10,24 @@ export const Row3 = (props: {
noAuthorLink?: boolean noAuthorLink?: boolean
}) => { }) => {
return ( return (
<div class="floor"> <Show when={props.articles && props.articles.length > 0}>
<div class="wide-container"> <div class="floor">
<div class="row"> <div class="wide-container">
<div class="floor-header">{props.header}</div> <div class="row">
<For each={props.articles}> <div class="floor-header">{props.header}</div>
{(a) => ( <For each={props.articles}>
<div class="col-md-8"> {(a) => (
<ArticleCard <div class="col-md-8">
article={a} <ArticleCard
settings={{ nodate: props.nodate, noAuthorLink: props.noAuthorLink }} article={a}
/> settings={{ nodate: props.nodate, noAuthorLink: props.noAuthorLink }}
</div> />
)} </div>
</For> )}
</For>
</div>
</div> </div>
</div> </div>
</div> </Show>
) )
} }