Initial commit

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Yazzi Hsueh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is furnished
+to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice (including the next
+paragraph) shall be included in all copies or substantial portions of the
+Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS
+OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF
+OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README.md

@@ -0,0 +1,48 @@
+NGINX FancyIndex Theme
+===
+
+A prettier theme for nginx' fancyindex module. Further details about this excellent
+module can be found at the dev's [github page](https://github.com/aperezdc/ngx-fancyindex).
+
+####NOTE:
+NGX-FANCYINDEX truncates the file name to 50 characters subtracts 3 and then
+appends a "..>" to the truncated name. This can be fixed by recompiling
+NGX-FANCYINDEX after changing line 55 of "ngx_http_fancyindex_module.c":
+
+From:
+
+    #define NGX_HTTP_FANCYINDEX_NAME_LEN 50
+
+To:
+
+    #define NGX_HTTP_FANCYINDEX_NAME_LEN 500 (or some other number greater than 50)
+
+#####Usage:
+ - Compile nginx with the fancyindex module.
+ - Include the contents of 'fancyindex.conf' in your location directive of your nginx conf.
+ - copy the remaining items in your web root under 'fancyindex'.
+  - header.html
+  - footer.html
+  - css\fancyindex.css
+  - fonts\\*
+  - images\breadcrumb.png
+ - Restart your nginx server.
+
+#####Added/Modified:
+ - Mime type icons from [Splitbrain](http://www.splitbrain.org/projects/file_icons)
+  - Icons default to enabled on large devices and off on small devices like phones.
+  - If you'd prefer no icons at all: copy css\fancyindex_NoIcons.css css\fancyindex.css
+ - Slightly better handling of mobile CSS click areas.
+ - Added HTML5 History for quicker page transitions.
+  - This can be disabled by commenting out the script tag in footer.html
+ - Fixed CSS issues on older versions of FF
+
+#####Addendums:
+ - If you want your 'Parent Directory/' listing back in your file listings:
+  - Read: [This Issue](https://github.com/TheInsomniac/Nginx-Fancyindex-Theme/issues/1#issuecomment-43936700)
+
+![Image1](https://raw.githubusercontent.com/TheInsomniac/Nginx-Fancyindex-Theme/master/images/fancyindex.png)
+
+![Image1](https://raw.githubusercontent.com/TheInsomniac/Nginx-Fancyindex-Theme/master/images/fancyindex1.png)
+
+![Image1](https://raw.githubusercontent.com/TheInsomniac/Nginx-Fancyindex-Theme/master/images/fancyindex2.png)

css/fancyindex.css

@@ -0,0 +1,466 @@
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_2_0.eot');
+  src: url('../fonts/298CCB_2_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_2_0.woff') format('woff'),url('../fonts/298CCB_2_0.ttf') format('truetype')
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_0_0.eot');
+  src: url('../fonts/298CCB_0_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_0_0.woff') format('woff'),url('../fonts/298CCB_0_0.ttf') format('truetype');
+  font-weight: 300
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_1_0.eot');
+  src: url('../fonts/298CCB_1_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_1_0.woff') format('woff'),url('../fonts/298CCB_1_0.ttf') format('truetype');
+  font-weight: 500
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_3_0.eot');
+  src: url('../fonts/298CCB_3_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_3_0.woff') format('woff'),url('../fonts/298CCB_3_0.ttf') format('truetype');
+  font-weight: bold
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: border-box;
+}
+
+.clearfix {
+  *zoom: 1;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  line-height: 0;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+html, body {
+  /* height: 100%; */
+  font-size: 100%;
+  background-color: #f7f7f7;
+  font-family: "ProximaNova";
+}
+
+.box {
+  border: 1px solid #d9d6d6;
+  width: 100%;
+}
+
+.box .box-header {
+  font-weight: 500;
+  font-style: normal;
+  background: #f7f7f7;
+  background: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f7f7f7));
+  background: -webkit-linear-gradient(top,#fff,#f7f7f7);
+  background: linear-gradient(top,#fff,#f7f7f7);
+  text-transform: uppercase;
+  height: 45px;
+  font-size: 16px;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+.box .box-header .box-header-content {
+  padding: 12px 20px;
+  font-weight: 700;
+  position: relative;
+}
+
+.box .box-content {
+  width: 97%;
+  margin: 20px auto;
+  background: #fff;
+}
+
+.box.box-breadcrumbs .box-header {
+  height: auto;
+}
+
+.box.box-breadcrumbs .box-header-content {
+  padding: 0;
+}
+
+.breadcrumbs a {
+  position: relative;
+  display: inline-block;
+  padding: 8px 18px 8px 10px;
+  font-weight: 400;
+  font-size: 12px;
+  color: #a3a9ab;
+  text-shadow: 0 1px 0 #FFF;
+  -webkit-transition: 300ms color;
+  transition: 300ms color;
+}
+
+.breadcrumbs a:after {
+  display: block;
+  content: '';
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 20px;
+  background: url(../images/breadcrumb.png) no-repeat center right;
+}
+
+.breadcrumbs a:hover {
+  color: #50b1ff;
+  text-decoration: none;
+  background: none;
+}
+
+tbody tr:first-child {
+  display: none;
+}
+
+tr.e {
+  background:#f7f7f7;
+}
+
+th,td {
+  padding:0.1em 0.5em;
+}
+
+th {
+  text-align:left;
+  font-weight:500;
+  background:#eee;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+th > a {
+  color: #333;
+}
+
+h1 {
+  font-size: 1.5rem;
+  color: #333;
+  display: none;
+}
+
+#list {
+  border:1px solid #d9d6d6;
+  width:100%;
+}
+
+td > a {
+   display: block;
+}
+
+a {
+  color:#777;
+  text-decoration: none;
+}
+
+a:hover {
+  color:#333;
+}
+
+@media screen and (max-width: 1024px) {
+  tr > td:nth-child(3) {
+    display: none;
+  }
+  thead > tr > th:nth-child(3) {
+    display: none;
+  }
+  .box .box-content {
+    padding-top: 20px;
+    padding-bottom: 0;
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
+@media screen and (min-width: 1025px) {
+
+  /* I C O N S (only on 1024+ px resolutions)
+  ~~~~~~~~~~~~*/
+
+  #list a[href*="."]:before, #list a[href*="/"]:before,
+  #list a[href~="INSTALL"]:before, #list a[href~="README"]:before,
+  #list a[href~="CHANGELOG"]:before, #list a[href~="COPYING"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+          content: ""; padding: 0 22px 0 0;
+  }
+
+  #list a[href*="."]:after, #list a[href*="/"]:after {
+          content: "";
+  }
+
+  #list a[href$="/"]:before, #list a[href*="/?"]:before {
+          background: url('../icons/folder_black.png') left center no-repeat;
+  }
+
+
+  /* A P P L I C A T I O N
+  ~~~~~~~~~~~~~~~~~~~~~~~~*/
+
+  #list a[href$=".doc"]:before {
+          background: url('../icons/doc.png') left center no-repeat;
+  }
+
+  #list a[href$=".pdf"]:before {
+          background: url('../icons/pdf.png') left center no-repeat;
+  }
+
+  #list a[href$=".pgp"]:before {
+          background: url('../icons/pgp.png') left center no-repeat;
+  }
+
+  #list a[href$=".xml"]:before {
+          background: url('../icons/xml.png') left center no-repeat;
+  }
+
+  #list a[href$=".xls"]:before {
+          background: url('../icons/xls.png') left center no-repeat;
+  }
+
+  #list a[href$=".ppt"]:before {
+          background: url('../icons/ppt.png') left center no-repeat;
+  }
+
+  #list a[href$=".7z"]:before {
+          background: url('../icons/7z.png') left center no-repeat;
+  }
+
+  #list a[href$=".torrent"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".iso"]:before {
+          background: url('../icons/iso.png') left center no-repeat;
+  }
+
+  #list a[href$=".cue"]:before, #list a[href$=".bin"]:before {
+          background: url('../icons/bin.png') left center no-repeat;
+  }
+
+  #list a[href$=".deb"]:before {
+          background: url('../icons/deb.png') left center no-repeat;
+  }
+
+  #list a[href$=".exe"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".swf"]:before {
+          background: url('../icons/swf.png') left center no-repeat;
+  }
+
+  #list a[href$=".tgz"]:before, #list a[href$=".tar.gz"]:before,
+  #list a[href$=".tar.xz"]:before {
+    background: url('../icons/tgz.png') left center no-repeat;
+  }
+
+  #list a[href$=".xpi"]:before {
+    background: url('../icons/xpi.png') left center no-repeat;
+  }
+
+  #list a[href$=".apk"]:before {
+    background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".bat"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".jar"]:before {
+          background: url('../icons/jar.png') left center no-repeat;
+  }
+
+  #list a[href$=".pl"]:before {
+          background: url('../icons/pl.png') left center no-repeat;
+  }
+
+  #list a[href$=".php"]:before {
+          background: url('../icons/php.png') left center no-repeat;
+  }
+
+  #list a[href$=".rar"]:before {
+          background: url('../icons/rar.png') left center no-repeat;
+  }
+
+  #list a[href$=".rpm"]:before {
+          background: url('../icons/rpm.png') left center no-repeat;
+  }
+
+  #list a[href$=".rb"]:before {
+          background: url('../icons/rb.png') left center no-repeat;
+  }
+
+  #list a[href$=".tar"]:before {
+          background: url('../icons/tar.png') left center no-repeat;
+  }
+
+  #list a[href$=".zip"]:before {
+          background: url('../icons/zip.png') left center no-repeat;
+  }
+
+  /* A U D I O
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".m3u"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  #list a[href$=".mpeg"]:before {
+          background: url('../icons/mpg.png') left center no-repeat;
+  }
+
+  #list a[href$=".wma"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  #list a[href$=".ogg"]:before {
+          background: url('../icons/ogg.png') left center no-repeat;
+  }
+
+  #list a[href$=".wav"]:before {
+          background: url('../icons/wav.png') left center no-repeat;
+  }
+
+
+  #list a[href$=".flac"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  /* I M A G E
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".bmp"]:before, #list a[href$=".svg"]:before  {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".gif"]:before {
+          background: url('../icons/gif.png') left center no-repeat;
+  }
+
+  #list a[href$=".jpg"]:before, #list a[href$=".jpeg"]:before {
+          background: url('../icons/jpeg.png') left center no-repeat;
+  }
+
+  #list a[href$=".png"]:before {
+          background: url('../icons/png.png') left center no-repeat;
+  }
+
+  #list a[href$=".tiff"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".ico"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".psd"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".xcf"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+
+  /* T E X T
+  ~~~~~~~~~~*/
+
+  #list a[href$=".css"]:before {
+          background: url('../icons/css.png') left center no-repeat;
+  }
+
+  #list a[href$=".htm"]:before, #list a[href$=".html"]:before,
+  #list a[href$=".md"]:before {
+          background: url('../icons/html.png') left center no-repeat;
+  }
+
+  #list a[href$=".txt"]:before, #list a[href$=".json"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".csv"]:before {
+          background: url('../icons/csv.png') left center no-repeat;
+  }
+
+  #list a[href$=".conf"]:before {
+          background: url('../icons/conf.png') left center no-repeat;
+  }
+
+  #list a[href$=".rtf"]:before {
+          background: url('../icons/rtf.png') left center no-repeat;
+  }
+
+  #list a[href$=".bak"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".c"]:before {
+          background: url('../icons/c.png') left center no-repeat;
+  }
+
+  #list a[href$=".cpp"]:before {
+          background: url('../icons/cpp.png') left center no-repeat;
+  }
+
+  #list a[href~="CHANGELOG"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href~="COPYING"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href~="INSTALL"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".java"]:before {
+          background: url('../icons/java.png') left center no-repeat;
+  }
+
+  #list a[href$=".js"]:before {
+          background: url('../icons/js.png') left center no-repeat;
+  }
+
+  #list a[href$=".h"]:before {
+          background: url('../icons/c.png') left center no-repeat;
+  }
+
+  #list a[href$=".py"]:before {
+          background: url('../icons/py.png') left center no-repeat;
+  }
+
+  #list a[href~="README"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".sh"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".sql"]:before {
+          background: url('../icons/sql.png') left center no-repeat;
+  }
+
+  #list a[href$=".xml"]:before {
+          background: url('../icons/xml.png') left center no-repeat;
+  }
+
+  /* V I D E O
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".avi"]:before, #list a[href$=".mp4"]:before,
+  #list a[href$=".mkv"]:before, #list a[href$=".divx"]:before,
+  #list a[href$=".wmv"]:before {
+          background: url('../icons/video.png') left center no-repeat;
+  }
+}

css/fancyindex_Icons.css

@@ -0,0 +1,466 @@
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_2_0.eot');
+  src: url('../fonts/298CCB_2_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_2_0.woff') format('woff'),url('../fonts/298CCB_2_0.ttf') format('truetype')
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_0_0.eot');
+  src: url('../fonts/298CCB_0_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_0_0.woff') format('woff'),url('../fonts/298CCB_0_0.ttf') format('truetype');
+  font-weight: 300
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_1_0.eot');
+  src: url('../fonts/298CCB_1_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_1_0.woff') format('woff'),url('../fonts/298CCB_1_0.ttf') format('truetype');
+  font-weight: 500
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_3_0.eot');
+  src: url('../fonts/298CCB_3_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_3_0.woff') format('woff'),url('../fonts/298CCB_3_0.ttf') format('truetype');
+  font-weight: bold
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: border-box;
+}
+
+.clearfix {
+  *zoom: 1;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  line-height: 0;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+html, body {
+  /* height: 100%; */
+  font-size: 100%;
+  background-color: #f7f7f7;
+  font-family: "ProximaNova";
+}
+
+.box {
+  border: 1px solid #d9d6d6;
+  width: 100%;
+}
+
+.box .box-header {
+  font-weight: 500;
+  font-style: normal;
+  background: #f7f7f7;
+  background: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f7f7f7));
+  background: -webkit-linear-gradient(top,#fff,#f7f7f7);
+  background: linear-gradient(top,#fff,#f7f7f7);
+  text-transform: uppercase;
+  height: 45px;
+  font-size: 16px;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+.box .box-header .box-header-content {
+  padding: 12px 20px;
+  font-weight: 700;
+  position: relative;
+}
+
+.box .box-content {
+  width: 97%;
+  margin: 20px auto;
+  background: #fff;
+}
+
+.box.box-breadcrumbs .box-header {
+  height: auto;
+}
+
+.box.box-breadcrumbs .box-header-content {
+  padding: 0;
+}
+
+.breadcrumbs a {
+  position: relative;
+  display: inline-block;
+  padding: 8px 18px 8px 10px;
+  font-weight: 400;
+  font-size: 12px;
+  color: #a3a9ab;
+  text-shadow: 0 1px 0 #FFF;
+  -webkit-transition: 300ms color;
+  transition: 300ms color;
+}
+
+.breadcrumbs a:after {
+  display: block;
+  content: '';
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 20px;
+  background: url(../images/breadcrumb.png) no-repeat center right;
+}
+
+.breadcrumbs a:hover {
+  color: #50b1ff;
+  text-decoration: none;
+  background: none;
+}
+
+tbody tr:first-child {
+  display: none;
+}
+
+tr.e {
+  background:#f7f7f7;
+}
+
+th,td {
+  padding:0.1em 0.5em;
+}
+
+th {
+  text-align:left;
+  font-weight:500;
+  background:#eee;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+th > a {
+  color: #333;
+}
+
+h1 {
+  font-size: 1.5rem;
+  color: #333;
+  display: none;
+}
+
+#list {
+  border:1px solid #d9d6d6;
+  width:100%;
+}
+
+td > a {
+   display: block;
+}
+
+a {
+  color:#777;
+  text-decoration: none;
+}
+
+a:hover {
+  color:#333;
+}
+
+@media screen and (max-width: 1024px) {
+  tr > td:nth-child(3) {
+    display: none;
+  }
+  thead > tr > th:nth-child(3) {
+    display: none;
+  }
+  .box .box-content {
+    padding-top: 20px;
+    padding-bottom: 0;
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
+@media screen and (min-width: 1025px) {
+
+  /* I C O N S (only on 1024+ px resolutions)
+  ~~~~~~~~~~~~*/
+
+  #list a[href*="."]:before, #list a[href*="/"]:before,
+  #list a[href~="INSTALL"]:before, #list a[href~="README"]:before,
+  #list a[href~="CHANGELOG"]:before, #list a[href~="COPYING"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+          content: ""; padding: 0 22px 0 0;
+  }
+
+  #list a[href*="."]:after, #list a[href*="/"]:after {
+          content: "";
+  }
+
+  #list a[href$="/"]:before, #list a[href*="/?"]:before {
+          background: url('../icons/folder_black.png') left center no-repeat;
+  }
+
+
+  /* A P P L I C A T I O N
+  ~~~~~~~~~~~~~~~~~~~~~~~~*/
+
+  #list a[href$=".doc"]:before {
+          background: url('../icons/doc.png') left center no-repeat;
+  }
+
+  #list a[href$=".pdf"]:before {
+          background: url('../icons/pdf.png') left center no-repeat;
+  }
+
+  #list a[href$=".pgp"]:before {
+          background: url('../icons/pgp.png') left center no-repeat;
+  }
+
+  #list a[href$=".xml"]:before {
+          background: url('../icons/xml.png') left center no-repeat;
+  }
+
+  #list a[href$=".xls"]:before {
+          background: url('../icons/xls.png') left center no-repeat;
+  }
+
+  #list a[href$=".ppt"]:before {
+          background: url('../icons/ppt.png') left center no-repeat;
+  }
+
+  #list a[href$=".7z"]:before {
+          background: url('../icons/7z.png') left center no-repeat;
+  }
+
+  #list a[href$=".torrent"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".iso"]:before {
+          background: url('../icons/iso.png') left center no-repeat;
+  }
+
+  #list a[href$=".cue"]:before, #list a[href$=".bin"]:before {
+          background: url('../icons/bin.png') left center no-repeat;
+  }
+
+  #list a[href$=".deb"]:before {
+          background: url('../icons/deb.png') left center no-repeat;
+  }
+
+  #list a[href$=".exe"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".swf"]:before {
+          background: url('../icons/swf.png') left center no-repeat;
+  }
+
+  #list a[href$=".tgz"]:before, #list a[href$=".tar.gz"]:before,
+  #list a[href$=".tar.xz"]:before {
+    background: url('../icons/tgz.png') left center no-repeat;
+  }
+
+  #list a[href$=".xpi"]:before {
+    background: url('../icons/xpi.png') left center no-repeat;
+  }
+
+  #list a[href$=".apk"]:before {
+    background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".bat"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".jar"]:before {
+          background: url('../icons/jar.png') left center no-repeat;
+  }
+
+  #list a[href$=".pl"]:before {
+          background: url('../icons/pl.png') left center no-repeat;
+  }
+
+  #list a[href$=".php"]:before {
+          background: url('../icons/php.png') left center no-repeat;
+  }
+
+  #list a[href$=".rar"]:before {
+          background: url('../icons/rar.png') left center no-repeat;
+  }
+
+  #list a[href$=".rpm"]:before {
+          background: url('../icons/rpm.png') left center no-repeat;
+  }
+
+  #list a[href$=".rb"]:before {
+          background: url('../icons/rb.png') left center no-repeat;
+  }
+
+  #list a[href$=".tar"]:before {
+          background: url('../icons/tar.png') left center no-repeat;
+  }
+
+  #list a[href$=".zip"]:before {
+          background: url('../icons/zip.png') left center no-repeat;
+  }
+
+  /* A U D I O
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".m3u"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  #list a[href$=".mpeg"]:before {
+          background: url('../icons/mpg.png') left center no-repeat;
+  }
+
+  #list a[href$=".wma"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  #list a[href$=".ogg"]:before {
+          background: url('../icons/ogg.png') left center no-repeat;
+  }
+
+  #list a[href$=".wav"]:before {
+          background: url('../icons/wav.png') left center no-repeat;
+  }
+
+
+  #list a[href$=".flac"]:before {
+          background: url('../icons/audio.png') left center no-repeat;
+  }
+
+  /* I M A G E
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".bmp"]:before, #list a[href$=".svg"]:before  {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".gif"]:before {
+          background: url('../icons/gif.png') left center no-repeat;
+  }
+
+  #list a[href$=".jpg"]:before, #list a[href$=".jpeg"]:before {
+          background: url('../icons/jpeg.png') left center no-repeat;
+  }
+
+  #list a[href$=".png"]:before {
+          background: url('../icons/png.png') left center no-repeat;
+  }
+
+  #list a[href$=".tiff"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".ico"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".psd"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+  #list a[href$=".xcf"]:before {
+          background: url('../icons/image.png') left center no-repeat;
+  }
+
+
+  /* T E X T
+  ~~~~~~~~~~*/
+
+  #list a[href$=".css"]:before {
+          background: url('../icons/css.png') left center no-repeat;
+  }
+
+  #list a[href$=".htm"]:before, #list a[href$=".html"]:before,
+  #list a[href$=".md"]:before {
+          background: url('../icons/html.png') left center no-repeat;
+  }
+
+  #list a[href$=".txt"]:before, #list a[href$=".json"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".csv"]:before {
+          background: url('../icons/csv.png') left center no-repeat;
+  }
+
+  #list a[href$=".conf"]:before {
+          background: url('../icons/conf.png') left center no-repeat;
+  }
+
+  #list a[href$=".rtf"]:before {
+          background: url('../icons/rtf.png') left center no-repeat;
+  }
+
+  #list a[href$=".bak"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".c"]:before {
+          background: url('../icons/c.png') left center no-repeat;
+  }
+
+  #list a[href$=".cpp"]:before {
+          background: url('../icons/cpp.png') left center no-repeat;
+  }
+
+  #list a[href~="CHANGELOG"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href~="COPYING"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href~="INSTALL"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".java"]:before {
+          background: url('../icons/java.png') left center no-repeat;
+  }
+
+  #list a[href$=".js"]:before {
+          background: url('../icons/js.png') left center no-repeat;
+  }
+
+  #list a[href$=".h"]:before {
+          background: url('../icons/c.png') left center no-repeat;
+  }
+
+  #list a[href$=".py"]:before {
+          background: url('../icons/py.png') left center no-repeat;
+  }
+
+  #list a[href~="README"]:before {
+          background: url('../icons/txt.png') left center no-repeat;
+  }
+
+  #list a[href$=".sh"]:before {
+          background: url('../icons/file.png') left center no-repeat;
+  }
+
+  #list a[href$=".sql"]:before {
+          background: url('../icons/sql.png') left center no-repeat;
+  }
+
+  #list a[href$=".xml"]:before {
+          background: url('../icons/xml.png') left center no-repeat;
+  }
+
+  /* V I D E O
+  ~~~~~~~~~~~~*/
+
+  #list a[href$=".avi"]:before, #list a[href$=".mp4"]:before,
+  #list a[href$=".mkv"]:before, #list a[href$=".divx"]:before,
+  #list a[href$=".wmv"]:before {
+          background: url('../icons/video.png') left center no-repeat;
+  }
+}

css/fancyindex_NoIcons.css

@@ -0,0 +1,185 @@
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_2_0.eot');
+  src: url('../fonts/298CCB_2_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_2_0.woff') format('woff'),url('../fonts/298CCB_2_0.ttf') format('truetype')
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_0_0.eot');
+  src: url('../fonts/298CCB_0_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_0_0.woff') format('woff'),url('../fonts/298CCB_0_0.ttf') format('truetype');
+  font-weight: 300
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_1_0.eot');
+  src: url('../fonts/298CCB_1_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_1_0.woff') format('woff'),url('../fonts/298CCB_1_0.ttf') format('truetype');
+  font-weight: 500
+}
+
+@font-face {
+  font-family: 'ProximaNova';
+  src: url('../fonts/298CCB_3_0.eot');
+  src: url('../fonts/298CCB_3_0.eot?#iefix') format('embedded-opentype'),url('../fonts/298CCB_3_0.woff') format('woff'),url('../fonts/298CCB_3_0.ttf') format('truetype');
+  font-weight: bold
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: border-box;
+}
+
+.clearfix {
+  *zoom: 1;
+}
+
+.clearfix:before,
+.clearfix:after {
+  display: table;
+  line-height: 0;
+  content: "";
+}
+
+.clearfix:after {
+  clear: both;
+}
+
+html, body {
+  /* height: 100%; */
+  font-size: 100%;
+  background-color: #f7f7f7;
+  font-family: "ProximaNova";
+}
+
+.box {
+  border: 1px solid #d9d6d6;
+  width: 100%;
+}
+
+.box .box-header {
+  font-weight: 500;
+  font-style: normal;
+  background: #f7f7f7;
+  background: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#f7f7f7));
+  background: -webkit-linear-gradient(top,#fff,#f7f7f7);
+  background: linear-gradient(top,#fff,#f7f7f7);
+  text-transform: uppercase;
+  height: 45px;
+  font-size: 16px;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+.box .box-header .box-header-content {
+  padding: 12px 20px;
+  font-weight: 700;
+  position: relative;
+}
+
+.box .box-content {
+  width: 97%;
+  margin: 20px auto;
+  background: #fff;
+}
+
+.box.box-breadcrumbs .box-header {
+  height: auto;
+}
+
+.box.box-breadcrumbs .box-header-content {
+  padding: 0;
+}
+
+.breadcrumbs a {
+  position: relative;
+  display: inline-block;
+  padding: 8px 18px 8px 10px;
+  font-weight: 400;
+  font-size: 12px;
+  color: #a3a9ab;
+  text-shadow: 0 1px 0 #FFF;
+  -webkit-transition: 300ms color;
+  transition: 300ms color;
+}
+
+.breadcrumbs a:after {
+  display: block;
+  content: '';
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  width: 20px;
+  background: url(../images/breadcrumb.png) no-repeat center right;
+}
+
+.breadcrumbs a:hover {
+  color: #50b1ff;
+  text-decoration: none;
+  background: none;
+}
+
+tbody tr:first-child {
+  display: none;
+}
+
+tr.e {
+  background:#f7f7f7;
+}
+
+th,td {
+  padding:0.1em 0.5em;
+}
+
+th {
+  text-align:left;
+  font-weight:500;
+  background:#eee;
+  border-bottom: 1px solid #d9d6d6;
+}
+
+th > a {
+  color: #333;
+}
+
+h1 {
+  font-size: 1.5rem;
+  color: #333;
+  display: none;
+}
+
+#list {
+  border:1px solid #d9d6d6;
+  width:100%;
+}
+
+td > a {
+  display: block;
+}
+
+a {
+  color:#777;
+  text-decoration: none;
+}
+
+a:hover {
+  color:#333;
+  /* background: #d7d7d7; */
+}
+
+@media screen and (max-width: 1024px) {
+  tr > td:nth-child(3) {
+    display: none;
+  }
+  thead > tr > th:nth-child(3) {
+    display: none;
+  }
+  .box .box-content {
+    padding-top: 20px;
+    padding-bottom: 0;
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+

fancyindex.conf

@@ -0,0 +1,8 @@
+# Include in location directive
+  fancyindex on;
+  fancyindex_localtime on; #on for local time zone. off for GMT
+  fancyindex_exact_size off; #off for human-readable. on for exact size in bytes
+  fancyindex_header "/fancyindex/header.html";
+  fancyindex_footer "/fancyindex/footer.html";
+  fancyindex_ignore "fancyindex"; #ignore this directory when showing list
+# end include

footer.html

@@ -0,0 +1,22 @@
+
+</div>
+</div>
+<script>
+  var loc = window.location.pathname;
+  var segments = loc.split('/');
+  var breadcrumbs = '';
+  var currentPath = '/';
+  for (var i=0; i<segments.length; i++) {
+    if (segments[i] !== '') {
+      currentPath += segments[i] + '/';
+      breadcrumbs += '<a href="' +  currentPath + '">' + window.unescape(segments[i]) + '<\/a>';
+    } else if (segments.length -1 !== i) {
+      currentPath += '';
+      breadcrumbs += '<a href="' + currentPath + '">Root<\/a>';
+    }
+  }
+  document.getElementById('breadcrumbs').innerHTML = breadcrumbs;
+</script>
+<script src="/fancyindex/js/history.js"></script>
+</body>
+</html>

header.html

@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
+  <meta name="viewport" content="width=device-width"/>
+  <title>Files...</title>
+  <link rel="stylesheet" href="/fancyindex/css/fancyindex.css">
+  <script>
+    window.document.title = window.location.pathname;
+  </script>
+</head>
+<body>
+<div class="box box-breadcrumbs">
+    <div class="box-header">
+      <div class="box-header-content">
+        <div id="breadcrumbs" class="breadcrumbs">
+          <a href="#"></a>
+        </div>
+      </div>
+    </div>
+    <div class="box-content clearfix">
+      <h1>Index of: