mirror of
https://github.com/apache/superset.git
synced 2026-04-25 19:14:27 +00:00
feat: 🚀 Docs V2 CI Script (#18560)
* switch to v2 * promote docv2 * remove on triggers
This commit is contained in:
Hugh A. Miles II
@@ -1,62 +0,0 @@
|
||||
/**
|
||||
* 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 { Anchor } from 'antd';
|
||||
import { useMenus } from 'docz';
|
||||
import { css } from '@emotion/core';
|
||||
import { getActiveMenuItem, mq } from '../utils';
|
||||
|
||||
const { Link } = Anchor;
|
||||
const anchorNavStyle = css`
|
||||
|
||||
${[mq[3]]} {
|
||||
display: none;
|
||||
}
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
right: 0;
|
||||
width: 250px;
|
||||
padding: 16px;
|
||||
height: 605px;
|
||||
overflow: auto;
|
||||
ul {
|
||||
font-size: 12px;
|
||||
li {
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const HeaderNav = () => {
|
||||
const menus = useMenus();
|
||||
const { headings } = getActiveMenuItem(menus);
|
||||
return (
|
||||
<div css={anchorNavStyle}>
|
||||
<Anchor>
|
||||
{headings.map((e) => (
|
||||
<Link key={e.slug} href={`#${e.slug}`} title={e.value} />
|
||||
))}
|
||||
</Anchor>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default HeaderNav;
|
||||
@@ -1,49 +0,0 @@
|
||||
/**
|
||||
* 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 { useStaticQuery, graphql } from 'gatsby';
|
||||
import Img from 'gatsby-image';
|
||||
|
||||
interface Props {
|
||||
imageName?: string;
|
||||
}
|
||||
|
||||
const DbImage = ({ imageName }: Props) => {
|
||||
const data = useStaticQuery(graphql`
|
||||
query {
|
||||
allImages: allFile(filter: {relativeDirectory: {eq: "src/images/databases"}}) {
|
||||
edges {
|
||||
node {
|
||||
childImageSharp {
|
||||
fixed(height: 50) {
|
||||
...GatsbyImageSharpFixed
|
||||
originalName
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`);
|
||||
const images = data.allImages.edges.map((img) => img.node?.childImageSharp?.fixed);
|
||||
const filter = images.filter((img) => img?.originalName === imageName);
|
||||
return <Img fixed={filter[0]} />;
|
||||
};
|
||||
|
||||
export default DbImage;
|
||||
@@ -1,58 +0,0 @@
|
||||
/**
|
||||
* 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 { useMenus, Link } from 'docz';
|
||||
import { Menu } from 'antd';
|
||||
import { getActiveMenuItem } from '../utils';
|
||||
|
||||
const { SubMenu } = Menu;
|
||||
|
||||
export default () => {
|
||||
const menus = useMenus();
|
||||
const { openKey, selectedKey } = getActiveMenuItem(menus);
|
||||
return (
|
||||
<Menu
|
||||
mode="inline"
|
||||
defaultOpenKeys={[openKey]}
|
||||
defaultSelectedKeys={[selectedKey]}
|
||||
className="docSearch-sidebar"
|
||||
>
|
||||
{menus.map((menuItem) => {
|
||||
if (menuItem.menu?.length > 0) {
|
||||
return (
|
||||
<SubMenu key={menuItem.id} title={menuItem.name}>
|
||||
{menuItem.menu
|
||||
.sort((a, b) => a.index - b.index)
|
||||
.map((submenuItem) => (
|
||||
<Menu.Item key={submenuItem.id}>
|
||||
<Link to={submenuItem.route}>{submenuItem.name}</Link>
|
||||
</Menu.Item>
|
||||
))}
|
||||
</SubMenu>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Menu.Item key={menuItem.id}>
|
||||
<Link to={menuItem.route}>{menuItem.name}</Link>
|
||||
</Menu.Item>
|
||||
);
|
||||
})}
|
||||
</Menu>
|
||||
);
|
||||
};
|
||||
@@ -1,156 +0,0 @@
|
||||
/**
|
||||
* 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 { Drawer, Layout, Menu } from 'antd';
|
||||
import { Link } from 'gatsby';
|
||||
import { MenuOutlined, GithubOutlined } from '@ant-design/icons';
|
||||
import { css } from '@emotion/core';
|
||||
import { getCurrentPath, mq } from '../utils';
|
||||
import logoSvg from '../images/superset-logo-horiz.svg';
|
||||
|
||||
const menuResponsiveIndex = 1;
|
||||
|
||||
const headerStyle = css`
|
||||
background-color: rgb(255,255,255, 0.9);
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.12);
|
||||
z-index: 1;
|
||||
.ant-menu {
|
||||
background: transparent;
|
||||
}
|
||||
.menu-icon {
|
||||
vertical-align: middle;
|
||||
font-size: 24px;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
}
|
||||
.ant-menu-horizontal {
|
||||
border-bottom: none;
|
||||
}
|
||||
.menu-sm {
|
||||
display: none;
|
||||
}
|
||||
.ant-menu-horizontal:not(.ant-menu-dark)>.ant-menu-item-selected {
|
||||
border-bottom: 2px solid #20A7C9;
|
||||
}
|
||||
${[mq[menuResponsiveIndex]]} {
|
||||
.menu-sm {
|
||||
display: block;
|
||||
}
|
||||
.menu-lg {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
`;
|
||||
const logoStyle = css`
|
||||
float: left;
|
||||
margin-top: 6px;
|
||||
height: 50px;
|
||||
`;
|
||||
|
||||
interface menuProps {
|
||||
mode: string;
|
||||
toggleDrawer: () => null;
|
||||
}
|
||||
|
||||
const MenuItems = ({ mode, toggleDrawer }: menuProps) => {
|
||||
let leftStyle = { float: 'left' };
|
||||
let rightStyle = { float: 'right' };
|
||||
if (mode === 'vertical') {
|
||||
leftStyle = null;
|
||||
rightStyle = null;
|
||||
}
|
||||
return (
|
||||
<Menu mode={mode} selectedKeys={getCurrentPath()}>
|
||||
<Menu.Item key="docsintro" style={leftStyle} className="menu-lg">
|
||||
<Link to="/docs/intro">Documentation</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item key="gallery" style={leftStyle} className="menu-lg">
|
||||
<Link to="/gallery">Gallery</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item key="community" style={leftStyle} className="menu-lg">
|
||||
<Link to="/community">Community</Link>
|
||||
</Menu.Item>
|
||||
<Menu.Item key="resources" style={leftStyle} className="menu-lg">
|
||||
<Link to="/resources"> Resources</Link>
|
||||
</Menu.Item>
|
||||
{toggleDrawer && (
|
||||
<Menu.Item style={rightStyle} className="menu-sm">
|
||||
<MenuOutlined onClick={toggleDrawer} className="menu-icon" />
|
||||
</Menu.Item>
|
||||
)}
|
||||
{mode === 'horizontal'
|
||||
&& (
|
||||
<Menu.Item key="github" style={rightStyle}>
|
||||
<a href="https://github.com/apache/superset" target="_blank" rel="noreferrer">
|
||||
<GithubOutlined className="menu-icon" />
|
||||
</a>
|
||||
</Menu.Item>
|
||||
)}
|
||||
</Menu>
|
||||
);
|
||||
};
|
||||
|
||||
export default class MainMenu extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
visible: false,
|
||||
};
|
||||
this.toggleDrawer = this.toggleDrawer.bind(this);
|
||||
this.onClose = this.onClose.bind(this);
|
||||
}
|
||||
|
||||
onClose() {
|
||||
this.setState({
|
||||
visible: false,
|
||||
});
|
||||
}
|
||||
|
||||
toggleDrawer() {
|
||||
this.setState((prevState) => ({
|
||||
visible: !prevState.visible,
|
||||
}));
|
||||
}
|
||||
|
||||
render() {
|
||||
const { visible } = this.state;
|
||||
return (
|
||||
<Layout.Header css={headerStyle}>
|
||||
<a href="/">
|
||||
<img height="50" css={logoStyle} src={logoSvg} alt="logo" />
|
||||
</a>
|
||||
<MenuItems toggleDrawer={this.toggleDrawer} mode="horizontal" />
|
||||
<Drawer
|
||||
title="Menu"
|
||||
placement="right"
|
||||
closable={false}
|
||||
onClose={this.onClose}
|
||||
visible={visible}
|
||||
>
|
||||
<MenuItems mode="vertical" />
|
||||
</Drawer>
|
||||
</Layout.Header>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,180 +0,0 @@
|
||||
/**
|
||||
* 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 { Layout } from 'antd';
|
||||
import { css } from '@emotion/core';
|
||||
import { GithubOutlined, SlackSquareOutlined } from '@ant-design/icons';
|
||||
|
||||
const { Footer } = Layout;
|
||||
|
||||
const footerStyle = css`
|
||||
background-color: #323232;
|
||||
text-align: center;
|
||||
color: #ccc;
|
||||
padding: 10px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
`;
|
||||
|
||||
const copyrightStyle = css`
|
||||
font-size: 10px;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
`;
|
||||
const apacheLinksStyle = css`
|
||||
text-align: center;
|
||||
font-size: 10px;
|
||||
a {
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
margin: 5px;
|
||||
}
|
||||
`;
|
||||
const iconContainerStyle = css`
|
||||
padding: 10px;
|
||||
background-color: #323232;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.icons {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
svg {
|
||||
margin-top: 15px;
|
||||
color: #ccc;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin: 0 15px;
|
||||
}
|
||||
.svg {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: -15px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const LayoutFooter = () => (
|
||||
<Footer css={footerStyle}>
|
||||
<div css={iconContainerStyle}>
|
||||
<div className="icons">
|
||||
<a
|
||||
href="https://join.slack.com/t/apache-superset/shared_invite/zt-uxbh5g36-AISUtHbzOXcu0BIj7kgUaw"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<SlackSquareOutlined className="icon" />
|
||||
</a>
|
||||
<a
|
||||
href="https://github.com/apache/superset"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<GithubOutlined className="icon" />
|
||||
</a>
|
||||
<a
|
||||
href="https://stackoverflow.com/questions/tagged/apache-superset+superset"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
<img
|
||||
alt="StackOverflow"
|
||||
src="/images/so-icon.svg"
|
||||
className="icon svg"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div css={copyrightStyle}>
|
||||
© Copyright
|
||||
{' '}
|
||||
{new Date().getFullYear()}
|
||||
,
|
||||
<a href="http://www.apache.org/" target="_blank" rel="noreferrer">
|
||||
The Apache Software Foundation
|
||||
</a>
|
||||
, Licensed under the Apache
|
||||
<a
|
||||
href="https://apache.org/licenses/LICENSE-2.0"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
License.
|
||||
</a>
|
||||
{' '}
|
||||
<div>
|
||||
Apache Superset, Apache, Superset, the Superset logo, and the Apache
|
||||
feather logo are either registered trademarks or trademarks of The
|
||||
Apache Software Foundation. All other products or name brands
|
||||
are trademarks of their respective holders, including The Apache
|
||||
Software Foundation.
|
||||
</div>
|
||||
</div>
|
||||
<div css={apacheLinksStyle} className="apacheLinks">
|
||||
<a
|
||||
href="https://www.apache.org/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Apache Software Foundation
|
||||
</a>
|
||||
resources
|
||||
<br />
|
||||
<a
|
||||
href="https://www.apache.org/security/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Security
|
||||
</a>
|
||||
{' | '}
|
||||
<a
|
||||
href="https://www.apache.org/foundation/sponsorship.html"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Donate
|
||||
</a>
|
||||
{' | '}
|
||||
<a
|
||||
href="https://www.apache.org/foundation/thanks.html"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Thanks
|
||||
</a>
|
||||
{' | '}
|
||||
<a
|
||||
href="https://apache.org/events/current-event"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
Events
|
||||
</a>
|
||||
{' | '}
|
||||
<a
|
||||
href="https://apache.org/licenses/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
>
|
||||
License
|
||||
</a>
|
||||
</div>
|
||||
</Footer>
|
||||
);
|
||||
|
||||
export default LayoutFooter;
|
||||
@@ -1,82 +0,0 @@
|
||||
/**
|
||||
* 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 { useStaticQuery, graphql } from 'gatsby';
|
||||
import Img from 'gatsby-image';
|
||||
|
||||
interface Props {
|
||||
imageName?: string;
|
||||
width?: string;
|
||||
height?: string;
|
||||
otherProps?: any;
|
||||
}
|
||||
|
||||
const Image = ({
|
||||
imageName, width, height, ...otherProps
|
||||
}: Props) => {
|
||||
const data = useStaticQuery(graphql`
|
||||
query {
|
||||
logoSm: file(relativePath: { eq: "src/images/s.png" }) {
|
||||
childImageSharp {
|
||||
fixed(height: 30) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
logoLg: file(relativePath: { eq: "src/images/s.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 150) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
stackoverflow: file(
|
||||
relativePath: { eq: "src/images/stack_overflow.png" }
|
||||
) {
|
||||
childImageSharp {
|
||||
fixed(width: 60) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
docker: file(relativePath: { eq: "src/images/docker.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 100) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
preset: file(relativePath: { eq: "src/images/preset.png" }) {
|
||||
childImageSharp {
|
||||
fixed(width: 100) {
|
||||
...GatsbyImageSharpFixed
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`);
|
||||
|
||||
return <Img fixed={data[imageName]?.childImageSharp?.fixed} {...otherProps} />;
|
||||
};
|
||||
|
||||
export default Image;
|
||||
@@ -1,160 +0,0 @@
|
||||
/**
|
||||
* 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.
|
||||
*/
|
||||
|
||||
$brandColor: #20A7C9;
|
||||
$bigPad: 60px;
|
||||
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
body {
|
||||
background-color: transparent !important;
|
||||
margin: 0;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
color: black;
|
||||
}
|
||||
|
||||
.ant-layout {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.contentPage {
|
||||
padding-bottom: $bigPad;
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
section {
|
||||
width: 100%;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: $bigPad 0 0 0;
|
||||
font-size: 17px;
|
||||
&:first-of-type{
|
||||
padding: 40px;
|
||||
background-image: linear-gradient(120deg, lighten($brandColor, 45), lighten($brandColor, 15));
|
||||
border-radius: 10px;
|
||||
}
|
||||
}
|
||||
.title{
|
||||
margin-top: $bigPad;
|
||||
}
|
||||
|
||||
.ant-card-body{
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
flex-wrap: wrap;
|
||||
.ant-card-grid-hoverable {
|
||||
cursor: pointer;
|
||||
}
|
||||
h4 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
color: #1985a0;
|
||||
}
|
||||
th, td {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
|
||||
background-color: lighten($brandColor, 42);
|
||||
a:hover {
|
||||
color: #fff;
|
||||
border-bottom: $brandColor;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-menu-item-selected a {
|
||||
color: black;
|
||||
}
|
||||
.ant-menu-submenu-selected,
|
||||
.ant-anchor .ant-anchor-link-active > .ant-anchor-link-title {
|
||||
color: $brandColor;
|
||||
}
|
||||
|
||||
.ant-anchor .ant-anchor-ink-ball {
|
||||
border: 2px solid $brandColor;
|
||||
}
|
||||
|
||||
.ant-menu-submenu,
|
||||
.ant-menu-submenu-title,
|
||||
.ant-anchor-link-title,
|
||||
.ant-menu .ant-menu-item a
|
||||
{
|
||||
&:hover {
|
||||
color:$brandColor;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-anchor .ant-anchor-ink-ball {
|
||||
border: 2px solid $brandColor;
|
||||
}
|
||||
|
||||
.ant-menu-horizontal {
|
||||
&:not(.ant-menu-dark) {
|
||||
& > .ant-menu-item:hover, & > .ant-menu-item-active {
|
||||
color: $brandColor;
|
||||
border-bottom: 2px solid $brandColor;
|
||||
}
|
||||
}
|
||||
|
||||
& >.ant-menu-item-selected {
|
||||
color: $brandColor;
|
||||
border-bottom: 2px solid $brandColor;
|
||||
a {
|
||||
color: $brandColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
tr:nth-child(even) {background-color: #f2f2f2;}
|
||||
|
||||
.centered {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button {
|
||||
background: $brandColor;
|
||||
}
|
||||
.ant-drawer-body {
|
||||
padding: 0px !important;
|
||||
}
|
||||
h1, h2, h3, h4 {
|
||||
font-weight: bold;
|
||||
}
|
||||
h1 {
|
||||
font-size: 40px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 32px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 24px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 16px;
|
||||
}
|
||||
@@ -1,201 +0,0 @@
|
||||
/**
|
||||
* 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, { useState } from 'react';
|
||||
import {
|
||||
Layout, Drawer,
|
||||
} from 'antd';
|
||||
import { css } from '@emotion/core';
|
||||
import { MenuOutlined } from '@ant-design/icons';
|
||||
|
||||
import Footer from './footer';
|
||||
import SEO from './seo';
|
||||
import DoczMenu from './DoczMenu';
|
||||
|
||||
import { getCurrentPath, mq } from '../utils';
|
||||
import MainMenu from './MainMenu';
|
||||
import 'antd/dist/antd.css';
|
||||
import './layout.scss';
|
||||
|
||||
const { Sider } = Layout;
|
||||
|
||||
const leftPaneWidth = 350;
|
||||
|
||||
const layoutStyles = css`
|
||||
font-family: Inter;
|
||||
.ant-layout {
|
||||
background-color: white !important;
|
||||
}
|
||||
Button {
|
||||
background: #20a7c9;
|
||||
border-color: #20a7c9;
|
||||
border-radius: 4px;
|
||||
}
|
||||
`;
|
||||
|
||||
const centerLayoutStyle = css`
|
||||
padding: 25px;
|
||||
min-height: 60vw;
|
||||
overflow: auto;
|
||||
padding-right: 250px;
|
||||
${[mq[3]]} {
|
||||
padding-right: 25px;
|
||||
}
|
||||
.doc-hamburger {
|
||||
display: none;
|
||||
${[mq[2]]} {
|
||||
display: block;
|
||||
}
|
||||
text-align: left;
|
||||
}
|
||||
`;
|
||||
|
||||
const sidebarStyle = css`
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
top: 64px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
border-right: 1px solid #bfbfbf;
|
||||
`;
|
||||
|
||||
const doczLayoutStyle = css`
|
||||
margin-top: 3px;
|
||||
background-color: white;
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
blockquote {
|
||||
color: rgb(132, 146, 166);
|
||||
padding: 10px 30px;
|
||||
margin: 30px 0px;
|
||||
border-radius: 3px;
|
||||
border-left: 4px solid rgb(56, 211, 236);
|
||||
background: rgb(239, 242, 247);
|
||||
}
|
||||
pre {
|
||||
border: solid #00000033 1px;
|
||||
padding: 5px 10px;
|
||||
background-color: #82ef8217;
|
||||
border-radius: 3px;
|
||||
max-width: 800px;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
p {
|
||||
font-size: 16px;
|
||||
}
|
||||
ul {
|
||||
font-size: 16px;
|
||||
}
|
||||
h2, h3 {
|
||||
padding-top: 64px;
|
||||
margin-top: -64px;
|
||||
}
|
||||
`;
|
||||
|
||||
const contentLayoutDocsStyle = css`
|
||||
margin-top: 64px;
|
||||
padding-left: ${leftPaneWidth}px;
|
||||
overflow: visible;
|
||||
${[mq[2]]} {
|
||||
padding-left: 0px;
|
||||
margin-top: 64px;
|
||||
}
|
||||
aside {
|
||||
${[mq[2]]} {
|
||||
display: none;
|
||||
}
|
||||
overflow: auto;
|
||||
}
|
||||
`;
|
||||
const footerHeight = 185;
|
||||
const baseLayoutStyle = css`
|
||||
min-height: 100vh;
|
||||
position: relative;
|
||||
.layout-footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: ${footerHeight}px;
|
||||
overflow: auto; // sorry about this :/
|
||||
background-color: #323232;
|
||||
}
|
||||
.content-wrap {
|
||||
padding-bottom: ${footerHeight}px;
|
||||
}
|
||||
`;
|
||||
|
||||
interface Props {
|
||||
children: React.ReactNode;
|
||||
}
|
||||
|
||||
const AppLayout = ({ children }: Props) => {
|
||||
const [showDrawer, setDrawer] = useState(false);
|
||||
const isOnDocsPage = getCurrentPath().indexOf('docs') > -1;
|
||||
return (
|
||||
<Layout css={layoutStyles}>
|
||||
<SEO title="Welcome" />
|
||||
<MainMenu />
|
||||
{isOnDocsPage ? (
|
||||
<>
|
||||
<Drawer
|
||||
title="Documentation"
|
||||
placement="left"
|
||||
closable={false}
|
||||
onClose={() => setDrawer(false)}
|
||||
visible={showDrawer}
|
||||
getContainer={false}
|
||||
style={{ position: 'absolute' }}
|
||||
>
|
||||
<DoczMenu />
|
||||
</Drawer>
|
||||
<Layout css={contentLayoutDocsStyle}>
|
||||
<Sider width={leftPaneWidth} css={sidebarStyle}>
|
||||
<DoczMenu />
|
||||
</Sider>
|
||||
<Layout css={doczLayoutStyle}>
|
||||
<div css={centerLayoutStyle}>
|
||||
<h1 className="doc-hamburger" onClick={() => setDrawer(true)}>
|
||||
<MenuOutlined
|
||||
className="menu"
|
||||
/>
|
||||
{' '}
|
||||
Documentation
|
||||
</h1>
|
||||
{children}
|
||||
</div>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</>
|
||||
) : (
|
||||
<Layout css={baseLayoutStyle}>
|
||||
<div className="content-wrap">
|
||||
{children}
|
||||
</div>
|
||||
<div className="layout-footer">
|
||||
<Footer />
|
||||
</div>
|
||||
</Layout>
|
||||
)}
|
||||
</Layout>
|
||||
);
|
||||
};
|
||||
|
||||
export default AppLayout;
|
||||
@@ -1,42 +0,0 @@
|
||||
/**
|
||||
* 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 { useMenus } from 'docz';
|
||||
import { getPreviousAndNextUrls } from '../utils';
|
||||
|
||||
const nextButtons = () => {
|
||||
const menus = useMenus();
|
||||
const [prevUrl, nextUrl] = getPreviousAndNextUrls(menus);
|
||||
return (
|
||||
<>
|
||||
{prevUrl && (
|
||||
<a href={prevUrl} className="ant-btn">
|
||||
Prev
|
||||
</a>
|
||||
)}
|
||||
{nextUrl && (
|
||||
<a href={nextUrl} className="ant-btn">
|
||||
Next
|
||||
</a>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default nextButtons;
|
||||
@@ -1,47 +0,0 @@
|
||||
/**
|
||||
* 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 { Select } from 'antd';
|
||||
import querystring from 'querystring';
|
||||
|
||||
const { Option } = Select;
|
||||
|
||||
const versions = ['1', '2'];
|
||||
|
||||
export default function VersionSelect() {
|
||||
const { version } = querystring.parse(window.location.search.substr(1));
|
||||
const handleChange = (e) => {
|
||||
// @ts-ignore
|
||||
window.location = `/docs/intro?version=${e}`;
|
||||
};
|
||||
return (
|
||||
<div>
|
||||
version:
|
||||
<Select
|
||||
defaultValue={version || 1}
|
||||
style={{ width: 120 }}
|
||||
onChange={handleChange}
|
||||
>
|
||||
{versions.map((e) => (
|
||||
<Option value={e}>{e}</Option>
|
||||
))}
|
||||
</Select>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
/**
|
||||
* 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 PropTypes from 'prop-types';
|
||||
import { Helmet } from 'react-helmet';
|
||||
import { useStaticQuery, graphql } from 'gatsby';
|
||||
import favicon from '../images/favicon.png';
|
||||
|
||||
function SEO({
|
||||
description, lang, meta, title,
|
||||
}) {
|
||||
const { site } = useStaticQuery(
|
||||
graphql`
|
||||
query {
|
||||
site {
|
||||
siteMetadata {
|
||||
title
|
||||
description
|
||||
author
|
||||
}
|
||||
}
|
||||
}
|
||||
`,
|
||||
);
|
||||
|
||||
const metaDescription = description || site.siteMetadata.description;
|
||||
|
||||
return (
|
||||
<Helmet
|
||||
htmlAttributes={{
|
||||
lang,
|
||||
}}
|
||||
title={title}
|
||||
titleTemplate={`%s | ${site.siteMetadata.title}`}
|
||||
meta={[
|
||||
{
|
||||
name: 'description',
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: 'og:title',
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
property: 'og:description',
|
||||
content: metaDescription,
|
||||
},
|
||||
{
|
||||
property: 'og:type',
|
||||
content: 'website',
|
||||
},
|
||||
{
|
||||
name: 'twitter:card',
|
||||
content: 'summary',
|
||||
},
|
||||
{
|
||||
name: 'twitter:creator',
|
||||
content: site.siteMetadata.author,
|
||||
},
|
||||
{
|
||||
name: 'twitter:title',
|
||||
content: title,
|
||||
},
|
||||
{
|
||||
name: 'twitter:description',
|
||||
content: metaDescription,
|
||||
},
|
||||
].concat(meta)}
|
||||
>
|
||||
<link rel="icon" href={favicon} />
|
||||
</Helmet>
|
||||
);
|
||||
}
|
||||
|
||||
SEO.defaultProps = {
|
||||
lang: 'en',
|
||||
meta: [],
|
||||
description: '',
|
||||
};
|
||||
|
||||
SEO.propTypes = {
|
||||
description: PropTypes.string,
|
||||
lang: PropTypes.string,
|
||||
meta: PropTypes.arrayOf(PropTypes.object),
|
||||
title: PropTypes.string.isRequired,
|
||||
};
|
||||
|
||||
export default SEO;
|
||||
Reference in New Issue
Block a user