.ddoc-search-panel-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: var(--search-panel-wrapper-bg);
z-index: 200;
}
.ddoc-search-panel {
position: fixed;
z-index: 210;
padding: 0;
display: flex;
flex-direction: column;
}
.ddoc-search-controls {
display: flex;
flex-direction: row;
align-items: center;
padding: 20px;
border-radius: 10px 10px 0 0;
background: var(--search-controls-bg);
}
.ddoc-search-controls input {
flex: 1 1 auto;
padding: 5px 5px;
font-size: 16px;
}
.ddoc-search-close {
margin-left: 10px;
padding: 6px 10px;
font-size: 20px;
font-weight: bold;
cursor: pointer;
color: var(--nav-fg);
}
.ddoc-search-close:hover {
color: var(--accent);
}
.ddoc-search-results {
flex: 0 0 auto;
display: flex;
flex-direction: column;
overflow-y: auto;
background: var(--search-results-bg);
padding: 0 0 20px 0;
border-radius: 0 0 10px 10px;
border-top: var(--search-results-border);
}
.ddoc-search-no-result {
padding: 10px;
}
.ddoc-search-result + .ddoc-search-result {
border-top: var(--search-result-border);
}
.ddoc-search-result {
flex: 0 0 auto;
padding: 10px;
display: flex;
flex-direction: column;
align-items: stretch;
}
.ddoc-search-result-selected {
background: var(--selected-search-result-bg);
}
.ddoc-search-result-path {
flex: 0 0 auto;
padding: 5px;
display: flex;
flex-direction: row;
align-items: center;
}
.ddoc-search-result-path a {
color: var(--search-result-link-fg);
}
.ddoc-search-result-path a:hover {
color: var(--hovered-search-result-link-fg);
}
.ddoc-search-result-path .ddoc-search-result-sep {
margin: 0 5px;
color: var(--text);
}
.ddoc-search-result-extract {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
background: var(--bg);
color: var(--text);
margin-left: 10px;
padding: 2px;
font-size: 90%;
opacity: 0.9;
}
@media (max-width: 880px) {
.ddoc-search-panel {
top: 30px;
left: 10px;
right: 10px;
}
.ddoc-search-results {
max-height: calc(100vh - 150px);
}
}
@media (min-width: 880px) {
.ddoc-search-panel {
top: 100px;
width: 760px;
left: calc(50% - 380px);
}
.ddoc-search-results {
max-height: calc(100vh - 240px);
}
}