Improved padding of active search input

This commit is contained in:
Silvio Giebl 2020-01-01 00:21:19 +01:00
parent 82b3f15443
commit c907e79251
2 changed files with 16 additions and 8 deletions

View File

@ -37,7 +37,7 @@
padding-top: $sp-2;
padding-right: $gutter-spacing-sm;
padding-bottom: $sp-2;
padding-left: #{$gutter-spacing-sm + $sp-4 * 1.2 + $sp-2};
padding-left: #{$gutter-spacing-sm + $sp-5};
background-color: $search-background-color;
border-top: 0;
border-right: 0;
@ -55,7 +55,7 @@
background-color: $body-background-color;
border-radius: 0;
box-shadow: none;
transition: width ease $transition-duration;
transition: padding-left linear #{$transition-duration / 2}, width ease $transition-duration;
@include fs-3;
}
@ -76,6 +76,7 @@
@include mq(md) {
padding-left: $gutter-spacing;
transition: padding-left linear #{$transition-duration / 2};
}
.search-icon {
@ -261,10 +262,17 @@
box-shadow: none;
@include mq(md) {
padding-left: #{$sp-4 * 1.25 + $sp-5};
width: $search-results-width;
}
}
.search-label {
@include mq(md) {
padding-left: #{$sp-4 * 1.25};
}
}
.search-results {
display: block;
}

View File

@ -51,7 +51,7 @@ function initNav() {
}
});
{% if site.search_enabled != false and site.search.button -%}
{%- if site.search_enabled != false and site.search.button %}
const searchInput = document.getElementById('search-input');
const searchButton = document.getElementById('search-button');
@ -64,9 +64,9 @@ function initNav() {
{%- endif %}
}
{%- if site.search_enabled != false %}
// Site search
{% if site.search_enabled != false -%}
function initSearch() {
var request = new XMLHttpRequest();
request.open('GET', '{{ "assets/js/search-data.json" | absolute_url }}', true);
@ -81,7 +81,7 @@ function initSearch() {
this.ref('id');
this.field('title', { boost: 200 });
this.field('content', { boost: 2 });
{% if site.search.rel_url != false -%}
{%- if site.search.rel_url != false %}
this.field('relUrl');
{%- endif %}
this.metadataWhitelist = ['position']
@ -91,7 +91,7 @@ function initSearch() {
id: i,
title: docs[i].title,
content: docs[i].content,
{% if site.search.rel_url != false -%}
{%- if site.search.rel_url != false %}
relUrl: docs[i].relUrl
{%- endif %}
});
@ -266,7 +266,7 @@ function initSearch() {
}
}
{% if site.search.rel_url != false -%}
{%- if site.search.rel_url != false %}
var resultRelUrl = document.createElement('span');
resultRelUrl.classList.add('search-result-rel-url');
resultRelUrl.innerText = doc.relUrl;
@ -351,7 +351,7 @@ function initSearch() {
jtd.onReady(function(){
initNav();
{% if site.search_enabled != false -%}
{%- if site.search_enabled != false %}
initSearch();
{%- endif %}
});