mirror of
https://github.com/apache/superset.git
synced 2026-06-01 13:49:21 +00:00
docs: Restyle documentation landing page and community page (#24393)
This commit is contained in:
Thiago Rossener
53
docs/src/components/BlurredSection.tsx
Normal file
53
docs/src/components/BlurredSection.tsx
Normal file
@@ -0,0 +1,53 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React, { ReactNode } from 'react';
|
||||
import styled from '@emotion/styled';
|
||||
import { mq } from '../utils';
|
||||
|
||||
const StyledBlurredSection = styled('section')`
|
||||
text-align: center;
|
||||
border-bottom: 1px solid var(--ifm-border-color);
|
||||
overflow: hidden;
|
||||
.blur {
|
||||
max-width: 635px;
|
||||
width: 100%;
|
||||
margin-top: -70px;
|
||||
margin-bottom: -35px;
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
${mq[1]} {
|
||||
margin-top: -40px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
interface BlurredSectionProps {
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
const BlurredSection = ({ children }: BlurredSectionProps) => {
|
||||
return (
|
||||
<StyledBlurredSection>
|
||||
{children}
|
||||
<img className="blur" src="/img/community/blur.png" alt="Blur" />
|
||||
</StyledBlurredSection>
|
||||
);
|
||||
};
|
||||
|
||||
export default BlurredSection;
|
||||
123
docs/src/components/SectionHeader.tsx
Normal file
123
docs/src/components/SectionHeader.tsx
Normal file
@@ -0,0 +1,123 @@
|
||||
/**
|
||||
* Licensed to the Apache Software Foundation (ASF) under one
|
||||
* or more contributor license agreements. See the NOTICE file
|
||||
* distributed with this work for additional information
|
||||
* regarding copyright ownership. The ASF licenses this file
|
||||
* to you under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance
|
||||
* with the License. You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import styled from '@emotion/styled';
|
||||
import { mq } from '../utils';
|
||||
|
||||
type StyledSectionHeaderProps = {
|
||||
dark: boolean;
|
||||
};
|
||||
|
||||
const StyledSectionHeader = styled('div')<StyledSectionHeaderProps>`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding: 75px 20px 0;
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
${mq[1]} {
|
||||
padding-top: 55px;
|
||||
}
|
||||
.title,
|
||||
.subtitle {
|
||||
color: ${props =>
|
||||
props.dark
|
||||
? 'var(--ifm-font-base-color-inverse)'
|
||||
: 'var(--ifm-font-base-color)'};
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledSectionHeaderH1 = styled(StyledSectionHeader)`
|
||||
.title {
|
||||
font-size: 96px;
|
||||
${mq[1]} {
|
||||
font-size: 46px;
|
||||
}
|
||||
}
|
||||
.line {
|
||||
margin-top: -45px;
|
||||
margin-bottom: 15px;
|
||||
${mq[1]} {
|
||||
margin-top: -20px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
.subtitle {
|
||||
font-size: 30px;
|
||||
line-height: 40px;
|
||||
${mq[1]} {
|
||||
font-size: 25px;
|
||||
line-height: 29px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledSectionHeaderH2 = styled(StyledSectionHeader)`
|
||||
.title {
|
||||
font-size: 48px;
|
||||
${mq[1]} {
|
||||
font-size: 34px;
|
||||
}
|
||||
}
|
||||
.line {
|
||||
margin-top: -15px;
|
||||
margin-bottom: 15px;
|
||||
${mq[1]} {
|
||||
margin-top: -5px;
|
||||
}
|
||||
}
|
||||
.subtitle {
|
||||
font-size: 24px;
|
||||
line-height: 32px;
|
||||
${mq[1]} {
|
||||
font-size: 18px;
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
interface SectionHeaderProps {
|
||||
level: any;
|
||||
title: string;
|
||||
subtitle?: string;
|
||||
dark?: boolean;
|
||||
}
|
||||
|
||||
const SectionHeader = ({
|
||||
level,
|
||||
title,
|
||||
subtitle,
|
||||
dark,
|
||||
}: SectionHeaderProps) => {
|
||||
const Heading = level;
|
||||
|
||||
const StyledRoot =
|
||||
level === 'h1' ? StyledSectionHeaderH1 : StyledSectionHeaderH2;
|
||||
|
||||
return (
|
||||
<StyledRoot dark={!!dark}>
|
||||
<Heading className="title">{title}</Heading>
|
||||
<img className="line" src="/img/community/line.png" alt="line" />
|
||||
{subtitle && <p className="subtitle">{subtitle}</p>}
|
||||
</StyledRoot>
|
||||
);
|
||||
};
|
||||
|
||||
export default SectionHeader;
|
||||
@@ -20,103 +20,211 @@ 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/list.html?dev@superset.apache.org',
|
||||
'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',
|
||||
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/list.html?dev@superset.apache.org',
|
||||
title: 'dev@ Mailing List',
|
||||
description:
|
||||
'Participate in conversations with committers and contributors.',
|
||||
image: 'email-symbol.png',
|
||||
ariaLabel:
|
||||
'Participate in conversations with committers and contributors on Superset mailing list',
|
||||
},
|
||||
{
|
||||
url: 'https://stackoverflow.com/questions/tagged/superset+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',
|
||||
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',
|
||||
},
|
||||
{
|
||||
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',
|
||||
ariaLabel: 'Learn how to contribute and best practices on Superset GitHub',
|
||||
},
|
||||
];
|
||||
|
||||
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: var(--ifm-off-section-background);
|
||||
border-bottom: 1px solid var(--ifm-border-color);
|
||||
.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: var(--ifm-secondary-text);
|
||||
margin-top: -8px;
|
||||
margin-bottom: 23px;
|
||||
${mq[1]} {
|
||||
font-size: 17px;
|
||||
line-height: 22px;
|
||||
color: var(--ifm-primary-text);
|
||||
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, ariaLabel }) => (
|
||||
<List.Item className="item">
|
||||
<List.Item.Meta
|
||||
avatar={
|
||||
<a
|
||||
className="title"
|
||||
href={url}
|
||||
target="_blank"
|
||||
aria-label={ariaLabel}
|
||||
>
|
||||
<img className="icon" src={`/img/community/${image}`} />
|
||||
</a>
|
||||
}
|
||||
title={
|
||||
<a className="title" href={url} target="_blank">
|
||||
{title}
|
||||
</a>
|
||||
}
|
||||
description={<p className="description">{description}</p>}
|
||||
role="group"
|
||||
aria-label="Community link"
|
||||
/>
|
||||
</List.Item>
|
||||
)}
|
||||
/>
|
||||
</StyledJoinCommunity>
|
||||
<BlurredSection>
|
||||
<SectionHeader
|
||||
level="h2"
|
||||
title="Superset Community Calendar"
|
||||
subtitle="Join us for live demos, meetups, discussions, and more!"
|
||||
/>
|
||||
<StyledCalendarIframe
|
||||
src="https://calendar.google.com/calendar/embed?src=superset.committers%40gmail.com&ctz=America%2FLos_Angeles"
|
||||
frameBorder="0"
|
||||
scrolling="no"
|
||||
/>
|
||||
</BlurredSection>
|
||||
<BlurredSection>
|
||||
<SectionHeader level="h2" title="Newsletter Archive" />
|
||||
<StyledNewsletterIframe
|
||||
src="https://preset.io/embed/newsletter/"
|
||||
frameBorder="0"
|
||||
scrolling="no"
|
||||
/>
|
||||
</BlurredSection>
|
||||
</main>
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -18,10 +18,35 @@
|
||||
*/
|
||||
|
||||
export const Databases = [
|
||||
{
|
||||
title: 'PostgreSQL',
|
||||
href: 'https://www.postgresql.org/',
|
||||
imgName: 'postgresql.svg',
|
||||
},
|
||||
{
|
||||
title: 'BigQuery',
|
||||
href: 'https://cloud.google.com/bigquery/',
|
||||
imgName: 'google-big-query.svg',
|
||||
},
|
||||
{
|
||||
title: 'Snowflake',
|
||||
href: 'https://www.snowflake.com/',
|
||||
imgName: 'snowflake.svg',
|
||||
},
|
||||
{
|
||||
title: 'MySQL',
|
||||
href: 'https://www.mysql.com/',
|
||||
imgName: 'mysql.jpg',
|
||||
},
|
||||
{
|
||||
title: 'Amazon Redshift',
|
||||
href: 'https://aws.amazon.com/redshift/',
|
||||
imgName: 'aws-redshift.png',
|
||||
imgName: 'amazon-redshift.jpg',
|
||||
},
|
||||
{
|
||||
title: 'Amazon Athena',
|
||||
href: 'https://aws.amazon.com/pt/athena/',
|
||||
imgName: 'amazon-athena.jpg',
|
||||
},
|
||||
{
|
||||
title: 'Apache Druid',
|
||||
@@ -29,133 +54,67 @@ export const Databases = [
|
||||
imgName: 'druid.png',
|
||||
},
|
||||
{
|
||||
title: 'Apache Kylin',
|
||||
href: 'http://kylin.apache.org/',
|
||||
imgName: 'apache-kylin.png',
|
||||
title: 'Databricks',
|
||||
href: 'https://www.databricks.com',
|
||||
imgName: 'databricks.png',
|
||||
},
|
||||
{
|
||||
title: 'BigQuery',
|
||||
href: 'https://cloud.google.com/bigquery/',
|
||||
imgName: 'googleBQ.png',
|
||||
title: 'Google Sheets',
|
||||
href: 'https://www.google.com/sheets/about/',
|
||||
imgName: 'google-sheets.svg',
|
||||
},
|
||||
{
|
||||
title: 'CSV',
|
||||
imgName: 'csv.svg',
|
||||
},
|
||||
{
|
||||
title: 'ClickHouse',
|
||||
href: 'https://clickhouse.tech/',
|
||||
imgName: 'clickhouse.png',
|
||||
},
|
||||
{
|
||||
title: 'Rockset',
|
||||
href: 'https://rockset.com/',
|
||||
imgName: 'rockset.png',
|
||||
},
|
||||
{
|
||||
title: 'Dremio',
|
||||
href: 'https://dremio.com/',
|
||||
imgName: 'dremio.png',
|
||||
},
|
||||
{
|
||||
title: 'Databricks',
|
||||
href: 'https://www.databricks.com',
|
||||
imgName: 'databricks.png',
|
||||
},
|
||||
{
|
||||
title: 'Exasol',
|
||||
href: 'https://www.exasol.com/en/',
|
||||
imgName: 'exasol.png',
|
||||
},
|
||||
{
|
||||
title: 'FireBirdSql',
|
||||
href: 'https://firebirdsql.org/',
|
||||
imgName: 'firebird.png',
|
||||
},
|
||||
{
|
||||
title: 'Green Plum',
|
||||
href: 'https://greenplum.org/',
|
||||
imgName: 'greenplum.png',
|
||||
},
|
||||
{
|
||||
title: 'IBM Db2',
|
||||
href: 'https://www.ibm.com/analytics/db2',
|
||||
imgName: 'ibmdb2.png',
|
||||
},
|
||||
{
|
||||
title: 'MySQL',
|
||||
href: 'https://www.mysql.com/',
|
||||
imgName: 'mysql.png',
|
||||
},
|
||||
{
|
||||
title: 'Microsoft SqlServer',
|
||||
href: 'https://www.microsoft.com/en-us/sql-server',
|
||||
imgName: 'msql.png',
|
||||
},
|
||||
{
|
||||
title: 'MonetDB',
|
||||
href: 'https://www.monetdb.org/',
|
||||
imgName: 'monet.png',
|
||||
},
|
||||
{
|
||||
title: 'Oracle',
|
||||
href: 'https://www.oracle.com/database/',
|
||||
imgName: 'oraclelogo.png',
|
||||
},
|
||||
{
|
||||
title: 'PostgresSQL',
|
||||
href: 'https://www.postgresql.org/',
|
||||
imgName: 'postsql.png',
|
||||
},
|
||||
{
|
||||
title: 'Presto',
|
||||
href: 'https://prestodb.io/',
|
||||
imgName: 'presto-og.png',
|
||||
},
|
||||
{
|
||||
title: 'Snowflake',
|
||||
href: 'https://www.snowflake.com/',
|
||||
imgName: 'snowflake.png',
|
||||
},
|
||||
{
|
||||
title: 'SQLite',
|
||||
href: 'https://www.sqlite.org/index.html',
|
||||
imgName: 'sqlite.png',
|
||||
},
|
||||
{
|
||||
title: 'Trino',
|
||||
href: 'https://trino.io/',
|
||||
imgName: 'trino2.jpg',
|
||||
},
|
||||
{
|
||||
title: 'Rockset',
|
||||
href: 'https://rockset.com/',
|
||||
imgName: 'rockset.png',
|
||||
title: 'Oracle',
|
||||
href: 'https://www.oracle.com/database/',
|
||||
imgName: 'oraclelogo.png',
|
||||
},
|
||||
{
|
||||
title: 'Vertica',
|
||||
href: 'https://www.vertica.com/',
|
||||
imgName: 'vertica.png',
|
||||
title: 'Apache Pinot',
|
||||
href: 'https://pinot.apache.org/',
|
||||
imgName: 'apache-pinot.svg',
|
||||
},
|
||||
{
|
||||
title: 'Hologres',
|
||||
href: 'https://www.alibabacloud.com/product/hologres',
|
||||
imgName: 'hologres.png',
|
||||
title: 'Presto',
|
||||
href: 'https://prestodb.io/',
|
||||
imgName: 'presto-og.png',
|
||||
},
|
||||
{
|
||||
title: 'IBM Netezza Performance Server',
|
||||
href: 'https://www.ibm.com/products/netezza',
|
||||
imgName: 'netezza.png',
|
||||
title: 'IBM Db2',
|
||||
href: 'https://www.ibm.com/analytics/db2',
|
||||
imgName: 'ibmdb2.png',
|
||||
},
|
||||
{
|
||||
title: 'Teradata',
|
||||
href: "www.teradata.com",
|
||||
imgName: 'teradata.png'
|
||||
title: 'SAP Hana',
|
||||
href: 'https://www.sap.com/products/technology-platform/hana.html',
|
||||
imgName: 'sap-hana.jpg',
|
||||
},
|
||||
{
|
||||
title: 'TimescaleDB',
|
||||
href: "www.timescale.com",
|
||||
imgName: 'timescale.png'
|
||||
title: 'Microsoft SqlServer',
|
||||
href: 'https://www.microsoft.com/en-us/sql-server',
|
||||
imgName: 'msql.png',
|
||||
},
|
||||
{
|
||||
title: 'YugabyteDB',
|
||||
href: "www.yugabyte.com",
|
||||
imgName: 'yugabyte.png'
|
||||
},
|
||||
{
|
||||
title: 'StarRocks',
|
||||
href: "www.starrocks.io",
|
||||
imgName: 'starrocks.png'
|
||||
}
|
||||
];
|
||||
|
||||
@@ -24,7 +24,7 @@
|
||||
*/
|
||||
|
||||
/* You can override the default Infima variables here. */
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter&display=swap');
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
|
||||
|
||||
:root {
|
||||
--ifm-color-primary: #20a7c9;
|
||||
@@ -34,80 +34,17 @@
|
||||
--ifm-color-primary-light: #79cade;
|
||||
--ifm-color-primary-lighter: #a5dbe9;
|
||||
--ifm-color-primary-lightest: #d2edf4;
|
||||
--ifm-font-base-color: #484848;
|
||||
--ifm-font-base-color-inverse: #ffffff;
|
||||
--ifm-code-font-size: 95%;
|
||||
--ifm-menu-link-padding-vertical: 12px;
|
||||
--doc-sidebar-width: 350px !important;
|
||||
--ifm-navbar-height: none;
|
||||
--ifm-font-family-base: Inter;
|
||||
}
|
||||
body {
|
||||
font-family: Inter !important;
|
||||
}
|
||||
.DocSearch-Button .DocSearch-Button-Key {
|
||||
display: none;
|
||||
}
|
||||
.github-logo-container {
|
||||
background-image: url('/img/github.png');
|
||||
background-size: contain;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.theme-doc-toc-desktop {
|
||||
position: fixed !important;
|
||||
}
|
||||
|
||||
.docusaurus-highlight-code-line {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
display: block;
|
||||
margin: 0 calc(-1 * var(--ifm-pre-padding));
|
||||
padding: 0 var(--ifm-pre-padding);
|
||||
}
|
||||
|
||||
html[data-theme='dark'] .docusaurus-highlight-code-line {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.navbar__logo {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.navbar-sidebar__brand {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.menu,
|
||||
.navbar {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Hacks to disable Swagger UI's "try it out" interactive mode */
|
||||
.try-out,
|
||||
.auth-wrapper,
|
||||
.information-container {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.swagger-ui table td,
|
||||
.swagger-ui table th,
|
||||
.swagger-ui table tr {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.markdown h2:first-child {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 800px) {
|
||||
.navbar__logo {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
a > span > svg {
|
||||
display: none;
|
||||
--ifm-font-family-base: Roboto;
|
||||
--ifm-footer-background-color: #173036;
|
||||
--ifm-footer-color: #87939a;
|
||||
--ifm-off-section-background: #fbfbfb;
|
||||
--ifm-border-color: #ededed;
|
||||
--ifm-primary-text: #484848;
|
||||
--ifm-secondary-text: #5f5f5f;
|
||||
}
|
||||
|
||||
@@ -19,3 +19,242 @@
|
||||
@import '~antd/lib/style/themes/default.less';
|
||||
@import '~antd/dist/antd.less'; // Import Ant Design styles by less entry
|
||||
@import 'antd-theme.less';
|
||||
|
||||
body {
|
||||
font-family: var(--ifm-font-family-base);
|
||||
color: var(--ifm-font-base-color);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: var(--ifm-font-base-color);
|
||||
font-weight: var(--ifm-heading-font-weight);
|
||||
}
|
||||
|
||||
.under-navbar {
|
||||
margin-top: -67px;
|
||||
}
|
||||
|
||||
.theme-doc-toc-desktop {
|
||||
position: fixed !important;
|
||||
}
|
||||
|
||||
.docusaurus-highlight-code-line {
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
display: block;
|
||||
margin: 0 calc(-1 * var(--ifm-pre-padding));
|
||||
padding: 0 var(--ifm-pre-padding);
|
||||
}
|
||||
|
||||
html[data-theme='dark'] .docusaurus-highlight-code-line {
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.menu {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* Hacks to disable Swagger UI's "try it out" interactive mode */
|
||||
.try-out,
|
||||
.auth-wrapper,
|
||||
.information-container {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.swagger-ui table td,
|
||||
.swagger-ui table th,
|
||||
.swagger-ui table tr {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.markdown h2:first-child {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
a > span > svg {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Default button */
|
||||
|
||||
.default-button-theme {
|
||||
display: block;
|
||||
background: linear-gradient(180deg, #20a7c9 0%, #0c8fae 100%);
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
&::before {
|
||||
border-radius: inherit;
|
||||
background: linear-gradient(180deg, #11b0d8 0%, #116f86 100%);
|
||||
content: '';
|
||||
display: block;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
opacity: 0;
|
||||
width: 100%;
|
||||
z-index: -1;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
&:hover {
|
||||
color: #ffffff;
|
||||
&::before {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Navbar */
|
||||
|
||||
.navbar {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
background-color: #fff;
|
||||
|
||||
.get-started-button {
|
||||
border-radius: 10px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
width: 142px;
|
||||
padding: 7px 0;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.github-button {
|
||||
background-image: url('/img/github.png');
|
||||
background-size: contain;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar--dark {
|
||||
background-color: transparent;
|
||||
border-bottom: 1px solid rgba(24, 115, 132, 0.4);
|
||||
|
||||
.github-button {
|
||||
background-image: url('/img/github-dark.png');
|
||||
}
|
||||
}
|
||||
|
||||
.navbar__logo {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.dropdown > .navbar__link::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.navbar-sidebar__brand {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 996px) {
|
||||
.navbar {
|
||||
padding-right: 8px;
|
||||
padding-left: 8px;
|
||||
|
||||
.get-started-button,
|
||||
.github-button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar__items {
|
||||
flex-direction: row-reverse;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.navbar__logo {
|
||||
height: 48px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
|
||||
.navbar-sidebar {
|
||||
left: auto;
|
||||
right: 0;
|
||||
transform: translate3d(100%, 0, 0);
|
||||
}
|
||||
|
||||
/* Search Bar */
|
||||
|
||||
.navbar .DocSearch {
|
||||
--docsearch-text-color: #187384;
|
||||
--docsearch-muted-color: #187384;
|
||||
--docsearch-searchbox-background: #fff;
|
||||
border: 1px solid #187384;
|
||||
border-radius: 10px;
|
||||
|
||||
&.DocSearch-Button {
|
||||
width: 225px;
|
||||
}
|
||||
|
||||
.DocSearch-Search-Icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.DocSearch-Button-Key,
|
||||
.DocSearch-Button-Placeholder {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar--dark .DocSearch {
|
||||
--docsearch-searchbox-background: #1d3d46;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 996px) {
|
||||
.navbar .DocSearch.DocSearch-Button {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
|
||||
.footer {
|
||||
position: relative;
|
||||
padding-top: 90px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.footer__applitools {
|
||||
background-color: #0d3e49;
|
||||
color: #e1e1e1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 16px 0;
|
||||
|
||||
img {
|
||||
height: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
.footer__divider {
|
||||
margin: 10px auto 25px;
|
||||
}
|
||||
|
||||
.footer small {
|
||||
font-size: 13px;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
max-width: 830px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 996px) {
|
||||
.footer__applitools img {
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user