[apisix-website] branch master updated: fix: view docs btn (#1188)

[sylviasu]

This is an automated email from the ASF dual-hosted git repository.

sylviasu pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/apisix-website.git


The following commit(s) were added to refs/heads/master by this push:
     new 5c9f55190e3 fix: view docs btn (#1188)
5c9f55190e3 is described below

commit 5c9f55190e330c0e23a169b188d4e5a855fad0f0
Author: Young <isk...@outlook.com>
AuthorDate: Tue Jul 5 11:08:47 2022 +0800

    fix: view docs btn (#1188)
---
 website/src/components/ArrowAnim.tsx    |  2 +-
 website/src/css/home-events.module.scss | 10 ++++++----
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/website/src/components/ArrowAnim.tsx 
b/website/src/components/ArrowAnim.tsx
index 5469ac479ce..c3e08002641 100644
--- a/website/src/components/ArrowAnim.tsx
+++ b/website/src/components/ArrowAnim.tsx
@@ -11,7 +11,7 @@ const ArrowAnim: FC = () => (
     className="btn-docs"
   >
     <div className="goto">
-      <Translate id="arrowAnim.component.link.btn">Go to docs...</Translate>
+      <Translate id="arrowAnim.component.link.btn">View the docs</Translate>
     </div>
     <div className="arrow">
       <svg width="70%" height="50%" viewBox="0 0 256 256">
diff --git a/website/src/css/home-events.module.scss 
b/website/src/css/home-events.module.scss
index 400c7bcd158..c502ccb1990 100644
--- a/website/src/css/home-events.module.scss
+++ b/website/src/css/home-events.module.scss
@@ -1,24 +1,26 @@
 @import "./util";
 
+$transition-duration: 200ms;
+
 .arrow {
   $size: 25px;
 
   width: $size;
   height: $size;
   position: relative;
-  margin-bottom: 1px;
+  margin-bottom: 0.5px;
 
   svg {
     position: absolute;
     top: 50%;
     left: 50%;
-    transform: translate(-50%, -50%);
+    transform: translate3d(-50%, -50%, 0);
     overflow: visible;
   }
 
   polygon,
   rect {
-    transition: all 250ms;
+    transition: all $transition-duration ease-in-out;
   }
 
   rect {
@@ -54,7 +56,7 @@
       font-size: 0.9rem;
       height: 200px;
       width: 282px;
-      transition: all 0.2s ease-in-out;
+      transition: all $transition-duration ease-in-out;
       margin: 0 1rem;
       border-radius: 1rem;
       border: 1px solid hsl(210deg 26% 28% / 14%);