rusackas commented on code in PR #37536:
URL: https://github.com/apache/superset/pull/37536#discussion_r2739276826
##########
docs/src/pages/community.tsx:
##########
@@ -18,117 +18,173 @@
*/
import { useState } from 'react';
import styled from '@emotion/styled';
-import { List } from 'antd';
import Layout from '@theme/Layout';
import { mq } from '../utils';
import SectionHeader from '../components/SectionHeader';
import BlurredSection from '../components/BlurredSection';
-const communityLinks = [
+interface CommunityLink {
+ url: string;
+ title: string;
+ description: string;
+ image: string;
+}
+
+const communityLinks: CommunityLink[] = [
{
url: 'http://bit.ly/join-superset-slack',
title: 'Slack',
description: 'Interact with other Superset users and community members.',
image: 'slack-symbol.jpg',
- ariaLabel:
- 'Interact with other Superset users and community members on Slack',
},
{
url: 'https://github.com/apache/superset',
title: 'GitHub',
description:
'Create tickets to report issues, report bugs, and suggest new
features.',
image: 'github-symbol.jpg',
- ariaLabel:
- 'Create tickets to report issues, report bugs, and suggest new features
on Superset GitHub repo',
},
{
url: 'https://lists.apache.org/[email protected]',
title: 'dev@ Mailing List',
description:
- 'Participate in conversations with committers and contributors.',
+ 'Participate in conversations with committers and contributors.
Subscribe by emailing [email protected].',
image: 'email-symbol.png',
- ariaLabel:
- 'Participate in conversations with committers and contributors on
Superset mailing list',
- },
- {
- url: 'https://stackoverflow.com/questions/tagged/apache-superset',
- title: 'Stack Overflow',
- description: 'Our growing knowledge base.',
- image: 'stackoverflow-symbol.jpg',
- ariaLabel: 'See Superset issues on Stack Overflow',
- },
- {
- url: 'https://www.meetup.com/Global-Apache-Superset-Community-Meetup/',
- title: 'Superset Meetup Group',
- description:
- 'Join our monthly virtual meetups and register for any upcoming events.',
- image: 'coffee-symbol.png',
- ariaLabel:
- 'Join our monthly virtual meetups and register for any upcoming events
on Meetup',
},
{
- url:
'https://github.com/apache/superset/blob/master/RESOURCES/INTHEWILD.md',
+ url: 'https://superset.apache.org/inTheWild',
title: 'Organizations',
description:
'A list of some of the organizations using Superset in production.',
- image: 'note-symbol.png',
- ariaLabel: 'See a list of the organizations using Superset in production',
+ image: 'globe-symbol.svg',
},
{
- url: 'https://github.com/apache-superset/awesome-apache-superset',
+ url: 'https://superset.apache.org/developer_portal/contributing/overview',
title: 'Contributors Guide',
description:
'Interested in contributing? Learn how to contribute and best
practices.',
image: 'writing-symbol.png',
- ariaLabel: 'Learn how to contribute and best practices on Superset GitHub',
},
];
-const StyledJoinCommunity = styled('section')`
- background-color: var(--ifm-background-color);
- border-bottom: 1px solid var(--ifm-border-color);
- .list {
- max-width: 540px;
- margin: 0 auto;
- padding: 40px 20px 20px 35px;
+interface SocialLink {
+ url: string;
+ title: string;
+ image: string;
+}
+
+const socialLinks: SocialLink[] = [
+ {
+ url: 'https://x.com/ApacheSuperset',
+ title: 'X (Twitter)',
+ image: 'x-symbol.svg',
+ },
+ {
+ url: 'https://www.linkedin.com/company/apache-superset/',
+ title: 'LinkedIn',
+ image: 'linkedin-symbol.svg',
+ },
+ {
+ url: 'https://bsky.app/profile/apachesuperset.bsky.social',
+ title: 'Bluesky',
+ image: 'bluesky-symbol.svg',
+ },
+];
+
+const StyledCardGrid = styled('div')`
+ display: grid;
+ grid-template-columns: repeat(3, minmax(0, 1fr));
+ gap: 16px;
+ max-width: 1000px;
+ margin: 0 auto;
+ padding: 30px 20px;
+ ${mq[2]} {
+ grid-template-columns: repeat(2, minmax(0, 1fr));
}
- .item {
- padding: 0;
- border: 0;
+ ${mq[1]} {
Review Comment:
`mq[2]` is valid — `mq` is defined in `docs/src/utils.js` as
`breakpoints.map(bp => ...)` over `[576, 768, 992, 1200]`, so `mq[2]` maps to
`@media (max-width: 992px)`. The 3→2→1 responsive layout is intentional:
- Default: 3 columns
- `mq[2]` (≤992px): 2 columns
- `mq[1]` (≤768px): 1 column
While the rest of the codebase only uses `mq[0]` and `mq[1]`, the array has
4 entries and `mq[2]` is the correct breakpoint for the intermediate 2-column
step.
##########
docs/src/pages/community.tsx:
##########
@@ -188,39 +244,42 @@ const Community = () => {
subtitle="Get involved in our welcoming, fast growing community!"
/>
</BlurredSection>
- <StyledJoinCommunity>
- <List
- className="list"
- itemLayout="horizontal"
- dataSource={communityLinks}
- renderItem={({ url, title, description, image, ariaLabel }) => (
- <List.Item className="item">
- <List.Item.Meta
- avatar={
- <a
- className="title"
- href={url}
- target="_blank"
- rel="noreferrer"
- aria-label={ariaLabel}
- >
- <img className="icon" src={`/img/community/${image}`} />
- </a>
- }
- title={
- <a href={url} target="_blank" rel="noreferrer">
- <p className="title" style={{ marginBottom: 0 }}>
- {title}
- </p>
- </a>
- }
- description={<p className="description">{description}</p>}
- aria-label="Community link"
- />
- </List.Item>
- )}
- />
- </StyledJoinCommunity>
+ <section>
+ <StyledCardGrid>
+ {communityLinks.map(({ url, title, description, image }) => (
+ <a
+ key={title}
+ className="card"
+ href={url}
+ target="_blank"
+ rel="noreferrer"
+ >
+ <img className="icon" src={`/img/community/${image}`} alt="" />
+ <div className="card-body">
+ <div className="title">{title}</div>
+ <div className="description">{description}</div>
+ </div>
+ </a>
+ ))}
+ </StyledCardGrid>
+ </section>
+ <BlurredSection>
+ <SectionHeader level="h2" title="Follow Us" />
+ <StyledSocialGrid>
+ {socialLinks.map(({ url, title, image }) => (
+ <a
+ key={title}
+ className="card"
+ href={url}
+ target="_blank"
+ rel="noreferrer"
+ >
+ <img className="icon" src={`/img/community/${image}`} alt="" />
Review Comment:
Fixed in a67daeb — both `alt=""` occurrences now use `alt={title}` for
proper screen reader support.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
