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/08 08:30:47 UTC

[GitHub] [camel-website] AemieJ opened a new pull request #452: CAMEL-15371: underline links

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


   


----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       Thickness feature isn't present for chrome browser and the dotted style looks inconsistent. Either we just not include under or we include it. It's best to keep it simple. Or I could use the `border-bottom` property.




----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       I am not sure about to dotted style. It would look quite odd. I will look into the thickness.




----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       You require this particular line so that there is a minimum distance between the underline and the text.




----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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


   @zregvart I have checked it, the `background-position` tracks all the font-size of the text and that of browsers correctly.


----------------------------------------------------------------
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 a change in pull request #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       Right, so this is with `text-underline-position: under`:
   
   ![Screenshot_2020-08-11 Home - Apache Camel](https://user-images.githubusercontent.com/1306050/89947841-5e2b0600-dc25-11ea-87eb-0ee28caca42a.png)
   
   and without:
   
   ![Screenshot_2020-08-11 Home - Apache Camel(1)](https://user-images.githubusercontent.com/1306050/89947917-7d299800-dc25-11ea-805b-4bacfc13cc4b.png)
   
   I think what you're reacting to is that the underline is quite noticeable, perhaps adding to make it lighter:
   
   ```suggestion
     text-decoration-thickness: 1px;
     text-decoration-style: dotted;
   ```
   
   Would help, this is how it renders in Firefox:
   
   ![Screenshot_2020-08-11 Home - Apache Camel(3)](https://user-images.githubusercontent.com/1306050/89948444-70f20a80-dc26-11ea-9a57-b84bd5659c42.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] zregvart commented on pull request #452: CAMEL-15371: underline links

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


   Thanks @AemieJ


----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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


   @zregvart alright I got your concern about it but with those changes, it looks messy in chrome browser, I found a method using background-image and linear-gradient on the CSS tricks site. 
   
   ```
   background-image: linear-gradient(to right, #583ac2 50%, transparent 50%);
   background-position: 0 1.1em;
   background-repeat: repeat-x;
   background-size: 7px 1px;
   ```
   
   If it's okay with you, I will implement it in this manner, it will create a neater effect of underline on each browser. 
   ![underline-link](https://user-images.githubusercontent.com/44139348/89999311-3e8af080-dcac-11ea-9709-038102702239.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] zregvart commented on pull request #452: CAMEL-15371: underline links

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


   Not sure about the underline being below the descenders. My personal preference would be
   
   ```css
   text-decoration: underline;
   text-decoration-style: dotted;
   ```
   
   There are some methods on different underline styles at [css tricks](https://css-tricks.com/styling-underlines-web/) and I remember reading about the underline journey at [medium](https://medium.design/crafting-link-underlines-on-medium-7c03a9274f9) (for inspiration).
   
   @aashnajena and @delawen any thoughts on 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] zregvart commented on a change in pull request #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       This bit looks a bit weird to me.
   
   ```suggestion
   ```




----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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


   


----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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



##########
File path: antora-ui-camel/src/css/doc.css
##########
@@ -149,6 +149,16 @@
 .doc a {
   color: var(--link-font-color);
   word-break: break-word;
+  text-decoration: underline;
+  text-underline-position: under;

Review comment:
       I am not sure about to dotted style. It would look quite odd. I will look into the thickness.




----------------------------------------------------------------
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 #452: CAMEL-15371: underline links

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


   > ```
   > background-image: linear-gradient(to right, #583ac2 50%, transparent 50%);
   > background-position: 0 1.1em;
   > background-repeat: repeat-x;
   > background-size: 7px 1px;
   > ```
   
   Does the `background-position` track different font sizes correctly? Might be a bit of a headache to have this properly positioned for all font sizes.


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