StardustXR/website
1
0
Fork 0
Code Issues 3 Pull Requests 4 Actions Packages Projects Releases Wiki Activity

Use tabs instead of spaces

Browse Source
This commit is contained in:
technobaboo
2021-07-21 17:05:35 -05:00
parent c2cbb96cfe
commit c825bb71e5
10 changed files with 5683 additions and 5694 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
src/components/HomepageFeatures.js
View File

@@ -3,62 +3,51 @@ import clsx from 'clsx';
import styles from './HomepageFeatures.module.css';
const FeatureList = [
{
title: 'Easy to Use',
Svg: require('../../static/img/undraw_docusaurus_mountain.svg').default,
description: (
<>
Docusaurus was designed from the ground up to be easily installed and
used to get your website up and running quickly.
</>
),
},
{
title: 'Focus on What Matters',
Svg: require('../../static/img/undraw_docusaurus_tree.svg').default,
description: (
<>
Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
ahead and move your docs into the <code>docs</code> directory.
</>
),
},
{
title: 'Powered by React',
Svg: require('../../static/img/undraw_docusaurus_react.svg').default,
description: (
<>
Extend or customize your website layout by reusing React. Docusaurus can
be extended while reusing the same header and footer.
</>
),
},
{
title: 'Flexible',
image: '../../static/img/icon.gif',
description: (
<>
Stardust allows you to make XR widgets or interfaces and run them among others.
</>
),
},
{
title: 'Focus on What Matters',
image: '../../static/img/icon.gif',
description: (
<>
Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
ahead and move your docs into the <code>docs</code> directory.
</>
),
},
];
function Feature({Svg, title, description}) {
return (
<div className={clsx('col col--4')}>
<div className="text--center">
<Svg className={styles.featureSvg} alt={title} />
</div>
<div className="text--center padding-horiz--md">
<h3>{title}</h3>
<p>{description}</p>
</div>
</div>
);
function Feature({image, title, description}) {
return (
<div className={clsx('col col--6')}>
<div className="text--center">
<img src={image} className={styles.featureImg} alt={title} />
</div>
<div className="text--center padding-horiz--md">
<h3>{title}</h3>
<p>{description}</p>
</div>
</div>
);
}
export default function HomepageFeatures() {
return (
<section className={styles.features}>
<div className="container">
<div className="row">
{FeatureList.map((props, idx) => (
<Feature key={idx} {...props} />
))}
</div>
</div>
</section>
);
return (
<section className={styles.features}>
<div className="container">
<div className="row">
{FeatureList.map((props, idx) => (
<Feature key={idx} {...props} />
))}
</div>
</div>
</section>
);
}

14
src/components/HomepageFeatures.module.css
View File

@@ -1,13 +1,13 @@
/* stylelint-disable docusaurus/copyright-header */
.features {
display: flex;
align-items: center;
padding: 2rem 0;
width: 100%;
display: flex;
align-items: center;
padding: 2rem 0;
width: 100%;
}
.featureSvg {
height: 200px;
width: 200px;
.featureImg {
height: 200px;
width: 200px;
}

26
src/css/custom.css
View File

@@ -7,23 +7,23 @@
/* You can override the default Infima variables here. */
:root {
--ifm-color-primary: #dde000;
--ifm-color-primary-dark: rgb(175, 173, 33);
--ifm-color-primary-darker: rgb(165, 163, 31);
--ifm-color-primary-darkest: rgb(134, 136, 26);
--ifm-color-primary-light: rgb(201, 203, 70);
--ifm-color-primary-lighter: rgb(212, 210, 102);
--ifm-color-primary-lightest: rgb(223, 224, 146);
--ifm-code-font-size: 95%;
--ifm-color-primary: #dde000;
--ifm-color-primary-dark: rgb(175, 173, 33);
--ifm-color-primary-darker: rgb(165, 163, 31);
--ifm-color-primary-darkest: rgb(134, 136, 26);
--ifm-color-primary-light: rgb(201, 203, 70);
--ifm-color-primary-lighter: rgb(212, 210, 102);
--ifm-color-primary-lightest: rgb(223, 224, 146);
--ifm-code-font-size: 95%;
}
.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);
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);
background-color: rgba(0, 0, 0, 0.3);
}

52
src/pages/index.js
View File

@@ -7,33 +7,33 @@ import styles from './index.module.css';
import HomepageFeatures from '../components/HomepageFeatures';
function HomepageHeader() {
const {siteConfig} = useDocusaurusContext();
return (
<header className={clsx('hero hero--primary', styles.heroBanner)}>
<div className="container">
<h1 className="hero__title">{siteConfig.title}</h1>
<p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className="button button--secondary button--lg"
to="/docs/stardust-protocol/protocol">
Protocol API Reference
</Link>
</div>
</div>
</header>
);
const {siteConfig} = useDocusaurusContext();
return (
<header className={clsx('hero hero--primary', styles.heroBanner)}>
<div className="container">
<h1 className="hero__title">{siteConfig.title}</h1>
<p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className="button button--secondary button--lg"
to="/docs/stardust-protocol/protocol">
Protocol API Reference
</Link>
</div>
</div>
</header>
);
}
export default function Home() {
const {siteConfig} = useDocusaurusContext();
return (
<Layout
description="XR Display Server">
<HomepageHeader />
<main>
<HomepageFeatures />
</main>
</Layout>
);
const {siteConfig} = useDocusaurusContext();
return (
<Layout
description="XR Display Server">
<HomepageHeader />
<main>
<HomepageFeatures />
</main>
</Layout>
);
}

20
src/pages/index.module.css
View File

@@ -6,20 +6,20 @@
*/
.heroBanner {
padding: 4rem 0;
text-align: center;
position: relative;
overflow: hidden;
padding: 4rem 0;
text-align: center;
position: relative;
overflow: hidden;
}
@media screen and (max-width: 966px) {
.heroBanner {
padding: 2rem;
}
.heroBanner {
padding: 2rem;
}
}
.buttons {
display: flex;
align-items: center;
justify-content: center;
display: flex;
align-items: center;
justify-content: center;
}