commit f59fcabcd04f0855f4639b1c2d79b00ba324e72d Author: Admin User Date: Tue Nov 14 18:31:01 2023 +0100 initial diff --git a/additional-page.yml.dist b/additional-page.yml.dist new file mode 100644 index 0000000..5d377ee --- /dev/null +++ b/additional-page.yml.dist @@ -0,0 +1,35 @@ +--- +# Additional page configuration + +# Additional configurations are loaded using its file name, minus the extension, as an anchor (https://#). +# `config.yml` is still used as a base configuration, and all values here will overwrite it, so you don't have to re-defined everything + + +subtitle: "this is another dashboard page" + +# This overwrites message config. Setting it to empty to remove message from this page and keep it only in the main one: +message: ~ + +# as we want to include a differente link here (so we can get back to home page), we need to replicate all links or they will be revome when overwriting the links field: +links: + - name: "Home" + icon: "fas fa-home" + url: "#" + - name: "Contribute" + icon: "fab fa-github" + url: "https://github.com/bastienwirtz/homer" + target: "_blank" # optional html a tag target attribute + - name: "Wiki" + icon: "fas fa-book" + url: "https://www.wikipedia.org/" + +services: + - name: "More applications on another page!" + icon: "fas fa-cloud" + items: + - name: "Awesome app on a second page!" + logo: "assets/tools/sample.png" + subtitle: "Bookmark example" + tag: "app" + url: "https://www.reddit.com/r/selfhosted/" + target: "_blank" diff --git a/config-demo.yml.dist b/config-demo.yml.dist new file mode 100644 index 0000000..ac2b411 --- /dev/null +++ b/config-demo.yml.dist @@ -0,0 +1,131 @@ +--- +# Homepage configuration +# See https://fontawesome.com/v5/search for icons options + +title: "Demo dashboard" +subtitle: "Homer" +logo: "logo.png" +# icon: "fas fa-skull-crossbones" # Optional icon + +header: true +footer: '

Created with ❤️ with Bulma, Vue.js & font awesome // Fork me on

' # set false if you want to hide it. + +# Optional theme customization +theme: default +colors: + light: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#f5f5f5" + card-background: "#ffffff" + text: "#363636" + text-header: "#ffffff" + text-title: "#303030" + text-subtitle: "#424242" + card-shadow: rgba(0, 0, 0, 0.1) + link: "#3273dc" + link-hover: "#363636" + dark: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#131313" + card-background: "#2b2b2b" + text: "#eaeaea" + text-header: "#ffffff" + text-title: "#fafafa" + text-subtitle: "#f5f5f5" + card-shadow: rgba(0, 0, 0, 0.4) + link: "#3273dc" + link-hover: "#ffdd57" + +# Optional message +message: + style: "is-dark" # See https://bulma.io/documentation/components/message/#colors for styling options. + title: "👋 Welcome !" + content: "This demo page shows an overview of Homer possibilities. Feel free to click anywhere!
Find more information on github.com/bastienwirtz/homer" + +# Optional navbar +# links: [] # Allows for navbar (dark mode, layout, and search) without any links +links: + - name: "Contribute" + icon: "fab fa-github" + url: "https://github.com/bastienwirtz/homer" + target: "_blank" # optional html a tag target attribute + - name: "Documentation" + icon: "fas fa-book" + url: "https://github.com/bastienwirtz/homer/blob/main/README.md#table-of-contents" + # this will link to a second homer page that will load config from additional-page.yml and keep default config values as in config.yml file + # see url field and assets/additional-page.yml.dist used in this example: + - name: "another page!" + icon: "fas fa-file-alt" + url: "#additional-page" + +# Services +# First level array represent a group. +# Leave only a "items" key if not using group (group name, icon & tagstyle are optional, section separation will not be displayed). +services: + - name: "My apps" + icon: "fas fa-cloud" + items: + - name: "Pi-hole" + logo: "https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/pihole.png" + url: "https://pi-hole.net/" + endpoint: "https://homer-demo-content.netlify.app/pihole" + type: "PiHole" + - name: "Proxmox - Node1" + logo: "https://cdn.jsdelivr.net/gh/walkxcode/dashboard-icons/png/proxmox.png" + type: "Proxmox" + tag: "sys" + url: "https://www.proxmox.com/en/" + endpoint: "https://homer-demo-content.netlify.app/proxmox" + node: "node1" + warning_value: 50 + danger_value: 80 + api_token: "xxxxxxxxxxxx" + - name: "An awesome app" + logo: "assets/tools/sample.png" + subtitle: "Bookmark example" + tag: "app" + keywords: "self hosted reddit" + url: "https://www.reddit.com/r/selfhosted/" + - name: "Tools" + icon: "fa-solid fa-screwdriver-wrench" + items: + - name: "Octoprint" + logo: "https://cdn-icons-png.flaticon.com/512/3112/3112529.png" + apikey: "xxxxxxxxxxxx" + endpoint: "https://homer-demo-content.netlify.app/octoprint" + type: "OctoPrint" + - name: "Example item" + logo: "assets/tools/sample.png" + subtitle: "This another example" + tag: "app" + keywords: "demo" + url: "#" + target: "_blank" + - name: "Weather" + location: "Lyon" + apikey: "xxxxxxxxxxxx" # insert your own API key here. Request one from https://openweathermap.org/api. + units: "metric" + endpoint: "https://homer-demo-content.netlify.app/openweather/weather" + type: "OpenWeather" + - name: "interesting links" + icon: "fas fa-solid fa-arrow-up-right-from-square" + items: + - name: "Buy me a coffee !" + subtitle: "If you want to support me, buy me a coffee " + logo: "https://www.buymeacoffee.com/assets/img/guidelines/logo-mark-1.svg" + url: "https://www.buymeacoffee.com/bastien" + - name: "r/selfhosted" + icon: "fa-brands fa-reddit-alien" + subtitle: "Bookmark example" + tag: "reddit" + url: "https://www.reddit.com/r/selfhosted/" + target: "_blank" + - name: "Awesome selfhosted" + icon: "fa-brands fa-github-alt" + subtitle: "Another application" + tag: "awesome-list" + url: "https://github.com/awesome-selfhosted/awesome-selfhosted" diff --git a/config.yml b/config.yml new file mode 100644 index 0000000..2093756 --- /dev/null +++ b/config.yml @@ -0,0 +1,111 @@ +--- +# Homepage configuration +# See https://fontawesome.com/v5/search for icons options + +title: "Nummer5" +subtitle: "Homer" +logo: "logo.png" +# icon: "fas fa-skull-crossbones" # Optional icon + +header: true +footer: '

Created with ❤️ with bulma, vuejs & font awesome // Fork me on

' # set false if you want to hide it. + +# Optional theme customization +theme: default +colors: + light: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#f5f5f5" + card-background: "#ffffff" + text: "#363636" + text-header: "#ffffff" + text-title: "#303030" + text-subtitle: "#424242" + card-shadow: rgba(0, 0, 0, 0.1) + link: "#3273dc" + link-hover: "#363636" + dark: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#131313" + card-background: "#2b2b2b" + text: "#eaeaea" + text-header: "#ffffff" + text-title: "#fafafa" + text-subtitle: "#f5f5f5" + card-shadow: rgba(0, 0, 0, 0.4) + link: "#3273dc" + link-hover: "#ffdd57" + +# Optional message +#message: + #url: https://b4bz.io + # style: "is-dark" # See https://bulma.io/documentation/components/message/#colors for styling options. + # title: "Demo !" + # icon: "fa fa-grin" + # content: "This is a dummy homepage demo.
Find more information on github.com/bastienwirtz/homer" + +# Optional navbar +# links: [] # Allows for navbar (dark mode, layout, and search) without any links +links: + - name: "Contribute" + icon: "fab fa-github" + url: "https://github.com/bastienwirtz/homer" + target: "_blank" # optional html a tag target attribute + - name: "Wiki" + icon: "fas fa-book" + url: "https://www.wikipedia.org/" + # this will link to a second homer page that will load config from additional-page.yml and keep default config values as in config.yml file + # see url field and assets/additional-page.yml.dist used in this example: + #- name: "another page!" + # icon: "fas fa-file-alt" + # url: "#additional-page" + +# Services +# First level array represent a group. +# Leave only a "items" key if not using group (group name, icon & tagstyle are optional, section separation will not be displayed). +services: + - name: "Cluster" + icon: "fas fa-cloud" + items: + - name: "Nomad" + logo: "https://training.play-with-nomad.com/images/nomad-logo.png" + #subtitle: "Bookmark example" + tag: "app" + keywords: "self hosted nomad" + url: "http://nomad.service.nr5" + target: "_blank" # optional html a tag target attribute + - name: "Consul" + logo: "https://listimg.pinclipart.com/picdir/s/331-3314000_consul-picture-hashicorp-consul-icon-clipart.png" + #subtitle: "Another application" + tag: "app" + url: "http://consul.service.nr5" + - name: "Traefik" + #logo: "assets/tools/sample2.png" + logo: "https://d33wubrfki0l68.cloudfront.net/e29410f43273a18d40e1bd6e41641f5afdfc8057/eb7ca/traefik.logo.png" + #subtitle: "Another application" + tag: "app" + url: "http://traefik.service.nr5" + - name: "Apps" + icon: "fas fa-cloud" + items: + - name: "Gitea" + logo: "https://image.emojipng.com/827/13647827.jpg" + #subtitle: "Bookmark example" + tag: "app" + keywords: "self hosted nomad" + url: "http://gitea.service.nr5" + target: "_blank" # optional html a tag target attribute + - name: "Dmarc" + logo: "https://dmarc.globalcyberalliance.org/wp-content/uploads/dmarc-color-1.jpg" + #subtitle: "Another application" + tag: "app" + url: "http://dmarc.service.nr5" + - name: "Hassio" + logo: "https://w7.pngwing.com/pngs/792/422/png-transparent-home-assistant-home-automation-kits-amazon-alexa-raspberry-pi-installation-others-blue-installation-line.png" + #subtitle: "Another application" + tag: "app" + url: "http://hassio.service.nr5" diff --git a/config.yml.dist b/config.yml.dist new file mode 100644 index 0000000..cb84ccf --- /dev/null +++ b/config.yml.dist @@ -0,0 +1,85 @@ +--- +# Homepage configuration +# See https://fontawesome.com/v5/search for icons options + +title: "Demo dashboard" +subtitle: "Homer" +logo: "logo.png" +# icon: "fas fa-skull-crossbones" # Optional icon + +header: true +footer: '

Created with ❤️ with bulma, vuejs & font awesome // Fork me on

' # set false if you want to hide it. + +# Optional theme customization +theme: default +colors: + light: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#f5f5f5" + card-background: "#ffffff" + text: "#363636" + text-header: "#ffffff" + text-title: "#303030" + text-subtitle: "#424242" + card-shadow: rgba(0, 0, 0, 0.1) + link: "#3273dc" + link-hover: "#363636" + dark: + highlight-primary: "#3367d6" + highlight-secondary: "#4285f4" + highlight-hover: "#5a95f5" + background: "#131313" + card-background: "#2b2b2b" + text: "#eaeaea" + text-header: "#ffffff" + text-title: "#fafafa" + text-subtitle: "#f5f5f5" + card-shadow: rgba(0, 0, 0, 0.4) + link: "#3273dc" + link-hover: "#ffdd57" + +# Optional message +message: + #url: https://b4bz.io + style: "is-dark" # See https://bulma.io/documentation/components/message/#colors for styling options. + title: "Demo !" + icon: "fa fa-grin" + content: "This is a dummy homepage demo.
Find more information on github.com/bastienwirtz/homer" + +# Optional navbar +# links: [] # Allows for navbar (dark mode, layout, and search) without any links +links: + - name: "Contribute" + icon: "fab fa-github" + url: "https://github.com/bastienwirtz/homer" + target: "_blank" # optional html a tag target attribute + - name: "Wiki" + icon: "fas fa-book" + url: "https://www.wikipedia.org/" + # this will link to a second homer page that will load config from additional-page.yml and keep default config values as in config.yml file + # see url field and assets/additional-page.yml.dist used in this example: + #- name: "another page!" + # icon: "fas fa-file-alt" + # url: "#additional-page" + +# Services +# First level array represent a group. +# Leave only a "items" key if not using group (group name, icon & tagstyle are optional, section separation will not be displayed). +services: + - name: "Applications" + icon: "fas fa-cloud" + items: + - name: "Awesome app" + logo: "assets/tools/sample.png" + subtitle: "Bookmark example" + tag: "app" + keywords: "self hosted reddit" + url: "https://www.reddit.com/r/selfhosted/" + target: "_blank" # optional html a tag target attribute + - name: "Another one" + logo: "assets/tools/sample2.png" + subtitle: "Another application" + tag: "app" + url: "#" diff --git a/config.yml.dist.sample-sui b/config.yml.dist.sample-sui new file mode 100644 index 0000000..4ebf4a4 --- /dev/null +++ b/config.yml.dist.sample-sui @@ -0,0 +1,64 @@ +--- +# Homepage configuration +# See https://fontawesome.com/v5/search for icons options + +title: "Hello beautiful!" +subtitle: "App dashboard" +logo: false +# icon: "fas fa-skull-crossbones" Optional icon + +header: true + +# Optional theme customization +theme: sui +colors: + light: + highlight-primary: transparent + highlight-secondary: transparent + highlight-hover: "#4a4a4a" + text-subtitle: "#424242" + dark: + background: "#2B2C56" + highlight-primary: transparent + highlight-secondary: transparent + highlight-hover: "#200b35" + text-subtitle: "#6375e8" + +# Optional navbar +# links: [] # Allows for navbar (dark mode, layout, and search) without any links +links: [] + +# Services +# First level array represent a group. +# Leave only a "items" key if not using group (group name, icon & tagstyle are optional, section separation will not be displayed). +services: + - name: "APPLICATIONS" + items: + - name: "Jenkins" + logo: "assets/tools/jenkins.png" + subtitle: "Continuous integration server" + url: "https://jenkins.io/" + - name: "RabbitMQ Management" + logo: "assets/tools/rabbitmq.png" + subtitle: "Manage & monitor RabbitMQ server" + # Optional tagstyle + # Same styling options as the optional message. + tagstyle: "is-success" + url: "https://www.rabbitmq.com/" + - name: "M/Monit" + logo: "assets/tools/monit.png" + subtitle: "Monitor & manage all monit enabled hosts" + url: "https://mmonit.com/monit/" + - name: "Grafana" + logo: "assets/tools/grafana.png" + subtitle: "Metric analytics & dashboards" + url: "https://grafana.com/" + - name: "Kibana" + logo: "assets/tools/elastic.png" + subtitle: "Explore & visualize logs" + url: "https://www.elastic.co/products/kibana" + - name: "Website monitoring" + logo: "assets/tools/pingdom.png" + subtitle: "Pingdom public reports overview" + tag: "CI" + url: "https://www.pingdom.com/" diff --git a/custom.css.sample b/custom.css.sample new file mode 100644 index 0000000..00658d7 --- /dev/null +++ b/custom.css.sample @@ -0,0 +1,8 @@ +@charset "UTF-8"; + +/* Custom card colors */ +/* Use with `class:` property of services in config.yml */ +body #app .card.green { + background-color: #006600; + color: #00ff00; +} diff --git a/icons/README.md b/icons/README.md new file mode 100644 index 0000000..015169b --- /dev/null +++ b/icons/README.md @@ -0,0 +1,12 @@ +# PWA Icons / Images + +We suggest you to create a svg or png icon (if it is a png icon, with the maximum resolution possible) for your application and use it to generate a favicon package in [Favicon Generator](https://realfavicongenerator.net/). + +Once generated, download the ZIP and use android-* icons for pwa-*: + +- use `android-chrome-192x192.png` for `pwa-192x192.png` +- use `android-chrome-512x512.png` for `pwa-512x512.png` +- `apple-touch-icon.png` is `apple-touch-icon.png` +- `favicon.ico` is `favicon.ico` + +` diff --git a/icons/apple-touch-icon.png b/icons/apple-touch-icon.png new file mode 100644 index 0000000..32b68eb Binary files /dev/null and b/icons/apple-touch-icon.png differ diff --git a/icons/favicon.ico b/icons/favicon.ico new file mode 100644 index 0000000..c8d571f Binary files /dev/null and b/icons/favicon.ico differ diff --git a/icons/logo.svg b/icons/logo.svg new file mode 100644 index 0000000..89b99a1 --- /dev/null +++ b/icons/logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/icons/pwa-192x192.png b/icons/pwa-192x192.png new file mode 100644 index 0000000..36d8775 Binary files /dev/null and b/icons/pwa-192x192.png differ diff --git a/icons/pwa-512x512.png b/icons/pwa-512x512.png new file mode 100644 index 0000000..8f27647 Binary files /dev/null and b/icons/pwa-512x512.png differ diff --git a/manifest.json b/manifest.json new file mode 100644 index 0000000..dcd41bb --- /dev/null +++ b/manifest.json @@ -0,0 +1 @@ +{"name":"Homer dashboard","short_name":"Homer","start_url":"../","display":"standalone","background_color":"#ffffff","lang":"en","scope":"../","description":"Home Server Dashboard","theme_color":"#3367D6","icons":[{"src":"./icons/pwa-192x192.png","sizes":"192x192","type":"image/png"},{"src":"./icons/pwa-512x512.png","sizes":"512x512","type":"image/png"}]} diff --git a/tools/sample.png b/tools/sample.png new file mode 100644 index 0000000..6b4774b Binary files /dev/null and b/tools/sample.png differ diff --git a/tools/sample2.png b/tools/sample2.png new file mode 100644 index 0000000..f2327c0 Binary files /dev/null and b/tools/sample2.png differ