rusackas commented on code in PR #24393:
URL: https://github.com/apache/superset/pull/24393#discussion_r1229948114
##########
docs/src/pages/community.tsx:
##########
@@ -20,103 +20,193 @@ import React 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 links = [
- [
- 'http://bit.ly/join-superset-slack',
- 'Slack',
- 'interact with other Superset users and community members',
- ],
- [
- 'https://github.com/apache/superset',
- 'GitHub',
- 'create tickets to report issues, report bugs, and suggest new features',
- ],
- [
- 'https://lists.apache.org/[email protected]',
- 'dev@ Mailing List',
- 'participate in conversations with committers and contributors',
- ],
- [
-
'https://calendar.google.com/calendar/u/2?cid=c3VwZXJzZXQuY29tbWl0dGVyc0BnbWFpbC5jb20',
- 'Superset Community Calendar',
- 'join us for working group sessions and other community gatherings',
- ],
- [
- 'https://stackoverflow.com/questions/tagged/superset+apache-superset',
- 'Stack Overflow',
- 'our growing knowledge base',
- ],
- [
- 'https://www.meetup.com/Global-Apache-Superset-Community-Meetup/',
- 'Superset Meetup Group',
- 'join our monthly virtual meetups and register for any upcoming events',
- ],
- [
- 'https://github.com/apache/superset/blob/master/RESOURCES/INTHEWILD.md',
- 'Organizations',
- 'a list of some of the organizations using Superset in production',
- ],
- [
- 'https://github.com/apache-superset/awesome-apache-superset',
- 'Contributors Guide',
- 'Interested in contributing? Learn how to contribute and best practices',
- ],
+const communityLinks = [
+ {
+ url: 'http://bit.ly/join-superset-slack',
+ title: 'Slack',
+ description: 'Interact with other Superset users and community members.',
+ image: 'slack-symbol.jpg',
+ },
+ {
+ url: 'https://github.com/apache/superset',
+ title: 'GitHub',
+ description:
+ 'Create tickets to report issues, report bugs, and suggest new
features.',
+ image: 'github-symbol.jpg',
+ },
+ {
+ url: 'https://lists.apache.org/[email protected]',
+ title: 'dev@ Mailing List',
+ description:
+ 'Participate in conversations with committers and contributors.',
+ image: 'email-symbol.png',
+ },
+ {
+ url: 'https://stackoverflow.com/questions/tagged/superset+apache-superset',
+ title: 'Stack Overflow',
+ description: 'Our growing knowledge base.',
+ image: 'stackoverflow-symbol.jpg',
+ },
+ {
+ 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',
+ },
+ {
+ url:
'https://github.com/apache/superset/blob/master/RESOURCES/INTHEWILD.md',
+ title: 'Organizations',
+ description:
+ 'A list of some of the organizations using Superset in production.',
+ image: 'note-symbol.png',
+ },
+ {
+ url: 'https://github.com/apache-superset/awesome-apache-superset',
+ title: 'Contributors Guide',
+ description:
+ 'Interested in contributing? Learn how to contribute and best
practices.',
+ image: 'writing-symbol.png',
+ },
];
-const StyledMain = styled('main')`
- padding-bottom: 60px;
- padding-left: 16px;
- padding-right: 16px;
- section {
- width: 100%;
- max-width: 800px;
+const StyledJoinCommunity = styled('section')`
+ background-color: #fbfbfb;
+ border-bottom: 1px solid #ededed;
+ .list {
+ max-width: 540px;
margin: 0 auto;
- padding: 60px 0 0 0;
- font-size: 17px;
- &:first-of-type{
- padding: 40px;
- background-image: linear-gradient(120deg, #d6f2f8, #52c6e3);
- border-radius: 0 0 10px;
+ padding: 40px 20px 20px 35px;
+ }
+ .item {
+ padding: 0;
+ border: 0;
+ }
+ .icon {
+ width: 40px;
+ margin-top: 5px;
+ ${mq[1]} {
+ width: 40px;
+ margin-top: 0;
+ }
+ }
+ .title {
+ font-size: 20px;
+ line-height: 36px;
+ font-weight: 700;
+ color: var(--ifm-font-base-color);
+ ${mq[1]} {
+ font-size: 23px;
+ line-height: 26px;
+ }
+ }
+ .description {
+ font-size: 14px;
+ line-height: 20px;
+ color: #5f5f5f;
+ margin-top: -8px;
+ margin-bottom: 23px;
+ ${mq[1]} {
+ font-size: 17px;
+ line-height: 22px;
+ color: #484848;
+ margin-bottom: 35px;
+ margin-top: 0;
}
}
`;
-const StyledGetInvolved = styled('div')`
- margin-bottom: 25px;
+const StyledCalendarIframe = styled('iframe')`
+ display: block;
+ margin: 20px auto 30px;
+ max-width: 800px;
+ width: 100%;
+ height: 600px;
+ border: 0;
+ ${mq[1]} {
+ width: calc(100% - 40px);
+ }
+`;
+
+const StyledNewsletterIframe = styled('iframe')`
+ display: block;
+ max-width: 1080px;
+ width: calc(100% - 40px);
+ height: 285px;
+ margin: 30px auto 20px;
+ border: 0;
+ @media (max-width: 1200px) {
+ height: 380px;
+ }
+ @media (max-width: 679px) {
+ height: 680px;
+ margin-top: 15px;
+ }
`;
const Community = () => {
return (
<Layout
title="Community"
- description="Community website for Apache Superset, a data visualization
and data exploration platform"
+ description="Community website for Apache Superset™, a data
visualization and data exploration platform"
>
- <StyledMain>
- <section>
- <h1 className="title">Community</h1>
- Get involved in our welcoming, fast growing community!
- </section>
- <section className="joinCommunity">
- <StyledGetInvolved>
- <h2>Get involved!</h2>
- <List
- size="small"
- bordered
- dataSource={links}
- renderItem={([href, link, post]) => (
- <List.Item>
- <a href={href}>{link}</a>
- {' '}
- -
- {' '}
- {post}
- </List.Item>
- )}
- />
- </StyledGetInvolved>
- </section>
- </StyledMain>
+ <main>
+ <BlurredSection>
+ <SectionHeader
+ level="h1"
+ title="Community"
+ subtitle="Get involved in our welcoming, fast growing community!"
+ />
+ </BlurredSection>
+ <StyledJoinCommunity>
+ <List
+ className="list"
+ itemLayout="horizontal"
+ dataSource={communityLinks}
+ renderItem={({ url, title, description, image }) => (
+ <List.Item className="item">
+ <List.Item.Meta
+ avatar={
+ <a className="title" href={url} target="_blank">
Review Comment:
It might be good to add link titles for accessibility. I haven't scanned
through, but there may be many other places we could improve accessibility with
aria labels and such.
--
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]
