From 3f7d28843f850cc123c8effbc4ae21ebb518cc57 Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Sun, 19 Nov 2017 13:03:09 +0200 Subject: [PATCH] Added search functionality. --- docs/build-docs.js | 44 ++++++++++++++++++++++++++++++++++++++++---- docs/v3/DEVLOG.md | 1 + docs/v3/docs.html | 31 +++++++++++++++++++++++++++++-- 3 files changed, 70 insertions(+), 6 deletions(-) diff --git a/docs/build-docs.js b/docs/build-docs.js index f7525c7..59b4d03 100644 --- a/docs/build-docs.js +++ b/docs/build-docs.js @@ -8,6 +8,7 @@ var documentStart = ` + mini.css - Minimal, responsive, style-agnostic CSS framework @@ -29,19 +30,46 @@ var appShellStart = `
var appShellEnd = `
`; var appSidebarStart = ` -`; +`; var mainStart = `
`; var mainEnd = `
`; var documentationFragments = docFragments.map(f => buildFragment(f)).join('
'); +var documentationLinks = docFragments.map(f => buildLink(f)).join(''); +var documentationSearch = ` +`; fs.writeFile(outputPath, `${documentStart}${appShellStart} - ${appSidebarStart}${appSidebarEnd} + ${appSidebarStart}${documentationLinks}${appSidebarEnd} ${mainStart}${documentationFragments}${mainEnd} - ${appShellEnd}${documentEnd}`, + ${appShellEnd} + ${documentationSearch} + ${documentEnd}`, function(err) { if(err) return console.log(err); console.log("The file was saved!"); } ); @@ -62,3 +90,11 @@ function buildFragment(fragment){ `; return fragmentHtml; } + +function buildLink(fragment){ + return `${fragment.title}`; +} + +function stripData(fragment){ + return `{id: "${fragment.id}", keys: [${fragment.keywords.map(k=>`"${k}"`)}] }`; +} diff --git a/docs/v3/DEVLOG.md b/docs/v3/DEVLOG.md index d7c5219..a0a9532 100644 --- a/docs/v3/DEVLOG.md +++ b/docs/v3/DEVLOG.md @@ -180,3 +180,4 @@ - Documented `button` elements and input grouping. - Documented `header`, `footer` and `nav`. - Documented `drawer`. +- Implemented search functionality, using `fuse`. It all works pretty well. diff --git a/docs/v3/docs.html b/docs/v3/docs.html index 7990491..32f9cbd 100644 --- a/docs/v3/docs.html +++ b/docs/v3/docs.html @@ -3,6 +3,7 @@ + mini.css - Minimal, responsive, style-agnostic CSS framework @@ -19,7 +20,7 @@
- +

Getting started

You can get started using mini.css in one of many ways. It is published on npm and yarn, so you can easily download it, using your preferred package manager:

@@ -602,4 +603,30 @@

Notes

  • Drawer menus are responsive by default and will expand into normal containers on screens larger or equal to 768px wide.
  • It is highly recommended to place your drawer's toggle button inside your web app's header element.
  • You can combine the navigation bar element with the drawer menu for better results.
  • Remember to apply the appropriate classes to any and all elements, as indicated in the examples. Failing to do so will result in the drawer menu not rendering or behaving properly.
-
\ No newline at end of file + + + + \ No newline at end of file