diff options
author | Marcin Aman <marcin.aman@gmail.com> | 2021-08-12 14:49:26 +0200 |
---|---|---|
committer | Marcin Aman <marcin.aman@gmail.com> | 2021-08-12 14:49:26 +0200 |
commit | 79463f06a953de2f2c2ec877f34deaed658b3471 (patch) | |
tree | 377dea8c152d5afd01c2a3e979154688e90473c2 /plugins/base | |
parent | 7cd0164426a6527b9bbb39d441f9bbdf28db45f3 (diff) | |
download | dokka-79463f06a953de2f2c2ec877f34deaed658b3471.tar.gz dokka-79463f06a953de2f2c2ec877f34deaed658b3471.tar.bz2 dokka-79463f06a953de2f2c2ec877f34deaed658b3471.zip |
Remove unused components, docs, change icon to new kotlin logo and add hamburger for mobile
Diffstat (limited to 'plugins/base')
12 files changed, 23 insertions, 312 deletions
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; } |