v0.2.1

- Fxed: update style with some border radius, improve display on mobile - Added: search icon and dymanic close search button
kristuff · Sep 25, 2022 · 5e143fe · 5e143fe
1 parent 889b77f
commit 5e143fe
Show file tree

Hide file tree

Showing 19 changed files with 361 additions and 125 deletions.
diff --git a/README.md b/README.md
@@ -11,9 +11,9 @@
  
 ```
 
-![preview_dark](/screenshots/after_dark.png)
-![preview_401](/screenshots/401_dark.png)
-
+![preview_auto-index-ondesktop](/screenshots/auto-index-desktop-light-dark.png)
+![preview_auto-index-on-mobile](/screenshots/auto-index-mobile-light-dark.png)
+![preview_error-401](/screenshots/401_dark.png)
 
 ## Features
 - Responsive design
@@ -25,6 +25,8 @@
 ## Requirements
 - Apache >= 2.4 
 
+## Limitations
+- On mobile, column headers are hidden so sorting is implicitly disabled   
 
 ## Install
 

diff --git a/assets/FOOTER.html b/assets/FOOTER.html
@@ -3,7 +3,7 @@
     </section>
     <footer id="section-footer">
         <div class="row">
-            <p>Apache Fancy Pages v0.1.9 | © 2021-2022 Christophe Buliard | <a target="_blank" href="https://github.com/kristuff/apache-fancy-pages" rel="no-referer">Source code</a> </p> 
+            <p>Apache Fancy Pages v0.2.1 | © 2021-2022 Christophe Buliard | <a target="_blank" href="https://github.com/kristuff/apache-fancy-pages" rel="no-referer">Source code</a> </p> 
         </div>
     </footer>
     <script src="/fancy-pages/js/script.js"></script>

diff --git a/assets/HEADER.html b/assets/HEADER.html
@@ -7,15 +7,23 @@
     <title></title>
     <link rel="stylesheet" type="text/css" href="/fancy-pages/css/style.css">
 </head>
-<body>
+<body data-theme="auto">
     <header id="section-header">
         <div class="row"></div>
     </header>
     <section id="section-title">
         <div class="row">
             <h1 id="title"></h1>
+        </div>
+        <div class="row flex">
             <div id="breadcrumb"></div>
-            <input id="filter" type="text" placeholder="Search..." >
+            <div class="search-wrapper">
+                <input id="filter" type="text" placeholder="Search..." >
+                <span class="search-icon"></span>
+                <button class="close-search">
+                    <span class="close-icon"></span>
+                </button>
+            </div>
         </div>
     </section>
     <section id="section-content">