You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by da...@apache.org on 2024/09/23 14:42:19 UTC
(cloudstack-www) branch staging-site updated: Fix JS console warnings: Invalid DOM properties in js,mdx,tsx files (#246)
This is an automated email from the ASF dual-hosted git repository.
dahn pushed a commit to branch staging-site
in repository https://gitbox.apache.org/repos/asf/cloudstack-www.git
The following commit(s) were added to refs/heads/staging-site by this push:
new 772a25425 Fix JS console warnings: Invalid DOM properties in js,mdx,tsx files (#246)
772a25425 is described below
commit 772a254254106af9342d214b5e4448f218325920
Author: John Bampton <jb...@users.noreply.github.com>
AuthorDate: Tue Sep 24 00:42:14 2024 +1000
Fix JS console warnings: Invalid DOM properties in js,mdx,tsx files (#246)
Co-authored-by: dahn <da...@onecht.net>
---
src/components/Events/index.tsx | 142 ++++++++---------
src/pages/about.js | 10 +-
src/pages/cloud-builders.js | 94 +++++------
src/pages/downloads.mdx | 40 ++---
src/pages/events.js | 8 +-
src/pages/index.tsx | 242 ++++++++++++++--------------
src/pages/integrations.js | 342 ++++++++++++++++++++--------------------
src/pages/kubernetes.js | 124 +++++++--------
src/pages/learn-more.mdx | 78 ++++-----
9 files changed, 540 insertions(+), 540 deletions(-)
diff --git a/src/components/Events/index.tsx b/src/components/Events/index.tsx
index 6787db165..894a58963 100644
--- a/src/components/Events/index.tsx
+++ b/src/components/Events/index.tsx
@@ -3,12 +3,12 @@ import React from "react";
export default function EventContents(): JSX.Element {
return <>
<section>
- <div class="container">
+ <div className="container">
- <div class="row margin-second">
- <div class="col-lg-8 offset-lg-2 text-center">
- <h2 class="section-title">CloudStack Events</h2>
- <p class="px18 mt-4">
+ <div className="row margin-second">
+ <div className="col-lg-8 offset-lg-2 text-center">
+ <h2 className="section-title">CloudStack Events</h2>
+ <p className="px18 mt-4">
There’s always plenty of CloudStack Events happening in different
parts of the world. These range from Meet-ups, User Groups to
CloudStack Collaboration Conference events. Each event will feature a
@@ -20,99 +20,99 @@ involved with the community.
</div>
</div>
- <div class="horizontal-card">
- <div class="hc-header">Upcoming Events:</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/CSEUG 2024.png" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">CloudStack European User Group 2024</p>
- <p class="events-info"><img src="/img/pin_icon.png" class="me-2" alt=""/>Frankfurt, Germany</p>
- <p class="events-info"><img src="/img/calendar_icon.png" class="me-2" alt=""/>Sep 19, 2024</p>
+ <div className="horizontal-card">
+ <div className="hc-header">Upcoming Events:</div>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/CSEUG 2024.png" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">CloudStack European User Group 2024</p>
+ <p className="events-info"><img src="/img/pin_icon.png" className="me-2" alt=""/>Frankfurt, Germany</p>
+ <p className="events-info"><img src="/img/calendar_icon.png" className="me-2" alt=""/>Sep 19, 2024</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="/blog/cseug-2024" class="btn btn-outline-secondary me-3">Read More</a>
- <a class="button button--primary" href="https://www.eventbrite.co.uk/e/cloudstack-european-user-group-germany-tickets-879369205967" target="_blank">Register Now</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="/blog/cseug-2024" className="btn btn-outline-secondary me-3">Read More</a>
+ <a className="button button--primary" href="https://www.eventbrite.co.uk/e/cloudstack-european-user-group-germany-tickets-879369205967" target="_blank">Register Now</a>
</div>
</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <div class="events-img events-overview-img" style={{display: "flex", alignItems: "center"}}>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <div className="events-img events-overview-img" style={{display: "flex", alignItems: "center"}}>
<img src="https://www.apachecon.com/event-images/na2024-wide-light.png" alt="C/C NA 2024"/>
</div>
- <p class="title mt-2">Community Over Code North America 2024</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>Denver, United States of America</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>October 7-10, 2024</p>
+ <p className="title mt-2">Community Over Code North America 2024</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>Denver, United States of America</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>October 7-10, 2024</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="https://communityovercode.org/" class="btn btn-outline-secondary me-3">Read More</a>
- <a class="button button--primary" href="https://communityovercode.org/registration/" target="_blank">Register Now</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="https://communityovercode.org/" className="btn btn-outline-secondary me-3">Read More</a>
+ <a className="button button--primary" href="https://communityovercode.org/registration/" target="_blank">Register Now</a>
</div>
</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/CCC-2024.png" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">CloudStack Collaboration Conference 2024</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>Madrid, Spain</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>November 20-22, 2024</p>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/CCC-2024.png" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">CloudStack Collaboration Conference 2024</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>Madrid, Spain</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>November 20-22, 2024</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="/blog/ccc-2024" class="btn btn-outline-secondary me-3">Read More</a>
- <a href="https://www.eventbrite.com/e/cloudstack-collaboration-conference-2024-tickets-879401903767" class="btn btn-primary">Register Now</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="/blog/ccc-2024" className="btn btn-outline-secondary me-3">Read More</a>
+ <a href="https://www.eventbrite.com/e/cloudstack-collaboration-conference-2024-tickets-879401903767" className="btn btn-primary">Register Now</a>
</div>
</div>
</div>
- <div class="horizontal-card">
- <div class="hc-header">Past Events:</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/india 2024.jpeg" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">CloudStack India User Group 2024</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>Hyderabad, India</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>February 23, 2024</p>
+ <div className="horizontal-card">
+ <div className="hc-header">Past Events:</div>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/india 2024.jpeg" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">CloudStack India User Group 2024</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>Hyderabad, India</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>February 23, 2024</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="https://cloudstack.apache.org/blog/india-user-group-2024/" class="btn btn-outline-secondary me-3">Read More</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="https://cloudstack.apache.org/blog/india-user-group-2024/" className="btn btn-outline-secondary me-3">Read More</a>
</div>
</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/ceph day.png" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">Ceph and CloudStack day 2024</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>Amsterdam, the Netherlands</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>February 22, 2024</p>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/ceph day.png" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">Ceph and CloudStack day 2024</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>Amsterdam, the Netherlands</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>February 22, 2024</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
</div>
</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/event_img2.png" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">CloudStack Collaboration Conference 2023</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>Paris, Île-de-France, France</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>November 23-24, 2023</p>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/event_img2.png" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">CloudStack Collaboration Conference 2023</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>Paris, Île-de-France, France</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>November 23-24, 2023</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="https://cloudstack.apache.org/blog/ccc2023-roundup" class="btn btn-outline-secondary me-3">Read More</a>
- <a href="https://www.youtube.com/playlist?list=PLnIKk7GjgFlZsBJestxnL-xF5DxgewxYh" class="btn btn-primary">Watch</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="https://cloudstack.apache.org/blog/ccc2023-roundup" className="btn btn-outline-secondary me-3">Read More</a>
+ <a href="https://www.youtube.com/playlist?list=PLnIKk7GjgFlZsBJestxnL-xF5DxgewxYh" className="btn btn-primary">Watch</a>
</div>
</div>
- <div class="row">
- <div class="col-lg-9 pt-3 px-4">
- <img src="/img/CSEUG 2023.png" alt="" class="events-img events-overview-img"/>
- <p class="title mt-2">CloudStack European User Group 2023</p>
- <p class="events-info"><img src="img/pin_icon.png" class="me-2" alt=""/>London, UK</p>
- <p class="events-info"><img src="img/calendar_icon.png" class="me-2" alt=""/>May 4, 2023</p>
+ <div className="row">
+ <div className="col-lg-9 pt-3 px-4">
+ <img src="/img/CSEUG 2023.png" alt="" className="events-img events-overview-img"/>
+ <p className="title mt-2">CloudStack European User Group 2023</p>
+ <p className="events-info"><img src="img/pin_icon.png" className="me-2" alt=""/>London, UK</p>
+ <p className="events-info"><img src="img/calendar_icon.png" className="me-2" alt=""/>May 4, 2023</p>
</div>
- <div class="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
- <a href="https://cloudstack.apache.org/blog/cseug-2023-roundup" class="btn btn-outline-secondary me-3">Read More</a>
- <a href="https://www.youtube.com/playlist?list=PLnIKk7GjgFlZtSvP7zSXDKr-r5qLCKCFd" class="btn btn-primary">Watch</a>
+ <div className="col-lg-3 px-4 events-btn-margin d-flex justify-content-center justify-content-lg-end align-items-center">
+ <a href="https://cloudstack.apache.org/blog/cseug-2023-roundup" className="btn btn-outline-secondary me-3">Read More</a>
+ <a href="https://www.youtube.com/playlist?list=PLnIKk7GjgFlZtSvP7zSXDKr-r5qLCKCFd" className="btn btn-primary">Watch</a>
</div>
</div>
</div>
- <div class="text-center load-more">
- <a href="/blog/tags/roundup" class="btn btn-outline-secondary">See Past Events</a>
+ <div className="text-center load-more">
+ <a href="/blog/tags/roundup" className="btn btn-outline-secondary">See Past Events</a>
</div>
</div>
diff --git a/src/pages/about.js b/src/pages/about.js
index 496ae5cd0..bdbd9d810 100644
--- a/src/pages/about.js
+++ b/src/pages/about.js
@@ -8,12 +8,12 @@ export default function About() {
return (
<Layout title="About Apache CloudStack">
<header>
- <div class="container">
- <div class="row">
- <div class="col">
- <h1 class="section-title text-center mb-5">About Apache CloudStack</h1>
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <h1 className="section-title text-center mb-5">About Apache CloudStack</h1>
<div>
- <h2 class="text-center">What is Apache CloudStack?</h2>
+ <h2 className="text-center">What is Apache CloudStack?</h2>
<p>
Apache CloudStack is a top-level project of the Apache Software
Foundation (ASF). The project develops open source software for
diff --git a/src/pages/cloud-builders.js b/src/pages/cloud-builders.js
index cba64ef47..ac094711a 100644
--- a/src/pages/cloud-builders.js
+++ b/src/pages/cloud-builders.js
@@ -6,17 +6,17 @@ import LearnMore from './learn-more.mdx';
function CloudBuildersHeader() {
const {siteConfig} = useDocusaurusContext();
return (
- <header class="header-cloud header-homepage">
- <div class="container">
- <div class="row">
- <div class="col-lg-5">
+ <header className="header-cloud header-homepage">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-5">
<h1>Apache CloudStack– <strong>A Turnkey Solution for Cloud Builders</strong></h1>
- <p class="px18 my-4 text-center text-lg-start">Decrease total cost of ownership, eliminate vendor lock-in and operational overhead</p>
- <div class="center-buttons">
- <a href="/downloads" class="btn btn-primary btn-size mb-5">Download</a>
+ <p className="px18 my-4 text-center text-lg-start">Decrease total cost of ownership, eliminate vendor lock-in and operational overhead</p>
+ <div className="center-buttons">
+ <a href="/downloads" className="btn btn-primary btn-size mb-5">Download</a>
</div>
</div>
- <div class="col-lg-7"><img src="/img/CloudStack_cloud_builderfs_illustration.png" class="img-fluid" alt=""/></div>
+ <div className="col-lg-7"><img src="/img/CloudStack_cloud_builderfs_illustration.png" className="img-fluid" alt=""/></div>
</div>
</div>
</header>
@@ -30,11 +30,11 @@ export default function CloudBuilders() {
<CloudBuildersHeader/>
<main>
<section>
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mb-4">About Apache CloudStack</h2>
- <p class="px18">Apache CloudStack is a highly
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mb-4">About Apache CloudStack</h2>
+ <p className="px18">Apache CloudStack is a highly
scalable IaaS cloud computing platform that provides a cloud
orchestration layer, automating the creation, provisioning and
configuration of IaaS components. It turns existing virtual
@@ -42,27 +42,27 @@ infrastructure into a cloud-based Infrastructure as a Service (IaaS)
platform. Because CloudStack leverages existing infrastructure, the
costs and time for the organization to build a multi-tenant IaaS
platform are greatly reduced.</p>
- <p class="px18">CloudStack is a turnkey solution
+ <p className="px18">CloudStack is a turnkey solution
for MSPs, cloud providers and telcos. It includes the entire “stack” of
features you need: compute orchestration, Network-as-a-Service, user
and account management, a full and open native API, resource accounting,
and a first-class User Interface.</p>
</div>
- <div class="col-lg-6 text-center">
+ <div className="col-lg-6 text-center">
<a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank">
- <img src="/img/CloudStack_survey3.png" class="img-fluid mt-4 mt-lg-2" alt="CloudStack survey"/>
+ <img src="/img/CloudStack_survey3.png" className="img-fluid mt-4 mt-lg-2" alt="CloudStack survey"/>
</a>
</div>
</div>
</div>
</section>
- <div class="container">
- <div class="row">
- <div class="col">
- <div class="partners-holder">
- <p class="blue-title mb-4 mb-lg-5">LEADING COMPANIES TRUST APACHE CLOUDSTACK</p>
- <div class="partners cloud-partners">
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <div className="partners-holder">
+ <p className="blue-title mb-4 mb-lg-5">LEADING COMPANIES TRUST APACHE CLOUDSTACK</p>
+ <div className="partners cloud-partners">
<img src="/img/BT_logo.svg" height="50" alt=""/>
<img src="/img/CloudOps_logo.svg" height="30" alt=""/>
<img src="/img/ikoula_logo.svg" height="40" alt=""/>
@@ -75,12 +75,12 @@ and account management, a full and open native API, resource accounting,
</div>
</div>
- <section class="powers bg-none">
- <div class="container">
- <div class="row">
- <div class="col-lg-8 offset-lg-2">
- <h2 class="section-title text-center mb-4">CloudStack Solves Key Challenges for Cloud Providers & MSPs</h2>
- <p class="px18 text-center mb-5">CloudStack can
+ <section className="powers bg-none">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-8 offset-lg-2">
+ <h2 className="section-title text-center mb-4">CloudStack Solves Key Challenges for Cloud Providers & MSPs</h2>
+ <p className="px18 text-center mb-5">CloudStack can
manage tens of thousands of physical servers installed in geographically
distributed data centers. It is a powerful IaaS management solution,
but it is still easy to use and implement with a small team. Powered by a
@@ -90,41 +90,41 @@ and use the hardware and software of your choice and business
requirements.</p>
</div>
</div>
- <div class="row">
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="row">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/decrease_TCO_icon.svg" alt=""/>
- <p class="card-title">Decrease TCO for your IaaS</p>
+ <p className="card-title">Decrease TCO for your IaaS</p>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/open-source_icon.svg" alt=""/>
- <p class="card-title">Completely open-source</p>
+ <p className="card-title">Completely open-source</p>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/community_icon.svg" alt=""/>
- <p class="card-title">Powered by an active community</p>
+ <p className="card-title">Powered by an active community</p>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/easy_to_use_icon.svg" alt=""/>
- <p class="card-title">Easy to use</p>
+ <p className="card-title">Easy to use</p>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/quick_deploy_icon.svg" alt=""/>
- <p class="card-title">Quick to deploy</p>
+ <p className="card-title">Quick to deploy</p>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/vendor_integration_icon.svg" alt=""/>
- <p class="card-title">Strong vendor integrations</p>
+ <p className="card-title">Strong vendor integrations</p>
</div>
</div>
</div>
diff --git a/src/pages/downloads.mdx b/src/pages/downloads.mdx
index d9dbd2f94..be478fc5c 100644
--- a/src/pages/downloads.mdx
+++ b/src/pages/downloads.mdx
@@ -21,10 +21,10 @@ releases](https://github.com/apache/cloudstack/releases).
Apache CloudStack's most recent release is `4.19.1.1`. This is current
CloudStack LTS release.
-<a class="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2">Get the 4.19.1.1 Source</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2.asc">PGP</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2.sha512">SHA512</a>
+<a className="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2">Get the 4.19.1.1 Source</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2.asc">PGP</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.19.1.1/apache-cloudstack-4.19.1.1-src.tar.bz2.sha512">SHA512</a>
<br/><br/>
Full release notes can be found in the version [4.19.1.1 Release
@@ -40,10 +40,10 @@ the Release Notes (see above).
The latest CloudStack LTS maintenance release is `4.18.2.3` as part of the
previous LTS release.
-<a class="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2">Get the 4.18.2.3 Source</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2.asc">PGP</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2.sha512">SHA512</a>
+<a className="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2">Get the 4.18.2.3 Source</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2.asc">PGP</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/4.18.2.3/apache-cloudstack-4.18.2.3-src.tar.bz2.sha512">SHA512</a>
<br/><br/>
Full release notes can be found in the version [4.18.2.3 Release
@@ -104,10 +104,10 @@ wiki](https://github.com/apache/cloudstack-cloudmonkey/wiki/Getting-Started#inst
CloudMonkey's current release is `v6.4.0`.
-<a class="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2">Get the 6.4.0 Source</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
-<a class="button button--secondary button--sm" href="https://www.apache.org/dist/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2.asc">PGP</a>
-<a class="button button--secondary button--sm" href="https://www.apache.org/dist/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2.sha512">SHA512</a><br/>
+<a className="button button--primary button--lg" href="http://www.apache.org/dyn/closer.lua/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2">Get the 6.4.0 Source</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
+<a className="button button--secondary button--sm" href="https://www.apache.org/dist/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2.asc">PGP</a>
+<a className="button button--secondary button--sm" href="https://www.apache.org/dist/cloudstack/releases/cloudmonkey-6.4.0/apache-cloudstack-cloudmonkey-6.4.0-src.tar.bz2.sha512">SHA512</a><br/>
<br/>
### Binary Builds Release
@@ -142,10 +142,10 @@ here](https://registry.terraform.io/providers/cloudstack/cloudstack/latest/docs)
The current release is `v0.5.0`.
-<a class="button button--primary button--lg" href="https://www.apache.org/dyn/closer.lua/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2">Get the v0.5.0 Source</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2.asc">PGP</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2.sha512">SHA512</a><br/>
+<a className="button button--primary button--lg" href="https://www.apache.org/dyn/closer.lua/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2">Get the v0.5.0 Source</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2.asc">PGP</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/terraform-provider-0.5.0/apache-cloudstack-terraform-provider-0.5.0-src.tar.bz2.sha512">SHA512</a><br/>
<br/>
### Using Terraform Registry
@@ -168,10 +168,10 @@ here](https://docs.cloudstack.apache.org/en/latest/plugins/cloudstack-kubernetes
The current release is `v1.1.0`.
-<a class="button button--primary button--lg" href="https://www.apache.org/dyn/closer.lua/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2">Get the v1.1.0 Source</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2.asc">PGP</a>
-<a class="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2.sha512">SHA512</a><br/>
+<a className="button button--primary button--lg" href="https://www.apache.org/dyn/closer.lua/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2">Get the v1.1.0 Source</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/KEYS">KEYS</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2.asc">PGP</a>
+<a className="button button--secondary button--sm" href="https://downloads.apache.org/cloudstack/releases/kubernetes-provider-1.1.0/apache-cloudstack-kubernetes-provider-1.1.0-src.tar.bz2.sha512">SHA512</a><br/>
<br/>
### Docker Release
diff --git a/src/pages/events.js b/src/pages/events.js
index e34fdf029..b1dddcb43 100644
--- a/src/pages/events.js
+++ b/src/pages/events.js
@@ -7,13 +7,13 @@ export default function Events() {
const {siteConfig} = useDocusaurusContext();
return (
<Layout title="Apache CloudStack Events and Meetups" >
- <section class="events">
- <div class="container">
- <EventContents class="events"/>
+ <section className="events">
+ <div className="container">
+ <EventContents className="events"/>
</div>
</section>
- <section class="events container">
+ <section className="events container">
<div>
<p>
older events:
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 5691f5c31..1185b5001 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -15,26 +15,26 @@ const recentPosts = require("../../.docusaurus/docusaurus-plugin-content-blog/de
function HomepageHeader() {
const {siteConfig} = useDocusaurusContext();
return (
- <header class="header-homepage">
- <div class="container">
- <div class="row">
- <div class="col-lg-5 text-white">
+ <header className="header-homepage">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-5 text-white">
<h1><strong>Open–Source</strong> Cloud Computing™</h1>
- <p class="px18 my-4">
+ <p className="px18 my-4">
Apache CloudStack™ is an open-source software system designed to deploy and manage large networks of virtual machines, as a highly available, highly scalable Infrastructure as a Service (IaaS) cloud computing platform.
</p>
- <div class="center-buttons">
- <a href="downloads" class="btn btn-light btn-size">Download</a>
+ <div className="center-buttons">
+ <a href="downloads" className="btn btn-light btn-size">Download</a>
- <a href="https://docs.cloudstack.apache.org/en/4.19.1.1/" target="_blank" class="btn btn-outline-light btn-size">Documentation</a>
- <p class="small mt-3">Apache CloudStack 4.19.1.1 is out!</p>
+ <a href="https://docs.cloudstack.apache.org/en/4.19.1.1/" target="_blank" className="btn btn-outline-light btn-size">Documentation</a>
+ <p className="small mt-3">Apache CloudStack 4.19.1.1 is out!</p>
</div>
</div>
- <div class="col-lg-7"><img src="/img/CloudStack_monkey_cloud.png" class="img-fluid" alt=""/></div>
+ <div className="col-lg-7"><img src="/img/CloudStack_monkey_cloud.png" className="img-fluid" alt=""/></div>
</div>
</div>
- <div class="partners-holder">
- <div class="partners">
+ <div className="partners-holder">
+ <div className="partners">
<img src="/img/brainboard.png" height="25" alt=""/>
<img src="/img/ntt.svg" height="18" alt=""/>
<img src="/img/leaseweb.svg" height="25" alt=""/>
@@ -59,12 +59,12 @@ export default function Home(): JSX.Element {
description="Apache CloudStack is an opensource infrastructure-as-a-service cloud computing platform that is easy to use, turnkey, highly available and highly scalable.">
<HomepageHeader />
<main>
- <section class="light-blue">
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mt-lg-5">Apache CloudStack Infrastructure for Virtual Machines and Bare Metal</h2>
- <p class="px18">
+ <section className="light-blue">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mt-lg-5">Apache CloudStack Infrastructure for Virtual Machines and Bare Metal</h2>
+ <p className="px18">
Apache CloudStack is open-source software designed to deploy and
manage large networks of virtual machines, as a highly available,
highly scalable Infrastructure as a Service (laaS) cloud computing
@@ -72,86 +72,86 @@ platform. CloudStack is used by a number of service providers to offer
public cloud services, and by many companies to provide an on-premises
(private) cloud offering, or as part of a hybrid cloud solution.
</p>
- <p class="px18">
+ <p className="px18">
CloudStack is a turnkey solution that includes the entire “stack” of
features most organizations want with an laaS cloud: compute
orchestration, Network-as-a-Service, user and account management, a
full and open native API, resource accounting, and a first-class User
Interface (UI).
</p>
- <p class="px18">
+ <p className="px18">
Users can manage their cloud with an easy to use Web interface,
command line tools, and/or a full-featured RESTful API. In addition,
CloudStack provides an API that’s compatible with AWS EC2 and S3 for
organizations that wish to deploy hybrid clouds.
</p>
</div>
- <ArchitectureSVG class="col col-lg-6"/>
+ <ArchitectureSVG className="col col-lg-6"/>
</div>
</div>
</section>
- <section class="powers">
- <div class="container">
- <div class="row">
- <div class="col-lg-6">
- <h2 class="section-title mb-5">Apache CloudStack Powers Globally Leading Clouds</h2>
+ <section className="powers">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6">
+ <h2 className="section-title mb-5">Apache CloudStack Powers Globally Leading Clouds</h2>
</div>
</div>
- <div class="row">
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="row">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/Cloud_Solution_icon.svg" alt=""/>
- <p class="card-title mb-3">Cloud Solution Provider</p>
- <p class="card-text">
+ <p className="card-title mb-3">Cloud Solution Provider</p>
+ <p className="card-text">
Apache CloudStack seamlessly integrates with your existing
infrastructure, <strong>significantly reducing the costs and time
required</strong> to build a multi-tenant IaaS platform.
</p>
- <a href="/cloud-builders" class="btn btn-outline-secondary btn-card">Learn More</a>
+ <a href="/cloud-builders" className="btn btn-outline-secondary btn-card">Learn More</a>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/MSPs_icon.svg" alt=""/>
- <p class="card-title mb-3">MSPs</p>
- <p class="card-text">
+ <p className="card-title mb-3">MSPs</p>
+ <p className="card-text">
<strong>Ensure simplicity, scalability and avoid vendor lock-in with
CloudStack.</strong> Provision IaaS with ease and manage all your
cloud environments from a single plane.
</p>
- <a href="blog/we-systems-case-study" class="btn btn-outline-secondary btn-card">Discover a Success Story</a>
+ <a href="blog/we-systems-case-study" className="btn btn-outline-secondary btn-card">Discover a Success Story</a>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card line">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card line">
<img src="/img/Telcos_icon.svg" alt=""/>
- <p class="card-title mb-3">Telcos</p>
- <p class="card-text">
+ <p className="card-title mb-3">Telcos</p>
+ <p className="card-text">
Deliver cutting-edge cloud-based services, including <strong>virtual
network functions, infrastructure as a service, and advanced edge
computing</strong> capabilities with Edge zones.
</p>
- <a href="" class="btn btn-card"> </a>
+ <a href="" className="btn btn-card"> </a>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/enterprises_icon.svg" alt=""/>
- <p class="card-title mb-3">Enterprises</p>
- <p class="card-text">
+ <p className="card-title mb-3">Enterprises</p>
+ <p className="card-text">
<strong>Align your IT infrastructure with your specific business
requirements</strong> and security concerns, driving efficiency and
optimizing resource utilization.
</p>
- <a href="https://cloudstack.apache.org/blog/cloudstack-and-gitops-at-scale/" class="btn btn-outline-secondary btn-card">Discover a Success Story</a>
+ <a href="https://cloudstack.apache.org/blog/cloudstack-and-gitops-at-scale/" className="btn btn-outline-secondary btn-card">Discover a Success Story</a>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/continuous_integration_icon.svg" alt=""/>
- <p class="card-title mb-3">Kubernetes CAPC/CKS</p>
- <p class="card-text">
+ <p className="card-title mb-3">Kubernetes CAPC/CKS</p>
+ <p className="card-text">
CAPI implementation CAPC integrates Kubernetes with CloudStack
<strong>simplifying cluster management</strong>. Apache 2 licensed, CNCF-managed for
hybrid deployments.
@@ -160,31 +160,31 @@ hybrid deployments.
CKS is an easy to use quick start integration with kubernetes for
starting clusters easily.
</p>
- <a href="/kubernetes" class="btn btn-outline-secondary btn-card">Learn More</a>
+ <a href="/kubernetes" className="btn btn-outline-secondary btn-card">Learn More</a>
</div>
</div>
- <div class="col-lg-4 col-md-6">
- <div class="power-card">
+ <div className="col-lg-4 col-md-6">
+ <div className="power-card">
<img src="/img/edge_icon.svg" alt=""/>
- <p class="card-title mb-3">Edge Computing</p>
- <p class="card-text">
+ <p className="card-title mb-3">Edge Computing</p>
+ <p className="card-text">
Manage both traditional Cloud (Core Zones) and Edge Zones from a
single, unified platform. <strong>Unlock new opportunities for growth
and innovation.</strong>
</p>
- <a href="" class="btn btn-card"> </a>
+ <a href="" className="btn btn-card"> </a>
</div>
</div>
</div>
</div>
</section>
- <section class="dark-blue">
- <div class="container">
- <div class="row">
- <div class="col-lg-6">
- <h2 class="section-title mt-lg-5">CloudStack Solves Key Challenges for Cloud Builders and IaaS Providers</h2>
- <p class="px18 mt-4">
+ <section className="dark-blue">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6">
+ <h2 className="section-title mt-lg-5">CloudStack Solves Key Challenges for Cloud Builders and IaaS Providers</h2>
+ <p className="px18 mt-4">
CloudStack can manage tens of thousands of physical servers installed
in geographically distributed data centers. It is a powerful laaS
management solution, but it is still easy to use and implement with a
@@ -194,126 +194,126 @@ own cloud development plan, and use the hardware and software of your
choice and business requirements.
</p>
</div>
- <div class="col-lg-6 text-center"><img src="/img/key_challenges_illustration.png" alt="" class="img-fluid"/></div>
+ <div className="col-lg-6 text-center"><img src="/img/key_challenges_illustration.png" alt="" className="img-fluid"/></div>
</div>
- <div class="take">Take charge of your cloud management. <strong>Decrease operational costs and simplify cloud management</strong> with Apache CloudStack!</div>
+ <div className="take">Take charge of your cloud management. <strong>Decrease operational costs and simplify cloud management</strong> with Apache CloudStack!</div>
</div>
</section>
<section>
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mb-4 margin-first">Run a Multi-hypervisor Environment at Scale</h2>
- <p class="px18">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mb-4 margin-first">Run a Multi-hypervisor Environment at Scale</h2>
+ <p className="px18">
CloudStack is hypervisor agnostic, supporting VMware, KVM, XenServer
and Xen Cloud Platform. This gives CloudStack a unique position in the
market: it is not proprietary technology and is not tied to any
specific infrastructure.
</p>
</div>
- <div class="col-lg-6 text-center"><img src="/img/Multi-hypervisor-environment.png" alt="" class="img-fluid"/></div>
+ <div className="col-lg-6 text-center"><img src="/img/Multi-hypervisor-environment.png" alt="" className="img-fluid"/></div>
</div>
- <div class="row">
- <div class="col col-lg-5">
- <h2 class="section-title mb-4 margin-second">Latest Release</h2>
- <div class="center-buttons">
- <p class="px18">Apache CloudStack 4.19.1.1 is out!<br/>This is the latest LTS release.</p>
- <a href="downloads" class="btn btn-primary btn-size">Download</a>
+ <div className="row">
+ <div className="col col-lg-5">
+ <h2 className="section-title mb-4 margin-second">Latest Release</h2>
+ <div className="center-buttons">
+ <p className="px18">Apache CloudStack 4.19.1.1 is out!<br/>This is the latest LTS release.</p>
+ <a href="downloads" className="btn btn-primary btn-size">Download</a>
- <a href="https://docs.cloudstack.apache.org/en/4.19.1.1/" target="_blank" class="btn btn-outline-secondary btn-size">Documentation</a>
+ <a href="https://docs.cloudstack.apache.org/en/4.19.1.1/" target="_blank" className="btn btn-outline-secondary btn-size">Documentation</a>
</div>
</div>
- <div class="col-lg-7"><img src="/img/CloudStack_release_illustration.png" class="img-fluid img-release" alt=""/></div>
+ <div className="col-lg-7"><img src="/img/CloudStack_release_illustration.png" className="img-fluid img-release" alt=""/></div>
</div>
</div>
</section>
<section>
- <div class="container">
+ <div className="container">
<EventContents/>
</div>
</section>
- <section class="community">
- <div class="light-blue">
- <div class="container">
- <div class="row">
- <div class="col col-lg-6">
- <div class="section-title">Join Our Community</div>
- <p class="px18 my-4">
+ <section className="community">
+ <div className="light-blue">
+ <div className="container">
+ <div className="row">
+ <div className="col col-lg-6">
+ <div className="section-title">Join Our Community</div>
+ <p className="px18 my-4">
Learn more about involved with Apache CloudStack on the Contributing
to Apache page, or go straight to our Developer Resources page.
</p>
</div>
</div>
- <div class="row">
- <div class="col col-lg-3 col-md-6">
- <div class="join-card">
+ <div className="row">
+ <div className="col col-lg-3 col-md-6">
+ <div className="join-card">
<img src="/img/git_logo.svg" alt=""/>
- <p class="blue-title">DEVELOPER RESOURCES</p>
- <p class="join-title">Contribute to Apache CloudStack</p>
- <p class="text">
+ <p className="blue-title">DEVELOPER RESOURCES</p>
+ <p className="join-title">Contribute to Apache CloudStack</p>
+ <p className="text">
Interested in helping out with Apache CloudStack? Great! We welcome
participation from anybody willing to work The Apache Way.
</p>
- <a href="https://github.com/apache/cloudstack" class="btn btn-primary">Learn More</a>
+ <a href="https://github.com/apache/cloudstack" className="btn btn-primary">Learn More</a>
</div>
</div>
- <div class="col col-lg-3 col-md-6">
- <div class="join-card">
+ <div className="col col-lg-3 col-md-6">
+ <div className="join-card">
<img src="/img/slack_logo.svg" alt=""/>
- <p class="blue-title">JOIN US ON SLACK</p>
- <p class="join-title">Getting Involved</p>
- <p class="text">
+ <p className="blue-title">JOIN US ON SLACK</p>
+ <p className="join-title">Getting Involved</p>
+ <p className="text">
We need folks to help with documentation, translation, promotion, and
having someone with snazzy Web design skills would not be a bad thing!
</p>
- <a href="https://join.slack.com/t/apachecloudstack/shared_invite/zt-2aegc22z7-tPCxpptfcebTBtd59qcZSQ" class="btn btn-primary">Learn More</a>
+ <a href="https://join.slack.com/t/apachecloudstack/shared_invite/zt-2aegc22z7-tPCxpptfcebTBtd59qcZSQ" className="btn btn-primary">Learn More</a>
</div>
</div>
- <div class="col col-lg-3 col-md-6">
- <div class="join-card">
+ <div className="col col-lg-3 col-md-6">
+ <div className="join-card">
<img src="/img/blog_icon.svg" alt=""/>
- <p class="blue-title">CONTRIBUTE CONTENT</p>
- <p class="join-title">Blog</p>
- <p class="text">
+ <p className="blue-title">CONTRIBUTE CONTENT</p>
+ <p className="join-title">Blog</p>
+ <p className="text">
Want to share your success story? Or you are working on a new feature?
Contribute your content to our blog or join the Meet the Community
Video Series.
</p>
- <a href="blog" class="btn btn-primary">Learn More</a>
+ <a href="blog" className="btn btn-primary">Learn More</a>
</div>
</div>
- <div class="col col-lg-3 col-md-6">
- <div class="join-card">
+ <div className="col col-lg-3 col-md-6">
+ <div className="join-card">
<img src="/img/mailing_list_icon.svg" alt=""/>
- <p class="blue-title">WHERE TO ASK FOR HELP</p>
- <p class="join-title">Mailing List</p>
- <p class="text">Need some help getting started? Feel free to ask on the Mailing List.</p>
- <a href="mailing-lists" class="btn btn-primary">Learn More</a>
+ <p className="blue-title">WHERE TO ASK FOR HELP</p>
+ <p className="join-title">Mailing List</p>
+ <p className="text">Need some help getting started? Feel free to ask on the Mailing List.</p>
+ <a href="mailing-lists" className="btn btn-primary">Learn More</a>
</div>
</div>
</div>
</div>
</div>
- <div class="survey-announce">
- <div class="container">
- <div class="row">
- <div class="col-lg-6">
- <h2 class="section-title mb-4 margin-third">Take the Apache CloudStack User Survey</h2>
- <p class="px18 mb-5">
+ <div className="survey-announce">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6">
+ <h2 className="section-title mb-4 margin-third">Take the Apache CloudStack User Survey</h2>
+ <p className="px18 mb-5">
Participate in the Apache CloudStack User Survey and help us build the
Annual State of CloudStack Report. This survey will take you less than
5 minutes to complete. Your input is vital for the CloudStack
Community!
</p>
- <div class="center-buttons"><a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank" class="btn btn-outline-secondary btn-size">Take the Survey</a></div>
+ <div className="center-buttons"><a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank" className="btn btn-outline-secondary btn-size">Take the Survey</a></div>
</div>
- <div class="col-lg-6 text-center">
+ <div className="col-lg-6 text-center">
<a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank">
- <img src="/img/CloudStack_survey.png" class="img-fluid mt-5"/>
+ <img src="/img/CloudStack_survey.png" className="img-fluid mt-5"/>
</a>
</div>
</div>
diff --git a/src/pages/integrations.js b/src/pages/integrations.js
index 5ef6e91ee..0ca6b9494 100644
--- a/src/pages/integrations.js
+++ b/src/pages/integrations.js
@@ -9,20 +9,20 @@ import TabItem from '@theme/TabItem';
function IntegrationsHeader() {
const {siteConfig} = useDocusaurusContext();
return (
- <header class="header-integrations header-homepage">
- <div class="container">
- <div class="row">
- <div class="col-lg-5">
+ <header className="header-integrations header-homepage">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-5">
<h1>Apache CloudStack <br/><strong>Integrations</strong></h1>
- <p class="px18 my-4 text-center text-lg-start">
+ <p className="px18 my-4 text-center text-lg-start">
Apache CloudStack is a comprehensive infrastructure-as-a-service (IaaS)
cloud computing solution that offers extensive integration options to
seamlessly align with your technology stack.
</p>
- <div class="center-buttons">
+ <div className="center-buttons">
</div>
</div>
- <div class="col-lg-7"><img src="/img/oss_vs_css_integration_illustration.png" class="img-fluid" alt=""/></div>
+ <div className="col-lg-7"><img src="/img/oss_vs_css_integration_illustration.png" className="img-fluid" alt=""/></div>
</div>
</div>
</header>
@@ -32,23 +32,23 @@ function IntegrationsHeader() {
function OurUsers() {
const {siteConfig} = useDocusaurusContext();
return (
- <section class="our-users">
- <div class="container">
- <div class="row">
- <div class="col">
- <div class="section-title text-center mb-4">Learn from our users</div>
+ <section className="our-users">
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <div className="section-title text-center mb-4">Learn from our users</div>
</div>
</div>
- <div class="row">
- <div class="col-md-4 order-lg-2">
- <div class="card-users">
- <div class="card-images clearfix mb-4">
- <img src="/img/quotes_icon.svg" class="float-start" alt=""/>
- <img src="/img/Kshtish_img.png" class="float-start" alt=""/>
- <img src="/img/apiculus_logo.svg" class="float-end" alt=""/>
+ <div className="row">
+ <div className="col-md-4 order-lg-2">
+ <div className="card-users">
+ <div className="card-images clearfix mb-4">
+ <img src="/img/quotes_icon.svg" className="float-start" alt=""/>
+ <img src="/img/Kshtish_img.png" className="float-start" alt=""/>
+ <img src="/img/apiculus_logo.svg" className="float-end" alt=""/>
</div>
- <div class="card-text">
- <p class="mb-4">
+ <div className="card-text">
+ <p className="mb-4">
“<strong>CloudStack is extremely easy to set up, learn, manage and
operate</strong>. In our market(s), this not only helps our customers
launch quickly, but also makes them feel empowered by way of using a
@@ -59,21 +59,21 @@ Our aim is to position the combination of CloudStack and Apiculus as a
robust cloud solution in 100+ countries and 300+”
</p>
</div>
- <div class="card-info">
- <div class="card-name">— Kshitish Purohit</div>
- <p class="blue-title">CHIEF PRODUCT OFFICER</p>
+ <div className="card-info">
+ <div className="card-name">— Kshitish Purohit</div>
+ <p className="blue-title">CHIEF PRODUCT OFFICER</p>
</div>
</div>
</div>
- <div class="col-md-4 order-lg-2">
- <div class="card-users">
- <div class="card-images clearfix mb-4">
- <img src="/img/quotes_icon.svg" class="float-start" alt=""/>
- <img src="/img/Tamara_img.png" class="float-start" alt=""/>
- <img src="/img/Frauhofer_logo.svg" class="float-end" alt=""/>
+ <div className="col-md-4 order-lg-2">
+ <div className="card-users">
+ <div className="card-images clearfix mb-4">
+ <img src="/img/quotes_icon.svg" className="float-start" alt=""/>
+ <img src="/img/Tamara_img.png" className="float-start" alt=""/>
+ <img src="/img/Frauhofer_logo.svg" className="float-end" alt=""/>
</div>
- <div class="card-text">
- <p class="mb-4">
+ <div className="card-text">
+ <p className="mb-4">
“<strong>CloudStack and Terraform bring scalability and
flexibility</strong>. The immediate benefit out of them is that you
can have tested and proven blueprints and roll out environments
@@ -86,21 +86,21 @@ important. Infrastructure as code is a huge boost, helping teams to
collaborate on code.”
</p>
</div>
- <div class="card-info">
- <div class="card-name">— Tamara Muryshkin</div>
- <p class="blue-title">ENTERPRISE SERVICE MANAGER</p>
+ <div className="card-info">
+ <div className="card-name">— Tamara Muryshkin</div>
+ <p className="blue-title">ENTERPRISE SERVICE MANAGER</p>
</div>
</div>
</div>
- <div class="col-md-4 order-lg-2">
- <div class="card-users">
- <div class="card-images clearfix mb-4">
- <img src="/img/quotes_icon.svg" class="float-start" alt=""/>
- <img src="/img/Sven_img.png" class="float-start" alt=""/>
- <img src="/img/ewerk_group_logo.png" class="float-end" alt=""/>
+ <div className="col-md-4 order-lg-2">
+ <div className="card-users">
+ <div className="card-images clearfix mb-4">
+ <img src="/img/quotes_icon.svg" className="float-start" alt=""/>
+ <img src="/img/Sven_img.png" className="float-start" alt=""/>
+ <img src="/img/ewerk_group_logo.png" className="float-end" alt=""/>
</div>
- <div class="card-text">
- <p class="mb-4">
+ <div className="card-text">
+ <p className="mb-4">
“The EWERK Group mainly serves organizations in system-relevant
industries with regulated IT. <strong>In these industries, highly
complex IT infrastructure projects place special demands on the
@@ -110,9 +110,9 @@ technological know-how and flexibility of the software is needed. The
support of Tungsten Fabric helps us to meet these requirements.”
</p>
</div>
- <div class="card-info">
- <div class="card-name">— Sven Vogel</div>
- <p class="blue-title">SENIOR MANAGER R&D</p>
+ <div className="card-info">
+ <div className="card-name">— Sven Vogel</div>
+ <p className="blue-title">SENIOR MANAGER R&D</p>
</div>
</div>
</div>
@@ -127,170 +127,170 @@ export default function CloudStackIntegrations() {
<Layout title="Apache CloudStack Integrations">
<IntegrationsHeader />
<main>
- <section class="integrations">
- <div class="container">
- <div class="row">
- <div class="col-lg-6 text-center">
- <div class="section-title mb-4 text-center">CloudStack Integrations</div>
+ <section className="integrations">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 text-center">
+ <div className="section-title mb-4 text-center">CloudStack Integrations</div>
</div>
</div>
- <div class="row">
- <div class="col col-md-12">
+ <div className="row">
+ <div className="col col-md-12">
<Tabs className="tabbed-examples tab-box">
<TabItem value="automation" label="Automation" default>
- <div class="tab-pane active" id="automation" role="tabpanel" aria-labelledby="automation-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/automation_icon.svg" alt="" class="me-3"/>Automation</h2>
+ <div className="tab-pane active" id="automation" role="tabpanel" aria-labelledby="automation-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/automation_icon.svg" alt="" className="me-3"/>Automation</h2>
<p>
CloudStack supports automation integrations through its robust API and
integration capabilities, enabling <strong>seamless orchestration and
automation of cloud infrastructure tasks</strong>.
</p>
- <div class="row integration-images">
- <div class="col-md-6">
- <div class="tab-box box-puppet box278"><img src="/img/puppet_logo.svg" alt="hyper-v"/></div>
+ <div className="row integration-images">
+ <div className="col-md-6">
+ <div className="tab-box box-puppet box278"><img src="/img/puppet_logo.svg" alt="hyper-v"/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-terraform box131"><img src="/img/terraform_logo.svg" alt="hyper-v"/></div>
- <div class="tab-box box-ansible box131"><img src="/img/ansible_logo.svg" alt="hyper-v"/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-terraform box131"><img src="/img/terraform_logo.svg" alt="hyper-v"/></div>
+ <div className="tab-box box-ansible box131"><img src="/img/ansible_logo.svg" alt="hyper-v"/></div>
</div>
- <div class="col-md-12">
- <div class="tab-box box-chef box131"><img src="/img/chef-logo.png" alt="hyper-v"/></div>
+ <div className="col-md-12">
+ <div className="tab-box box-chef box131"><img src="/img/chef-logo.png" alt="hyper-v"/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="backup" label="Backup & Disaster Recovery">
- <div class="tab-pane" id="backup" role="tabpanel" aria-labelledby="backup-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/Backup_icon.svg" alt="" class="me-3"/>Backup & Disaster Recovery</h2>
+ <div className="tab-pane" id="backup" role="tabpanel" aria-labelledby="backup-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/Backup_icon.svg" alt="" className="me-3"/>Backup & Disaster Recovery</h2>
<p>
Supports backup and disaster recovery solutions through
CloudStack’s <strong>APIs and extensible architecture</strong>,
enabling third-party tools and services to seamlessly integrate with
the platform for data protection and continuity.
</p>
- <div class="row integration-images">
- <div class="col">
- <div class="tab-box box-acronis box192"><img src="/img/acronis_logo.svg" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col">
+ <div className="tab-box box-acronis box192"><img src="/img/acronis_logo.svg" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="containers" label="Containers">
- <div class="tab-pane" id="containers" role="tabpanel" aria-labelledby="containers-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/containers_icon.svg" alt="" class="me-3"/>Containers</h2>
+ <div className="tab-pane" id="containers" role="tabpanel" aria-labelledby="containers-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/containers_icon.svg" alt="" className="me-3"/>Containers</h2>
<p>
CloudStack supports different containers through its Container
Service, which can manage and orchestrate container-based workloads
alongside traditional virtual machines, <strong>providing a unified
cloud infrastructure platform</strong>.
</p>
- <div class="row integration-images">
- <div class="col">
- <div class="tab-box box-kubernetes box192"><img src="/img/kubernetes_logo.svg" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col">
+ <div className="tab-box box-kubernetes box192"><img src="/img/kubernetes_logo.svg" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="hypervisors" label="Hypervisors">
- <div class="tab-pane" id="hypervisors" role="tabpanel" aria-labelledby="hypervisors-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/Hypervisors_icon.svg" alt="" class="me-3"/>Hypervisors</h2>
+ <div className="tab-pane" id="hypervisors" role="tabpanel" aria-labelledby="hypervisors-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/Hypervisors_icon.svg" alt="" className="me-3"/>Hypervisors</h2>
<p>
Supports different hypervisors through
CloudStack’s <strong>hypervisor-agnostic architecture</strong>,
allowing deployment and management of virtualized resources across
various hypervisor platforms.
</p>
- <div class="row integration-images">
- <div class="col-md-6">
- <div class="tab-box box-blue box278"><img src="/img/MS_hyper-v_logo.png" alt="hyper-v"/></div>
+ <div className="row integration-images">
+ <div className="col-md-6">
+ <div className="tab-box box-blue box278"><img src="/img/MS_hyper-v_logo.png" alt="hyper-v"/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-white box278"><img src="/img/VM_ware_logo.svg" alt="vmware"/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-white box278"><img src="/img/VM_ware_logo.svg" alt="vmware"/></div>
</div>
- <div class="col-md-12">
- <div class="tab-box box-citrix box131"><img src="/img/citrix_logo.svg" alt="citrix"/></div>
+ <div className="col-md-12">
+ <div className="tab-box box-citrix box131"><img src="/img/citrix_logo.svg" alt="citrix"/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-dgray box131"><img src="/img/KVM_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-dgray box131"><img src="/img/KVM_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-lgray box131"><img src="/img/XCP-ng_logo.png" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-lgray box131"><img src="/img/XCP-ng_logo.png" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="monitoring" label="Monitoring">
- <div class="tab-pane" id="monitoring" role="tabpanel" aria-labelledby="monitoring-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/monitoring_icon.svg" alt="" class="me-3"/>Monitoring</h2>
+ <div className="tab-pane" id="monitoring" role="tabpanel" aria-labelledby="monitoring-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/monitoring_icon.svg" alt="" className="me-3"/>Monitoring</h2>
<p>
Apache CloudStack supports different hypervisors through
its <strong>hypervisor-agnostic architecture</strong>, allowing
deployment and management of virtualized resources across various
hypervisor platforms.
</p>
- <div class="row integration-images">
- <div class="col">
- <div class="tab-box box-veeam box192"><img src="/img/veeam_logo.svg" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col">
+ <div className="tab-box box-veeam box192"><img src="/img/veeam_logo.svg" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="networking" label="Networking">
- <div class="tab-pane" id="networking" role="tabpanel" aria-labelledby="networking-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/networking_icon.svg" alt="" class="me-3"/>Networking</h2>
+ <div className="tab-pane" id="networking" role="tabpanel" aria-labelledby="networking-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/networking_icon.svg" alt="" className="me-3"/>Networking</h2>
<p>
Support different networking integrations through CloudStack’s modular
networking framework, which facilitates the integration
of <strong>various network technologies and services to meet diverse
infrastructure needs</strong>.
</p>
- <div class="row integration-images">
- <div class="col">
- <div class="tab-box box-tfabric box192"><img src="/img/tungsten_logo.svg" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col">
+ <div className="tab-box box-tfabric box192"><img src="/img/tungsten_logo.svg" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="storage" label="Storage">
- <div class="tab-pane" id="storage" role="tabpanel" aria-labelledby="storage-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/storage_icon.svg" alt="" class="me-3"/>Storage</h2>
+ <div className="tab-pane" id="storage" role="tabpanel" aria-labelledby="storage-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/storage_icon.svg" alt="" className="me-3"/>Storage</h2>
<p>
Apache CloudStack supports different storage integrations through its
pluggable storage framework, allowing seamless integration with
various storage systems and technologies for <strong>versatile data
management and storage options</strong>.
</p>
- <div class="row integration-images">
- <div class="col-md-6">
- <div class="tab-box box-white box278"><img src="/img/storpool_logo.svg" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col-md-6">
+ <div className="tab-box box-white box278"><img src="/img/storpool_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-netapp box278"><img src="/img/net_app__solidfire_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-netapp box278"><img src="/img/net_app__solidfire_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-pure box131"><img src="/img/pure_storage-logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-pure box131"><img src="/img/pure_storage-logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-ceph box131"><img src="/img/ceph_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-ceph box131"><img src="/img/ceph_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-gluster box90"><img src="/img/gluster_logo.png" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-gluster box90"><img src="/img/gluster_logo.png" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-nutanix box172"><img src="/img/nutanix_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-nutanix box172"><img src="/img/nutanix_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-dell box172"><img src="/img/dell_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-dell box172"><img src="/img/dell_logo.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-cloudian box172"><img src="/img/cloudian_logo.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-cloudian box172"><img src="/img/cloudian_logo.svg" alt=""/></div>
</div>
</div>
</div>
</TabItem>
<TabItem value="billing" label="Billing">
- <div class="tab-pane" id="storage" role="tabpanel" aria-labelledby="storage-tab" tabindex="0">
- <h2 class="integration-title"><img src="/img/storage_icon.svg" alt="" class="me-3"/>Storage</h2>
+ <div className="tab-pane" id="storage" role="tabpanel" aria-labelledby="storage-tab" tabindex="0">
+ <h2 className="integration-title"><img src="/img/storage_icon.svg" alt="" className="me-3"/>Storage</h2>
<p>
Apache CloudStack offers integrations with a variety of self-service
intuitive billing and cloud management portals, designed to empower
@@ -299,29 +299,29 @@ manage cloud resources effectively . These solutions offer tools for
service orchestration, automation, billing, and seamless integration
with various IaaS cloud ecosystems.
</p>
- <div class="row integration-images">
- <div class="col-md-6">
- <div class="tab-box box-cloudmc box131"><img src="/img/cloud-mc-white.png" height="47p" alt=""/></div>
+ <div className="row integration-images">
+ <div className="col-md-6">
+ <div className="tab-box box-cloudmc box131"><img src="/img/cloud-mc-white.png" height="47p" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-stackconsole box131"><img src="/img/Stack Console SVG.svg" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-stackconsole box131"><img src="/img/Stack Console SVG.svg" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-stackbill box131"><img src="/img/stack-bill-logo-02.png" height="47p" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-stackbill box131"><img src="/img/stack-bill-logo-02.png" height="47p" alt=""/></div>
</div>
- <div class="col-md-6">
- <div class="tab-box box-hostbill box131"><img src="/img/hostbill-logo.png" height="47p" alt=""/></div>
+ <div className="col-md-6">
+ <div className="tab-box box-hostbill box131"><img src="/img/hostbill-logo.png" height="47p" alt=""/></div>
</div>
- <div class="col-md-12">
- <div class="tab-box box-apiculus box131"><img src="/img/apiculus-logo.png" height="47p" alt=""/></div>
+ <div className="col-md-12">
+ <div className="tab-box box-apiculus box131"><img src="/img/apiculus-logo.png" height="47p" alt=""/></div>
</div>
</div>
</div>
</TabItem>
</Tabs>
</div>
- <div class="col-lg-6">
- <div class="tab-content mt-5">
+ <div className="col-lg-6">
+ <div className="tab-content mt-5">
</div>
</div>
</div>
@@ -330,12 +330,12 @@ with various IaaS cloud ecosystems.
<OurUsers/>
- <section class="grey-splash">
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mb-4">Why Integrate with CloudStack</h2>
- <p class="px18">
+ <section className="grey-splash">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mb-4">Why Integrate with CloudStack</h2>
+ <p className="px18">
Integrating with Apache CloudStack offers a number of benefits to an
organisation, including:
</p>
@@ -348,25 +348,25 @@ organisation, including:
<li>Collaboration and <strong>Community Engagement</strong></li>
</ul>
</div>
- <div class="col-lg-6 text-center">
+ <div className="col-lg-6 text-center">
<a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank">
- <img src="/img/CloudStack_survey4.png" class="img-fluid mt-4" alt="CloudStack survey"/>
+ <img src="/img/CloudStack_survey4.png" className="img-fluid mt-4" alt="CloudStack survey"/>
</a>
</div>
</div>
</div>
</section>
- <section class="m80px">
- <div class="container">
- <div class="row">
- <div class="col">
- <div class="section-title text-center mb-4">Solution briefs</div>
+ <section className="m80px">
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <div className="section-title text-center mb-4">Solution briefs</div>
</div>
</div>
- <div class="row">
- <div class="col-lg-8 offset-lg-2">
- <p class="px18 text-center mb-5">
+ <div className="row">
+ <div className="col-lg-8 offset-lg-2">
+ <p className="px18 text-center mb-5">
The CloudStack community has made a significant impact through the
creation of numerous solution briefs. These documents serve
as <strong>invaluable resources</strong> for users and organizations
@@ -378,29 +378,29 @@ and thriving ecosystem.</strong>
</p>
</div>
</div>
- <div class="row">
- <div class="col-lg-4 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/Terraform%20Solution%20Brief_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body height300">
- <p class="blue-title">CASE STUDY</p>
- <div class="apache-card-title">Apache CloudStack and Terraform Solution Brief</div>
+ <div className="row">
+ <div className="col-lg-4 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/Terraform%20Solution%20Brief_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body height300">
+ <p className="blue-title">CASE STUDY</p>
+ <div className="apache-card-title">Apache CloudStack and Terraform Solution Brief</div>
<p>
IT solution providers need to satisfy the demand for the delivery of
diverse services in the short-term.
</p>
</div>
- <div class="apache-card-footer">
- <a href="" class="btn btn-primary">Download</a>
+ <div className="apache-card-footer">
+ <a href="" className="btn btn-primary">Download</a>
</div>
</div>
</div>
- <div class="col-lg-4 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/StorPool%20Storage_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body height300">
- <p class="blue-title">CASE STUDY</p>
- <div class="apache-card-title">
+ <div className="col-lg-4 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/StorPool%20Storage_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body height300">
+ <p className="blue-title">CASE STUDY</p>
+ <div className="apache-card-title">
CloudStack Integrations: StorPool Storage - High-performance primary
storage platform
</div>
@@ -409,21 +409,21 @@ This PoC guide gives you all the guidance you need to perform a
successful Proof of…
</p>
</div>
- <div class="apache-card-footer">
- <a href="files/acs-solution-brief-storpool-2022.pdf" class="btn btn-primary">Download</a>
+ <div className="apache-card-footer">
+ <a href="files/acs-solution-brief-storpool-2022.pdf" className="btn btn-primary">Download</a>
</div>
</div>
</div>
- <div class="col-lg-4 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/LinBit_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body height300">
- <p class="blue-title">CASE STUDY</p>
- <div class="apache-card-title">CloudStack Integrations: LINBIT - Open-source SDS Solution</div>
+ <div className="col-lg-4 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/LinBit_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body height300">
+ <p className="blue-title">CASE STUDY</p>
+ <div className="apache-card-title">CloudStack Integrations: LINBIT - Open-source SDS Solution</div>
<p>CloudStack is a multi-hypervisor, multi-tenant, high-availability cloud management…</p>
</div>
- <div class="apache-card-footer">
- <a href="" class="btn btn-primary">Download</a>
+ <div className="apache-card-footer">
+ <a href="" className="btn btn-primary">Download</a>
</div>
</div>
</div>
diff --git a/src/pages/kubernetes.js b/src/pages/kubernetes.js
index ae0f0fddb..e128c3ef9 100644
--- a/src/pages/kubernetes.js
+++ b/src/pages/kubernetes.js
@@ -8,14 +8,14 @@ import TabItem from '@theme/TabItem';
function KubernetesHeader() {
const {siteConfig} = useDocusaurusContext();
return (
- <header class="header-kubernetes header-homepage">
- <div class="container">
- <div class="row">
- <div class="col-lg-6">
+ <header className="header-kubernetes header-homepage">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6">
<h1><strong>Kubernetes on<br/> CloudStack</strong> in Production</h1>
- <p class="px18 k-subtitle">Reduces operational overhead and infrastructure costs</p>
+ <p className="px18 k-subtitle">Reduces operational overhead and infrastructure costs</p>
</div>
- <div class="col-lg-6"><img src="/img/CloudStack_release_illustration2.png" class="img-fluid mtm50" alt=""/></div>
+ <div className="col-lg-6"><img src="/img/CloudStack_release_illustration2.png" className="img-fluid mtm50" alt=""/></div>
</div>
</div>
</header>
@@ -28,11 +28,11 @@ export default function KubernetesOnCloudStack() {
<KubernetesHeader />
<main>
<section>
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mt-lg-5">About Apache CloudStack</h2>
- <p class="px18">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mt-lg-5">About Apache CloudStack</h2>
+ <p className="px18">
Apache CloudStack is an open-source IaaS platform that is used to
build public or private cloud environments. CloudStack allows you to
easily deploy Kubernetes clusters into your own infrastructure without
@@ -40,17 +40,17 @@ worrying about the underlying infrastructure and removing the coupling
to specific virtualization platforms. It also allows easy deployment
of Kubernetes as a Service (KaaS) offerings.
</p>
- <p class="px18">
+ <p className="px18">
Host your Kubernetes clusters on it to simplify your work and ensure
consistent and predictable behavior of your applications, no matter
the underlying infrastructure.
</p>
- <p class="px18">
+ <p className="px18">
CloudStack provides a Kubernetes Cluster API Provider and also the
CloudStack Kubernetes Service - giving a choice of integration
techniques.
</p>
- <p class="px18">
+ <p className="px18">
CloudStack is in widespread production usage at many of the world’s
largest organizations including many Fortune 500 companies. It
includes the entire “stack” of features you need: compute
@@ -59,21 +59,21 @@ complete and open native API, resource accounting, and a first-class
User Interface.
</p>
</div>
- <div class="col-lg-6 margin-second text-center">
+ <div className="col-lg-6 margin-second text-center">
<a href="https://docs.google.com/forms/d/e/1FAIpQLScPHIRetdt-pxPT62IesXMoQUmhQ8ATGKcYZa507mB9uwzn-Q/viewform" target="_blank">
- <img src="/img/CloudStack_survey2.png" class="img-fluid" alt="CloudStack survey"/>
+ <img src="/img/CloudStack_survey2.png" className="img-fluid" alt="CloudStack survey"/>
</a>
</div>
</div>
</div>
</section>
- <section class="bgr-gray">
- <div class="container">
- <div class="row">
- <div class="col-lg-6">
- <div class="section-title">Explore the Kubernetes Cluster API Provider for Apache CloudStack</div>
- <p class="px18 mt-4">
+ <section className="bgr-gray">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6">
+ <div className="section-title">Explore the Kubernetes Cluster API Provider for Apache CloudStack</div>
+ <p className="px18 mt-4">
The Kubernetes Cluster API (CAPI) provider for Apache CloudStack
allows Kubernetes users to build and manage resources on Apache
CloudStack. The provider is available under the Apache 2 open-source
@@ -86,25 +86,25 @@ lessons learned from previous cluster managers such as kops and
kubicorn.
</p>
</div>
- <div class="col-lg-6">
+ <div className="col-lg-6">
<iframe width="100%" height="315" src="https://www.youtube.com/embed/NcfVkVT48Kk" title="Bootstrapping K8S Cluster using CAPC - Apache CloudStack - Kubernetes" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe>
</div>
</div>
</div>
</section>
- <div class="container">
- <section class="dark-blue p-5 right-banner">
- <div class="row">
- <div class="col-lg-7">
- <h2 class="section-title">Launching a Kubernetes cluster on Apache CloudStack</h2>
- <p class="px18 mt-4">
+ <div className="container">
+ <section className="dark-blue p-5 right-banner">
+ <div className="row">
+ <div className="col-lg-7">
+ <h2 className="section-title">Launching a Kubernetes cluster on Apache CloudStack</h2>
+ <p className="px18 mt-4">
If users want to launch a
Kubernetes cluster on Apache CloudStack, they can check out the Getting
Started Guide to create your first Kubernetes cluster on Apache
CloudStack using Cluster API.
</p>
- <p class="px18 mb-4">
+ <p className="px18 mb-4">
CloudStack hybrid deployments of Kubernetes. It is built atop the
lessons learned from previous cluster managers such as kops and
kubicorn.
@@ -114,18 +114,18 @@ kubicorn.
</section>
</div>
- <section class="m80px">
- <div class="container">
- <div class="row">
- <div class="col-lg-6 order-lg-2">
- <h2 class="section-title mb-4">Explore the CloudStack Kubernetes Service</h2>
- <p class="px18">
+ <section className="m80px">
+ <div className="container">
+ <div className="row">
+ <div className="col-lg-6 order-lg-2">
+ <h2 className="section-title mb-4">Explore the CloudStack Kubernetes Service</h2>
+ <p className="px18">
The CloudStack Kubernetes Service (CKS) gives Cloud Service Providers
a Container as a Service (CaaS) offering within their existing IaaS
environments, with no disruption to user experience or business
process.
</p>
- <p class="px18">
+ <p className="px18">
The CloudStack Kubernetes Service is developed as a plug-in to Apache
CloudStack. It gives users the ability to create Kubernetes clusters
within an existing multi-tenant environment provided by
@@ -135,25 +135,25 @@ all in the same user-interface they use to manage their existing
compute, network and storage.
</p>
</div>
- <div class="col-lg-6 text-center"><img src="/img/apache_cloudstack_services.png" alt="" class="img-fluid"/></div>
+ <div className="col-lg-6 text-center"><img src="/img/apache_cloudstack_services.png" alt="" className="img-fluid"/></div>
</div>
</div>
</section>
- <section class="light-blue">
- <div class="container">
- <div class="row">
- <div class="col text-center">
- <div class="section-title mb-4">Use Cases</div>
+ <section className="light-blue">
+ <div className="container">
+ <div className="row">
+ <div className="col text-center">
+ <div className="section-title mb-4">Use Cases</div>
</div>
</div>
- <div class="row">
- <div class="col col-lg-9 offset-lg-2">
+ <div className="row">
+ <div className="col col-lg-9 offset-lg-2">
<Tabs className="tabbed-examples tab-box">
<TabItem value="self–healing" label="Self–Healing" default>
- <div class="row p-4">
- <div class="col-lg-2 text-center"><img src="/img/kubernetes_healing_icon.svg" alt="Self–Healing" class="mb-4"/></div>
- <div class="col-lg-10">
- <p class="px18">
+ <div className="row p-4">
+ <div className="col-lg-2 text-center"><img src="/img/kubernetes_healing_icon.svg" alt="Self–Healing" className="mb-4"/></div>
+ <div className="col-lg-10">
+ <p className="px18">
<strong>The ClusterAPI provides self-healing when a Kubernetes node
fails, spawning new Instances of the pod on a new node, as native
Kubernetes does not have the ability to provision new infrastructure
@@ -161,7 +161,7 @@ when this occurs.</strong> Since ClusterAPI manages infrastructure
and Kubernetes at the same time, it can throw more resources onto
CloudStack when a failure occurs.
</p>
- <p class="px18">
+ <p className="px18">
The MachineHealthCheck controller is used to monitor and certify the
health of the control plane of the work nodes, guaranteeing the
integrity of the services. When a node fails, or resources are
@@ -173,16 +173,16 @@ reschedule the podes from failed nodes.
</div>
</TabItem>
<TabItem value="mcm" label="Multiple Cluster Management">
- <div class="row p-4">
- <div class="col-lg-2 text-center"><img src="/img/multi-cluster_icon.svg" alt="Multiple Cluster Management" class="mb-4"/></div>
- <div class="col-lg-10">
- <p class="px18">
+ <div className="row p-4">
+ <div className="col-lg-2 text-center"><img src="/img/multi-cluster_icon.svg" alt="Multiple Cluster Management" className="mb-4"/></div>
+ <div className="col-lg-10">
+ <p className="px18">
When Kubernetes cluster expansion is considered, ClusterAPI provides
support for a range of different providers, including Apache
CloudStack. This ClusterAPI capability is important for companies that
use heterogeneous providers from different service providers.
</p>
- <p class="px18">
+ <p className="px18">
The ClusterAPI abstracts away the different deployment mechanisms that
are offered by various providers and infrastructure vendors, allowing
operators to fully standardize the entire deployment, regardless of
@@ -194,11 +194,11 @@ across multiple clusters, thus reducing rework.
</div>
</div>
</TabItem>
- <TabItem class="nav-link" value="scaling" label="Scaling">
- <div class="row p-4">
- <div class="col-lg-2 text-center"><img src="/img/scaling_icon.svg" alt="Scaling" class="mb-4"/></div>
- <div class="col-lg-10">
- <p class="px18">
+ <TabItem className="nav-link" value="scaling" label="Scaling">
+ <div className="row p-4">
+ <div className="col-lg-2 text-center"><img src="/img/scaling_icon.svg" alt="Scaling" className="mb-4"/></div>
+ <div className="col-lg-10">
+ <p className="px18">
Application workload is often unpredictable, and to scale up and down
Kubernetes clusters, the ClusterAPI facilitates scaling when workloads
change. The main task of the ClusterAPI is to ensure that there is
@@ -206,13 +206,13 @@ enough capacity to meet the current demand for access to the
application, also guaranteeing redundancy so that, if a control plane
fails, another can attend.
</p>
- <p class="px18">
+ <p className="px18">
With the Kubeadm Control Plane provider (KCP), the operator can
declaratively expand the Kubernetes control plane, thus managing
availability and ensuring that the control nodes are organized,
minimizing failures during the cluster lifecycle.
</p>
- <p class="px18">
+ <p className="px18">
For worker nodes, just specify the number of nodes; the clusterAPI will provision
the new CloudStack Instances and add them to the cluster. When using the
Cluster Autoscaler, the number of worker nodes is automatically
diff --git a/src/pages/learn-more.mdx b/src/pages/learn-more.mdx
index 079eb10f1..a9be25aeb 100644
--- a/src/pages/learn-more.mdx
+++ b/src/pages/learn-more.mdx
@@ -1,70 +1,70 @@
---
title: Learn More about Apache CloudStack
---
- <section class="m80px">
- <div class="container">
- <div class="row">
- <div class="col">
- <div class="section-title text-center mb-5">Learn More about Apache CloudStack</div>
+ <section className="m80px">
+ <div className="container">
+ <div className="row">
+ <div className="col">
+ <div className="section-title text-center mb-5">Learn More about Apache CloudStack</div>
</div>
</div>
- <div class="row">
- <div class="col-lg-6 mb-4">
- <div class="apache-card bgd-blue">
- <div class="img-holder"><img src="/img/Apache%20CloudStack%20at%20a%20Glance_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body">
- <div class="apache-card-title">Apache CloudStack at a Glance</div>
+ <div className="row">
+ <div className="col-lg-6 mb-4">
+ <div className="apache-card bgd-blue">
+ <div className="img-holder"><img src="/img/Apache%20CloudStack%20at%20a%20Glance_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body">
+ <div className="apache-card-title">Apache CloudStack at a Glance</div>
<p>Learn more about Apache CloudStack and the capabilities it provides for IaaS builders</p>
- <a href="/files/cloudstack-at-a-glance.pdf" class="btn btn-primary btn-dark-blue">Download</a>
+ <a href="/files/cloudstack-at-a-glance.pdf" className="btn btn-primary btn-dark-blue">Download</a>
</div>
</div>
</div>
- <div class="col-lg-6 mb-4">
- <div class="apache-card bgd-dark-blue">
- <div class="img-holder"><img src="/img/ATT-Gitops.jpg" alt="" /></div>
- <div class="apache-card-body">
+ <div className="col-lg-6 mb-4">
+ <div className="apache-card bgd-dark-blue">
+ <div className="img-holder"><img src="/img/ATT-Gitops.jpg" alt="" /></div>
+ <div className="apache-card-body">
<p>
<br/>
During the annual CloudStack Collaboration Conference 2023, Alex
Dometrius, Associate Director - Technology at AT&T, presented their
journey with Apache CloudStack.
</p>
- <a href="/blog/cloudstack-and-gitops-at-scale" class="btn btn-primary">Read more</a>
+ <a href="/blog/cloudstack-and-gitops-at-scale" className="btn btn-primary">Read more</a>
</div>
</div>
</div>
</div>
- <div class="row">
- <div class="col-lg-3 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/Delivering%20Public%20Cloud%20Services_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body">
- <p class="blue-title">SOLUTION BRIEF</p>
- <div class="apache-card-title">Delivering Public Cloud Services with CloudStack</div>
+ <div className="row">
+ <div className="col-lg-3 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/Delivering%20Public%20Cloud%20Services_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body">
+ <p className="blue-title">SOLUTION BRIEF</p>
+ <div className="apache-card-title">Delivering Public Cloud Services with CloudStack</div>
<p>Discover how to use CloudStack to provision public cloud services and improve your profitability</p>
- <a href="/files/acs-public-cloud-solution-brief.pdf" class="btn btn-primary">Download</a>
+ <a href="/files/acs-public-cloud-solution-brief.pdf" className="btn btn-primary">Download</a>
</div>
</div>
</div>
- <div class="col-lg-3 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/IKOULA_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body">
- <p class="blue-title">CASE STUDY</p>
- <div class="apache-card-title">IKOULA - The cloud leader & innovator in France</div>
+ <div className="col-lg-3 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/IKOULA_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body">
+ <p className="blue-title">CASE STUDY</p>
+ <div className="apache-card-title">IKOULA - The cloud leader & innovator in France</div>
<p>IKOULA Simplifies the Management of Large-Scale Cloud Infrastructure with CloudStack and XCP-ng</p>
- <a href="/files/acs-case-study-ikoula-2021.pdf" class="btn btn-primary">Download</a>
+ <a href="/files/acs-case-study-ikoula-2021.pdf" className="btn btn-primary">Download</a>
</div>
</div>
</div>
- <div class="col-lg-6 mb-4">
- <div class="apache-card card-border">
- <div class="img-holder"><img src="/img/Your.Online_img.png" alt="" width="100%"/></div>
- <div class="apache-card-body pt-0">
- <p class="blue-title">CASE STUDY</p>
- <div class="apache-card-title">Your.Online – A leading European online services platform</div>
+ <div className="col-lg-6 mb-4">
+ <div className="apache-card card-border">
+ <div className="img-holder"><img src="/img/Your.Online_img.png" alt="" width="100%"/></div>
+ <div className="apache-card-body pt-0">
+ <p className="blue-title">CASE STUDY</p>
+ <div className="apache-card-title">Your.Online – A leading European online services platform</div>
<p>Future-Proof Open-Source Platform Hosting Millions of Websites for Your.Online Powered by CloudStack, KVM and Ceph</p>
- <a href="/files/acs-case-study-your-online.pdf" class="btn btn-primary">Download</a>
+ <a href="/files/acs-case-study-your-online.pdf" className="btn btn-primary">Download</a>
</div>
</div>
</div>