add video page

This commit is contained in:
liuboaibc 2020-05-28 11:14:15 +08:00
parent 95c69b6760
commit bbea743ccf
20 changed files with 1028 additions and 78 deletions

View File

@ -79,8 +79,8 @@
position: absolute;
top: 40px;
box-sizing: border-box;
width: 306px;
padding: 12px 30px 18px;
width: 160px;
padding: 12px 0;
left: 50%;
transform: translateX(-50%);
background: #ffffff;
@ -90,9 +90,7 @@
box-shadow: 0 4px 8px 0 rgba(36,46,66,.06),0 8px 16px 0 rgba(36,46,66,.05);
li {
display: inline-block;
width: 100px;
padding-left: 20px;
padding: 0 20px;
height: 32px;
line-height: 32px;
font-size: 12px;
@ -108,11 +106,8 @@
}
li:nth-child(2n) {
margin-left: 6px;
}
.active {
border-left: 2px solid #55bc8a;
a {
color: #55bc8a;
}
@ -165,6 +160,7 @@
.dropdown-menu {
color: black;
width: 120px;
padding-left: 20px;
li {
padding: 0;
margin: 0;

View File

@ -1,22 +1,44 @@
.open-source-header {
text-align: center;
margin-top: 93px;
height: 300px;
color: #ffffff;
& > img {
width: 100%;
height: 100%;
object-fit:cover;
}
& > div {
position: absolute;
top: 129px;
left: 0;
right: 0;
text-align: center;
}
h1 {
margin-bottom: 20px;
height: 40px;
text-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
font-size: 40px;
font-weight: 600;
line-height: 1.4;
text-shadow: 0 8px 16px rgba(35,45,65,.16);
color: #36435c;
font-weight: bold;
line-height: 1;
letter-spacing: -0.11px;
color: #ffffff;
}
p {
max-width: 760px;
margin: 0 auto 30px;
font-size: 14px;
line-height: 2.29;
text-shadow: 0 8px 16px rgba(35,45,65,.16);
color: #36435c;
height: 24px;
margin-top: 12px;
margin-bottom: 16px;
text-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
font-size: 16px;
line-height: 1.5;
letter-spacing: -0.04px;
text-align: center;
color: #ffffff;
}
button {
height: 48px;
border-radius: 30px;
@ -44,41 +66,44 @@
vertical-align: text-top;
}
}
ul {
margin-top: 77px;
li {
position: relative;
display: inline-block;
margin-bottom: 32px;
font-size: 16px;
font-weight: 600;
color: #36435c;
cursor: pointer;
}
li + li {
margin-left: 40px;
}
a {
color: rgb(48, 62, 90);
&:hover {
color: #4ca986;
}
}
.active {
color: #4ca986;
&::after {
position: absolute;
bottom: -32px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
content: "";
width: 0;
height: 0;
border: 1em solid transparent;
border-bottom-color: #fff;
}
}
}
.open-source-tab {
width: 1160px;
margin: 40px auto 0;
text-align: center;
li {
position: relative;
display: inline-block;
margin-bottom: 32px;
font-size: 16px;
font-weight: 600;
color: #36435c;
cursor: pointer;
}
li + li {
margin-left: 40px;
}
a {
color: rgb(48, 62, 90);
&:hover {
color: #4ca986;
}
}
.active {
color: #4ca986;
&::after {
position: absolute;
bottom: -32px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
content: "";
width: 0;
height: 0;
border: 1em solid transparent;
border-bottom-color: #fff;
}
}
}

View File

@ -1 +1,184 @@
@import 'open-source';
@import 'open-source';
.section-1 {
background-color: #fff;
padding-top: 60px;
padding-bottom: 100px;
& > div {
width: 1160px;
margin: 0 auto;
& > .video-tab-ul {
padding: 30px 34px 22px;
border-radius: 5px;
box-shadow: 0 4px 16px 0 rgba(7,42,68,.1);
background-color: #fff;
li {
display: inline-block;
min-width: 48px;
padding: 8px 16px;
margin-bottom: 8px;
border-radius: 20px;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
cursor: pointer;
font-size: 16px;
font-weight: 500;
line-height: 1.5;
text-align: center;
&:hover {
box-shadow: 0 8px 16px 0 rgba(101,193,148,.2),0 0 50px 0 rgba(101,193,148,.1);
background-color: #55bc8a;
color: #fff;
}
}
.active {
box-shadow: 0 8px 16px 0 rgba(101,193,148,.2),0 0 50px 0 rgba(101,193,148,.1);
background-color: #55bc8a;
color: #fff;
}
li + li {
margin-left: 12px;
}
}
.video-ul {
margin-top: 20px;
font-size: 0;
& > li {
position: relative;
display: inline-block;
width: 360px;
height: 202px;
border-radius: 4px;
margin-bottom: 40px;
margin-right: 40px;
background-color: #eef4f8;
background-image: url('/images/videos/video-bg.svg');
overflow: hidden;
cursor: pointer;
& > img {
width: 100%;
height: 100%;
}
&:hover {
& > div {
height: 202px;
}
}
& > div {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 70px;
opacity: 0.89;
background-color: #171c34;
transition: all .2s ease-in-out;
overflow: hidden;
& > .btn {
position: absolute;
left: 50%;
bottom: 120px;
transform: translateX(-50%);
}
& > div {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 70px;
padding: 0 16px;
h3 {
font-size: 16px;
font-weight: 500;
line-height: 22px;
color: #fff;
padding: 8px 0;
margin-bottom: 6px;
border-bottom: 1px solid hsla(0,0%,100%,.1);
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
p {
font-size: 14px;
line-height: 20px;
color: #919aa3;
}
.time {
position: absolute;
right: 16px;
bottom: 6px;
}
}
}
}
li:nth-child(3n) {
margin-right: 0;
}
}
& > div {
margin-top: 20px;
text-align: center;
li {
display: inline-block;
margin: 0 10px;
}
.disabled {
a {
color: #ccd3db;
}
}
.active {
a {
color: #55bc8a;
}
}
}
}
}
.jquery-modal {
z-index: 10;
background-color: rgba(23, 28, 52, 0.5);
}
#modal-for-video {
width: 750px;
max-width: 750px;
height: 420px;
padding: 0;
border-radius: 0;
video {
width: 100%;
height: 100%;
min-height: 420px;
background-color: #171c34;
outline: none;
}
a {
top: -40px;
right: 0;
}
}

View File

@ -0,0 +1 @@
baseURL = "https://dev.kubesphere.io/"

View File

@ -1,4 +1,6 @@
---
title: "page1"
css: "scss/videos.scss"
minCss: css/jquery.modal.min.css
tip: ALL
---

View File

@ -1,4 +1,6 @@
---
title: "page1"
css: "scss/videos.scss"
minCss: css/jquery.modal.min.css
tip: 全部
---

34
data/en/video.json Normal file
View File

@ -0,0 +1,34 @@
[
{
"title": "Helm-based Application Management in KubeSphere Application Store",
"link": "https://www.youtube.com/embed/h1Mmcr4wnF8?&autoplay=1",
"createTime": "2020.4.25",
"snapshot": "/images/videos/cover.png",
"group": "",
"tag": ""
},
{
"title": "Binary to Image - Containerize Artifact and Deploy Service to Kubernetes",
"link": "https://www.youtube.com/embed/jThC4CDoCLU?&autoplay=1",
"createTime": "2020.4.25",
"snapshot": "/images/videos/cover.png",
"group": "",
"tag": ""
},
{
"title": "Bookinfo Canary Release on Kubernetes using Istio, Jaeger and KubeSphere",
"link": "https://www.youtube.com/embed/EkGWtwcsdE4?&autoplay=1",
"createTime": "2020.4.25",
"snapshot": "/images/videos/cover.png",
"group": "",
"tag": ""
},
{
"title": "Create Horizontal Pod Autoscaler for Kubernetes Deployment using KubeSphere",
"link": "https://www.youtube.com/embed/Aqy-psx9B30?&autoplay=1",
"createTime": "2020.4.25",
"snapshot": "/images/videos/cover.png",
"group": "",
"tag": ""
}
]

514
data/zh/video.json Normal file
View File

@ -0,0 +1,514 @@
[
{
"title": "为什么选择 KubeSphere",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/meetup-final-1226.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206170305.png",
"group": "Meetup",
"tag": "用户访谈,容器,Kubernetes"
},
{
"title": "走近 KubeSphere",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/zhouxiaosi-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171311.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "企业级容器 CI/CD 进阶之路",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/xiarunze-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171404.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,DevOps,容器,Kubernetes"
},
{
"title": "Istio 在 KubeSphere 平台上的实践",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/zhangrenyu-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171431.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,微服务,容器,Kubernetes"
},
{
"title": "K8s 可观察性实践之路 - 上",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/huobingjie-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171451.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "K8s 可观察性实践之路 - 下",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/huangguangzhe-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171451.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "你不知道的 KubeSphere Console",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/liulu-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171525.png",
"group": "Meetup",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "KubeSphere 多租户管理教程",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/KS2.1_1-multi-tenancy.mp4",
"createTime": "2019.01.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206174734.png",
"group": "入门教程",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "创建 Wordpress 应用并发布至 K8s",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/KS2.1_3-wordpress-k8s.mp4",
"createTime": "2019.01.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206174845.png",
"group": "入门教程",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "创建 Service 与 Ingress 暴露应用",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/KS2.1_2-service-ingress.mp4",
"createTime": "2019.01.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928174847.png",
"group": "入门教程",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "Binary to Image - 发布制品至 K8s",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/Binary-to-image.mp4",
"createTime": "2019.01.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206174934.png",
"group": "入门教程",
"tag": "KubeSphere 2.1,容器,Kubernetes"
},
{
"title": "KubeSphere 容器平台新动向 - 周小四",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E4%B8%BB%E4%BC%9A%E5%9C%BA/6%E3%80%81KubeSphere%20%E5%AE%B9%E5%99%A8%E5%B9%B3%E5%8F%B0%E6%96%B0%E5%8A%A8%E5%90%91%20%20%20%E5%91%A8%E5%B0%8F%E5%9B%9B.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "KubeSphere 助力企业解禁云原生 - 于爽",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E4%B8%8E%E5%BE%AE%E6%9C%8D%E5%8A%A1/KubeSphere%20%E5%8A%A9%E5%8A%9B%E4%BC%81%E4%B8%9A%E8%A7%A3%E7%A6%81%E4%BA%91%E5%8E%9F%E7%94%9F%20%E4%BA%8E%E7%88%BD_batch.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "企业应用向容器迁移和微服务改造实践 - 张仁宇",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E4%B8%8E%E5%BE%AE%E6%9C%8D%E5%8A%A1/%E4%BC%81%E4%B8%9A%E5%BA%94%E7%94%A8%E5%90%91%E5%AE%B9%E5%99%A8%E8%BF%81%E7%A7%BB%E5%92%8C%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%94%B9%E9%80%A0%E5%AE%9E%E8%B7%B5%20%E5%BC%A0%E4%BB%81%E5%AE%87_batch.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "K8S 监控实践 Prometheus, 多租户与多集群 - 霍秉杰",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E4%B8%8E%E5%BE%AE%E6%9C%8D%E5%8A%A1/K8S%E7%9B%91%E6%8E%A7%E5%AE%9E%E8%B7%B5%20%EF%BC%9APrometheus%2C%20%E5%A4%9A%E7%A7%9F%E6%88%B7%E4%B8%8E%E5%A4%9A%E9%9B%86%E7%BE%A4%20%E9%9C%8D%E7%A7%89%E6%9D%B0_batch.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "如何打造一个轻量级的极简 CI / CD Kubernetes 工作流 - 夏润泽",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E4%B8%8E%E5%BE%AE%E6%9C%8D%E5%8A%A1/%E5%A6%82%E4%BD%95%E6%89%93%E9%80%A0%E4%B8%80%E4%B8%AA%E8%BD%BB%E9%87%8F%E7%BA%A7%E7%9A%84%E6%9E%81%E7%AE%80%20%E5%A4%8F%E6%B6%A6%E6%B3%BD_batch.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "Harbor 镜像仓储最佳实践 - Alex Xu",
"link": "https://insight2019.pek3a.qingstor.com/%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E4%B8%8E%E5%BE%AE%E6%9C%8D%E5%8A%A1/Harbor%E9%95%9C%E5%83%8F%E4%BB%93%E5%82%A8%E6%9C%80%E4%BD%B3%E5%AE%9E%E8%B7%B5%20%E5%BE%90%E5%A4%A9%E8%A1%8C_batch.mp4",
"createTime": "2019.07.25",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183518.png",
"group": "CIC 用户大会",
"tag": "峰会论坛"
},
{
"title": "KubeSphere 容器平台发布 - 周小四",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E4%B8%BB%E4%BC%9A%E5%9C%BA/KubeSphere%20%E5%AE%B9%E5%99%A8%E4%BA%A7%E5%93%81%E7%BA%BF-%E5%91%A8%E5%B0%8F%E5%9B%9B-%E9%9D%92%E4%BA%91QingCloud%20%E5%AE%B9%E5%99%A8%E5%8F%8A%E5%BA%94%E7%94%A8%E5%B9%B3%E5%8F%B0%E7%A0%94%E5%8F%91%E6%80%BB%E7%9B%91.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "峰会论坛"
},
{
"title": "划时代的云端容器平台 KubeSphere - 于爽",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E3%80%81%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%9E%84%E6%9E%B6%E4%B8%8E%E6%B2%BB%E7%90%86%E4%B8%93%E9%A2%98%E8%AE%BA%E5%9D%9B/%E5%88%92%E6%97%B6%E4%BB%A3%E7%9A%84%E4%BA%91%E7%AB%AF%E5%AE%B9%E5%99%A8%E5%B9%B3%E5%8F%B0%20KubeSphere-%E4%BA%8E%E7%88%BD-%E9%9D%92%E4%BA%91QingCloud%20%E5%AE%B9%E5%99%A8%E5%B9%B3%E5%8F%B0%E8%B5%84%E6%B7%B1%E6%9E%B6%E6%9E%84%E5%B8%88.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "招银云创容器及微服务实践-陈沙克",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E3%80%81%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%9E%84%E6%9E%B6%E4%B8%8E%E6%B2%BB%E7%90%86%E4%B8%93%E9%A2%98%E8%AE%BA%E5%9D%9B/%E6%8B%9B%E9%93%B6%E4%BA%91%E5%88%9B%E5%AE%B9%E5%99%A8%E5%8F%8A%E5%BE%AE%E6%9C%8D%E5%8A%A1%E5%AE%9E%E8%B7%B5-%E9%99%88%E6%B2%99%E5%85%8B-%E6%8B%9B%E9%93%B6%E4%BA%91%E5%88%9B%E9%87%91%E8%9E%8D%20PaaS%20%E7%A0%94%E7%A9%B6%E4%B8%AD%E5%BF%83%E6%80%BB%E7%9B%91.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "DataOps 容器技术助力敏捷大数据-王庆",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E3%80%81%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%9E%84%E6%9E%B6%E4%B8%8E%E6%B2%BB%E7%90%86%E4%B8%93%E9%A2%98%E8%AE%BA%E5%9D%9B/DataOps%20%E5%AE%B9%E5%99%A8%E6%8A%80%E6%9C%AF%E5%8A%A9%E5%8A%9B%E6%95%8F%E6%8D%B7%E5%A4%A7%E6%95%B0%E6%8D%AE-%E7%8E%8B%E5%BA%86%E4%B8%80-%E6%96%B0%E6%B0%A6%E6%95%B0%E6%8D%AE%20CEO.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "DevOps 工具链落地之路-王青",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E3%80%81%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%9E%84%E6%9E%B6%E4%B8%8E%E6%B2%BB%E7%90%86%E4%B8%93%E9%A2%98%E8%AE%BA%E5%9D%9B/DevOps%20%E5%B7%A5%E5%85%B7%E9%93%BE%E8%90%BD%E5%9C%B0%E4%B9%8B%E8%B7%AF-%E7%8E%8B%E9%9D%92-JFrog%20%E4%B8%AD%E5%9B%BD%E9%A6%96%E5%B8%AD%E6%9E%B6%E6%9E%84%E5%B8%88.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "ofo 小黄车容器云平台及业务容器化实践-王强",
"link": "https://insight2018.pek3a.qingstor.com/%E8%A7%86%E9%A2%91/%E5%AE%B9%E5%99%A8%E3%80%81%E5%BE%AE%E6%9C%8D%E5%8A%A1%E6%9E%84%E6%9E%B6%E4%B8%8E%E6%B2%BB%E7%90%86%E4%B8%93%E9%A2%98%E8%AE%BA%E5%9D%9B/ofo%20%E5%B0%8F%E9%BB%84%E8%BD%A6%E5%AE%B9%E5%99%A8%E4%BA%91%E5%B9%B3%E5%8F%B0%E5%8F%8A%E4%B8%9A%E5%8A%A1%E5%AE%B9%E5%99%A8%E5%8C%96%E5%AE%9E%E8%B7%B5-%E7%8E%8B%E5%BC%BA-ofo%20%E5%B0%8F%E9%BB%84%E8%BD%A6%E5%AE%B9%E5%99%A8%E4%BA%91%E7%A0%94%E5%8F%91%E8%B4%9F%E8%B4%A3%E4%BA%BA.mp4",
"createTime": "2018.07.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928184613.png",
"group": "CIC 用户大会",
"tag": "KubeSphere 2.0,峰会论坛"
},
{
"title": "Porter面向裸金属环境的 Kubernetes 开源负载均衡器",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/kubecon/Porter%20-%20An%20Open%20Source%20Load%20Balancer%20for%20Bare%20Metal%20Kubernetes%20-%20Xuetao%20Song%20%26%20Fang%20Du.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928115532.png",
"group": "KubeCon",
"tag": "Kubernetes,峰会论坛"
},
{
"title": "The New Stack 在 KubeCon 采访 Porter 作者宋雪涛",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/kubecon/Open%20Source%20Load%20Balancing%20on%20Bare%20Metal.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928115700.png",
"group": "KubeCon",
"tag": "Kubernetes"
},
{
"title": "Serverless Jenkins on Kubernetes - Jenkins X",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/kubecon/Serverless%20Jenkins%20on%20Kubernetes%20-%20Jenkins%20X%20-%20RunZe%20Xia%20%26%20Fang%20Du.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928115408.png",
"group": "KubeCon",
"tag": "Kubernetes,峰会论坛"
},
{
"title": "KubeSphere 容器平台产品发布会",
"link": "https://workshop.pek3a.qingstor.com/%E5%A4%A7%E9%81%93%E8%87%B3%E7%AE%80%E4%B8%BB%E4%BC%9A%E5%9C%BA%E7%9B%B4%E6%92%AD%E8%A7%86%E9%A2%91-%E5%89%AA%E8%BE%91.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928181423.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器,峰会论坛"
},
{
"title": "嘉宾观点 - 阳光保险云计算架构师朱向阳",
"link": "https://workshop.pek3a.qingstor.com/%E9%98%B3%E5%85%89%E4%BF%9D%E9%99%A9%E4%BA%91%E8%AE%A1%E7%AE%97%E6%9E%B6%E6%9E%84%E5%B8%88-%E6%9C%B1%E5%90%91%E9%98%B3.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928182510.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "嘉宾观点 - 马哥教育创始人、CEO 马永亮",
"link": "https://workshop.pek3a.qingstor.com/%E9%98%B3%E5%85%89%E4%BF%9D%E9%99%A9%E4%BA%91%E8%AE%A1%E7%AE%97%E6%9E%B6%E6%9E%84%E5%B8%88-%E6%9C%B1%E5%90%91%E9%98%B3.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928182936.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "嘉宾观点 - 某保险公司云计算架构师芦苇",
"link": "https://workshop.pek3a.qingstor.com/%E6%9F%90%E4%BF%9D%E9%99%A9%E5%85%AC%E5%8F%B8%E4%BA%91%E8%AE%A1%E7%AE%97%E6%9E%B6%E6%9E%84%E5%B8%88-%E8%8A%A6%E8%8B%87.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183054.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "嘉宾观点 - CuriosityChina CTO 水羽哲",
"link": "https://workshop.pek3a.qingstor.com/Curiosity%20China%20CTO%E6%B0%B4%E7%BE%BD%E5%93%B2.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183123.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "嘉宾观点 - 金融 PaaS 技术专家陈沙克",
"link": "https://workshop.pek3a.qingstor.com/%E9%87%91%E8%9E%8DPaaS%E6%8A%80%E6%9C%AF%E4%B8%93%E5%AE%B6-%E9%99%88%E6%B2%99%E5%85%8B.mp4",
"createTime": "2019.04.18",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928183241.png",
"group": "发布会",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 是什么",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P003C201904_KubeSphere%E6%98%AF%E4%BB%80%E4%B9%88.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928165927.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere架构与主要功能",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P004C201904_KubeSphere%E6%9E%B6%E6%9E%84%E4%B8%8E%E4%B8%BB%E8%A6%81%E5%8A%9F%E8%83%BD.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170035.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 全景功能概览",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P005C201904_KubeSphere%20%E5%85%A8%E6%99%AF%E5%8A%9F%E8%83%BD%E6%A6%82%E8%A7%88.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170201.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 租户和权限管理",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P006C201906_KubeSphere%20%E7%A7%9F%E6%88%B7%E5%92%8C%E6%9D%83%E9%99%90%E7%AE%A1%E7%90%86.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170244.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 的网络与存储",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P007C201906_KubeSphere%20%E7%9A%84%E7%BD%91%E7%BB%9C%E4%B8%8E%E5%AD%98%E5%82%A8.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170313.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 集群资源管理与监控",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P008C201906_KubeSphere%20%E9%9B%86%E7%BE%A4%E8%B5%84%E6%BA%90%E7%AE%A1%E7%90%86%E4%B8%8E%E7%9B%91%E6%8E%A7.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170358.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 多租户日志",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P009C201906_KubeSphere%20%E6%97%A5%E5%BF%97.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928170458.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "KubeSphere 告警和通知",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P010C201906_KubeSphere%20%E5%91%8A%E8%AD%A6%E5%92%8C%E9%80%9A%E7%9F%A5.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928120049.png",
"group": "产品介绍",
"tag": "KubeSphere 2.0,容器"
},
{
"title": "Porter 在本来生活的落地实践",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/benlaishenghuo-final.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171221.png",
"group": "Meetup",
"tag": "网络,容器,Kubernetes"
},
{
"title": "新浪产品运维团队 K8s 应用实践",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/meetup/sina-k8s.mp4",
"createTime": "2019.12.14",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200206171248.png",
"group": "Meetup",
"tag": "容器,Kubernetes"
},
{
"title": "在 OpenShift 部署 KubeSphere",
"link": "https://kubesphere-docs.pek3b.qingstor.com/video/Demo-Install-KubeSphere-on-OpenShift.mp4",
"createTime": "2020.01.20",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20200308224101.png",
"group": "Webniar",
"tag": "容器"
},
{
"title": "KubeSphere 多维度监控教程",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/%E5%A4%9A%E7%BB%B4%E5%BA%A6%E7%9B%91%E6%8E%A7.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928174806.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "KubeSphere 日志查询与收集教程",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/kubesphere%20%E6%97%A5%E5%BF%97.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928175300.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "KubeSphere 集群与工作负载告警策略",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/kubesphere%20%E5%91%8A%E8%AD%A6.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928175350.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "CI/CD 流水线发布 Spring Boot 项目至 K8s",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/inscm-20190412-1080.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928175645.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "图形化构建流水线发布项目至 K8s",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/noscm-20190412-1080.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928175943.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "Source-to-Image代码直达镜像",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/s2i-20190412-1080.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928180222.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "微服务治理 - Bookinfo 应用的金丝雀发布(上)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/1.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928180638.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "微服务治理 - Bookinfo 应用的金丝雀发布(中)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/2.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928181043.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "微服务治理 - Bookinfo 应用的金丝雀发布(下)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E5%85%A5%E9%97%A8%E6%95%99%E7%A8%8B/s2i-20190412-1080.mov",
"createTime": "2019.06.24",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928181112.png",
"group": "入门教程",
"tag": "KubeSphere 2.0,容器,Kubernetes"
},
{
"title": "容器是什么",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P001C201804_%E5%AE%B9%E5%99%A8%E6%98%AF%E4%BB%80%E4%B9%88.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928114725.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,容器"
},
{
"title": "容器与镜像的关系",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D/Container_100P002C201804_%E5%AE%B9%E5%99%A8%E4%B8%8E%E9%95%9C%E5%83%8F%E7%9A%84%E5%85%B3%E7%B3%BB.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928114801.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,容器"
},
{
"title": "什么是 Kubernetes",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P001C201809_K8S%E6%98%AF%E4%BB%80%E4%B9%88.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928000918.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 与 KubeSphere 的关系",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P002C201809_K8S%E4%B8%8EKubeSphere%E7%9A%84%E5%85%B3%E7%B3%BB.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928001616.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 架构",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P003C201809_K8S%E6%9E%B6%E6%9E%84.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928001806.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 基本概念(上)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P004C201809_K8S%E5%9F%BA%E6%9C%AC%E6%A6%82%E5%BF%B5-1.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928001957.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 基本概念(中)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P005C201809_K8S%E5%9F%BA%E6%9C%AC%E6%A6%82%E5%BF%B5-2.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002045.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 基本概念(下)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P005C201809_K8S%E5%9F%BA%E6%9C%AC%E6%A6%82%E5%BF%B5-3.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002215.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 网络(上)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P007C201809_K8S%20Networking-1.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002445.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 网络(下)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P007C201809_K8S%20Networking-2.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002510.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 存储(上)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P009C201809_K8S%20Storage-1.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002616.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
},
{
"title": "Kubernetes 存储(下)",
"link": "https://kubesphere-docs.pek3b.qingstor.com/website/Kubernetes%E5%9F%BA%E7%A1%80/K8S_100P010C201809_K8S%20Storage-2-CSI%20%E6%9E%B6%E6%9E%84.mp4",
"createTime": "2019.09.27",
"snapshot": "https://pek3b.qingstor.com/kubesphere-docs/png/20190928002702.png",
"group": "Kubernetes基础",
"tag": "Kubernetes,快速教程"
}
]

View File

@ -20,3 +20,7 @@
translation: Open Source Community
- id: introduction11
translation: KubeSphere is committed to the open source contribution of cloud native technology, enriching the ecology of the open source community
- id: introduction12
translation: Goto Github

View File

@ -1,5 +1,13 @@
{{ if .Params.minCss }}
{{ range (split .Params.minCss ",")}}
<link rel="stylesheet" href="{{ . | absURL }}">
{{ end }}
{{ end }}
{{ if .Params.css}}
{{ $style := resources.Get .Params.css | toCSS | minify | fingerprint }}
<link rel="stylesheet" href="{{ $style.Permalink }}">
{{ end }}

View File

@ -1,25 +1,28 @@
<section>
<div class='open-source-header'>
<h1>{{ i18n "introduction10" }}</h1>
<p>{{ i18n "introduction11" }}</p>
<img src='{{ "/images/common/resource-bg.jpg" | absURL }}' alt="">
<div>
<a href="https://github.com/kubesphere" target="_blank" rel="noopener noreferrer">
<button class="index-module--button--217nv index-module--control--3r7PJ index-module--large--3KWUF">
<svg width="1em" height="1em" viewBox="0 0 21 20">
<path d="M10.252.003C4.59.003 0 4.593 0 10.255c0 4.53 2.937 8.372 7.011 9.728.513.095.701-.223.701-.493 0-.245-.01-1.053-.014-1.909-2.853.62-3.454-1.21-3.454-1.21-.466-1.185-1.138-1.5-1.138-1.5-.93-.637.07-.623.07-.623 1.03.072 1.572 1.056 1.572 1.056.915 1.567 2.4 1.114 2.983.852.093-.662.358-1.115.651-1.371-2.277-.259-4.67-1.138-4.67-5.067 0-1.119.4-2.034 1.055-2.752-.106-.258-.457-1.3.099-2.713 0 0 .861-.275 2.82 1.051a9.834 9.834 0 0 1 2.566-.344 9.86 9.86 0 0 1 2.568.344c1.957-1.326 2.817-1.05 2.817-1.05.558 1.412.208 2.455.101 2.712.658.718 1.055 1.633 1.055 2.752 0 3.938-2.399 4.804-4.681 5.058.368.318.696.942.696 1.898 0 1.371-.012 2.476-.012 2.813 0 .273.185.592.705.492a10.253 10.253 0 0 0 7.005-9.727C20.506 4.59 15.916 0 10.254 0l-.002.003z" fill="currentColor" fill-rule="nonzero"></path>
</svg>
前往 Github
</button>
</a>
<h1>{{ i18n "introduction10" }}</h1>
<p>{{ i18n "introduction11" }}</p>
<div>
<a href="https://github.com/kubesphere" target="_blank" rel="noopener noreferrer">
<button class="index-module--button--217nv index-module--control--3r7PJ index-module--large--3KWUF">
<svg width="1em" height="1em" viewBox="0 0 21 20">
<path d="M10.252.003C4.59.003 0 4.593 0 10.255c0 4.53 2.937 8.372 7.011 9.728.513.095.701-.223.701-.493 0-.245-.01-1.053-.014-1.909-2.853.62-3.454-1.21-3.454-1.21-.466-1.185-1.138-1.5-1.138-1.5-.93-.637.07-.623.07-.623 1.03.072 1.572 1.056 1.572 1.056.915 1.567 2.4 1.114 2.983.852.093-.662.358-1.115.651-1.371-2.277-.259-4.67-1.138-4.67-5.067 0-1.119.4-2.034 1.055-2.752-.106-.258-.457-1.3.099-2.713 0 0 .861-.275 2.82 1.051a9.834 9.834 0 0 1 2.566-.344 9.86 9.86 0 0 1 2.568.344c1.957-1.326 2.817-1.05 2.817-1.05.558 1.412.208 2.455.101 2.712.658.718 1.055 1.633 1.055 2.752 0 3.938-2.399 4.804-4.681 5.058.368.318.696.942.696 1.898 0 1.371-.012 2.476-.012 2.813 0 .273.185.592.705.492a10.253 10.253 0 0 0 7.005-9.727C20.506 4.59 15.916 0 10.254 0l-.002.003z" fill="currentColor" fill-rule="nonzero"></path>
</svg>
{{ i18n "introduction12"}}
</button>
</a>
</div>
</div>
<ul class="tabs">
{{ $section := .Page.Section }}
{{ $menus := (index .Site.Menus.main 2).Children }}
{{ range $menus }}
<li class="">
<a {{ if eq $section .URL }} class="active"{{ end }} href="{{ .URL | absLangURL }}">{{ .Name }}</a>
</li>
{{ end }}
</ul>
</div>
<ul class="open-source-tab">
{{ $section := .Page.Section }}
{{ $menus := (index .Site.Menus.main 2).Children }}
{{ range $menus }}
<li class="">
<a {{ if eq $section .URL }} class="active"{{ end }} href="{{ .URL | absLangURL }}">{{ .Name }}</a>
</li>
{{ end }}
</ul>
</section>

View File

@ -1,6 +1,133 @@
{{ define "main" }}
{{- partial "openSource.html" . -}}
<section id="home">
<h2>内容</h2>
{{ $data := index .Site.Data .Site.Language.Lang }}
<section class='section-1'>
<div>
<ul class='video-tab-ul'>
<li class='active'>{{ .Params.tip }}</li>
{{ $groups := slice }}
{{ range $data.video }}
{{ $group := split .group ","}}
{{ $groups = $groups | append $group }}
{{ end }}
{{ range ($groups | uniq) }}
<li data-group='{{ . }}'>{{ . }}</li>
{{ end }}
</ul>
<ul class='video-ul' data-language='{{ .Site.Language.Lang }}' data-origin='{{ $data.video | jsonify }}'>
</ul>
<div id='pagination'></div>
</div>
</section>
<div id="modal-for-video" class="modal">
<div class='video-div'>
<video src="" controls autoplay></video>
<iframe
id='iframe-player'
src=""
width="750"
height="420"
frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</div>
</div>
<script src='{{ "js/pagination.min.js" | absURL }}'></script>
<script src='{{ "js/jquery.modal.min.js" | absURL }}'></script>
<script>
var bindClickVideoTabLi = function() {
var tabLi = $('.video-tab-ul > li')
tabLi.click(function() {
tabLi.removeClass('active')
var group = $(this).data('group')
$(this).addClass('active')
var videos = $('.video-ul').data('origin')
if (group) {
videos = videos.filter(function(video) {
return video.group === group
})
}
initPagination(videos)
})
}
var bindClickVideoLi = function() {
$('.video-ul').on('click', 'li', function(ev) {
var link = $(this).data('link')
var language = $('.video-ul').data('language')
if (language === 'zh') {
showVideo(link)
} else if (language === 'en') {
showIframe(link)
}
})
}
var initModal = function() {
$('#modal-for-video').on($.modal.BEFORE_CLOSE, function(event, modal) {
$('#modal-for-video video')[0].pause()
var iframe = $("#iframe-player").attr({src: ''});
});
}
var showIframe = function(link) {
$('#modal-for-video video').hide()
$('#modal-for-video iframe').attr({src: link})
$('#modal-for-video').modal()
}
var showVideo = function(link) {
$('#modal-for-video iframe').hide()
$('#modal-for-video video').attr({src: link})
$('#modal-for-video').modal()
}
var createVideoList = function(videos) {
var result = ''
for (var i = 0; i < videos.length; i++) {
var video = videos[i]
var s = createVideoLi(video)
result += s
}
return result
}
var createVideoLi = function(video) {
var img = '<img src="' + video.snapshot + '" alt="">'
var button = '<img class="btn" src="/images/videos/play.svg" alt="">'
var title = '<h3>' + video.title + '</h3>'
var group = '<p>' + video.group + '</p>'
var time = '<p class="time">' + video.createTime + '</p>'
var div = '<div>' + button + '<div>' + title + group + time + '</div></div>'
var s = '<li data-link="' + video.link + '">' + img + div + '</li>'
return s
}
var initPagination = function(dataSource) {
$('#pagination').pagination({
dataSource: dataSource,
pageSize: 12,
prevText: '<<',
nextText: '>>',
callback: function(data, pagination) {
var videoList =createVideoList(data)
$('.video-ul').empty().append(videoList)
}
})
}
var initVideos = function() {
var videos = $('.video-ul').data('origin')
initPagination(videos)
}
bindClickVideoTabLi()
bindClickVideoLi()
initVideos()
initModal()
</script>
{{ end }}

1
static/css/jquery.modal.min.css vendored Normal file
View File

@ -0,0 +1 @@
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:1;padding:20px;box-sizing:border-box;background-color:#000;background-color:rgba(0,0,0,0.75);text-align:center}.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-0.05em}.blocker.behind{background-color:transparent}.modal{display:none;vertical-align:middle;position:relative;z-index:2;max-width:500px;box-sizing:border-box;width:90%;background:#fff;padding:15px 30px;-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;text-align:left}.modal a.close-modal{position:absolute;top:-12.5px;right:-12.5px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-repeat:no-repeat;background-position:center center;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==')}.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.modal-spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}.modal-spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}@-webkit-keyframes sk-stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.5)}20%{-webkit-transform:scaleY(1.0)}}@keyframes sk-stretchdelay{0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 169 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 411 KiB

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
<path fill="#FFF" fill-rule="nonzero" d="M0 20C0 8.954 8.954 0 20 0s20 8.954 20 20-8.954 20-20 20S0 31.046 0 20zm26.15.442a.577.577 0 0 0 0-.884l-9.401-8.016a.678.678 0 0 0-.462-.175c-.35 0-.68.246-.68.616v16.034c0 .37.33.616.68.616a.694.694 0 0 0 .462-.175l9.401-8.016z"/>
</svg>

After

Width:  |  Height:  |  Size: 369 B

View File

@ -0,0 +1,31 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="360" height="202" viewBox="0 0 360 202">
<defs>
<rect id="a" width="360" height="202" rx="4"/>
<linearGradient id="c" x1="50%" x2="50%" y1="0%" y2="100%">
<stop offset="0%" stop-color="#DBE2E8"/>
<stop offset="100%" stop-color="#B5C1CC"/>
</linearGradient>
<radialGradient id="d" cx="39.692%" cy="30.942%" r="72.873%" fx="39.692%" fy="30.942%">
<stop offset="0%" stop-color="#E8EBEF"/>
<stop offset="100%" stop-color="#CCD3DB"/>
</radialGradient>
<linearGradient id="e" x1="46.703%" x2="50%" y1="24.188%" y2="87.293%">
<stop offset="0%" stop-color="#667895"/>
<stop offset="100%" stop-color="#36435C"/>
</linearGradient>
</defs>
<g fill="none" fill-rule="evenodd">
<mask id="b" fill="#fff">
<use xlink:href="#a"/>
</mask>
<use fill="#EEF4F8" xlink:href="#a"/>
<g fill-rule="nonzero" mask="url(#b)">
<g transform="translate(-114 24)">
<path fill="url(#c)" d="M470 194H327l40.158-69.643L398.5 70z"/>
<circle cx="398" cy="41" r="28" fill="url(#d)"/>
<path fill="url(#e)" d="M398 185H200l.156-.27 64.937-112.16L299 14l60.453 104.423 38.493 66.487z" opacity=".153"/>
<circle cx="299" cy="12" r="12" fill="#D1D8E0"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

5
static/js/jquery.modal.min.js vendored Normal file
View File

@ -0,0 +1,5 @@
/*
A simple jQuery modal (http://github.com/kylefox/jquery-modal)
Version 0.9.2
*/
!function(o){"object"==typeof module&&"object"==typeof module.exports?o(require("jquery"),window,document):o(jQuery,window,document)}(function(o,t,i,e){var s=[],l=function(){return s.length?s[s.length-1]:null},n=function(){var o,t=!1;for(o=s.length-1;o>=0;o--)s[o].$blocker&&(s[o].$blocker.toggleClass("current",!t).toggleClass("behind",t),t=!0)};o.modal=function(t,i){var e,n;if(this.$body=o("body"),this.options=o.extend({},o.modal.defaults,i),this.options.doFade=!isNaN(parseInt(this.options.fadeDuration,10)),this.$blocker=null,this.options.closeExisting)for(;o.modal.isActive();)o.modal.close();if(s.push(this),t.is("a"))if(n=t.attr("href"),this.anchor=t,/^#/.test(n)){if(this.$elm=o(n),1!==this.$elm.length)return null;this.$body.append(this.$elm),this.open()}else this.$elm=o("<div>"),this.$body.append(this.$elm),e=function(o,t){t.elm.remove()},this.showSpinner(),t.trigger(o.modal.AJAX_SEND),o.get(n).done(function(i){if(o.modal.isActive()){t.trigger(o.modal.AJAX_SUCCESS);var s=l();s.$elm.empty().append(i).on(o.modal.CLOSE,e),s.hideSpinner(),s.open(),t.trigger(o.modal.AJAX_COMPLETE)}}).fail(function(){t.trigger(o.modal.AJAX_FAIL);var i=l();i.hideSpinner(),s.pop(),t.trigger(o.modal.AJAX_COMPLETE)});else this.$elm=t,this.anchor=t,this.$body.append(this.$elm),this.open()},o.modal.prototype={constructor:o.modal,open:function(){var t=this;this.block(),this.anchor.blur(),this.options.doFade?setTimeout(function(){t.show()},this.options.fadeDuration*this.options.fadeDelay):this.show(),o(i).off("keydown.modal").on("keydown.modal",function(o){var t=l();27===o.which&&t.options.escapeClose&&t.close()}),this.options.clickClose&&this.$blocker.click(function(t){t.target===this&&o.modal.close()})},close:function(){s.pop(),this.unblock(),this.hide(),o.modal.isActive()||o(i).off("keydown.modal")},block:function(){this.$elm.trigger(o.modal.BEFORE_BLOCK,[this._ctx()]),this.$body.css("overflow","hidden"),this.$blocker=o('<div class="'+this.options.blockerClass+' blocker current"></div>').appendTo(this.$body),n(),this.options.doFade&&this.$blocker.css("opacity",0).animate({opacity:1},this.options.fadeDuration),this.$elm.trigger(o.modal.BLOCK,[this._ctx()])},unblock:function(t){!t&&this.options.doFade?this.$blocker.fadeOut(this.options.fadeDuration,this.unblock.bind(this,!0)):(this.$blocker.children().appendTo(this.$body),this.$blocker.remove(),this.$blocker=null,n(),o.modal.isActive()||this.$body.css("overflow",""))},show:function(){this.$elm.trigger(o.modal.BEFORE_OPEN,[this._ctx()]),this.options.showClose&&(this.closeButton=o('<a href="#close-modal" rel="modal:close" class="close-modal '+this.options.closeClass+'">'+this.options.closeText+"</a>"),this.$elm.append(this.closeButton)),this.$elm.addClass(this.options.modalClass).appendTo(this.$blocker),this.options.doFade?this.$elm.css({opacity:0,display:"inline-block"}).animate({opacity:1},this.options.fadeDuration):this.$elm.css("display","inline-block"),this.$elm.trigger(o.modal.OPEN,[this._ctx()])},hide:function(){this.$elm.trigger(o.modal.BEFORE_CLOSE,[this._ctx()]),this.closeButton&&this.closeButton.remove();var t=this;this.options.doFade?this.$elm.fadeOut(this.options.fadeDuration,function(){t.$elm.trigger(o.modal.AFTER_CLOSE,[t._ctx()])}):this.$elm.hide(0,function(){t.$elm.trigger(o.modal.AFTER_CLOSE,[t._ctx()])}),this.$elm.trigger(o.modal.CLOSE,[this._ctx()])},showSpinner:function(){this.options.showSpinner&&(this.spinner=this.spinner||o('<div class="'+this.options.modalClass+'-spinner"></div>').append(this.options.spinnerHtml),this.$body.append(this.spinner),this.spinner.show())},hideSpinner:function(){this.spinner&&this.spinner.remove()},_ctx:function(){return{elm:this.$elm,$elm:this.$elm,$blocker:this.$blocker,options:this.options,$anchor:this.anchor}}},o.modal.close=function(t){if(o.modal.isActive()){t&&t.preventDefault();var i=l();return i.close(),i.$elm}},o.modal.isActive=function(){return s.length>0},o.modal.getCurrent=l,o.modal.defaults={closeExisting:!0,escapeClose:!0,clickClose:!0,closeText:"Close",closeClass:"",modalClass:"modal",blockerClass:"jquery-modal",spinnerHtml:'<div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div>',showSpinner:!0,showClose:!0,fadeDuration:null,fadeDelay:1},o.modal.BEFORE_BLOCK="modal:before-block",o.modal.BLOCK="modal:block",o.modal.BEFORE_OPEN="modal:before-open",o.modal.OPEN="modal:open",o.modal.BEFORE_CLOSE="modal:before-close",o.modal.CLOSE="modal:close",o.modal.AFTER_CLOSE="modal:after-close",o.modal.AJAX_SEND="modal:ajax:send",o.modal.AJAX_SUCCESS="modal:ajax:success",o.modal.AJAX_FAIL="modal:ajax:fail",o.modal.AJAX_COMPLETE="modal:ajax:complete",o.fn.modal=function(t){return 1===this.length&&new o.modal(this,t),this},o(i).on("click.modal",'a[rel~="modal:close"]',o.modal.close),o(i).on("click.modal",'a[rel~="modal:open"]',function(t){t.preventDefault(),o(this).modal()})});

11
static/js/pagination.min.js vendored Normal file

File diff suppressed because one or more lines are too long