[website]: Improve Mobile View Layout for Better Usability and Responsiveness #364

Closed
opened 2026-02-04 18:14:23 +03:00 by OVERLORD · 4 comments
Owner

Originally created by @MickLesk on GitHub (Jan 22, 2025).

Originally assigned to: @BramSuurdje on GitHub.

Please verify that you have read and understood the guidelines.

yes

What type of issue is this?

Optimization

A clear and concise description of the issue.

Mobile view:

  • Header:
  • Header shifted (scripts by tteck somewhere in the background and everything overlaid)
  • The icon at the top right (project icon or tteck icon) can be removed in the mobile view

Ideal case:

  • The icons for Github / Discord etc. at the top
  • Below that a larger search bar
  • Possibilities to display categories?

Body:

  • Shorten text if necessary? And make it responsive? It looks like it's hanging from the header.
  • Add view scripts? I think it's just hanging somewhere between the body and the footer and can't be pressed.

Footer:
Fits so far

Which browser are you using?

Chrome

If relevant, including screenshots or a code block can be helpful in clarifying the issue.

Image

Device Xiaomi 14T Pro

(on my Pixel 8 Pro its the same)

Please provide detailed steps to reproduce the issue.

No response

Originally created by @MickLesk on GitHub (Jan 22, 2025). Originally assigned to: @BramSuurdje on GitHub. ### Please verify that you have read and understood the guidelines. yes ### What type of issue is this? Optimization ### A clear and concise description of the issue. Mobile view: - Header: - Header shifted (scripts by tteck somewhere in the background and everything overlaid) - The icon at the top right (project icon or tteck icon) can be removed in the mobile view Ideal case: - The icons for Github / Discord etc. at the top - Below that a larger search bar - Possibilities to display categories? Body: - Shorten text if necessary? And make it responsive? It looks like it's hanging from the header. - Add view scripts? I think it's just hanging somewhere between the body and the footer and can't be pressed. Footer: Fits so far ### Which browser are you using? Chrome ### If relevant, including screenshots or a code block can be helpful in clarifying the issue. ![Image](https://github.com/user-attachments/assets/9aace692-cfb8-4bfa-b21b-b6304beff98a) Device Xiaomi 14T Pro (on my Pixel 8 Pro its the same) ### Please provide detailed steps to reproduce the issue. _No response_
OVERLORD added the website label 2026-02-04 18:14:23 +03:00
Author
Owner

@bvdberg01 commented on GitHub (Jan 22, 2025):

Here a screenshot on my Samsung Galaxy S22 using Chrome.

When page loaded:
Screenshot_20250122_092248_Chrome.jpg

And here when fully scrolled down on the page.
Screenshot_20250122_092302_Chrome.jpg

@bvdberg01 commented on GitHub (Jan 22, 2025): Here a screenshot on my Samsung Galaxy S22 using Chrome. When page loaded: ![Screenshot_20250122_092248_Chrome.jpg](https://github.com/user-attachments/assets/61dce9c5-d39b-4bb5-b6d7-bfe0eaf280d6) And here when fully scrolled down on the page. ![Screenshot_20250122_092302_Chrome.jpg](https://github.com/user-attachments/assets/d7365883-5925-414a-b201-3e7ef4d589c2)
Author
Owner

@oOStroudyOo commented on GitHub (Jan 22, 2025):

Chrome on Pixel 9 Pro

Image
Image
Image

@oOStroudyOo commented on GitHub (Jan 22, 2025): Chrome on Pixel 9 Pro ![Image](https://github.com/user-attachments/assets/25522d62-dc23-4434-a945-e159ae6aa40a) ![Image](https://github.com/user-attachments/assets/8f779535-fcb3-4e46-a19e-15560f20b2a8) ![Image](https://github.com/user-attachments/assets/0d29eeb7-6ed9-42d0-8c70-4fda38bab9f0)
Author
Owner

@BramSuurdje commented on GitHub (Jan 22, 2025):

expect a PR for this this week.

@BramSuurdje commented on GitHub (Jan 22, 2025): expect a PR for this this week.
Author
Owner

@MickLesk commented on GitHub (Jan 22, 2025):

Thx. Looks nice now 👍

@MickLesk commented on GitHub (Jan 22, 2025): Thx. Looks nice now 👍
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/ProxmoxVE#364