diff --git a/docs/site/assets/css/page.css b/docs/site/assets/css/page.css index 5b1117833d5..6e0af2c98e4 100644 --- a/docs/site/assets/css/page.css +++ b/docs/site/assets/css/page.css @@ -1,120 +1,142 @@ /* mirror of div.body */ section.body { - margin: 3em; + margin: 3em; } header { - width: "100%"; - background-color: #5555ff; - border-bottom: 0.5em solid #EEEEFE; - padding: 0.5em; + width: "100%"; + background-color: #5555ff; + border-bottom: 0.5em solid #eeeefe; + padding: 0.5em; } header div.navparent { - display: flex; - flex-direction: row; - flex-wrap: wrap; + display: flex; + flex-direction: row; + flex-wrap: wrap; } -header .navparent a.icon { - display: table-cell; - margin-top: 40; +header .navparent a.icon { + display: table-cell; + margin-top: 40; } header .navparent > div { - display: table-cell; + display: table-cell; } header .title { - display: table-cell; - color: yellow; - font-size: 1.5em; + display: table-cell; + color: yellow; + font-size: 1.5em; } -header .nav, header .nav > div { - display: inline; +header .nav, +header .nav > div { + display: inline; } header .nav a { - color: white; + color: white; } header .nav ul b { - color: gray; + color: gray; +} + +.title ul.subpages { + display: none; +} + +.title:hover ul.subpages { + display: block; } header .nav .crumb { - color: white; - margin: .5em; + color: white; + margin: 0.5em; } header .nav ul { - display: inline-flexbox; - width: 90%; + display: inline; + box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); + z-index: 1; + background-color: navy; + padding: 0.5em; } header .nav ul li { - display: inline-flex; - padding: .5em; - margin: 0; + display: block; + padding: 0.5em; + font-size: medium; + margin: 0; } header .message { - color: lightblue; - display: list-item; + color: lightblue; + display: list-item; } footer { - width: 100%; - margin-left: auto; - margin-right: auto; - text-align: center; - border-top: 0.5em solid #eeeefe; - font-size: smaller; + width: 100%; + margin-left: auto; + margin-right: auto; + text-align: center; + border-top: 0.5em solid #eeeefe; + font-size: smaller; } - /* copied from tr35.css */ .markdown-alert { - border-left: 0.25em; - padding-left: .5em; - border-left-style: solid; + border-left: 0.25em; + padding-left: 0.5em; + border-left-style: solid; } .markdown-alert-title { - font-weight: bold; + font-weight: bold; } .markdown-alert-title svg { - margin-right: .5em; + margin-right: 0.5em; } .markdown-alert-note { - border-color: blue; + border-color: blue; } .markdown-alert-note .markdown-alert-title { - color: blue; + color: blue; } .markdown-alert-important { - border-color: blueviolet; + border-color: blueviolet; } .markdown-alert-important .markdown-alert-title { - color: blueviolet; + color: blueviolet; } /* unusable header and stuff from old Sites. */ -svg.K4B8Y, div.Xb9hP, div.hBW7Hb, div.WIdY2d, span.Lw7GHd, svg.K4B8Y, path.MrYMx, path.K4B8Y, span.Ce1Y1c, svg.hmuWb, svg.wFCWne { - display: none; +svg.K4B8Y, +div.Xb9hP, +div.hBW7Hb, +div.WIdY2d, +span.Lw7GHd, +svg.K4B8Y, +path.MrYMx, +path.K4B8Y, +span.Ce1Y1c, +svg.hmuWb, +svg.wFCWne { + display: none; } header#atViewHeader { - display: none !important; + display: none !important; } div > header { - display: none !important; + display: none !important; } diff --git a/docs/site/assets/js/cldrsite.js b/docs/site/assets/js/cldrsite.js index 66d1649886e..70e5538cb20 100644 --- a/docs/site/assets/js/cldrsite.js +++ b/docs/site/assets/js/cldrsite.js @@ -2,9 +2,9 @@ const { ref } = Vue; // site management -let myPath = window.location.pathname.slice(1) || "index.html" +let myPath = window.location.pathname.slice(1) || "index.html"; if (!/\.html/.test(myPath)) { - myPath = `${myPath}.html`; // cloudflare likes to drop the .html + myPath = `${myPath}.html`; // cloudflare likes to drop the .html } /** replace a/b/c.md with a/b */ @@ -143,18 +143,19 @@ const app = Vue.createApp( if (!this.tree?.value) return []; let dirForPage = this.ourDir; if (this.tree.value.allIndexes.indexOf(this.mdPath) != -1) { - const dirPages = Object.entries(this.tree?.value?.allDirs) - .filter(([k, {index}]) => index == this.mdPath)[0]; - if (dirPages) { - // our page is an index -so, show the subpages instead of the siblings. - dirForPage = dirPages[0]; // the adjusted index - } else { - return []; // no sibling pages; - } + const dirPages = Object.entries(this.tree?.value?.allDirs).filter( + ([k, { index }]) => index == this.mdPath + )[0]; + if (dirPages) { + // our page is an index -so, show the subpages instead of the siblings. + dirForPage = dirPages[0]; // the adjusted index } else { - return []; // no sibling pages + return []; // no sibling pages; } - let thePages = this.tree?.value?.allDirs[dirForPage].pages ?? []; + } else { + return []; // no sibling pages + } + let thePages = this.tree?.value?.allDirs[dirForPage].pages ?? []; if (dirForPage === "") { thePages = [...thePages, ...this.tree?.value?.allDirs["index"].pages]; } @@ -167,48 +168,51 @@ const app = Vue.createApp( title: this.tree.value.title[path] ?? path, })) .sort((a, b) => c.compare(a.title, b.title)) - .filter(({html}) => html != t.path); // skip showing the index page in the subpage list + .filter(({ html }) => html != t.path); // skip showing the index page in the subpage list }, ancestorPages() { const pages = []; // if we are not loaded, or if we're at the root, then exit - if (!this.tree?.value || !this.path || this.path == 'index.html') return pages; + if (!this.tree?.value || !this.path || this.path == "index.html") + return pages; // traverse let path = this.path; do { // calculate the immediate ancestor const pathMd = html2md(path); const dir = path2dir(path); - const nextIndex = this.tree.value.allDirs[dir].index || 'index.md'; // falls back to top + const nextIndex = this.tree.value.allDirs[dir].index || "index.md"; // falls back to top const nextIndexHtml = md2html(nextIndex); const nextIndexTitle = this.tree.value.title[nextIndex]; // prepend pages.push({ - href: '/'+nextIndexHtml, + href: "/" + nextIndexHtml, title: nextIndexTitle, }); if (nextIndexHtml == path) { - console.error('Loop detected from ' + this.path); - path = 'index.html'; // exit + console.error("Loop detected from " + this.path); + path = "index.html"; // exit } path = nextIndexHtml; - } while(path && path != 'index.html'); // we iterate over 'path', so html + } while (path && path != "index.html"); // we iterate over 'path', so html pages.reverse(); return pages; - } + }, }, - template: `
-
{{ status }}
-
Loading…
- + template: ` +
+
{{ status }}
+
Loading…
[Unicode]   - - {{ ancestor.title }}❱ - - {{ ourTitle }} + + {{ ancestor.title }}❱ + +
{{ ourTitle }}
+
≡ + {{ ourTitle }}
  • @@ -219,6 +223,8 @@ const app = Vue.createApp(
+
+
`, }, {