zias/stats
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(public): grid on articles

Browse Source
This commit is contained in:
Carl-Gerhard Lindesvärd
2024-11-14 10:41:23 +01:00
parent ab4efcfd77
commit 33cff99d09
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
apps/public/app/(content)/articles/page.tsx
View File

@@ -35,7 +35,7 @@ export default async function Page() {
<div className="py-16"> <div className="py-16">
<h1 className="text-center text-7xl font-bold">Articles</h1> <h1 className="text-center text-7xl font-bold">Articles</h1>
</div> </div>
<div className="grid grid-cols-3 gap-8"> <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8">
{articles.map((item) => ( {articles.map((item) => (
<Link <Link
href={item.url} href={item.url}
@@ -47,6 +47,7 @@ export default async function Page() {
alt={item.data.title} alt={item.data.title}
width={323} width={323}
height={181} height={181}
className="w-full"
/> />
<span className="p-4 col flex-1"> <span className="p-4 col flex-1">
{item.data.tag && ( {item.data.tag && (

6
apps/public/components/ui/slider.tsx
View File

@@ -29,10 +29,10 @@ const Slider = ({
step: number; step: number;
onValueChange: (value: number[]) => void; onValueChange: (value: number[]) => void;
}) => { }) => {
const isDesktop = useMediaQuery('(min-width: 768px)'); const isMobile = useMediaQuery('(max-width: 768px)');
return ( return (
<> <>
{!isDesktop && ( {isMobile && (
<div className="text-sm text-muted-foreground mb-4">{tooltip}</div> <div className="text-sm text-muted-foreground mb-4">{tooltip}</div>
)} )}
<SliderPrimitive.Root <SliderPrimitive.Root
@@ -46,7 +46,7 @@ const Slider = ({
<SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-white/10"> <SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-white/10">
<SliderPrimitive.Range className="absolute h-full bg-white/90" /> <SliderPrimitive.Range className="absolute h-full bg-white/90" />
</SliderPrimitive.Track> </SliderPrimitive.Track>
{tooltip && isDesktop ? ( {tooltip && !isMobile ? (
<Tooltip open disableHoverableContent> <Tooltip open disableHoverableContent>
<TooltipTrigger asChild> <TooltipTrigger asChild>
<SliderPrimitive.Thumb className="block h-5 w-5 rounded-full border-2 border-white bg-black ring-offset-black transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" /> <SliderPrimitive.Thumb className="block h-5 w-5 rounded-full border-2 border-white bg-black ring-offset-black transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" />