From 828582351780582558cb0f4a475ef9eeb4dc1299 Mon Sep 17 00:00:00 2001 From: Evan Steinkerchner Date: Tue, 22 Mar 2022 18:22:16 -0400 Subject: [PATCH] Created new custom home page, moved Getting started to its own page, fixed requirements.txt, added docs/README.md --- docs/README.md | 25 +++++ docs/getting_started.md | 70 ++++++++++++ docs/index.md | 125 +-------------------- docs/overrides/assets/stylesheets/home.css | 81 +++++++++++++ docs/overrides/home.html | 49 ++++++++ docs/stylesheets/styles.css | 7 -- mkdocs.yml | 13 ++- requirements.txt | 99 ++++------------ 8 files changed, 259 insertions(+), 210 deletions(-) create mode 100644 docs/README.md create mode 100644 docs/getting_started.md create mode 100644 docs/overrides/assets/stylesheets/home.css create mode 100644 docs/overrides/home.html delete mode 100644 docs/stylesheets/styles.css diff --git a/docs/README.md b/docs/README.md new file mode 100644 index 0000000..5fca6ed --- /dev/null +++ b/docs/README.md @@ -0,0 +1,25 @@ +# Homer docs + +Live on github pages: [https://bastienwirtz.github.io/homer/](https://bastienwirtz.github.io/homer/) + +## Local development + +### Install Python dependencies + +Homer's documentation is built using [Material for MkDocs](https://squidfunk.github.io/mkdocs-material/). To get started, you'll need Python 3 installed on your machine and set up your local environment. + +```sh +python -m venv venv +source venv/bin/activate +pip install -r requirements.txt +``` + +### Preview local copy + +MkDocs comes with a command-line utility for building and serving the static documentation site every time you save a file. To launch it, run the `serve` command. + +```sh +mkdocs serve +``` + +Your local version of the docs site will now be available at http://localhost:8000/. diff --git a/docs/getting_started.md b/docs/getting_started.md new file mode 100644 index 0000000..2a123e2 --- /dev/null +++ b/docs/getting_started.md @@ -0,0 +1,70 @@ +Homer is a full static html/js dashboard, generated from the source in `/src` using webpack. It's meant to be served by an HTTP server, **it will not work if you open dist/index.html directly over file:// protocol**. + +See [documentation](docs/configuration.md) for information about the configuration (`assets/config.yml`) options. + +## Using docker + +To launch container: + +```sh +docker run -d \ + -p 8080:8080 \ + -v :/www/assets \ + --restart=always \ + b4bz/homer:latest +``` + +Default assets will be automatically installed in the `/www/assets` directory. Use `UID` and/or `GID` env var to change the assets owner (`docker run -e "UID=1000" -e "GID=1000" [...]`). + +## Using docker-compose + +The `docker-compose.yml` file must be edited to match your needs. +Set the port and volume (equivalent to `-p` and `-v` arguments): + +```yaml +volumes: + - /your/local/assets/:/www/assets +ports: + - 8080:8080 +``` + +To launch container: + +```sh +cd /path/to/docker-compose.yml +docker-compose up -d +``` + +Default assets will be automatically installed in the `/www/assets` directory. Use `UID` and/or `GID` env var to change the assets owner, also in `docker-compose.yml`: + +```yaml +environment: + - UID=1000 + - GID=1000 +``` + +## Using the release tarball (prebuilt, ready to use) + +Download and extract the latest release (`homer.zip`) from the [release page](https://github.com/bastienwirtz/homer/releases), rename the `assets/config.yml.dist` file to `assets/config.yml`, and put it behind a web server. + +```sh +wget https://github.com/bastienwirtz/homer/releases/latest/download/homer.zip +unzip homer.zip +cd homer +cp assets/config.yml.dist assets/config.yml +npx serve # or python -m http.server 8010 or apache, nginx ... +``` + +## Build manually + +```sh +# Using yarn (recommended) +yarn install +yarn build + +# **OR** Using npm +npm install +npm run build +``` + +Then your dashboard is ready to use in the `/dist` directory. diff --git a/docs/index.md b/docs/index.md index b7ac66c..a572d90 100644 --- a/docs/index.md +++ b/docs/index.md @@ -1,122 +1,3 @@ -
- Homer's donut -

Homer

-
- -

- A dead simple static HOMepage for your servER to keep - your services on hand, from a simple yaml configuration file. -

- -
- - License: Apache 2 - - - Gitter chat - - - Download homer static build - - - Awesome - -
- -## Demo - -[![Demo](images/screenshot.png)](https://homer-demo.netlify.app) -[Check out the demo!](https://homer-demo.netlify.app) - -## Features - -- [yaml](http://yaml.org/) file configuration -- Installable (pwa) -- Search -- Grouping -- Theme customization -- Offline health check -- keyboard shortcuts: - - `/` Start searching. - - `Escape` Stop searching. - - `Enter` Open the first matching result (respects the bookmark's `_target` property). - - `Alt`/`Option` + `Enter` Open the first matching result in a new tab. - -## Getting started - -Homer is a full static html/js dashboard, generated from the source in `/src` using webpack. It's meant to be served by an HTTP server, **it will not work if you open dist/index.html directly over file:// protocol**. - -See [documentation](docs/configuration.md) for information about the configuration (`assets/config.yml`) options. - -### Using docker - -To launch container: - -```sh -docker run -d \ - -p 8080:8080 \ - -v :/www/assets \ - --restart=always \ - b4bz/homer:latest -``` - -Default assets will be automatically installed in the `/www/assets` directory. Use `UID` and/or `GID` env var to change the assets owner (`docker run -e "UID=1000" -e "GID=1000" [...]`). - -### Using docker-compose - -The `docker-compose.yml` file must be edited to match your needs. -Set the port and volume (equivalent to `-p` and `-v` arguments): - -```yaml -volumes: - - /your/local/assets/:/www/assets -ports: - - 8080:8080 -``` - -To launch container: - -```sh -cd /path/to/docker-compose.yml -docker-compose up -d -``` - -Default assets will be automatically installed in the `/www/assets` directory. Use `UID` and/or `GID` env var to change the assets owner, also in `docker-compose.yml`: - -```yaml -environment: - - UID=1000 - - GID=1000 -``` - -### Using the release tarball (prebuilt, ready to use) - -Download and extract the latest release (`homer.zip`) from the [release page](https://github.com/bastienwirtz/homer/releases), rename the `assets/config.yml.dist` file to `assets/config.yml`, and put it behind a web server. - -```sh -wget https://github.com/bastienwirtz/homer/releases/latest/download/homer.zip -unzip homer.zip -cd homer -cp assets/config.yml.dist assets/config.yml -npx serve # or python -m http.server 8010 or apache, nginx ... -``` - -### Build manually - -```sh -# Using yarn (recommended) -yarn install -yarn build - -# **OR** Using npm -npm install -npm run build -``` - -Then your dashboard is ready to use in the `/dist` directory. +--- +template: home.html +--- diff --git a/docs/overrides/assets/stylesheets/home.css b/docs/overrides/assets/stylesheets/home.css new file mode 100644 index 0000000..76f585b --- /dev/null +++ b/docs/overrides/assets/stylesheets/home.css @@ -0,0 +1,81 @@ +.hero { + padding: 32px 2.8rem; + color: var(--md-primary-bg-color); + background: linear-gradient( + to bottom, + var(--md-primary-fg-color), + hsla(160deg, 47%, 55%, 1) 99%, + #fff 99% + ); +} + +.hero-container { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + padding: 1rem 0; +} + +.hero-content { + flex: 0 0 40%; +} + +.hero-title { + height: 4rem; + display: flex; + flex-direction: row; + align-items: center; +} + +.hero-title > img { + max-height: 100%; + width: auto; +} + +.hero-title > h1 { + margin: 0 0 0 0.5rem; + font-size: 4rem; + line-height: 1; + color: currentColor; + font-weight: 700; +} + +.hero-image { + width: 17rem; + height: auto; + flex: 0 0 50%; + transform: perspective(300px) rotate3D(0, 1, 0, -5deg); + box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2); +} + +.hero .md-button { + margin-top: 0.5rem; + margin-right: 0.5rem; + color: var(--md-primary-bg-color); +} + +.hero .md-button-primary { + background-color: var(--md-primary-bg-color); + color: hsla(280deg, 37%, 48%, 1); + border-color: var(--md-primary-bg-color); +} + +.hero .md-button:focus, +.hero .md-button:hover { + background-color: var(--md-accent-fg-color); + color: var(--md-default-bg-color); + border-color: var(--md-accent-fg-color); +} + +.md-header { + position: initial; +} + +.md-main__inner { + margin: 0; +} + +.md-content { + display: none; +} diff --git a/docs/overrides/home.html b/docs/overrides/home.html new file mode 100644 index 0000000..81ef4aa --- /dev/null +++ b/docs/overrides/home.html @@ -0,0 +1,49 @@ +{% extends "base.html" %} + +{% block extrahead %} + +{% endblock %} + +{% block tabs %} +{{ super() }} + +
+
+
+
+ +

Homer

+
+

+ A dead simple static HOMepage for your servER + to keep your services on hand, from a simple yaml configuration file. +

+ + Get started + + + Go to GitHub + +
+ +
+
+ +
+ TODO! +
+{% endblock %} + +{% block site_nav %}{% endblock %} +{% block content %}{% endblock %} +{% block footer %}{% endblock %} diff --git a/docs/stylesheets/styles.css b/docs/stylesheets/styles.css deleted file mode 100644 index e1e1a3e..0000000 --- a/docs/stylesheets/styles.css +++ /dev/null @@ -1,7 +0,0 @@ -.centered { - text-align: center; -} - -.bold { - font-weight: bold; -} \ No newline at end of file diff --git a/mkdocs.yml b/mkdocs.yml index 2d4704c..9af5b79 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -1,22 +1,21 @@ # Project information site_name: Homer -site_url: https://bastienwirtz.github.io/homer/ +site_url: https://bastienwirtz.github.io/ # Repository repo_name: bastienwirtz/homer repo_url: https://github.com/bastienwirtz/homer edit_uri: "" -# Stylesheet -extra_css: - - stylesheets/styles.css - # Theme theme: + favicon: images/logo.png logo: images/logo.png name: material + custom_dir: docs/overrides/ icon: repo: fontawesome/brands/github + language: en palette: - media: "(prefers-color-scheme: light)" scheme: default @@ -42,6 +41,9 @@ theme: - search.share - search.suggest - toc.follow + # Don't include MkDocs' JavaScript + include_search_page: false + search_index_only: true # Copyright - name for footer text copyright: Homer dashboard @@ -76,6 +78,7 @@ markdown_extensions: # Page tree nav: - Home: index.md + - Getting started: getting_started.md - Configuration: configuration.md - Custom services: customservices.md - Tips & tricks: tips-and-tricks.md diff --git a/requirements.txt b/requirements.txt index 568942b..078b3dc 100644 --- a/requirements.txt +++ b/requirements.txt @@ -1,76 +1,23 @@ -attrs==19.3.0 -Automat==0.8.0 -blinker==1.4 -certifi==2019.11.28 -chardet==3.0.4 -Click==7.0 -cloud-init==21.4 -colorama==0.4.3 -command-not-found==0.3 -configobj==5.0.6 -constantly==15.1.0 -cryptography==2.8 -cupshelpers==1.0 -dbus-python==1.2.16 -defer==1.0.6 -distro==1.4.0 -distro-info===0.23ubuntu1 -entrypoints==0.3 -httplib2==0.14.0 -hyperlink==19.0.0 -idna==2.8 -importlib-metadata==1.5.0 -incremental==16.10.1 -Jinja2==2.10.1 -jsonpatch==1.22 -jsonpointer==2.0 -jsonschema==3.2.0 -keyring==18.0.1 -language-selector==0.1 -launchpadlib==1.10.13 -lazr.restfulclient==0.14.2 -lazr.uri==1.0.3 -macaroonbakery==1.3.1 -MarkupSafe==1.1.0 -more-itertools==4.2.0 -netifaces==0.10.4 -oauthlib==3.1.0 -pexpect==4.6.0 -powerline-shell==0.7.0 -protobuf==3.6.1 -psutil==5.5.1 -pyasn1==0.4.2 -pyasn1-modules==0.2.1 -pycairo==1.16.2 -pycups==1.9.73 -PyGObject==3.36.0 -PyHamcrest==1.9.0 -PyJWT==1.7.1 -pymacaroons==0.13.0 -PyNaCl==1.3.0 -pyOpenSSL==19.0.0 -pyRFC3339==1.1 -pyrsistent==0.15.5 -pyserial==3.4 -python-apt==2.0.0+ubuntu0.20.4.6 -python-debian===0.1.36ubuntu1 -pytz==2019.3 -pyxdg==0.26 -PyYAML==5.3.1 -requests==2.22.0 -requests-unixsocket==0.2.0 -SecretStorage==2.3.1 -service-identity==18.1.0 -simplejson==3.16.0 -six==1.14.0 -sos==4.2 -ssh-import-id==5.10 -systemd-python==234 -Twisted==18.9.0 -ubuntu-advantage-tools==27.5 -ufw==0.36 -unattended-upgrades==0.1 -urllib3==1.25.8 -wadllib==1.3.3 -zipp==1.0.0 -zope.interface==4.7.1 +bracex==2.2.1 +click==8.0.4 +ghp-import==2.0.2 +importlib-metadata==4.11.3 +Jinja2==3.0.3 +Markdown==3.3.6 +MarkupSafe==2.1.1 +mergedeep==1.3.4 +mkdocs==1.2.3 +mkdocs-awesome-pages-plugin==2.7.0 +mkdocs-material==8.2.5 +mkdocs-material-extensions==1.0.3 +packaging==21.3 +Pygments==2.11.2 +pymdown-extensions==9.3 +pyparsing==3.0.7 +python-dateutil==2.8.2 +PyYAML==6.0 +pyyaml-env-tag==0.1 +six==1.16.0 +watchdog==2.1.6 +wcmatch==8.3 +zipp==3.7.0 -- 2.41.0