mirror of
https://github.com/fosrl/pangolin.git
synced 2026-01-28 22:00:51 +00:00
💄fix countries list grid items
This commit is contained in:
@@ -510,7 +510,7 @@ function TopCountriesList(props: TopCountriesListProps) {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{/* `aspect-475/335` is the same aspect ratio as the world map component */}
|
{/* `aspect-475/335` is the same aspect ratio as the world map component */}
|
||||||
<ol className="w-full overflow-auto grid gap-1 aspect-475/335">
|
<ol className="w-full overflow-auto gap-1 aspect-475/335 flex flex-col">
|
||||||
{props.countries.length === 0 && (
|
{props.countries.length === 0 && (
|
||||||
<div className="flex items-center justify-center size-full text-muted-foreground gap-1">
|
<div className="flex items-center justify-center size-full text-muted-foreground gap-1">
|
||||||
{props.isLoading ? (
|
{props.isLoading ? (
|
||||||
@@ -523,12 +523,12 @@ function TopCountriesList(props: TopCountriesListProps) {
|
|||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{props.countries.map((country) => {
|
{props.countries.slice(0, 3).map((country) => {
|
||||||
const percent = country.count / props.total;
|
const percent = country.count / props.total;
|
||||||
return (
|
return (
|
||||||
<li
|
<li
|
||||||
key={country.code}
|
key={country.code}
|
||||||
className="grid grid-cols-7 rounded-xs hover:bg-muted relative items-center text-sm"
|
className="w-full grid grid-cols-7 rounded-xs hover:bg-muted relative items-center text-sm"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
|
|||||||
Reference in New Issue
Block a user