[bug] Fix navigation arrows in item page

ails-lab · Oct 16, 2024 · 1f3b6db · 1f3b6db
1 parent 8589cb2
commit 1f3b6db
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/src/pages/item/campaignItem.html b/src/pages/item/campaignItem.html
@@ -1,14 +1,16 @@
 <template>
   <main>
     <!-- nav arrows -->
-    <!--section id="nav-arrows">
-      <a if.bind="!isFirstItem" click.delegate="goToItem('previous')">
-        <i class="fa fa-chevron-circle-left" aria-hidden="true"></i>
-      </a>
-      <a show.bind="!isLastItem" click.delegate="goToItem('next')">
+    <section id="nav-arrows">
+      <div>
+        <a show.bind="!isFirstItem" class="previous" click.delegate="goToItem('previous')">
+          <i class="fa fa-chevron-circle-left" aria-hidden="true"></i>
+        </a>
+      </div>
+      <a show.bind="!isLastItem" class="next" click.delegate="goToItem('next')">
         <i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
       </a>
-    </section-->
+    </section>
     <!-- new banner-->
     <section class="banner mini detail" id="banner">
       <div class="container">

diff --git a/styles/styles.less b/styles/styles.less
@@ -8717,6 +8717,17 @@ section#nav-arrows {
   justify-content: space-between;
   padding: 0 32px;
   align-items: center;
+  z-index: 10;
+  a {
+    background-color: #fff;
+    border-radius: 32px;
+    &.previous {
+      padding: 9px 16px;
+    }
+    &.next {
+      padding: 4px 16px;
+    }
+  }
   a, i {
     position: relative;
     z-index: 1000;