hywax / mafl

Minimalistic flexible homepage
https://mafl.hywax.space
MIT License
306 stars 22 forks source link

[QUESTION] <Why are icons and favicons not displaying correctly?> #108

Closed AemonCao closed 3 months ago

AemonCao commented 3 months ago

Question

I am using Docker.

/usr/local/emhttp/plugins/dynamix.docker.manager/scripts/docker run -d \
  --name='Mafl' \
  --net='bridge' \
  -e TZ="Asia/Shanghai" \ 
  -e HOST_OS="Unraid" \
  -e HOST_HOSTNAME="Home-NAS" \
  -e HOST_CONTAINERNAME="Mafl" \
  -l net.unraid.docker.managed=dockerman \
  -l net.unraid.docker.webui='http://[IP]:[PORT:30000]' \
  -l net.unraid.docker.icon='https://raw.githubusercontent.com/selfhosters/unRAID-CA-templates/master/templates/img/mafl.png' \
  -p '30000:3000/tcp' \
  -v '/mnt/user/appdata/mafl/data/config.yml':'/app/data/config.yml':'ro' \
  -v '/mnt/user/appdata/mafl/favicons':'/app/public/favicons':'rw' \
  -v '/mnt/user/appdata/mafl/icons':'/app/public/icons':'rw' \
  'ghcr.io/hywax/mafl'

Here is the directory structure of my host machine.

root@Home-NAS:/mnt/user/appdata/mafl# tree
.
├── data
│   └── config.yml
├── favicons
│   ├── apple-touch-icon.png
│   ├── favicon.ico
│   ├── pwa-192x192.png
│   └── pwa-512x512.png
└── icons
    ├── Unraid_A.png
    └── Unraid_logo.svg

Here is my configuration file.

title: My NAS
lang: zh
theme: system
checkUpdates: true
behaviour:
  target: _blank
tags:
  - name: Home
    color: green
  - name: Work
    color: blue
services:
  常用:
    - title: unRAID
      icon:
        url: icons/Unraid_logo.svg
      description: unRAID 控制台
      link: http://192.168.1.223/
      tags:
        - Home
  工具:
    - type: ip-api

But when I access the site, the icons and favicons do not display correctly.

image

Category

Using Icons

hywax-assistant commented 3 months ago

👋 @AemonCao Thanks for opening your first issue here! To help make it easier for us to investigate your issue, please follow the contributing guidelines.

If you like this project, please ⭐ star our repo.

AemonCao commented 3 months ago

As of now, this issue has not been resolved. I am currently using the image URLs to replace the original relative paths of the images, and it is working fine.

AemonCao commented 3 months ago

As of now, this issue has not been resolved. I am currently using the image URLs to replace the original relative paths of the images, and it is working fine.

I cloned the project and tried to run it locally. I created a data folder under the .output path and placed the config.yml file in it, but it still prompts that the configuration file cannot be retrieved. I haven't found a good solution yet. Could you please confirm if the path where I stored the configuration file is correct?

屏幕截图 2024-05-29 014401

hywax commented 3 months ago

Hi, sorry for the long reply.

Here are all the possible file paths:

  1. src/public/favicons - initially, everything is stored here
  2. .output/public/favicons - when build is copied to this folder
  3. /app/public/favicons - docker image

Example

tree app

.example
├── config.yml
├── docker-compose.yml
└── favicons
    ├── apple-touch-icon.png
    ├── favicon.ico
    ├── pwa-192x192.png
    └── pwa-512x512.png

docker-compose.yml

version: '3.8'

services:
  mafl:
    image: hywax/mafl
    restart: unless-stopped
    ports:
      - '3000:3000'
    volumes:
      - ./config.yml:/app/data/config.yml
      - ./favicons:/app/public/favicons

If you can't do it, reopen the issue. I'll try to help in any way I can!