zregvart commented on a change in pull request #579:
URL: https://github.com/apache/camel-website/pull/579#discussion_r634982110



##########
File path: layouts/blog/post.html
##########
@@ -20,6 +20,33 @@ <h1>{{ .Title }}</h1>
             </figure>
             {{ end }}
             {{ end }}
+
+            <h4>Share this blog</h4>
+
+            <!-- Sharingbutton Facebook -->
+            <a class="resp-sharing-button__link" 
href="https://facebook.com/sharer/sharer.php?u={{ .Permalink }}" 
target="_blank" rel="noopener" aria-label="">

Review comment:
       I need to test this, but I think we could use the `aria-label` here to 
help folk with sight impairment. Same goes for other buttons.
   
   ```suggestion
               <a class="resp-sharing-button__link" 
href="https://facebook.com/sharer/sharer.php?u={{ .Permalink }}" 
target="_blank" rel="noopener" aria-label="Share on Facebook">
   ```

##########
File path: antora-ui-camel/src/css/sharingbuttons.css
##########
@@ -0,0 +1,162 @@
+.resp-sharing-button__link,
+.resp-sharing-button__icon {
+  display: inline-block;
+}
+
+.resp-sharing-button__link {
+  text-decoration: none;
+  color: #fff;
+  margin: 0.5em;
+}
+
+.resp-sharing-button {
+  border-radius: 5px;
+  transition: 25ms ease-out;
+  padding: 0.5em 0.75em;
+  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
+}
+
+.resp-sharing-button__icon svg {
+  width: 1em;
+  height: 1em;
+  margin-right: 0.4em;
+  vertical-align: top;
+}
+
+.resp-sharing-button--small svg {
+  margin: 0;
+  vertical-align: middle;
+}
+
+/* Non solid icons get a stroke */
+
+.resp-sharing-button__icon {
+  stroke: #fff;
+  fill: none;
+}
+
+/* Solid icons get a fill */
+
+.resp-sharing-button__icon--solid,
+.resp-sharing-button__icon--solidcircle {
+  fill: #fff;
+  stroke: none;
+}
+
+.resp-sharing-button--twitter {
+  background-color: #55acee;
+  border-color: #55acee;
+}
+
+.resp-sharing-button--twitter:hover {
+  background-color: #2795e9;
+}
+
+.resp-sharing-button--pinterest {

Review comment:
       There are bits that we don't use here (pinterest being one of them), 
it's not a real issue, couple of bytes more in the CSS, but perhaps we can 
remove those as we're not using 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:
[email protected]


Reply via email to