From 85d849f6e1ccf09bf87d0783c8d37eefc2cb7632 Mon Sep 17 00:00:00 2001 From: harshita91 Date: Mon, 10 Feb 2025 14:21:13 +0530 Subject: [PATCH] Fix: Improved table layout on Partners Page (#677) --- src/pages/partners/index.js | 64 +++++++++----- src/pages/partners/index.scss | 146 ++++++++++++++++++++++++++------ src/pages/partners/partners.mdx | 29 +++++-- 3 files changed, 187 insertions(+), 52 deletions(-) diff --git a/src/pages/partners/index.js b/src/pages/partners/index.js index 29bfddf700..5923ad28f7 100644 --- a/src/pages/partners/index.js +++ b/src/pages/partners/index.js @@ -1,27 +1,51 @@ +// import React from "react"; +// import { Row, Col } from "antd"; +// import Layout from "@theme/Layout"; +// import Translate from "@docusaurus/Translate"; +// import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; +// import PartnersData from "./partners.mdx"; +// import "./index.scss"; + +// export default function Partners() { + +// return ( +// +//
+//
+//

+// KubeEdge Distributions, Hosted Platforms, and Installers +//

+//
+//
+//
+// +//
+//
+//
+// +// ); +// } import React from "react"; -import { Row, Col } from "antd"; import Layout from "@theme/Layout"; import Translate from "@docusaurus/Translate"; -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import PartnersData from "./partners.mdx"; +import PartnersData from "@site/src/pages/partners/partners.mdx"; // Ensure correct path import "./index.scss"; export default function Partners() { - - return ( - -
-
-

- KubeEdge Distributions, Hosted Platforms, and Installers -

-
-
-
- -
-
-
- - ); + return ( + +
+
+

+ KubeEdge Distributions, Hosted Platforms, and Installers +

+
+
+
+ {/* Ensure this is used correctly */} +
+
+
+ + ); } diff --git a/src/pages/partners/index.scss b/src/pages/partners/index.scss index 1146b27f1a..9591e3cacb 100644 --- a/src/pages/partners/index.scss +++ b/src/pages/partners/index.scss @@ -1,32 +1,130 @@ +// .partners-pages { +// background-color: var(--ifm-background-color); + +// .partners-header { +// height: 350px; +// display: flex; +// flex-direction: column; +// justify-content: center; +// align-items: center; +// background-image: url("/img/partners.jpg"); +// background-repeat: no-repeat; +// background-size: cover; + +// .partners { +// font-size: 40px; +// font-weight: 700; +// color: white; +// } + +// } + +// .partners-content { +// display: flex; +// justify-content: center; +// margin: 50px 0; + +// .partners-md { +// width: 60%; +// } +// } +// } + .partners-pages { background-color: var(--ifm-background-color); + padding: 20px; +} - .partners-header { - height: 350px; - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; - background-image: url("/img/partners.jpg"); - background-repeat: no-repeat; - background-size: cover; - - .partners { - font-size: 40px; - font-weight: 700; - color: white; - } +.partners-header { + height: 350px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + background-image: url("/img/partners.jpg"); + background-repeat: no-repeat; + background-size: cover; + background-position: center; + text-align: center; + .partners { + font-size: 40px; + font-weight: 700; + color: white; } +} + +.partners-content { + display: flex; + justify-content: center; + margin: 50px 0; +} + +.partners-md { + width: 85%; /* Reduce width for better margins */ + max-width: 1200px; /* Keep it centered */ + background-color: white; /* Ensure background is visible */ + padding: 20px; + border-radius: 8px; /* Slight rounding for better aesthetics */ + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); +} + +/* Table Styling */ +table { + width: 100%; + border-collapse: collapse; + border-spacing: 0; + margin: 20px 0; /* Add margin to keep spacing */ +} + +th, +td { + padding: 12px 15px; + text-align: left; + border: 1px solid #ddd; +} + +th { + background-color: var(--ifm-color-primary); + color: white; + text-align: center; +} + +/* Column Width Adjustments */ +th:nth-child(1), +td:nth-child(1) { + /* Organization/Company */ + width: 18%; + text-align: center; +} + +th:nth-child(2), +td:nth-child(2) { + /* Product */ + width: 15%; /* Reduced width */ + text-align: center; +} + +th:nth-child(3), +td:nth-child(3) { + /* Description */ + width: 50%; /* Expanded */ +} - .partners-content { - display: flex; - justify-content: center; - margin: 50px 0; +th:nth-child(4), +td:nth-child(4) { + /* Website */ + width: 17%; + text-align: center; +} +/* Hyperlink Styling */ +td a { + color: var(--ifm-color-primary); + text-decoration: none; + font-weight: bold; +} - .partners-md { - width: 60%; - } - } -} \ No newline at end of file +td a:hover { + text-decoration: underline; +} diff --git a/src/pages/partners/partners.mdx b/src/pages/partners/partners.mdx index a76435bdb3..42b24752ad 100644 --- a/src/pages/partners/partners.mdx +++ b/src/pages/partners/partners.mdx @@ -3,13 +3,26 @@ title: KubeEdge Partners hide_table_of_contents: true --- -KubeEdge works with partners to create a strong, vibrant cloud native edge computing ecosystem. Here we have a list of KubeEdge Distributions, Hosted Platforms and Installers with deep experience helping enterprises successfully adopt KubeEdge. + + KubeEdge works with partners to create a strong, vibrant cloud native edge + computing ecosystem. Here we have a list of{" "} + + KubeEdge Distributions, Hosted Platforms and Installers + {" "} + with deep experience helping enterprises successfully adopt KubeEdge. + + + To join this list (Sort alphabetically by organization/company name), please + follow{" "} + + partners instructions + + . + -To join this list (Sort alphabetically by organization/company name), please follow partners instructions. - -| Organization/Company | Product | Description | Website | -| :-: | :-: |-------------|---------| -| DaoCloud | DaoCloud Enterprise 5.0 | DaoCloud Enterprise 5.0 (DCE 5.0) is an advanced and highly scalable cloud native operating system designed to provide a consistent and dependable experience across diverse infrastructures and environments. With its support for heterogeneous clouds, edge clouds, and multicloud management, DCE 5.0 offers unparalleled flexibility. | https://www.daocloud.io/products/standard-edition/index.html | -| Huawei Cloud | IEF | Edge computing platform built upon KubeEdge, provides extremely lightweight, edge intelligent, and powerful in terms of computing capabilities. | https://www.huaweicloud.com/product/ief.html | -| KubeSphere | KubeSphere Enterprise 4.0 | Based on the open and extensible architecture of KubeSphere LuBan, KubeSphere Enterprise 4.0 can easily achieve upstream and downstream linkage of applications, integrate various high-quality extensions from KubeSphere Marketplace anytime, and provide seamless business capabilities and highly consistent product experience. Edge computing extension based on KubeEdge provide easier-to-use and broader coverage of edge computing capabilities, solving operational issues such as node status management and relationship tree management for users. | https://kubesphere.co/kse/ | \ No newline at end of file +| Organization/Company | Product | Description | Website | +| :------------------: | :-----------------------: | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------ | +| DaoCloud | DaoCloud Enterprise 5.0 | DaoCloud Enterprise 5.0 (DCE 5.0) is an advanced and highly scalable cloud native operating system designed to provide a consistent and dependable experience across diverse infrastructures and environments. With its support for heterogeneous clouds, edge clouds, and multicloud management, DCE 5.0 offers unparalleled flexibility. | [DaoCloud](https://www.daocloud.io/products/standard-edition/index.html) | +| Huawei Cloud | IEF | Edge computing platform built upon KubeEdge, provides extremely lightweight, edge intelligent, and powerful in terms of computing capabilities. | [Huawei Cloud](https://www.huaweicloud.com/product/ief.html) | +| KubeSphere | KubeSphere Enterprise 4.0 | Based on the open and extensible architecture of KubeSphere LuBan, KubeSphere Enterprise 4.0 can easily achieve upstream and downstream linkage of applications, integrate various high-quality extensions from KubeSphere Marketplace anytime, and provide seamless business capabilities and highly consistent product experience. Edge computing extension based on KubeEdge provide easier-to-use and broader coverage of edge computing capabilities, solving operational issues such as node status management and relationship tree management for users. | [KubeSphere ](https://kubesphere.co/kse/) |