Skip to content

Commit 3bfa475

Browse files
kubeedge-botkubeedge-bot
authored
Merge pull request #680 from harshita9104/fix-partners-table-final
Fix: Improved table layout (#677)
2 parents 17bc54d + e56f83b commit 3bfa475

File tree

3 files changed

+125
-51
lines changed

3 files changed

+125
-51
lines changed

‎src/pages/partners/index.js

+17-20
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,24 @@
11
import React from "react";
2-
import { Row, Col } from "antd";
32
import Layout from "@theme/Layout";
43
import Translate from "@docusaurus/Translate";
5-
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
6-
import PartnersData from "./partners.mdx";
4+
import PartnersData from "@site/src/pages/partners/partners.mdx"; // Ensure correct path
75
import "./index.scss";
86

97
export default function Partners() {
10-
11-
return (
12-
<Layout>
13-
<div className="partners-pages">
14-
<div className="partners-header">
15-
<h1 className="partners">
16-
<Translate>KubeEdge Distributions, Hosted Platforms, and Installers</Translate>
17-
</h1>
18-
</div>
19-
<div className="partners-content">
20-
<div className="partners-md">
21-
<PartnersData />
22-
</div>
23-
</div>
24-
</div>
25-
</Layout>
26-
);
8+
return (
9+
<Layout title="KubeEdge Partners">
10+
<div className="partners-pages">
11+
<div className="partners-header">
12+
<h1 className="partners">
13+
KubeEdge Distributions, Hosted Platforms, and Installers
14+
</h1>
15+
</div>
16+
<div className="partners-content">
17+
<div className="partners-md">
18+
<PartnersData /> {/* Ensure this is used correctly */}
19+
</div>
20+
</div>
21+
</div>
22+
</Layout>
23+
);
2724
}

‎src/pages/partners/index.scss

+103-24
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,111 @@
11
.partners-pages {
22
background-color: var(--ifm-background-color);
3+
padding: 20px;
4+
}
35

4-
.partners-header {
5-
height: 350px;
6-
display: flex;
7-
flex-direction: column;
8-
justify-content: center;
9-
align-items: center;
10-
background-image: url("/img/partners.jpg");
11-
background-repeat: no-repeat;
12-
background-size: cover;
13-
14-
.partners {
15-
font-size: 40px;
16-
font-weight: 700;
17-
color: white;
18-
}
196

7+
.partners-header {
8+
height: 350px;
9+
display: flex;
10+
flex-direction: column;
11+
justify-content: center;
12+
align-items: center;
13+
background-image: url("/img/partners.jpg");
14+
background-repeat: no-repeat;
15+
background-size: cover;
16+
background-position: center;
17+
text-align: center;
18+
19+
20+
.partners {
21+
font-size: 40px;
22+
font-weight: 700;
23+
color: white;
2024
}
25+
}
26+
27+
28+
.partners-content {
29+
display: flex;
30+
justify-content: center;
31+
margin: 50px 0;
32+
}
33+
34+
35+
.partners-md {
36+
width: 85%; /* Reduce width for better margins */
37+
max-width: 1200px; /* Keep it centered */
38+
background-color: white; /* Ensure background is visible */
39+
padding: 20px;
40+
border-radius: 8px; /* Slight rounding for better aesthetics */
41+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
42+
}
43+
44+
45+
/* Table Styling */
46+
table {
47+
width: 100%;
48+
border-collapse: collapse;
49+
border-spacing: 0;
50+
margin: 20px 0; /* Add margin to keep spacing */
51+
}
52+
53+
54+
th,
55+
td {
56+
padding: 12px 15px;
57+
text-align: left;
58+
border: 1px solid #ddd;
59+
}
60+
61+
62+
th {
63+
background-color: var(--ifm-color-primary);
64+
color: white;
65+
text-align: center;
66+
}
67+
68+
69+
/* Column Width Adjustments */
70+
th:nth-child(1),
71+
td:nth-child(1) {
72+
/* Organization/Company */
73+
width: 18%;
74+
text-align: center;
75+
}
76+
77+
78+
th:nth-child(2),
79+
td:nth-child(2) {
80+
/* Product */
81+
width: 15%; /* Reduced width */
82+
text-align: center;
83+
}
84+
85+
86+
th:nth-child(3),
87+
td:nth-child(3) {
88+
/* Description */
89+
width: 50%; /* Expanded */
90+
}
91+
92+
93+
th:nth-child(4),
94+
td:nth-child(4) {
95+
/* Website */
96+
width: 17%;
97+
text-align: center;
98+
}
99+
21100

22-
.partners-content {
23-
display: flex;
24-
justify-content: center;
25-
margin: 50px 0;
101+
/* Hyperlink Styling */
102+
td a {
103+
color: var(--ifm-color-primary);
104+
text-decoration: none;
105+
font-weight: bold;
106+
}
26107

27108

28-
.partners-md {
29-
width: 60%;
30-
}
31-
}
32-
}
109+
td a:hover {
110+
text-decoration: underline;
111+
}

‎src/pages/partners/partners.mdx

+5-7
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,8 @@ hide_table_of_contents: true
66
<span style={{fontSize:'18px', display:'block', marginBottom:'10px'}}>KubeEdge works with partners to create a strong, vibrant cloud native edge computing ecosystem. Here we have a list of <span style={{fontWeight:'bold'}}>KubeEdge Distributions, Hosted Platforms and Installers</span> with deep experience helping enterprises successfully adopt KubeEdge.</span>
77

88

9-
<span style={{fontSize:'18px', display:'block', marginBottom:'20px'}}>To join this list (Sort alphabetically by organization/company name), please follow <a href="https://kubeedge.io/docs/community/partners" target="_blank">partners instructions</a>.</span>
10-
11-
| Organization/Company | Product | Description | Website |
12-
| :-: | :-: |-------------|---------|
13-
| 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 |
14-
| 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 |
15-
| 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/ |
9+
| Organization/Company | Product | Description | Website |
10+
| :------------------: | :-----------------------: | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------- |
11+
| 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. | [Dao Cloud](https://www.daocloud.io/products/standard-edition/index.html) |
12+
| 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) |
13+
| 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/) |

0 commit comments

Comments
 (0)