Skip to content
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

CSS changes to make current theme responsive #12227

Merged
merged 1 commit into from
Nov 10, 2020
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions docs/static/exampleinclude.css
Original file line number Diff line number Diff line change
Expand Up @@ -84,3 +84,15 @@
color: #404040;
background-color: #d6d6d6;
}

/* override the maximum width restriction for large screen */
Copy link
Member

Choose a reason for hiding this comment

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

This doesn't look like code related to the exampleinclude directive.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Kindly suggest file name where this code can be placed.

Copy link
Member

Choose a reason for hiding this comment

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

I don't think that is a good solution. The lack of text width on all pages makes some pages very difficult to read on some screens. I would prefer to turn these tables into lists to make the whole content narrower. I currently have these tasks in my queue, but I want to do it cleverly and automatically, and then use this information to update the website - https://github.com/apache/airflow-site/blob/master/landing-pages/site/static/integrations.json

According to several sources designers should strive for 45 to 85 characters per line since the ideal width for a paragraph is supposedly 65 characters.

https://medium.com/@matuzo/writing-css-with-accessibility-in-mind-8514a0007939

.wy-nav-content {
max-width: none;
}

/* override table width restrictions */
@media screen and (min-width: 720px) {
.wy-table-responsive table td {
white-space: normal !important;
}
}