From 79463f06a953de2f2c2ec877f34deaed658b3471 Mon Sep 17 00:00:00 2001
From: Marcin Aman <marcin.aman@gmail.com>
Date: Thu, 12 Aug 2021 14:49:26 +0200
Subject: Remove unused components, docs, change icon to new kotlin logo and
 add hamburger for mobile

---
 .../doc/docs/user_guide/base-specific/frontend.md  | 14 +----
 .../main/components/navigationPaneSearch/clear.svg |  3 -
 .../navigationPaneSearch/navigationPaneSearch.scss | 37 -----------
 .../navigationPaneSearch/navigationPaneSearch.tsx  | 71 ----------------------
 .../main/components/pageSummary/pageSummary.scss   | 71 ----------------------
 .../main/components/pageSummary/pageSummary.tsx    | 65 --------------------
 plugins/base/frontend/src/main/components/root.tsx | 37 ++---------
 .../src/main/kotlin/renderers/html/HtmlRenderer.kt |  8 +--
 .../kotlin/renderers/html/htmlPreprocessors.kt     |  2 -
 .../src/main/resources/dokka/images/docs_logo.svg  |  7 ---
 .../src/main/resources/dokka/images/logo-icon.svg  | 13 +++-
 .../main/resources/dokka/styles/logo-styles.css    |  3 -
 .../base/src/main/resources/dokka/styles/style.css | 18 ++----
 13 files changed, 24 insertions(+), 325 deletions(-)
 delete mode 100644 plugins/base/frontend/src/main/components/navigationPaneSearch/clear.svg
 delete mode 100644 plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.scss
 delete mode 100644 plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.tsx
 delete mode 100644 plugins/base/frontend/src/main/components/pageSummary/pageSummary.scss
 delete mode 100644 plugins/base/frontend/src/main/components/pageSummary/pageSummary.tsx
 delete mode 100644 plugins/base/src/main/resources/dokka/images/docs_logo.svg
 delete mode 100644 plugins/base/src/main/resources/dokka/styles/logo-styles.css

diff --git a/docs/src/doc/docs/user_guide/base-specific/frontend.md b/docs/src/doc/docs/user_guide/base-specific/frontend.md
index 62f72af1..dc1b0c2e 100644
--- a/docs/src/doc/docs/user_guide/base-specific/frontend.md
+++ b/docs/src/doc/docs/user_guide/base-specific/frontend.md
@@ -24,7 +24,6 @@ Dokka uses 3 stylesheets:
 
 * `style.css` - main css file responsible for styling the page
 * `jetbrains-mono.css` - fonts used across dokka
-* `logo-styles.css` - logo styling
 
 User can choose to add or override those files. 
 Resources will be overridden when in `pluginConfiguration` block there is a resource with the same name.
@@ -37,15 +36,4 @@ Keep in mind that this value will be pased exactly to the output html, so it has
 ## Separating inherited members
 
 By setting a boolean property `separateInheritedMembers` dokka will split inherited members (like functions, properties etc.) 
-from ones declared in viewed class. Separated members will have it's own tabs on the page.
-
-### Examples
-In order to override a logo and style it accordingly a simple css file named `logo-styles.css` is needed:
-```css
-#logo {
-    background-image: url('https://upload.wikimedia.org/wikipedia/commons/9/9d/Ubuntu_logo.svg');
-    /* other styles required to make your page pretty */
-}
-```
-
-For build system specific instructions please visit dedicated pages: [gradle](../gradle/usage.md#Applying plugins), [maven](../maven/usage.md#Applying plugins) and [cli](../cli/usage.md#Configuration options)
+from ones declared in viewed class. Separated members will have it's own tabs on the page.
\ No newline at end of file
diff --git a/plugins/base/frontend/src/main/components/navigationPaneSearch/clear.svg b/plugins/base/frontend/src/main/components/navigationPaneSearch/clear.svg
deleted file mode 100644
index ad6a2026..00000000
--- a/plugins/base/frontend/src/main/components/navigationPaneSearch/clear.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M11.1374 1.80464L6.94205 5.99996L11.1374 10.1953L10.1947 11.138L5.99935 6.94267L1.80403 11.138L0.861328 10.1953L5.05664 5.99996L0.861328 1.80464L1.80403 0.861938L5.99935 5.05725L10.1947 0.861938L11.1374 1.80464Z" fill="#637282"/>
-</svg>
diff --git a/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.scss b/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.scss
deleted file mode 100644
index 1a61e90f..00000000
--- a/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.scss
+++ /dev/null
@@ -1,37 +0,0 @@
-@import "src/main/scss/index.scss";
-
-$defaultHeight: 40px;
-
-div#paneSearch {
-
-    width: 248px;
-    margin: 0 auto;
-
-    input#navigation-pane-search {
-        background: $white;
-        border: 1px solid $grey-border;
-        box-sizing: border-box;
-        border-radius: 4px;
-        padding: 8px;
-        height: $defaultHeight;
-    }
-    
-    .navigation-pane-search {
-        padding-top: 16px;
-        width: 100%;
-    }
-
-    div.paneSearchInputWrapper {
-        position: relative;
-        span.paneSearchInputClearIcon {
-            position: absolute;
-            top: calc(50% + 2px); //Just to include a border
-            right: 8px;
-            cursor: pointer;
-        }
-    }
-}
-
-.navigation-pane-popup {
-    margin-top: 1.2em;
-}
\ No newline at end of file
diff --git a/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.tsx b/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.tsx
deleted file mode 100644
index 152e7719..00000000
--- a/plugins/base/frontend/src/main/components/navigationPaneSearch/navigationPaneSearch.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import React, { useCallback, useState, useEffect } from 'react';
-import {Select, List } from '@jetbrains/ring-ui';
-import { DokkaFuzzyFilterComponent } from '../search/dokkaFuzzyFilter';
-import { IWindow, Option } from '../search/types';
-import './navigationPaneSearch.scss';
-import ClearIcon from 'react-svg-loader!./clear.svg';
-import { relativizeUrlForRequest } from '../utils/requests';
-
-export const NavigationPaneSearch = () => {
-    const [navigationList, setNavigationList] = useState<Option[]>([]);
-    const [selected, onSelected] = useState<Option | null>(null);
-    const [filterValue, setFilterValue] = useState<string>('')
-    
-    const onChangeSelected = useCallback(
-        (element: Option) => {
-            window.location.replace(`${(window as IWindow).pathToRoot}${element.location}`)
-            onSelected(element);
-        },
-        [selected]
-    );
-
-    const onFilter = (filterValue: string) => {
-        setFilterValue(filterValue)
-    }
-
-    const onClearClick = () => {
-        setFilterValue('')
-    }
-
-    const shouldShowPopup = (filterState: string): boolean => {
-        return filterState.trim().length !== 0
-    }
-
-    useEffect(() => {
-        fetch(relativizeUrlForRequest('scripts/navigation-pane.json'))
-            .then(response => response.json())
-            .then((result) => {
-                setNavigationList(result.map((record: Option, idx: number) => {
-                    return {
-                        ...record,
-                        key: idx,
-                        rgItemType: List.ListProps.Type.CUSTOM
-                    }
-                }))
-            },
-            (error) => {
-                console.error('failed to fetch navigationPane data', error)
-                setNavigationList([])
-            })
-    }, [])
-  
-
-    return <div className={"paneSearchInputWrapper"}>
-            <DokkaFuzzyFilterComponent
-                    id="navigation-pane-search"
-                    className="navigation-pane-search"
-                    inputPlaceholder="Title filter"
-                    clear={true}
-                    type={Select.Type.INPUT_WITHOUT_CONTROLS}
-                    filter={{fuzzy:true, value: filterValue}}
-                    selected={selected}
-                    data={navigationList}
-                    popupClassName={"navigation-pane-popup"}
-                    onSelect={onChangeSelected}
-                    onFilter={onFilter}
-                    shouldShowPopup={shouldShowPopup}
-                    renderOptimization={false}
-                />
-                <span className={"paneSearchInputClearIcon"} onClick={onClearClick}><ClearIcon /></span>
-        </div>
-}
\ No newline at end of file
diff --git a/plugins/base/frontend/src/main/components/pageSummary/pageSummary.scss b/plugins/base/frontend/src/main/components/pageSummary/pageSummary.scss
deleted file mode 100644
index aaa897a8..00000000
--- a/plugins/base/frontend/src/main/components/pageSummary/pageSummary.scss
+++ /dev/null
@@ -1,71 +0,0 @@
-@import "src/main/scss/index.scss";
-
-.page-summary {
-    background: $white;
-    border: 1px solid $grey-border;
-    position: fixed;
-    top: 25%;
-    max-height: 70vh;
-    right: -2px;
-    width: 250px;
-    z-index: 8;
-    transition: width .2s;
-
-    &.hidden {
-        width: 3em;
-        writing-mode: vertical-rl;
-        text-orientation: mixed;
-
-        .content-wrapper {
-            h4 {
-                margin: 0;
-                padding: 8px;
-            }
-        }
-    }
-
-    .content-wrapper {
-        padding: 0.5em 0 1em 0;
-        letter-spacing: 0.2px;
-
-        h4 {
-            margin: 0 2em;
-            font-weight: 600;
-        }
-
-        ul {
-            list-style-type: none;
-            width: 100%;
-            padding: 0;
-            margin: 1em 0;
-            overflow-x: hidden;
-            overflow-y: auto;
-            max-height: 60vh;
-
-            li {
-                width: 100%;
-                padding: 4px 0;
-
-                &:hover {
-                    background: $list-background-hover;
-                }
-
-                &>a {
-                    margin: 0 2em;
-                    cursor: pointer;
-                }
-
-                &.selected {
-                    border-left: 4px solid $hover-link-color;
-                }
-            }
-        }
-    }
-}
-
-@media screen and (max-width: 759px){
-    /* hide it on smaller screens since it looks super weird when displayed with hidden menu */
-    .page-summary {
-        display: none;
-    }
-}
\ No newline at end of file
diff --git a/plugins/base/frontend/src/main/components/pageSummary/pageSummary.tsx b/plugins/base/frontend/src/main/components/pageSummary/pageSummary.tsx
deleted file mode 100644
index c5a8344f..00000000
--- a/plugins/base/frontend/src/main/components/pageSummary/pageSummary.tsx
+++ /dev/null
@@ -1,65 +0,0 @@
-import React, { useState, useEffect } from "react";
-import './pageSummary.scss'
-import _ from "lodash";
-import Scrollspy from 'react-scrollspy'
-
-type PageSummaryProps = {
-    entries: PageSummaryEntry[],
-    containerId: string, //Id of a container that has scroll enabled 
-    offsetComponentId: string, //Id of a top navbar component
-}
-
-type PageSummaryEntry = {
-    location: string,
-    label: string,
-    sourceSets: SourceSetFilterKey[]
-}
-
-type SourceSetFilterKey = string
-
-const getElementHeightFromDom = (elementId: string): number => document.getElementById(elementId).offsetHeight
-
-export const PageSummary: React.FC<PageSummaryProps> = ({ entries, containerId, offsetComponentId }: PageSummaryProps) => {
-    const [hidden, setHidden] = useState<Boolean>(true);
-    const [displayableEntries, setDisplayableEntries] = useState<PageSummaryEntry[]>(entries)
-    const topOffset = getElementHeightFromDom(offsetComponentId)
-
-    useEffect(() => {
-        const handeEvent = (event: CustomEvent<SourceSetFilterKey[]>) => {
-            const displayable = entries.filter((entry) => entry.sourceSets.some((sourceset) => event.detail.includes(sourceset)))
-            setDisplayableEntries(displayable)
-        }
-
-        window.addEventListener('sourceset-filter-change', handeEvent)
-        return () => window.removeEventListener('sourceset-filter-change', handeEvent)
-    }, [entries])
-
-    const handleMouseHover = () => {
-        setHidden(!hidden)
-    }
-
-    const handleClick = (entry: PageSummaryEntry) => {
-        document.getElementById(containerId).scrollTo({
-            top: document.getElementById(entry.location).offsetTop - topOffset,
-            behavior: 'smooth'
-        })
-    }
-
-    let classnames = "page-summary"
-    if (hidden) classnames += " hidden"
-
-    return (
-        <div
-            className={classnames}
-            onMouseEnter={handleMouseHover}
-            onMouseLeave={handleMouseHover}
-        >
-            <div className={"content-wrapper"}>
-                <h4>On this page</h4>
-                {!hidden && <Scrollspy items={displayableEntries.map((e) => e.location)} currentClassName="selected">
-                    {displayableEntries.map((item) => <li><a onClick={() => handleClick(item)}>{item.label}</a></li>)}
-                </Scrollspy>}
-            </div>
-        </div>
-    )
-}
\ No newline at end of file
diff --git a/plugins/base/frontend/src/main/components/root.tsx b/plugins/base/frontend/src/main/components/root.tsx
index 4161a4c1..9efbfdd0 100644
--- a/plugins/base/frontend/src/main/components/root.tsx
+++ b/plugins/base/frontend/src/main/components/root.tsx
@@ -1,47 +1,18 @@
 import React from 'react';
-import { render } from 'react-dom';
-import _ from "lodash";
+import {render} from 'react-dom';
 
 import App from "./app";
 import './app/index.scss';
-import { NavigationPaneSearch } from './navigationPaneSearch/navigationPaneSearch';
-import { PageSummary } from './pageSummary/pageSummary';
 
-const renderNavigationPane = () => {
-  render(
-    <NavigationPaneSearch />,
-    document.getElementById('paneSearch')
-  )
-}
-
-const renderOnThisPage = () => {
-  for (const e of document.querySelectorAll('.tabs-section-body > div[data-togglable]')) {
-    const entries = Array.from(e.querySelectorAll('a[anchor-label]')).map((element: HTMLElement) => {
-      return {
-        location: element.getAttribute('data-name'),
-        label: element.getAttribute('anchor-label'),
-        sourceSets: _.sortBy(element.getAttribute('data-filterable-set').split(' '))
-      }
-    })
-    const unique = _.uniqBy(entries, ({label}) => label)
-    if (unique.length) {
-      const element = document.createElement('div')
-      render(<PageSummary entries={unique} containerId={'main'} offsetComponentId={'navigation-wrapper'}/>, element)
-      e.appendChild(element)
-    }
-  }
-}
 
 const renderMainSearch = () => {
-  render(<App />, document.getElementById('searchBar'));
+    render(<App/>, document.getElementById('searchBar'));
 }
 
 let renderApp = () => {
-  renderMainSearch();
-  renderNavigationPane();
-  renderOnThisPage();
+    renderMainSearch();
 
-  document.removeEventListener('DOMContentLoaded', renderApp);
+    document.removeEventListener('DOMContentLoaded', renderApp);
 };
 
 document.addEventListener('DOMContentLoaded', renderApp);
\ No newline at end of file
diff --git a/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt b/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt
index 77086695..362447d1 100644
--- a/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt
+++ b/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt
@@ -798,6 +798,10 @@ open class HtmlRenderer(
             body {
                 div("navigation-wrapper") {
                     id = "navigation-wrapper"
+                    div {
+                        id = "leftToggler"
+                        span("icon-toggler")
+                    }
                     div("library-name") {
                         clickableLogo(page, pathToRoot)
                     }
@@ -821,10 +825,6 @@ open class HtmlRenderer(
                     }
                     div {
                         id = "main"
-                        div {
-                            id = "leftToggler"
-                            span("icon-toggler")
-                        }
                         templateCommand(PathToRootSubstitutionCommand("###", default = pathToRoot)) {
                             script(type = ScriptType.textJavaScript, src = "###scripts/main.js") {}
                         }
diff --git a/plugins/base/src/main/kotlin/renderers/html/htmlPreprocessors.kt b/plugins/base/src/main/kotlin/renderers/html/htmlPreprocessors.kt
index 70f1c1d6..992c5eba 100644
--- a/plugins/base/src/main/kotlin/renderers/html/htmlPreprocessors.kt
+++ b/plugins/base/src/main/kotlin/renderers/html/htmlPreprocessors.kt
@@ -134,7 +134,6 @@ class ScriptsInstaller(private val dokkaContext: DokkaContext) : PageTransformer
 class StylesInstaller(private val dokkaContext: DokkaContext) : PageTransformer {
     private val stylesPages = listOf(
         "styles/style.css",
-        "styles/logo-styles.css",
         "styles/jetbrains-mono.css",
         "styles/main.css"
     )
@@ -154,7 +153,6 @@ object AssetsInstaller : PageTransformer {
     private val imagesPages = listOf(
         "images/arrow_down.svg",
         "images/arrow_down_white.svg",
-        "images/docs_logo.svg",
         "images/logo-icon.svg",
         "images/go-to-top-icon.svg",
         "images/footer-go-to-link.svg",
diff --git a/plugins/base/src/main/resources/dokka/images/docs_logo.svg b/plugins/base/src/main/resources/dokka/images/docs_logo.svg
deleted file mode 100644
index 7c1e3ae8..00000000
--- a/plugins/base/src/main/resources/dokka/images/docs_logo.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-<svg width="125" height="27" viewBox="0 0 125 27" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M89.1611 7.6297V25.6345V25.6867H103.843V21.8039H93.3589V10.3852H103.843V6.50244H89.1611V7.6297Z" fill="#27282C"/>
-<path d="M124.989 21.8039L114.778 10.3852H124.905V6.50244H109.059V10.3852L119.459 21.8039H109.059V25.6867H125V21.8039H124.989Z" fill="#27282C"/>
-<path d="M58.2978 7.76556C56.5872 6.46086 54.4463 5.67804 52.1271 5.67804C46.5336 5.67804 42 10.1871 42 15.7503C42 21.3135 46.5336 25.8226 52.1271 25.8226C54.4463 25.8226 56.5872 25.0502 58.2978 23.735V25.7182H62.4955V0H58.2978V7.76556ZM52.1271 21.8041C48.7584 21.8041 46.0298 19.0903 46.0298 15.7399C46.0298 12.3894 48.7584 9.67563 52.1271 9.67563C55.4958 9.67563 58.2243 12.3894 58.2243 15.7399C58.2138 19.0903 55.4853 21.8041 52.1271 21.8041Z" fill="#27282C"/>
-<path d="M75.9698 5.8656C70.3763 5.8656 65.8428 10.3746 65.8428 15.9379C65.8428 21.5011 70.3763 26.0101 75.9698 26.0101C81.5633 26.0101 86.0969 21.5011 86.0969 15.9379C86.0969 10.3746 81.5633 5.8656 75.9698 5.8656ZM75.9698 21.9916C72.6012 21.9916 69.8726 19.2779 69.8726 15.9274C69.8726 12.577 72.6012 9.86319 75.9698 9.86319C79.3385 9.86319 82.0671 12.577 82.0671 15.9274C82.0671 19.2779 79.3385 21.9916 75.9698 21.9916Z" fill="#27282C"/>
-<path d="M26 26H0V0H26L12.9243 12.9747L26 26Z" fill="#F8873C"/>
-</svg>
diff --git a/plugins/base/src/main/resources/dokka/images/logo-icon.svg b/plugins/base/src/main/resources/dokka/images/logo-icon.svg
index 1b3b3670..1fea0877 100755
--- a/plugins/base/src/main/resources/dokka/images/logo-icon.svg
+++ b/plugins/base/src/main/resources/dokka/images/logo-icon.svg
@@ -1,3 +1,10 @@
-<svg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M26 26H0V0H26L12.9243 12.9747L26 26Z" fill="#F8873C"/>
-</svg>
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M64 64H0V0H64L31.3373 31.5369L64 64Z" fill="url(#paint0_radial)"/>
+    <defs>
+        <radialGradient id="paint0_radial" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(61.8732 2.63097) scale(73.3111)">
+            <stop offset="0.00343514" stop-color="#EF4857"/>
+            <stop offset="0.4689" stop-color="#D211EC"/>
+            <stop offset="1" stop-color="#7F52FF"/>
+        </radialGradient>
+    </defs>
+</svg>
\ No newline at end of file
diff --git a/plugins/base/src/main/resources/dokka/styles/logo-styles.css b/plugins/base/src/main/resources/dokka/styles/logo-styles.css
deleted file mode 100644
index a3a07d75..00000000
--- a/plugins/base/src/main/resources/dokka/styles/logo-styles.css
+++ /dev/null
@@ -1,3 +0,0 @@
-#logo {
-    background-image: url(../images/docs_logo.svg);
-}
\ No newline at end of file
diff --git a/plugins/base/src/main/resources/dokka/styles/style.css b/plugins/base/src/main/resources/dokka/styles/style.css
index 248bb531..d16b420d 100644
--- a/plugins/base/src/main/resources/dokka/styles/style.css
+++ b/plugins/base/src/main/resources/dokka/styles/style.css
@@ -694,6 +694,7 @@ small {
     align-self: flex-end;
     min-height: 30px;
     z-index: 0;
+    flex-wrap: wrap;
 }
 
 .platform-selector:hover {
@@ -1110,21 +1111,12 @@ div.runnablesample {
     }
 
     #leftToggler {
-        display: unset;
-        position: fixed;
-        top: 50%;
-        transform: translateY(-50%);
         z-index: 5;
         font-size: 20px;
         transition: margin .2s ease-out;
+        margin-right: 16px;
 
-        color: var(--average-color);
-        border: 1px solid var(--average-color);
-        border-left: 0;
-        border-top-right-radius: 1em;
-        border-bottom-right-radius: 1em;
-        padding: 8px 4px 8px 8px;
-        background-color: white;
+        color: var(--background-color);
     }
 
     #leftToggler .icon-toggler:hover {
@@ -1136,11 +1128,11 @@ div.runnablesample {
     }
 
     .icon-toggler::before {
-        content: "\232A";
+        content: "\2630";
     }
 
     #leftColumn.open ~ #main .icon-toggler::before {
-        content: "\2329";
+        content: "\2630";
         padding-right: 0.5em;
         margin-left: -0.5em;
     }
-- 
cgit