Skip to content

Commit

Permalink
v0.1.6
Browse files Browse the repository at this point in the history
  • Loading branch information
kristuff authored Aug 25, 2021
2 parents f2733aa + b5b3deb commit b460dcf
Show file tree
Hide file tree
Showing 16 changed files with 631 additions and 128 deletions.
59 changes: 37 additions & 22 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,24 +1,26 @@
# apache-fancy-index
# apache-fancy-pages

> Modern drop in replacement for default Apache index page.
> Modern drop in replacement for default Apache index/error pages.
```
___ ___ _
| __|_ _ _ _ __ _ _|_ _|_ _ __| |_____ __
| _/ _` | ' \/ _| || || || ' \/ _` / -_) \ /
|_|\__,_|_||_\__|\_, |___|_||_\__,_\___/_\_\
|__/
___ ___
| __|_ _ _ _ __ _ _| _ \__ _ __ _ ___ ___
| _/ _` | ' \/ _| || | _/ _` / _` / -_|_-<
|_|\__,_|_||_\__|\_, |_| \__,_\__, \___/__/
|__/ |___/
```

![preview_dark](/screenshots/after_dark.png)
![preview_401](/screenshots/401_dark.png)


## Features
- Responsive design
- Breadcrumb navigation
- Search/Filter results
- Light/Dark theme based on user prefered color scheme
- Light/Dark theme based on user prefered color scheme
- Replacement for default error pages: 401, 403, 404, 500

## Requirements
- Apache >= 2.4
Expand All @@ -34,14 +36,14 @@

```.language-bash
apt-get update
apt-get install apache-fancy-index
apt-get install apache-fancy-pages
```
Alternatively, you can download the latest `.deb` package from release tags and install it using `dpkg -i`:
- Enable fancy-index conf:
The `fancy-index.conf` contains an alias for url `/fancy-index` to serve template, style, script and icons files. Enable this conf to set *apache-fancy-index* enabled everywhere `Options Indexes` is enabled.
The `fancy-index.conf` contains an alias for url `/fancy-pages` to serve template, style, script and icons files. Enable this conf to set *fancy-index* enabled everywhere `Options Indexes` is enabled.
```
a2enconf fancy-index
Expand All @@ -51,25 +53,38 @@
Voila!
### Other distros/manual install
- Setup fancy-index tests:
You can enable the `fancy-index-tests` conf to test index with fake content. The `tests` directory contain empty files with various extensions.
1. Clone this repo on github (could be ***not*** up to date with the latest build).
```
a2enconf fancy-index-tests
systemctl reload apache2
```
2. Copy content of the folder `/assets/` to `/usr/share/apache-fancy-index`. Adjust permissions to be readable by web server.
`Tests` directory is then available to the following url: `EXAMPLE.COM/fancy-index-tests/`.
3. Copy the files in `/conf/` to apache conf available directory (debian `/etc/apache2/conf-available`)
4. Enable conf and restart Apache.
- Enable fancy-error conf:
The `fancy-error.conf` contains an alias for url `/fancy-error` to serve templates on error and prevent them to be directly requested.
```
a2enconf fancy-error
systemctl reload apache2
```
Voila!
## Setup tests directory
You can enable the `fancy-index-tests` conf to test index with fake content. The `tests` directory contain empty files with various extensions.
### Other distros/manual install
1. Clone this repo on github (could be ***not*** up to date with the latest build).
2. Copy content of the folder `/assets/` to `/usr/share/apache-fancy-pages`. Adjust permissions to be readable by web server.
3. Copy the files in `/conf/` to apache conf available directory (in debian `/etc/apache2/conf-available`)
4. Enable conf and restart Apache.
```
a2enconf fancy-index-tests
systemctl reload apache2
```
`Tests` directory is then available to the following url: `EXAMPLE.COM/fancy-index-tests/`.
4 changes: 2 additions & 2 deletions assets/FOOTER.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,9 @@
</section>
<footer id="section-footer">
<div class="row">
<p>Apache Fancy Index v0.1.5 | © 2021 Christophe Buliard | <a target="_blank" href="https://github.com/kristuff/apache-fancy-index" rel="no-referer">Source code</a> </p>
<p>Apache Fancy Pages v0.1.6 | © 2021 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-index/js/script.js"></script>
<script src="/fancy-pages/js/script.js"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion assets/HEADER.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
<link rel="stylesheet" type="text/css" href="/fancy-index/css/style.css">
<link rel="stylesheet" type="text/css" href="/fancy-pages/css/style.css">
</head>
<body>
<header id="section-header">
Expand Down
14 changes: 7 additions & 7 deletions assets/css/style.css
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
/**
* ___ ___ _
* | __|_ _ _ _ __ _ _|_ _|_ _ __| |_____ __
* | _/ _` | ' \/ _| || || || ' \/ _` / -_) \ /
* |_|\__,_|_||_\__|\_, |___|_||_\__,_\___/_\_\
* |__/
* ___ ___
* | __|_ _ _ _ __ _ _| _ \__ _ __ _ ___ ___
* | _/ _` | ' \/ _| || | _/ _` / _` / -_|_-<
* |_|\__,_|_||_\__|\_, |_| \__,_\__, \___/__/
* |__/ |___/
*
* This file is part of kristuff/apache-fancy-index.
* Version 0.1.5 - Copyright (c) 2021 Kristuff <kristuff@kristuff.fr>
* This file is part of kristuff/apache-fancy-pages.
* Version 0.1.6 - Copyright (c) 2021 Kristuff <kristuff@kristuff.fr>
*
* For the full copyright and license information, please view the LICENSE
* file that was distributed with this source code.
Expand Down
115 changes: 115 additions & 0 deletions assets/error/401.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
<title>Unauthorized (401)</title>
<link rel="stylesheet" type="text/css" href="/fancy-pages/css/style.css">
<style>

:root {
--color-bg: #eee;
--color-highlight: #000000;
--color-text: #404040;
--color-border:#bbbbbb;
}
@media (prefers-color-scheme: dark) {
:root {
--color-bg:#1f242b;
--color-highlight: #ffffff;
--color-text: #bbb;
--color-border:#2b323b;
}
* {
scrollbar-color:#313137 #171b20;
}
}

*,
*::after,
*::before {
box-sizing: border-box;
}

html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}

body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-weight: 400;
color: #666;
color: var(--color-text);
background-color:#fff;
background-color: var(--color-bg);
font-size: 15px;
}

h1 {
margin-top: 0;
font-size: 36px;
font-weight: normal;
color: var(--color-highlight);
font-weight:300;
}

.emoj {
font-size: 70px;
margin-right: 25px;
}

p {
font-size: 18px;
color: var(--color-text);
line-height: 1.2em;
font-weight:300;
}

h3 {
color: var(--color-text);
font-size: 22px;
font-weight: normal;
line-height: 28px;
font-weight:300;
}

hr {
max-width: 800px;
margin: 18px auto;
border: 0;
border-bottom: 1px solid var(--color-border);
}

.container {
margin: auto;
text-align: center;
display: flex;
flex-wrap: wrap;
height: 100vh;
width: 100%;
align-items: center;
}
.content {
margin: auto;
width: 100%;
padding: 10px;
max-width: 560px;
text-align: left;
}

</style>
</head>

<body>
<div class="container">
<div class="content">
<h1><span class="emoj">:(</span>401 Unauthorized</h3>
<hr/>
<h3>This server could not verify that you are authorized to access the document requested. Either you supplied the wrong credentials (e.g., bad password), or your browser doesn't understand how to supply the credentials required.</h3>
</div>
</div>
</body>
</html>
114 changes: 114 additions & 0 deletions assets/error/403.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,114 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1" name="viewport">
<title>Forbidden (403)</title>
<style>

:root {
--color-bg: #eee;
--color-highlight: #000000;
--color-text: #404040;
--color-border:#bbbbbb;
}
@media (prefers-color-scheme: dark) {
:root {
--color-bg:#1f242b;
--color-highlight: #ffffff;
--color-text: #bbb;
--color-border:#2b323b;
}
* {
scrollbar-color:#313137 #171b20;
}
}

*,
*::after,
*::before {
box-sizing: border-box;
}

html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
}

body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-weight: 400;
color: #666;
color: var(--color-text);
background-color:#fff;
background-color: var(--color-bg);
font-size: 15px;
}

h1 {
margin-top: 0;
font-size: 36px;
font-weight: normal;
color: var(--color-highlight);
font-weight:300;
}

.emoj {
font-size: 70px;
margin-right: 25px;
}

p {
font-size: 18px;
color: var(--color-text);
line-height: 1.2em;
font-weight:300;
}

h3 {
color: var(--color-text);
font-size: 22px;
font-weight: normal;
line-height: 28px;
font-weight:300;
}

hr {
max-width: 800px;
margin: 18px auto;
border: 0;
border-bottom: 1px solid var(--color-border);
}

.container {
margin: auto;
text-align: center;
display: flex;
flex-wrap: wrap;
height: 100vh;
width: 100%;
align-items: center;
}
.content {
margin: auto;
width: 100%;
padding: 10px;
max-width: 400px;
text-align: left;
}

</style>
</head>

<body>
<div class="container">
<div class="content">
<h1><span class="emoj">:(</span>403 Forbidden</h3>
<hr/>
<h3>You don't have permission to access this resource.</h3>
</div>
</div>
</body>
</html>
Loading

0 comments on commit b460dcf

Please sign in to comment.