doc: update popover

components/popover/__tests__/__snapshots__/demo.test.js.snap

@@ -1,13 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`renders ./components/popover/demo/arrow-point-at-center.vue correctly 1`] = `
-<div>
-  <!----><button class="ant-btn" type="button">
-    <!----><span>Align edge / 边缘对齐</span>
-  </button>
-  <!----><button class="ant-btn" type="button">
-    <!----><span>Arrow points to center / 箭头指向中心</span>
-  </button>
+<div class="ant-space ant-space-horizontal ant-space-align-center">
+  <div class="ant-space-item" style="margin-right: 8px;">
+    <!----><button class="ant-btn" type="button">
+      <!----><span>Align edge / 边缘对齐</span>
+    </button>
+  </div>
+  <!---->
+  <div class="ant-space-item">
+    <!----><button class="ant-btn" type="button">
+      <!----><span>Arrow points to center / 箭头指向中心</span>
+    </button>
+  </div>
+  <!---->
 </div>
 `;
 

components/popover/demo/arrow-point-at-center.vue

@@ -16,7 +16,7 @@ The arrow points to the center of the target element, which set `arrowPointAtCen
 
 </docs>
 <template>
-  <div>
+  <a-space>
     <a-popover placement="topLeft">
       <template #content>
         <p>Content</p>
@@ -37,5 +37,5 @@ The arrow points to the center of the target element, which set `arrowPointAtCen
       </template>
       <a-button>Arrow points to center / 箭头指向中心</a-button>
     </a-popover>
-  </div>
+  </a-space>
 </template>

components/popover/style/customize.less

@@ -1,3 +0,0 @@
-@import './index.less';
-
-.popover-customize-bg(@popover-prefix-cls, @popover-background);

components/popover/style/index.less

@@ -99,6 +99,7 @@
       color: @warning-color;
       font-size: @font-size-base;
     }
+
     &-title {
       padding-left: @font-size-base + 8px;
     }
@@ -149,6 +150,7 @@
       transform: translateY((-@popover-arrow-rotate-width / 2)) rotate(45deg);
     }
   }
+
   &-placement-top &-arrow {
     left: 50%;
     transform: translateX(-50%);
@@ -172,13 +174,16 @@
       transform: translateX((@popover-arrow-rotate-width / 2)) rotate(45deg);
     }
   }
+
   &-placement-right &-arrow {
     top: 50%;
     transform: translateY(-50%);
   }
+
   &-placement-rightTop &-arrow {
     top: @popover-arrow-offset-vertical;
   }
+
   &-placement-rightBottom &-arrow {
     bottom: @popover-arrow-offset-vertical;
   }