Skip to content

chore: Set max-width to 1480px #132

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Apr 30, 2025
Merged

Conversation

Techassi
Copy link
Member

@Techassi Techassi commented Mar 27, 2025

This drops the max-width to 1480px instead of 1920px, which is way to wide and makes content very hard to read.

Before After
image image

@Techassi Techassi self-assigned this Mar 27, 2025
@Techassi Techassi moved this to Development: In Progress in Stackable Engineering Mar 27, 2025
@Techassi Techassi moved this from Development: In Progress to Development: Waiting for Review in Stackable Engineering Mar 27, 2025
@sbernauer
Copy link
Member

sbernauer commented Mar 27, 2025

Just to gather one data point: I personally prefer 1920 over 1480.
Not blocking this, maybe we can get some more data points

@adwk67
Copy link
Member

adwk67 commented Mar 27, 2025

I personally prefer 1920 over 1480.

I'd second this, particularly with the weird word-splitting that the rendering does (so the wider, the less splitting).
I'd also be OK with e.g. 1760 as a lower limit.

@Techassi
Copy link
Member Author

I personally find it way to wide and very hard to read at 1920px. I can try 1760px tho.

@sbernauer
Copy link
Member

I'm fine with giving 1760px a try 👍

@siegfriedweber
Copy link
Member

Let's look at the first paragraph of the Kafka operator page (https://docs.stackable.tech/home/stable/kafka/):

The Stackable operator for Apache Kafka is an operator that can deploy and manage Apache Kafka clusters on Kubernetes. Apache Kafka is a distributed streaming platform designed to handle large volumes of data in real-time. It is commonly used for real-time data processing, data ingestion, event streaming, and messaging between applications.

Screen width in px Average characters per line (except the last one)
1280 90
1480 112
1760 147
1920 168

There are a lot of studies in typography which line length is best suited for readability (e.g. https://en.wikipedia.org/wiki/Line_length#References). Whichever study you look at, it will be hard to find one that prefers a line length of more than 100.

@Techassi
Copy link
Member Author

I agree with @siegfriedweber's comment.

Therefore I would go with the proposed 1480px, which is still close to the 100 character width but also slightly increases the width compared to 1280px.

@Techassi
Copy link
Member Author

It has been decided (in a poll) to move forward with this PR as is and use 1480px as the max-width.

Copy link
Member

@sbernauer sbernauer left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@sbernauer sbernauer moved this from Development: Waiting for Review to Development: In Review in Stackable Engineering Apr 30, 2025
@Techassi Techassi merged commit 5c08d9f into stackable Apr 30, 2025
2 checks passed
@Techassi Techassi deleted the chore/adjust-container-width branch April 30, 2025 08:20
@Techassi Techassi moved this from Development: In Review to Development: Done in Stackable Engineering Apr 30, 2025
@lfrancke lfrancke moved this from Development: Done to Done in Stackable Engineering Apr 30, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

4 participants