diff --git a/packages/explorer-views/src/components/rdf-term.tsx b/packages/explorer-views/src/components/rdf-term.tsx index a64705a..0e4ea7e 100644 --- a/packages/explorer-views/src/components/rdf-term.tsx +++ b/packages/explorer-views/src/components/rdf-term.tsx @@ -207,7 +207,7 @@ function renderCompactedIRI(iri: IRIOrBlankNode, context: RenderContext, options {options.linkContents || <> {prefixedName.prefixLabel.length ? {prefixedName.prefixLabel} : null} : - {prefixedName.localName.length ? {Ix.from(prefixedName.localName.split(/(?<=[^A-Z])(?=[A-Z])/)).intersperse()} : null} + {prefixedName.localName.length ? {Ix.from(prefixedName.localName.split(/(?<=[^A-Z])(?=[A-Z])/)).intersperse(<> )} : null} } ; } diff --git a/packages/explorer-views/src/components/tabview.css b/packages/explorer-views/src/components/tabview.css index a5bb4df..8ae0b77 100644 --- a/packages/explorer-views/src/components/tabview.css +++ b/packages/explorer-views/src/components/tabview.css @@ -21,6 +21,10 @@ text-decoration: underline; } + .tabview .tabview-tabs label:last-of-type { + margin-right: 0; + } + .tabview .tabview-pages > * { display: none; margin: 0; diff --git a/packages/explorer-views/src/components/treeview.css b/packages/explorer-views/src/components/treeview.css index 5c8b074..33daf27 100644 --- a/packages/explorer-views/src/components/treeview.css +++ b/packages/explorer-views/src/components/treeview.css @@ -77,4 +77,6 @@ .tree a { display: inline-block; + white-space: nowrap; + margin-right: .5em; } diff --git a/packages/explorer-views/src/pages/navigation.css b/packages/explorer-views/src/pages/navigation.css index 789e20a..266a6b1 100644 --- a/packages/explorer-views/src/pages/navigation.css +++ b/packages/explorer-views/src/pages/navigation.css @@ -26,7 +26,7 @@ nav { background: var(--base01); border: 1px solid var(--base02); padding: 1.5rem .5rem 5rem; - overflow: clip auto; + overflow: auto; overscroll-behavior: none; } diff --git a/packages/explorer/src/main.ts b/packages/explorer/src/main.ts index 1ede954..28cd0d0 100644 --- a/packages/explorer/src/main.ts +++ b/packages/explorer/src/main.ts @@ -68,14 +68,20 @@ else { dialog.showModal(); function setLayoutsSize(clientX: number) { // eslint-disable-line no-inner-declarations - const width = Math.min(Math.max(clientX - 4, window.innerWidth * 0.15), window.innerWidth * 0.85) + "px"; + const minWidth = 359; // to accommodate at least the main 4 tabs (Classes, Properties, Ontologies and Files) - navigationDivider.style.left = width; - navigationPane.style.width = width; - mainContent.style.marginLeft = width; + let width = Math.min(Math.max(clientX - 4, window.innerWidth * 0.15), window.innerWidth * 0.85); + + if (width < minWidth) { + width = minWidth; + } + + navigationDivider.style.left = width + "px"; + navigationPane.style.width = width + "px"; + mainContent.style.marginLeft = width + "px"; if (window.localStorage) { - window.localStorage.setItem(navWidthStorageKey, width); + window.localStorage.setItem(navWidthStorageKey, width + "px"); } } @@ -269,9 +275,7 @@ else { if (window.localStorage) { const navWidth = Number.parseInt(window.localStorage.getItem(navWidthStorageKey) || ""); - if (!Number.isNaN(navWidth)) { - setLayoutsSize(navWidth); - } + setLayoutsSize(navWidth || 0); } progress.className = "progress-bar loading";