nikon/docsearch
1
0
Fork 0
Code Activity Actions

fix(design): mobile scroll and source zindex

Browse source
This commit is contained in:
Shipow 2020-04-10 08:53:36 +02:00
parent b88483851e
commit f2e9eb95f8
1 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/style.css
View file

@ -109,7 +109,6 @@ html[data-theme='dark'] {
background: var(--docsearch-searchbox-background);
color: var(--ifm-color-emphasis-900);
font-weight: 500;
transition: background-color 0.3s ease-out;
user-select: none;
}
@ -125,6 +124,12 @@ html[data-theme='dark'] {
stroke-width: var(--docsearch-icon-stroke-width);
}
.DocSearch-SearchButton:hover .DocSearch-Search-Icon,
.DocSearch-SearchButton:active .DocSearch-Search-Icon,
.DocSearch-SearchButton:focus .DocSearch-Search-Icon{
color: var(--docsearch-primary-color);
}
.DocSearch-SearchButton-Placeholder {
margin: 0 1em 0 .5em;
font-size: 1rem;
@ -420,6 +425,7 @@ html[data-theme='dark'] {
font-size: 0.9em;
color: var(--docsearch-muted-color);
user-select: none;
margin: 0;
}
.DocSearch-Title {
@ -429,7 +435,7 @@ html[data-theme='dark'] {
/* Hit */
.DocSearch-Hits:last-of-type{
margin-bottom: 40px;
margin-bottom: 24px;
}
.DocSearch-Hits mark {
@ -456,9 +462,9 @@ html[data-theme='dark'] {
.DocSearch-Hit-source {
position: sticky;
top: 0;
z-index: var(--ifm-z-index-fixed);
margin: 0 calc(var(--docsearch-spacing) * -1 + 1px);
padding: 8px calc(var(--docsearch-spacing) - 1px) 0;
z-index: 10;
margin: 0 -4px;
padding: 8px 4px 0;
line-height: 32px;
font-size: 0.85em;
font-weight: 600;
@ -614,7 +620,7 @@ html[data-theme='dark'] {
@media (max-width: 750px) {
:root {
/* quickfix https://stackoverflow.com/questions/37112218/css3-100vh-not-constant-in-mobile-browser */
--docsearch-modal-height: 100vh;
--docsearch-modal-height: calc(100vh - 200px);
--docsearch-spacing: 10px;
--docsearch-footer-height: 40px;
}
@ -622,6 +628,14 @@ html[data-theme='dark'] {
.DocSearch-SearchButton-Key {
display: none;
}
.DocSearch-Dropdown {
height: calc(
var(--docsearch-modal-height) - var(--docsearch-searchbox-height) -
var(--docsearch-spacing) - var(--docsearch-footer-height)
);
}
.DocSearch-Modal {
border-radius: 0;
box-shadow: none;
@ -629,6 +643,7 @@ html[data-theme='dark'] {
width: 100%;
max-width: 100%;
}
.DocSearch-Cancel {
display: inline-block;
white-space: nowrap;