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/08/27 22:03:06 UTC

[GitHub] [camel-website] zregvart opened a new pull request #471: CAMEL-15392: documentation and community redesign

zregvart opened a new pull request #471:
URL: https://github.com/apache/camel-website/pull/471


   Based on pull request #469 by @aashnajena, rebased with fixed links.


----------------------------------------------------------------
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



[GitHub] [camel-website] aashnajena commented on a change in pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
aashnajena commented on a change in pull request #471:
URL: https://github.com/apache/camel-website/pull/471#discussion_r478909001



##########
File path: antora-ui-camel/src/css/frontpage.css
##########
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;

Review comment:
       When exactly are you observing the overlap? I have already provided line-height for <1024px screens (line 355) to avoid the overlap, and I can't see the buttons overlapping for any screen width.




----------------------------------------------------------------
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



[GitHub] [camel-website] AemieJ commented on a change in pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #471:
URL: https://github.com/apache/camel-website/pull/471#discussion_r478840106



##########
File path: antora-ui-camel/src/css/frontpage.css
##########
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;

Review comment:
       ```suggestion
     padding: 0.4rem 1rem;
     line-height: 2.5rem;
   ```




----------------------------------------------------------------
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



[GitHub] [camel-website] zregvart merged pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
zregvart merged pull request #471:
URL: https://github.com/apache/camel-website/pull/471


   


----------------------------------------------------------------
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



[GitHub] [camel-website] zregvart commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
zregvart commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-716640940


   This is now merged thanks @aashnajena and @AemieJ. I'm sure we'll find other issues to improve, feel free to raise issues or create additional PRs for them.


----------------------------------------------------------------
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



[GitHub] [camel-website] aashnajena commented on a change in pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
aashnajena commented on a change in pull request #471:
URL: https://github.com/apache/camel-website/pull/471#discussion_r478909001



##########
File path: antora-ui-camel/src/css/frontpage.css
##########
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;

Review comment:
       When exactly are you observing the overlap? I have already provided line-height for <1024px screens to avoid the overlap, and I can't see the buttons overlapping for any screen width.




----------------------------------------------------------------
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



[GitHub] [camel-website] AemieJ commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
AemieJ commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-682332561


   ![issue-prob](https://user-images.githubusercontent.com/44139348/91524519-0f67b680-e91d-11ea-9290-e982cdb5172b.png)
   
   This is an issue within the documentation page for the certain screen width. `line-height` must be provided to overcome this.


----------------------------------------------------------------
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



[GitHub] [camel-website] AemieJ commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
AemieJ commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-682391273


   @aashnajena I hear you but I respectfully disagree with you. In my opinion, altering a few lines of CSS and making it look structured and consistent through gives a neater effect to the design be it 1 or 2 images. 


----------------------------------------------------------------
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



[GitHub] [camel-website] aashnajena commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
aashnajena commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-712724304


   @zregvart can we fix and merge this? The website still shows underlines under images and I think this PR fixes that as well


----------------------------------------------------------------
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



[GitHub] [camel-website] AemieJ commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
AemieJ commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-682333471


   I personally find the structure of the documentation page within the desktop screen version quite disorientated and unstructured. I would prefer it if the images were on the same side as presented as on the community page, looks neater. Also, I observed that due to one image for camel-core the context isn't aligned with the contents of the sub-project. 
   
   I find the following structure much neater: 
   ![structured-look](https://user-images.githubusercontent.com/44139348/91524695-74bba780-e91d-11ea-981c-9bbd9545f66f.png)


----------------------------------------------------------------
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



[GitHub] [camel-website] aashnajena commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
aashnajena commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-682388217


   @AemieJ The camel core context is not aligned with the rest because there's only one icon present, and if we give it 30% width, it leaves a lot of blank space which looks bad. Since the alignments are alternating, it's not a noticeable flaw. 
   
   I did think about making them all left-aligned, but it looks very odd to have one icon for camel core and two for the rest. If we can use just one icon for each sub-project, the left-alignment will look good. 


----------------------------------------------------------------
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



[GitHub] [camel-website] aashnajena commented on a change in pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
aashnajena commented on a change in pull request #471:
URL: https://github.com/apache/camel-website/pull/471#discussion_r478928891



##########
File path: antora-ui-camel/src/css/docs.css
##########
@@ -1,154 +1,84 @@
-.docs {
-  padding: 1rem 3rem;
-}
-
-.docs p:empty {
-  display: none;
-}
-
-.section h2 {
-  text-align: center;
-  padding-bottom: 0;
-}
-
-.camel-project {
-  width: calc(100% - 3rem);
-  display: inline-flex;
-  border: 1px solid var(--color-smoke-90);
+.docs,
+.community {
+  padding: 1rem 3rem 2rem;
+  display: flex;
+  width: 80%;
   flex-direction: column;
-  align-items: center;
-  text-align: center;
-  padding: 1rem 1rem 2rem 1rem;
-  margin: 1.5rem;
-  border-radius: 10px;
 }
 
-.camel-project .section {
-  border: none;
-  padding: 0;
-}
-
-.camel-project .section.core {
-  width: 100%;
+.docs .box,
+.community .box {
+  display: flex;
+  margin: 1rem 0;
 }
 
-.camel-project .camel-documentation .links {
-  background-color: var(--color-camel-orange-light);
-  padding: 0 0.5rem;
-  border-radius: 25px;
-  color: var(--navbar-background);
+.docs .box .content,
+.community .box .content {
+  width: 70%;
 }
 
-.camel-project .camel-documentation .links a {
-  color: var(--navbar-background);
-  font-weight: bolder;
+.docs .box img,
+.community .box img {
+  margin-top: 4rem;
+  height: 8vw;
+  max-height: 6rem;
+  margin-right: 0.5rem;
 }
 
-.section {
-  display: inline-flex;
-  border: 1px solid var(--color-smoke-90);
-  width: calc(50% - 3.2rem);
-  flex-direction: column;
-  align-items: center;
+.docs .box .icon {
+  width: 30%;
   text-align: center;
-  padding: 1rem;
-  margin: 1.5rem;
-  border-radius: 10px;
-}
-
-.section > a,
-.camel-project > a {
-  background: none;
-}
-
-.section a > img,
-.camel-project a > img {
-  display: inline-block;
-  width: auto;
-  height: 5rem;
-  margin-top: 1rem;
-}
-
-.section a > img + img {
-  padding-left: 1rem;
 }
 
-.section .description {
-  padding: 1.2rem;
+.docs .box.camel-core .icon,
+.community .box .icon {
+  width: 20%;
   text-align: center;
 }
 
-.section .list {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-}
-
-.section .links {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  margin: 1.5rem 0;
-  word-break: break-word;
-  background-color: var(--color-camel-orange-light);
-  padding: 0 0.5rem;
-  border-radius: 25px;
-  color: var(--navbar-background);
-}
-
-.section .list pre {
-  padding: 0;
-  width: 0.5rem;
-  box-shadow: none;
-  overflow-x: hidden;
-  background: none;
-}
-
-.section .list .links {
-  margin: 0.5rem;
+.icon a,
+a.button-light,
+a.button-dark {
+  background-image: none;
 }
 
-.section .links img {
-  height: 1.5rem;
-  width: 2rem;
-  margin: 0.35rem 0 0 0.25rem;
-}
-
-.section .links p {
-  margin: 0;
-}
-
-.section .links .partition {
-  background: #fff;
-  height: 2.5rem;
-  width: 0.1rem;
-  margin: 0 0.5rem;
-}
-
-.section .links a {
-  color: var(--navbar-background);
-  font-weight: bolder;
+.docs .box.camel-core .content {
+  width: 80%;
 }
 
 @media screen and (max-width: 1023px) {
-  .docs {
+  .docs,
+  .community {
     padding: 0 1rem 4rem;
+    width: 100%;
   }
 
-  .camel-project,
-  .section {
-    width: calc(100% - 1rem);
-    margin: 1.5rem -1.5rem 1.5rem 0.5rem;
+  .docs .box,
+  .community .box,
+  .docs .box .content,
+  .community .box .content,
+  .docs .box .icon,
+  .community .box .icon {

Review comment:
       Missed out on these rules earlier
   
   ```suggestion
     .community .box .icon,
     .docs .box.camel-core .content,
     .docs .box.camel-core .icon {
   ```

##########
File path: antora-ui-camel/src/css/frontpage.css
##########
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;

Review comment:
       My view at 1024px 100% zoom
   
   ![Screenshot 2020-08-28 at 1 48 47 PM](https://user-images.githubusercontent.com/32356795/91538379-64172b80-e935-11ea-8f54-27f8350d24c6.png)
   




----------------------------------------------------------------
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



[GitHub] [camel-website] AemieJ commented on a change in pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
AemieJ commented on a change in pull request #471:
URL: https://github.com/apache/camel-website/pull/471#discussion_r478917571



##########
File path: antora-ui-camel/src/css/frontpage.css
##########
@@ -74,30 +74,32 @@ header.frontpage p {
   line-height: 1.7rem;
 }
 
-.frontpage a.button-dark,
-.frontpage a.button-dark:hover {
+a.button,
+section.frontpage a.button {
   white-space: nowrap;
-  padding: 0.7rem 1rem;
-  background-color: var(--color-camel-orange);
-  background-image: none;
-  background-repeat: no-repeat;
-  background-position: 0;
-  color: white;
-  font-weight: bold;
   margin-right: 0.5rem;
+  background-image: none;
   border-radius: 3rem;
-  outline: none;
-  display: inline-block;
-  box-shadow: 0 4px #8e480b;
+  font-weight: bold;
+  padding: 0.4rem 1rem;

Review comment:
       This overlapping is observed for 1024px as well. 




----------------------------------------------------------------
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



[GitHub] [camel-website] zregvart commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
zregvart commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-713367576


   I'm rather tied up with other tasks, so I didn't have the time to look at this yesterday, I'll try to find some time today.


----------------------------------------------------------------
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



[GitHub] [camel-website] zregvart commented on pull request #471: CAMEL-15392: documentation and community redesign

Posted by GitBox <gi...@apache.org>.
zregvart commented on pull request #471:
URL: https://github.com/apache/camel-website/pull/471#issuecomment-712746433


   @aashnajena thanks for the ping. I'll rebase and merge this later today.


----------------------------------------------------------------
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