andberry

/*
    responsiveTables.js
    add a wrapper around every table in DOM
    and style make it horizontally scrollable (css below)
*/
function responsiveTables() {
    const tablesEls = document.querySelectorAll('table');
    for (const item of Array.from(tablesEls)) {
        const tableWrapperEl = document.createElement('div');
        tableWrapperEl.classList.add('c-responsive-table-wrapper');

andberry

/*
    https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event
    - The DOMContentLoaded event fires when the initial HTML document has been completely loaded and parsed,
    without waiting for stylesheets, images, and subframes to finish loading.
    - A different event, load, should be used only to detect a fully-loaded page. 

    https://developer.mozilla.org/en-US/docs/Web/API/Document/readyState    
    - loading: The document is still loading.
    - interactive: The document has finished loading and the document has been parsed but sub-resources such as scripts, images, stylesheets and frames are still loading.
    - completeThe document and all sub-resources have finished loading. The state indicates that the load event is about to fire.

andberry

# HTML
[...]
<div id="searchapp">
    <div class="search" ref="searchEl">
        <input id="search__input" type="text" name="search" placeholder="Type for search (min 3 chars)" v-model="searchString">

        <transition name="fade">
            <div v-if="searchResults.length > 0 && searchResultsVisible === true" class="search__results">
                <ul>
			<li v-for="(doc, k) in searchResults" :key="k">