85 lines
1.7 KiB
CSS
85 lines
1.7 KiB
CSS
/* Tabs CSS implementation. Borrowed from Skaffold & Kubernetes websites */
|
|
ul.nav.nav-tabs {
|
|
padding: 0;
|
|
list-style-type: none;
|
|
overflow: hidden;
|
|
content: none;
|
|
}
|
|
|
|
div.code-tabs li.nav-tab {
|
|
margin-top: 1.5rem;
|
|
padding: 7px 18px;
|
|
float: left;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
color: #444;
|
|
font-size: 18px;
|
|
font-family: 'Open Sans', sans-serif;
|
|
|
|
border-top: 1px solid #ccc;
|
|
border-left: 1px solid #ccc;
|
|
border-right: 1px solid #ccc;
|
|
margin-right: 0.5em;
|
|
|
|
border-top-left-radius: 4px;
|
|
border-top-right-radius: 4px;
|
|
/* inactive tab (title) */
|
|
background-color: #C5E8EA; /* $mk-light - minus two shades*/
|
|
}
|
|
|
|
/* active tab (title) */
|
|
div.code-tabs li.active {
|
|
color: #f2771a;
|
|
border-top: 1px solid #b0b6b6;
|
|
border-left: 1px solid #b0b6b6;
|
|
border-right: 1px solid #b0b6b6;
|
|
background: #f3f9fa; /* $mk-verylight */
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* active tab background */
|
|
div.tab-pane.active {
|
|
display: block;
|
|
padding: 2em;
|
|
background: #f3f9fa; /* $mk-verylight */
|
|
border: 1px solid #b0b6b6;
|
|
}
|
|
|
|
|
|
/* active tab code sample */
|
|
div.code-tabs div.highlight {
|
|
border: 1px solid #ccc;
|
|
background-color: #fff;
|
|
}
|
|
|
|
|
|
div.code-tabs a.nav-tab {
|
|
all: unset;
|
|
cursor: pointer;
|
|
}
|
|
|
|
|
|
div.tab-pane {
|
|
display: none;
|
|
margin-bottom: 3rem;
|
|
}
|
|
|
|
|
|
div.code-tabs code {
|
|
word-break: keep-all;
|
|
}
|
|
|
|
div.code-tabs h2 {
|
|
font-size: 1.2rem !important;
|
|
font-weight: bold !important;
|
|
margin-top: 1.3rem;
|
|
}
|
|
div.code-tabs h3 {
|
|
font-size: 1.1rem !important;
|
|
}
|
|
div.code-tabs h3.backup-tab-title {
|
|
font-size: 1.7rem !important;
|
|
font-weight: 600;
|
|
margin-top: 1.3rem;
|
|
}
|