233 lines
8.5 KiB
HTML
233 lines
8.5 KiB
HTML
{% extends "main.html" %}
|
|
|
|
{% block tabs %}
|
|
{{ super() }}
|
|
|
|
<!-- Additional styles for landing page -->
|
|
<style>
|
|
.more-box{
|
|
margin-left: 20px;
|
|
}
|
|
.ex-h1{
|
|
font-size: 40px;width: 400px;
|
|
}
|
|
.ex-p{
|
|
font-size: 20px; color: #777288;width: 480px;
|
|
}
|
|
.more-h1{ font-size: 20px;font-weight:900}
|
|
.more-p{
|
|
width: 320px; color: #777288; font-size: 18px;
|
|
}
|
|
.lit-p{
|
|
font-size: 16px; color: #777288; width: 400px;
|
|
}
|
|
.ch-div{
|
|
margin-left: 40px;
|
|
}
|
|
.fol{
|
|
margin: auto;
|
|
}
|
|
/* Application header should be static for the landing page */
|
|
.md-header {
|
|
position: initial;
|
|
}
|
|
|
|
/* Remove spacing, as we cannot hide it completely */
|
|
.md-main__inner {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Hide main content for now */
|
|
.md-content {
|
|
display: none;
|
|
}
|
|
|
|
/* Hide table of contents */
|
|
@media screen and (min-width: 60em) {
|
|
.md-sidebar--secondary {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
/* Hide navigation */
|
|
@media screen and (min-width: 76.25em) {
|
|
.md-sidebar--primary {
|
|
display: none;
|
|
}
|
|
}
|
|
@media (max-width:400px) {
|
|
.more_resource{
|
|
flex-direction: column;
|
|
text-align: center;
|
|
}
|
|
.more_resource_reverse{
|
|
flex-direction: column-reverse;
|
|
text-align: center;
|
|
}
|
|
.ex-h1 {
|
|
font-size:20px;text-align: center;width:fit-content;
|
|
}
|
|
.ex-p{
|
|
font-size: 14px; color: #777288;text-align: center;width:fit-content;
|
|
}
|
|
.more_resource .imgimg{
|
|
width: 50px;
|
|
height: 50px;
|
|
}
|
|
.more-box{ margin-left:0;}
|
|
.mo-img{
|
|
width: 250px;
|
|
height: 250px;
|
|
}
|
|
.more-h1{ font-size:25px;
|
|
}
|
|
.more-p{
|
|
width:fit-content;
|
|
}
|
|
.lit-p{
|
|
font-size: 14px; color: #777288; width: fit-content;margin:20px;
|
|
}
|
|
.chakli{
|
|
width:275px;
|
|
height: 275px;
|
|
margin-top: 10%;
|
|
}
|
|
.ch-div{
|
|
margin-left: 0;
|
|
}
|
|
.fol{
|
|
margin: auto;
|
|
margin-top:5%;
|
|
}
|
|
}
|
|
</style>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com"/>
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet"/>
|
|
<link rel="icon" type="image/png" href="litmus.svg"/>
|
|
<title>LitmusChaos Experiment Docs</title>
|
|
<style>
|
|
body {
|
|
font-family: 'Inter', sans-serif;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<!-- Header Section -->
|
|
<div style="margin: 0%;">
|
|
<div class="more_resource_reverse" style="display: flex;">
|
|
<div style="margin: auto;justify-content:start;">
|
|
<h1 class="ex-h1">
|
|
Experiments in LitmusChaos
|
|
</h1>
|
|
<p class="ex-p">
|
|
Litmus experiments for chaos injection
|
|
</p>
|
|
<button
|
|
onclick="window.location.href = 'experiments/categories/contents/';"
|
|
style="width: 140px;
|
|
height: 50px;
|
|
background: linear-gradient(133.06deg, #7C6AC8 1.78%, #5B44BA 64.41%);
|
|
color: #FFFFFF; border-radius: 4px;
|
|
border:1px solid;
|
|
margin-bottom: 30px;
|
|
cursor: pointer;
|
|
font-size: 15px;">
|
|
Start Learning
|
|
</button>
|
|
</div>
|
|
<div style="margin: auto;">
|
|
<img class="mo-img" src="exp-docs-icons/cloud-provider.svg" style="height:400px;" alt="cloud provider" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- More Resource Section -->
|
|
<div style="background-color: #F9FAFC;">
|
|
<div style="padding: 40px; margin: auto;">
|
|
<div class="more_resource" style="display: flex; justify-content: space-between;">
|
|
<div class="more_resource" style="display: flex; margin: auto;">
|
|
<img style="margin:auto;" class="imgimg" src="exp-docs-icons/faqs.svg" alt="faqs"/>
|
|
<div class="more-box">
|
|
<a href="experiments/faq/install"><h1 class="more-h1" style="color: blue; text-decoration: underline; cursor: pointer;">FAQs</h1></a>
|
|
<p class="more-p">
|
|
All common Frequently Asked Questions curated in one place
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="more_resource" style="display: flex; margin: auto;">
|
|
<img style="margin:auto;" class="imgimg" src="exp-docs-icons/troubleshooting.svg" alt="troubleshooting"/>
|
|
<div class="more-box">
|
|
<a href="experiments/troubleshooting/install"><h1 class="more-h1" style="color: blue; text-decoration: underline; cursor: pointer;">Troubleshooting</h1></a>
|
|
<p class="more-p">
|
|
Know more about troubleshooting of common issues
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="margin: 0%;">
|
|
<div class="more_resource" style="display: flex; padding:20px 0px">
|
|
<div style="margin: auto;">
|
|
<h3 style="font-size: 22px;">
|
|
Do you like our Litmus Docs?
|
|
</h3>
|
|
<p class="lit-p">
|
|
We are always trying to improve our docs. If you like the documentation we would want you to become our stargazer.
|
|
</p>
|
|
<button
|
|
onclick="window.location.href = 'https://github.com/litmuschaos/litmus';"
|
|
style="width: 210px;
|
|
height: 40px; background:
|
|
linear-gradient(133.06deg, #7C6AC8 1.78%, #5B44BA 64.41%);
|
|
color: #FFFFFF;
|
|
border-radius: 4px;
|
|
border:1px solid;
|
|
cursor: pointer;">
|
|
<div style="display: inline-flex; margin: -5px;">
|
|
<img src="exp-docs-icons/github-white.svg" alt="github"/>
|
|
<p style="margin-left:10px; font-size: 14px;">Become our stargazer</p>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
<div class="more_resource" style=" display: inline-flex; margin: auto;">
|
|
<img class="chakli" src="exp-docs-icons/chaos-bird.svg" alt="chaos-bird" />
|
|
<div class="ch-div">
|
|
<img src="exp-docs-icons/cncf.svg" alt="cncf" />
|
|
<p style="text-align: center;font-size: 16px;">
|
|
We are a <a href="https://www.cncf.io/" target="_", style="color: blue; text-decoration: underline; cursor: pointer;">CNCF</a> Incubating project.</p>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr style="height: 1px; border: 2; border-top: 2px solid #E6E8F0;"/>
|
|
<br>
|
|
<div class="more_resource" style="display: flex;padding:15px 0px">
|
|
<div style="display: flex;margin: auto">
|
|
<img src="exp-docs-icons/litmus.svg" alt="litmus"/>
|
|
<p style="font-size: 14px; margin-top: 15px; margin-left: 10px; color: #777288;"> © 2021 LitmusChaos Authors</p>
|
|
</div>
|
|
<div class="fol" style="display: inline-flex;">
|
|
<p style="font-size: 14px;margin-top:0.5px; color: #777288;"> Follow us on:</p>
|
|
<a target="_" href="https://slack.litmuschaos.io/"><img src="exp-docs-icons/Slack.svg" alt="slack" style="margin-left: 10px;"/></a>
|
|
<a target="_" href="https://github.com/litmuschaos/litmus"><img src="exp-docs-icons/Github.svg" alt="github" style="margin-left: 10px;"/></a>
|
|
<a target="_" href="https://dev.to/t/litmuschaos/latest"><img src="exp-docs-icons/Dev.svg" alt="dev" style="margin-left: 10px;"/></a>
|
|
<a target="_" href="https://twitter.com/LitmusChaos"><img src="exp-docs-icons/Twitter.svg" alt="twitter" style="margin-left: 10px;"/></a>
|
|
<a target="_" href="https://www.youtube.com/channel/UCa57PMqmz_j0wnteRa9nCaw"><img src="exp-docs-icons/Youtube.svg" alt="youtube" style="margin-left: 10px;"/></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
<!-- Content -->
|
|
{% block content %}{% endblock %}
|
|
|
|
<!-- Application footer -->
|
|
{% block footer %}
|
|
<div style="padding-bottom: 0px;"></div>
|
|
{% endblock %} |