You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by GitBox <gi...@apache.org> on 2020/03/19 15:19:57 UTC
[GitHub] [camel-website] AemieJ opened a new pull request #241: CAMEL-14745:
Navbar doesn't fit the screen resolved for few pages
AemieJ opened a new pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241
* It was observed that certain webpages under smaller screen width, the entire webpage doesn't fit the screen and the user needs to scroll through the screen to access the navbar. It is observed in several webpages.
* Currently, I have resolved this issue for **DOWNLOADS**, **FRONTPAGE**, **SUPPORT** pages, and the navbar and all its content fit within the screen for any width.
### ISSUE OBSERVED IN DOWNLOADS PAGE AS THE TABLE WAS CREATING THE ISSUE.
### SOLUTION TO RESOLVE THE ISSUE BY WRAPPING THE TABLE UNDER THE TABLE-WRAPPER
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397709070
##########
File path: layouts/download/download.html
##########
@@ -29,6 +29,7 @@ <h3>Binary Distribution</h3>
{{ $major := "" }}
{{ $cnt := 1 }}
+ <div class="table-wrapper">
Review comment:
This is required for the table within the downloads page. Without this, the table will make the page unresponsive in the mobile version.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396352475
##########
File path: content/blog/GSoC-2020-announced/index.md
##########
@@ -38,7 +38,8 @@ Camel and introduce yourself to the Camel community.
**Mentors** need to be existing [Camel
comitters](https://projects.apache.org/committee.html?camel) and need to apply
by first sending an email to the
-[private@camel.apache.org,mentors@community.apache.org](mailto:private@camel.apache.org,mentors@community.apache.org)
+[private@camel.apache.org](mailto:private@camel.apache.org),
+[mentors@community.apache.org](mailto:mentors@community.apache.org)
Review comment:
This needs to remain as it is, same email needs to be sent to both lists.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396357246
##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -577,10 +596,6 @@
display: none;
}
-b.button {
- white-space: nowrap;
-}
-
Review comment:
I observed that in the mobile view the navbar hamburger moves to the side because of the width occupied by the paragraph and links. Hence, removing the whitespace and word-wrap ensures continuous flow of the page and also the page becomes responsive.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397092762
##########
File path: layouts/blog/post.html
##########
@@ -20,7 +20,7 @@ <h1><a href="{{.Page.Permalink}}">{{ .Title }}</a></h1>
{{ end }}
</p>
</aside>
- <div class="post-content">
+ <div class="post-content table-wrapper">
Review comment:
I don't think we need the `table-wrapper` class
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396343229
##########
File path: antora-ui-camel/src/css/blog.css
##########
@@ -106,6 +106,14 @@ article.blog p {
margin-bottom: 1rem;
}
+.blog .post .post-content .table-wrapper {
Review comment:
I don't think this is a good approach, doing it this way forces us to add the `<div class="table-wrapper">` in the future.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397092533
##########
File path: content/community/team.md
##########
@@ -8,6 +8,7 @@ This page lists who we are. By all means add yourself to the list - lets sort it
When posting to the mailing lists, use plain text mails. Do not use HTML mails. HTML mails is more likely to be targeted as spam mails and will be rejected; as well it's not easily readable by others.
+{{< div "table-wrapper" >}}
Review comment:
As far as I understand we don't need this anymore
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397092822
##########
File path: layouts/download/download.html
##########
@@ -29,6 +29,7 @@ <h3>Binary Distribution</h3>
{{ $major := "" }}
{{ $cnt := 1 }}
+ <div class="table-wrapper">
Review comment:
Can be removed.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397701076
##########
File path: content/community/team.md
##########
@@ -8,6 +8,7 @@ This page lists who we are. By all means add yourself to the list - lets sort it
When posting to the mailing lists, use plain text mails. Do not use HTML mails. HTML mails is more likely to be targeted as spam mails and will be rejected; as well it's not easily readable by others.
+{{< div "table-wrapper" >}}
Review comment:
Yes, I changed it to directly include table wrapper within the table syntax in the shortcodes.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397093942
##########
File path: antora-ui-camel/src/css/blog.css
##########
@@ -106,6 +106,14 @@ article.blog p {
margin-bottom: 1rem;
}
+.blog .post .post-content .table-wrapper {
Review comment:
Would it make more sense to target the `table` element rather than introducing the wrapper?
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on issue #241: CAMEL-14745: Navbar
doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on issue #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#issuecomment-602575764
I have done the requested changes. I have removed the use of **table-wrapper** and **link-wrapper** in blog.css and committed the other changes too.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396433117
##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -577,10 +596,6 @@
display: none;
}
-b.button {
- white-space: nowrap;
-}
-
Review comment:
If you observe in pages such as the blog page, the mobile view isn't responsive and the navbar hamburger isn't visible. Similar cases for other pages and the changes resolve that.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396383786
##########
File path: antora-ui-camel/src/css/blog.css
##########
@@ -106,6 +106,14 @@ article.blog p {
margin-bottom: 1rem;
}
+.blog .post .post-content .table-wrapper {
+ overflow-x: auto;
+}
+
+.blog .post .post-content .link-wrapper {
Review comment:
I found a way across this to not make use of link-wrapper.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396358303
##########
File path: antora-ui-camel/src/css/blog.css
##########
@@ -106,6 +106,14 @@ article.blog p {
margin-bottom: 1rem;
}
+.blog .post .post-content .table-wrapper {
Review comment:
But some of the table are overflowing and putting the table wrapper prevents that. Otherwise the page is unresponsive with the table in it.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ closed pull request #241: CAMEL-14745:
Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ closed pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397092627
##########
File path: content/community/team.md
##########
@@ -71,13 +72,15 @@ When posting to the mailing lists, use plain text mails. Do not use HTML mails.
| William Tam | wtam | Red Hat |
| Zoran Regvart | zregvart | Red Hat |
{{< /table >}}
+{{< /div >}}
## Contributors
Adding your name to the list below.
If you have been contributing to the Apache Camel project, and you want your name added to the list below. Then you can get in touch with the Camel team from the [Mailing Lists](../mailing-list/) and ask to be added.
+{{< div "table-wrapper" >}}
Review comment:
This can be removed
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] AemieJ commented on a change in pull request #241:
CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397118850
##########
File path: layouts/blog/post.html
##########
@@ -20,7 +20,7 @@ <h1><a href="{{.Page.Permalink}}">{{ .Title }}</a></h1>
{{ end }}
</p>
</aside>
- <div class="post-content">
+ <div class="post-content table-wrapper">
Review comment:
I observed that in the components reference section, there is a section where table-wrapper is used for controlling the overflow of the table. However, in the blog section, for the post the table doesn't contain the table wrapper class hence, the overflow of tables causes the hindrance.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r397094132
##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -577,10 +596,6 @@
display: none;
}
-b.button {
- white-space: nowrap;
-}
-
Review comment:
Yup seeing it now.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396343776
##########
File path: antora-ui-camel/src/css/blog.css
##########
@@ -106,6 +106,14 @@ article.blog p {
margin-bottom: 1rem;
}
+.blog .post .post-content .table-wrapper {
+ overflow-x: auto;
+}
+
+.blog .post .post-content .link-wrapper {
Review comment:
Same remark as the `table-wrapper`. This is bringing on future complexity we can't maintain.
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services
[GitHub] [camel-website] zregvart commented on a change in pull request
#241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
Posted by GitBox <gi...@apache.org>.
zregvart commented on a change in pull request #241: CAMEL-14745: Navbar doesn't fit the screen resolved for few pages
URL: https://github.com/apache/camel-website/pull/241#discussion_r396351491
##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -577,10 +596,6 @@
display: none;
}
-b.button {
- white-space: nowrap;
-}
-
Review comment:
I can't find any HTML markup that uses this, can you help me, what is this change about?
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
With regards,
Apache Git Services