Skip to content

Commit cf92089

Browse files
luzrainluzrain
committed
New landing page
1 parent 0d54253 commit cf92089

File tree

7 files changed

+183
-155
lines changed

7 files changed

+183
-155
lines changed

‎docusaurus.config.js‎

Lines changed: 32 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -88,24 +88,49 @@ const config = {
8888
style: 'light',
8989
links: [
9090
{
91-
title: 'Documentation',
91+
title: 'Guide',
9292
items: [
9393
{
94-
label: 'PHPStreamServer docs',
94+
label: 'What is PHPStreamServer?',
9595
to: '/docs/general/',
9696
},
97+
{
98+
label: 'Quick Start',
99+
to: '/docs/general/quick-start',
100+
},
97101
],
98102
},
99103
{
100-
title: 'Github',
104+
title: 'Plugins',
101105
items: [
102106
{
103-
label: 'PHPStreamServer',
104-
href: 'https://github.com/phpstreamserver/phpstreamserver',
107+
label: 'Http Server',
108+
to: '/docs/plugins/http-server',
109+
},
110+
{
111+
label: 'Scheduler',
112+
to: '/docs/plugins/scheduler',
113+
},
114+
{
115+
label: 'Logger',
116+
to: '/docs/plugins/logger',
117+
},
118+
{
119+
label: 'File Monitor',
120+
to: '/docs/plugins/file-monitor',
121+
},
122+
{
123+
label: 'Metrics',
124+
to: '/docs/plugins/metrics',
105125
},
126+
],
127+
},
128+
{
129+
title: 'Community',
130+
items: [
106131
{
107-
label: 'PHPStreamServer runtime for symfony applications',
108-
href: 'https://github.com/luzrain/phpstreamserver-bundle',
132+
label: 'GitHub',
133+
href: 'https://github.com/phpstreamserver/phpstreamserver',
109134
},
110135
],
111136
},

‎src/components/HomepageFeatures/index.js‎

Lines changed: 0 additions & 85 deletions
This file was deleted.

‎src/components/HomepageFeatures/styles.module.css‎

Lines changed: 0 additions & 18 deletions
This file was deleted.

‎src/components/LandingPage/index.js‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import styles from "./index.module.css";
2+
import Link from "@docusaurus/Link";
3+
import Layout from '@theme/Layout/Provider';
4+
import Footer from '@theme/Footer';
5+
import clsx from 'clsx';
6+
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
7+
import LogoImg from '@site/static/img/phpss-light.svg';
8+
import GithubImg from '@site/static/img/GitHub.svg';
9+
10+
const features = [
11+
{ icon: "🐘", title: "Runs on PHP", description: "No additional software is required—PHPStreamServer runs entirely on PHP. Just install via Composer and get started!" },
12+
{ icon: "⚡", title: "Always-in-memory", description: "Keeps applications loaded in memory for enhanced performance and faster response times." },
13+
{ icon: "🌐", title: "Asynchronous HTTP Server", description: "Built-in HTTP server with support for HTTP/2, HTTPS, GZIP, static file serving, and middleware." },
14+
{ icon: "⚙️", title: "Advanced Worker Management", description: "Includes worker reload strategies based on TTL, memory usage, or exceptions." },
15+
{ icon: "🕒", title: "Flexible Scheduler", description: "Schedule tasks like Cron jobs with customizable intervals." },
16+
{ icon: "📦", title: "Support for External Programs", description: "Manage non-PHP applications alongside PHP workers seamlessly." },
17+
{ icon: "📝", title: "Powerful Logging System", description: "Log to files, Stdout/Stderr, Syslog, or Graylog with advanced log routing." },
18+
{ icon: "📊", title: "Prometheus Metrics Support", description: "Exposes a metrics endpoint for monitoring server performance and tracking custom application metrics." },
19+
{ icon: "📂", title: "File Monitoring for Development", description: "Automatically reloads workers when file changes are detected, perfect for development experience." },
20+
{ icon: "🔌", title: "Plugin System", description: "Extend functionality with built-in plugins or create custom plugins to fit your needs." },
21+
];
22+
23+
const Index = () => {
24+
const {siteConfig} = useDocusaurusContext();
25+
return (
26+
<Layout title={`${siteConfig.title}`} description="High-performance PHP application server and process manager written in PHP">
27+
<header className={clsx('hero', styles.heroBanner)}>
28+
<div className="container">
29+
<LogoImg alt="PHPStreamServer" className={styles.logo}/>
30+
<p className="hero__subtitle">High-performance PHP application server and process manager written in PHP.</p>
31+
<div className={styles.buttons}>
32+
<Link className="button button--secondary button--lg" to="/docs/general/">
33+
Get started
34+
</Link>
35+
<Link className="button button--secondary button--lg" href="https://github.com/phpstreamserver/phpstreamserver">
36+
<div className={styles.githubButtonGroup}>
37+
<GithubImg alt=""/> <span>GitHub</span>
38+
</div>
39+
</Link>
40+
</div>
41+
</div>
42+
</header>
43+
44+
<div className={styles.featuresSection}>
45+
<h2>Features</h2>
46+
<div className={styles.featuresGrid}>
47+
{features.map((feature, index) => (
48+
<div key={index} className={styles.featureCard}>
49+
<div className={styles.featureIcon}>{feature.icon}</div>
50+
<h3 className={styles.featureTitle}>{feature.title}</h3>
51+
<p>{feature.description}</p>
52+
</div>
53+
))}
54+
</div>
55+
</div>
56+
57+
<Footer></Footer>
58+
</Layout>
59+
);
60+
};
61+
62+
export default Index;

‎src/components/LandingPage/index.module.css‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
.heroBanner {
2+
padding: 5rem 0;
3+
text-align: left;
4+
position: relative;
5+
overflow: hidden;
6+
background: linear-gradient(145deg, var(--ifm-hero-background-color) 20%, var(--header-gradient) 100%);
7+
color: var(--ifm-color-gray-1000);
8+
}
9+
10+
@media screen and (max-width: 996px) {
11+
.heroBanner {
12+
padding: 2rem;
13+
}
14+
}
15+
16+
.logo {
17+
height: auto;
18+
max-width: 500px;
19+
min-width: 300px;
20+
width: 32%;
21+
}
22+
23+
.featuresSection {
24+
padding: 2rem 1rem;
25+
text-align: center;
26+
}
27+
28+
.featuresSection h2 {
29+
font-size: 2rem;
30+
margin-bottom: 2rem;
31+
}
32+
33+
.featuresGrid {
34+
display: flex;
35+
flex-wrap: wrap;
36+
gap: 1.5rem;
37+
justify-content: center;
38+
}
39+
40+
.featureCard {
41+
font-size: 0.9em;
42+
background: var(--ifm-background-color);
43+
border: 1px solid var(--ifm-color-emphasis-300);
44+
border-radius: 0.5em;
45+
padding: 1em;
46+
width: 16em;
47+
text-align: center;
48+
transition: all .2s ease-out;
49+
}
50+
51+
.featureCard:hover {
52+
transform: scale(1.04);
53+
}
54+
55+
.featureIcon {
56+
font-size: 2.5em;
57+
margin-bottom: 0.25em;
58+
filter: grayscale(100%);
59+
}
60+
61+
.featureCard:hover .featureIcon {
62+
filter: grayscale(0%);
63+
}
64+
65+
.featureTitle {
66+
font-size: 1.33em;
67+
}
68+
69+
.buttons {
70+
display: flex;
71+
gap: 1em;
72+
//justify-content: center;
73+
}
74+
75+
.buttons svg {
76+
width: auto;
77+
height: 1em;
78+
}
79+
80+
.githubButtonGroup {
81+
display: flex;
82+
align-items: center;
83+
gap: 0.3em;
84+
}

‎src/css/custom.css‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
1818
--ifm-hero-background-color: #bdd7fd;
1919
--ifm-leading-desktop: 1;
20+
--header-gradient: #fff;
2021
}
2122

2223
/* For readability concerns, you should choose a lighter palette in dark mode. */
@@ -29,7 +30,8 @@
2930
--ifm-color-primary-lighter: #599bf9;
3031
--ifm-color-primary-lightest: #84b4fa;
3132
--docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
32-
--ifm-hero-background-color: #0a73f0;
33+
--ifm-hero-background-color: #80b4f1;
34+
--header-gradient: #d5d5d5
3335
}
3436

3537
.navbar__logo {

‎src/pages/index.js‎

Lines changed: 2 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,5 @@
1-
import clsx from 'clsx';
2-
import Link from '@docusaurus/Link';
3-
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
4-
import Layout from '@theme/Layout/Provider';
5-
import Footer from '@theme/Footer';
6-
import HomepageFeatures from '@site/src/components/HomepageFeatures';
7-
8-
import Heading from '@theme/Heading';
9-
import styles from './index.module.css';
10-
11-
import Logo from '@site/static/img/phpss-light.svg';
12-
import GithubImg from '@site/static/img/GitHub.svg';
13-
14-
function HomepageHeader() {
15-
const {siteConfig} = useDocusaurusContext();
16-
return (
17-
<header className={clsx('hero', styles.heroBanner)}>
18-
<div className="container">
19-
<Logo alt="PHPStreamServer" className="hero__title" className={styles.logo} />
20-
<p className="hero__subtitle">High-performance PHP application server and process manager written in PHP.</p>
21-
<div className={styles.buttons}>
22-
<Link className="button button--secondary button--lg" to="/docs/general/">
23-
Get started
24-
</Link>
25-
<Link className="button button--secondary button--lg" href="https://github.com/phpstreamserver/phpstreamserver">
26-
<GithubImg alt="" /> GitHub
27-
</Link>
28-
</div>
29-
</div>
30-
</header>
31-
);
32-
}
1+
import LandingPage from "@site/src/components/LandingPage";
332

343
export default function Home() {
35-
const {siteConfig} = useDocusaurusContext();
36-
return (
37-
<Layout
38-
title={`${siteConfig.title}`}
39-
description="PHPStreamServer is a high-performance PHP application server and process manager written in PHP.">
40-
<HomepageHeader />
41-
<main className={styles.main}>
42-
<HomepageFeatures />
43-
</main>
44-
<Footer></Footer>
45-
</Layout>
46-
);
4+
return <LandingPage />;
475
}

0 commit comments

Comments
 (0)