chore: bump version from 2.2.0-dev to 2.2.0

Remove package-lock.json as conventional-changelog is only useful to release a new version of apaxy.

CHANGELOG.md

@@ -1,3 +1,19 @@
+# [2.2.0](https://github.com/oupala/apaxy/compare/2.1.3...2.2.0) (2020-03-19)
+
+
+### Bug Fixes
+
+* **doc:** fix links in table of content ([cc02ee5](https://github.com/oupala/apaxy/commit/cc02ee5e65359a95315d7d848589d4f4b05b8e14))
+* favicon not being loaded when using Apaxy in a subdirectory ([b9c2521](https://github.com/oupala/apaxy/commit/b9c25218f177b22ba0590706692d47f54986cd0d))
+
+
+### Features
+
+* optimize icons ([49289c4](https://github.com/oupala/apaxy/commit/49289c439cd032a95a4be93e1eb74f0fc7e821ef))
+* **theme:** add a proper dark mode (and globally improve CSS styles) ([301c932](https://github.com/oupala/apaxy/commit/301c9329af1ceea467b786ce287ae5557a08002b))
+
+
+
 ## [2.1.3](https://github.com/oupala/apaxy/compare/2.1.2...2.1.3) (2019-07-18)
 
 

README.md

@@ -6,9 +6,10 @@ apaxy is a customisable theme built to enhance the experience of browsing web di
 
 - [features](#features)
 - [installation](#installation)
-- [docker images](#docker-images)
+- [docker image](#docker-image)
 - [apaxy themes](#apaxy-themes)
-- [mime Types](#mime-types)
+- [media types](#media-types)
+- [gallery](#gallery)
 - [troubleshooting](#troubleshooting)
 - [credits](#credits)
 
@@ -28,7 +29,7 @@ Apaxy may be basic, but it gives you a great deal of creative freedom when styli
 
 apaxy requires an apache (2.2.11+) enabled http server.
 
-### Quick Start
+### Quick start
 
 If you would like, you can automate the installation of Apaxy with the included `apaxy-configure.sh` script.
 
@@ -42,7 +43,7 @@ Then run the configuration script as a user that can write to the `installWebPat
 
 The files will be copied to the web server directory, and modified automatically based on the settings specified.
 
-### Manual Install
+### Manual install
 
 Let's assume you have a folder named `share` in your server root directory (the path thus being `http://mywebsite.com/share`) that you'd like to use as your listing directory:
 

apaxy/htaccess.txt

@@ -19,11 +19,13 @@ Options +Indexes
 # index options
 IndexOptions +Charset=UTF-8 +FancyIndexing +FoldersFirst +HTMLTable +IconsAreLinks +IgnoreCase +NameWidth=* +SuppressDescription +SuppressRules +XHTML
 
-# meta viewport
-IndexHeadInsert "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />"
+# favicon & meta viewport
+IndexHeadInsert "\
+        <link rel=\"shortcut icon\" href=\"{FOLDERNAME}/theme/favicon.ico\" />\
+        <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />"
 
-# hide ".htaccess" file, "favicon.ico" file and "/theme" directory
-IndexIgnore .htaccess favicon.ico /theme
+# hide ".htaccess" file and "/theme" directory
+IndexIgnore .htaccess /theme
 
 
 #
@@ -123,7 +125,7 @@ AddIconByType (audio,{FOLDERNAME}/theme/icons/audio.png) audio/*
 AddIconByType (playlist,{FOLDERNAME}/theme/icons/video.png) video/vnd.mpegurl
 
 # all video
-# ext: 3g2 3gp h261 h263 h264 jpgv jpm jpgm mj2 mjp2 mp4 mp4v mpg4 mpeg mpg mpe m1v m2v ogv qt mov uvh uvvh uvm uvvm uvp uvvp uvs uvvs uvv uvvv dvb fvt mxu m4u pyv uvu uvvu viv webm f4v fli flv m4v mkv mk3d mks mng asf asx avi vob wmv wm wmx wvx movie smv 
+# ext: 3g2 3gp h261 h263 h264 jpgv jpm jpgm mj2 mjp2 mp4 mp4v mpg4 mpeg mpg mpe m1v m2v ogv qt mov uvh uvvh uvm uvvm uvp uvvp uvs uvvs uvv uvvv dvb fvt mxu m4u pyv uvu uvvu viv webm f4v fli flv m4v mkv mk3d mks mng asf asx avi vob wmv wm wmx wvx movie smv
 AddIconByType (video,{FOLDERNAME}/theme/icons/video.png) video/*
 
 

apaxy/theme/style.css

@@ -19,14 +19,18 @@ button,hr,input{overflow:visible}audio,canvas,progress,video{display:inline-bloc
 
 html {
   min-height: 100%;
-  border-top: 10px solid #ECEEF1;
-  border-bottom: 10px solid #ECEEF1;
   color: #61666c;
+  background-color: #fff;
   font-weight: 400;
   font-size: 1em;
-  font-family: sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   line-height: 2em;
 }
+@media (prefers-color-scheme: dark) {
+  html {
+    background-color: #232323;
+  }
+}
 
 body {
   padding: 20px;
@@ -38,17 +42,31 @@ code {
 }
 
 a {
-  color: #61666c;
+  color: #000;
   text-decoration: none;
 }
+@media (prefers-color-scheme: dark) {
+  a {
+    color: #e9e9e9;
+  }
+}
 
 a, img {
   border: none;
   outline: none;
 }
 
+a > img:hover {
+  opacity: 0.4;
+}
+
 a:hover {
-  color: #2a2a2a;
+  color: #bababa;
+}
+@media (prefers-color-scheme: dark) {
+  a:hover {
+    color: #696969;
+  }
 }
 
 /*------------------------------------*\
@@ -65,18 +83,27 @@ a:hover {
     Filter (search box)
 \*------------------------------------*/
 #filter {
-        float: right;
-        font-size:.75em;
-        padding: .5em;
-        margin-bottom: .5em;
-        border: 1px solid #aaa;
-        border-radius: .25em;
-        width: 10em;
-        transition: width 0.25s ease;
+  background-color: rgba(0, 0, 0, 0.04);
+  float: right;
+  font-size:.75em;
+  padding: .5em;
+  margin-bottom: .5em;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: .25em;
+  width: 10em;
+  transition: width 0.25s ease;
+}
+@media (prefers-color-scheme: dark) {
+  #filter {
+    background-color: rgba(255, 255, 255, 0.07);
+    border-color: rgba(255, 255, 255, 0.15);
+    color: white;
+  }
 }
 #filter:focus {
-        width: 14em;
+  width: 14em;
 }
+
 /*------------------------------------*\
     Demo block
 \*------------------------------------*/
@@ -96,6 +123,21 @@ table {
   width: 100%;
   border-collapse: collapse;
   font-size: .875em;
+  color: rgb(143, 143, 143);
+}
+@media (prefers-color-scheme: dark) {
+  table {
+    color: rgb(111, 111, 111);
+  }
+}
+
+.odd {
+  background-color: rgb(244, 244, 244);
+}
+@media (prefers-color-scheme: dark) {
+  .odd {
+    background-color: rgb(50, 50, 50);
+  }
 }
 
 tr {
@@ -103,10 +145,6 @@ tr {
   border: 0;
 }
 
-tr:hover td {
-  background: #f6f6f6;
-}
-
 th {
   text-align: left;
   font-size: .75em;
@@ -137,7 +175,6 @@ td {
   padding: 5px 0;
   outline: 0;
   border: 0;
-  border-bottom: 1px solid #edf1f5;
   vertical-align: middle;
   text-align: left;
   transition: background 300ms ease;
@@ -146,6 +183,11 @@ td {
   -moz-transition: background 300ms ease;
   -webkit-transition: background 300ms ease;
 }
+@media (prefers-color-scheme: dark) {
+  td {
+    border-color: #424242;
+  }
+}
 
 td a {
   display: block;
@@ -172,83 +214,83 @@ tr.parent a[href^="/"] {
     Media query for small screens
 \*------------------------------------*/
 @media (max-width: 768px) {
-    body {
-        padding: 10px;
-    }
-    .indexcollastmod { display: none; }
-    .wrapper { max-width: 100%; }
+  body {
+    padding: 10px;
+  }
+  .indexcollastmod { display: none; }
+  .wrapper { max-width: 100%; }
 }
 
 /*------------------------------------*\
-	Error pages
+    Error pages
 /*------------------------------------*/
 /* Animation */
 @-webkit-keyframes fadeDown {
-	0% {
-		opacity: 0;
-		-webkit-transform: translateY(-20px);
-	}
-	100% {
-		opacity: 1;
-		-webkit-transform: translateY(0);
-	}
+  0% {
+    opacity: 0;
+    -webkit-transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: translateY(0);
+  }
 }
 
 @-moz-keyframes fadeDown {
-	0% {
-		opacity: 0;
-		-moz-transform: translateY(-20px);
-	}
-	100% {
-		opacity: 1;
-		-moz-transform: translateY(0);
-	}
+  0% {
+    opacity: 0;
+    -moz-transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    -moz-transform: translateY(0);
+  }
 }
 
 @-ms-keyframes fadeDown {
-	0% {
-		opacity: 0;
-		-ms-transform: translateY(-20px);
-	}
-	100% {
-		opacity: 1;
-		-ms-transform: translateY(0);
-	}
+  0% {
+    opacity: 0;
+    -ms-transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    -ms-transform: translateY(0);
+  }
 }
 
 @-o-keyframes fadeDown {
-	0% {
-		opacity: 0;
-		-o-transform: translateY(-20px);
-	}
-	100% {
-		opacity: 1;
-		-o-transform: translateY(0);
-	}
+  0% {
+    opacity: 0;
+    -o-transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    -o-transform: translateY(0);
+  }
 }
 
 @keyframes fadeDown {
-	0% {
-		opacity: 0;
-		transform: translateY(-20px);
-	}
-	100% {
-		opacity: 1;
-		transform: translateY(0);
-	}
+  0% {
+    opacity: 0;
+    transform: translateY(-20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 
 .fadeDown {
-	-webkit-animation:fadeDown 1s ease;
-	   -moz-animation:fadeDown 1s ease;
-	    -ms-animation:fadeDown 1s ease;
-	     -o-animation:fadeDown 1s ease;
-	        animation:fadeDown 1s ease;
+  -webkit-animation:fadeDown 1s ease;
+     -moz-animation:fadeDown 1s ease;
+      -ms-animation:fadeDown 1s ease;
+       -o-animation:fadeDown 1s ease;
+          animation:fadeDown 1s ease;
 }
 
 /* Error code display */
 .errorCode {
-	font-size: 80px;
+  font-size: 80px;
 }
 
 /*------------------------------------*\
@@ -256,47 +298,57 @@ tr.parent a[href^="/"] {
 \*------------------------------------*/
 
 .breadcrumb {
-    white-space: nowrap;
-    padding: 0;
-    margin: 0;
+  white-space: nowrap;
+  padding: 0;
+  margin: 0;
 }
+
 .breadcrumb li {
-    display: inline-block;
-    line-height: 26px;
-    margin: 0 9px 0 -10px;
-    padding: 0 15px;
-    position: relative;
+  color: rgb(154, 154, 154);
+  display: inline-block;
+  line-height: 10px;
+  margin: 0 9px 20px -10px;
+  padding: 0 15px;
+  position: relative;
 }
+@media (prefers-color-scheme: dark) {
+  .breadcrumb li {
+    color: rgb(100, 100, 100);
+  }
+}
+
 .breadcrumb li::before,
 .breadcrumb li::after {
-    border-right: 1px solid #666666;
-    content: '';
-    display: block;
-    height: 50%;
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    z-index: -1;
-    transform: skewX(45deg);
+  border-right: 1.5px solid #000;
+  content: '';
+  display: block;
+  height: 50%;
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 0;
+  z-index: -1;
+  transform: skewX(45deg);
 }
+@media (prefers-color-scheme: dark) {
+  .breadcrumb li::before,
+  .breadcrumb li::after {
+    border-color: #fff;
+  }
+}
+
 .breadcrumb li::after {
-    bottom: 0;
-    top: auto;
-    transform: skewX(-45deg);
+  bottom: 0;
+  top: auto;
+  transform: skewX(-45deg);
 }
 
 .breadcrumb li:last-of-type::before,
 .breadcrumb li:last-of-type::after {
-    display: none;
+  display: none;
 }
 
 .breadcrumb li a {
-   letter-spacing: -1px;
-   text-decoration: none;
+  letter-spacing: -1px;
+  text-decoration: none;
 }
-
-.breadcrumb li:nth-of-type(1) a { color: hsl(0, 0%, 70%); }
-.breadcrumb li:nth-of-type(2) a { color: hsl(0, 0%, 65%); }
-.breadcrumb li:nth-of-type(3) a { color: hsl(0, 0%, 50%); }
-.breadcrumb li:nth-of-type(4) a { color: hsl(0, 0%, 45%); }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "apaxy",
-  "version": "2.1.3",
+  "version": "2.2.0",
   "description": "A simple, customisable theme for your Apache directory listing.",
   "main": "index.js",
   "scripts": {