ClickHouse/website/css/docs.css
Ivan Blinkov 80873d79e3
[docs] tuning of <details> tag, search menu colours and hidden pages (#10313)
* improve hidden page title

* adjust docsearch menu colors

* enable pymdownx.details

* some <details> styling

* remove useless example
2020-04-16 21:03:52 +03:00

207 lines
3.7 KiB
CSS

details {
background: #444451;
padding: 1rem;
margin-bottom: 1rem;
margin-top: 1rem;
}
summary {
font-weight: bold;
}
#sidebar {
position: fixed;
z-index: 50;
left: 0;
}
#toc.toc-right {
position: fixed;
}
#languages-dropdown .disabled {
color: #666 !important;
}
.toc-right {
right: 0;
}
#sidebar-nav .nav-link.active {
font-weight: bold;
}
.headerlink {
display: none;
text-decoration: none !important;
margin-left: .5rem;
}
#content {
overflow-x: scroll;
}
#content table {
border: 1px solid #dee2e6;
width: 100%;
margin-bottom: 1rem;
overflow-x: auto;
}
#content thead {
background: #444451;
color: #fff;
}
#content td, #content th {
padding: .75rem;
vertical-align: top;
}
#content td {
border: 1px solid #dee2e6;
}
#content th {
border: 1px solid #444451;
}
#content code {
color: #111;
background: #eee;
padding: 2px;
}
#content pre {
background: #eee;
padding: 1rem;
}
#docsearch-input:focus, #docsearch-input:active {
border: 0;
color: #efefef!important;
}
@media (max-width: 768px) {
#search-form {
width: 50%;
}
.algolia-autocomplete, #docsearch-input, #search-form .input-group {
width: 100%;
}
}
.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column {
display: none !important;
}
.algolia-autocomplete .algolia-docsearch-suggestion--content {
float: none !important;
width: 100% !important;
background-color: #444451;
}
.algolia-autocomplete .algolia-docsearch-suggestion--content:before {
content: none !important;
}
.algolia-autocomplete .ds-dropdown-menu {
max-height: 512px;
overflow-x: hidden;
overflow-y: auto;
}
.algolia-autocomplete .ds-dropdown-menu,
.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-],
.algolia-autocomplete .algolia-docsearch-suggestion,
.algolia-autocomplete .ds-dropdown-menu:before {
background: #1c1c1c !important;
border-color: #333;
}
.algolia-autocomplete .algolia-docsearch-suggestion--content {
background-color: #333;
}
.algolia-autocomplete .algolia-docsearch-suggestion--content:hover,
.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content {
background-color: #444451 !important;
}
.algolia-autocomplete .algolia-docsearch-suggestion--category-header,
.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column,
.algolia-autocomplete .algolia-docsearch-suggestion--title,
.algolia-autocomplete .algolia-docsearch-suggestion--text {
color: #efefef;
}
.algolia-autocomplete .algolia-docsearch-suggestion--highlight {
color: #f14600;
}
#toc .nav-link {
color: #333;
}
.toc-left, #toc.toc-left .nav-link {
color: #efefef;
}
#toc .nav {
flex-wrap: nowrap !important;
}
.toc-muted {
color: #888 !important;
}
#toc .nav-link:hover {
color: #f14600 !important;
}
@media print {
body {
min-width: 0!important;
}
h1, h2, h3, h4, h5, h6, p, li, thead, tr, th, td, img, code, pre {
page-break-inside: avoid !important;
}
}
@media (prefers-color-scheme: dark) {
body[data-spy] {
background: #1c1c1c;
color: #efefef;
}
#sidebar {
background: #333;
}
#content table {
border: 1px solid #2a2b2c;
}
#content thead {
background: #333;
}
#content td {
border: 1px solid #444451;
}
#content code {
background: #444;
color: #eee;
}
#content pre {
background: #444;
color: #eee;
}
#toc .nav-link {
color: #bbb;
}
}