[Enhancement]: Mobile responsive web client #51

New issue

Open

opened 2025-10-14 16:00:32 -06:00 by navan · 0 comments

navan commented

2025-10-14 16:00:32 -06:00

Owner

Originally created by @Geordon on 9/16/2025

Type of Enhancement

Web Interface/Frontend

Describe the Feature/Enhancement

I occasionally want to manage my library while not at my computer. When I have my iPhone and use either Brave or Safari browser, the web pages are a challenge to work with.
My guess is that this might be achieved with CSS that takes into account the differences between desktop and mobile browsers, but my skills at web design peaked in the late 90s and never grew to include Java/JavaScript, let alone the black magic that is CSS.

Why would this be helpful?

I occasionally want to manage my library while not at my computer. When I have my iPhone and use either Brave or Safari browser, the web pages are a challenge to work with.

Future Implementation (Screenshot)

Ideally, the web client components would fit into the horizontal space, even if it requires shifting components down.

Audiobookshelf Server Version

2.29.0

Current Implementation (Screenshot)

This is what it currently looks like on my iPhone. Notice how some of the web page components are off of the screen to either side of the visible area. The page can't be scrolled to either side to make use of the components of the web client.

Additionally, this is when trying to manage/edit library items on the default ABS web client. The web client player is satisfactory.

<edit: Removed incorrect screenshot>

*Originally created by @Geordon on 9/16/2025* ### Type of Enhancement Web Interface/Frontend ### Describe the Feature/Enhancement I occasionally want to manage my library while not at my computer. When I have my iPhone and use either Brave or Safari browser, the web pages are a challenge to work with. My guess is that this might be achieved with CSS that takes into account the differences between desktop and mobile browsers, but my skills at web design peaked in the late 90s and never grew to include Java/JavaScript, let alone the black magic that is CSS. ### Why would this be helpful? I occasionally want to manage my library while not at my computer. When I have my iPhone and use either Brave or Safari browser, the web pages are a challenge to work with. ### Future Implementation (Screenshot) Ideally, the web client components would fit into the horizontal space, even if it requires shifting components down. ### Audiobookshelf Server Version 2.29.0 ### Current Implementation (Screenshot) This is what it currently looks like on my iPhone. Notice how some of the web page components are off of the screen to either side of the visible area. The page can't be scrolled to either side to make use of the components of the web client. Additionally, this is when trying to manage/edit library items on the default ABS web client. The web client player is satisfactory. <edit: Removed incorrect screenshot>