Merge pull request #466 from oceanbase/dengfuping-design-feature

[Feature Branch] fix(design): Simple Empty image and description style should be correct
oceanbase · Feb 6, 2024 · 28af419 · 28af419
2 parents 359359c + 2069fa7
commit 28af419
Show file tree

Hide file tree

Showing 2 changed files with 46 additions and 13 deletions.
diff --git a/packages/design/src/empty/index.tsx b/packages/design/src/empty/index.tsx
@@ -43,6 +43,7 @@ const Empty: CompoundedComponent = ({
   const emptyCls = classNames(
     prefixCls,
     {
+      [`${prefixCls}-normal`]: image === simpleEmptyImg,
       [`${prefixCls}-horizontal`]: isHorizontal,
     },
     className

diff --git a/packages/design/src/empty/simple.tsx b/packages/design/src/empty/simple.tsx
@@ -1,18 +1,50 @@
 import React from 'react';
 
-const Empty: React.FC = () => (
-  <svg width="56px" height="56px" viewBox="0 0 56 56">
-    <g stroke="none" fill="none">
-      <g transform="translate(4.2, 4.2)">
-        <rect fill="#E6E6E6" x="5.495" y="0" width="37.121" height="29.176" rx="4.03"></rect>
-        <rect fill="#F8F8F8" x="11.452" y="5.257" width="25.046" height="1.652" rx="0.826"></rect>
-        <rect fill="#F8F8F8" x="11.452" y="10.997" width="16.681" height="1.652" rx="0.826"></rect>
-        <path
-          d="M45.143,48.083 L2.821,48.083 C1.267,48.083 0,46.823 0,45.262 L0,21.028 C0,19.474 1.26,18.207 2.821,18.207 L19.264,18.207 C20.216,18.207 21.098,18.683 21.623,19.481 L23.149,21.798 C23.667,22.589 24.556,23.072 25.508,23.072 L45.15,23.072 C46.704,23.072 47.971,24.332 47.971,25.893 L47.971,45.262 C47.971,46.816 46.711,48.083 45.15,48.083 L45.143,48.083 Z"
-          fill="#F8F8F8"
-        ></path>
-        <g transform="translate(20.503, 29.68)" fill="#0181FD">
-          <path d="M3.724,0 C2.576,0 1.673,0.329 1.008,0.98 C0.322,1.631 0,2.534 0,3.682 L1.771,3.682 C1.771,3.031 1.897,2.52 2.156,2.163 C2.45,1.729 2.933,1.526 3.619,1.526 C4.144,1.526 4.564,1.666 4.858,1.96 C5.138,2.254 5.292,2.66 5.292,3.171 C5.292,3.556 5.152,3.934 4.872,4.277 L4.683,4.494 C3.675,5.397 3.066,6.048 2.863,6.468 C2.646,6.888 2.555,7.399 2.555,7.987 L2.555,8.204 L4.34,8.204 L4.34,7.987 C4.34,7.616 4.417,7.287 4.571,6.979 C4.711,6.699 4.914,6.433 5.194,6.202 C5.936,5.551 6.391,5.131 6.531,4.977 C6.902,4.48 7.105,3.843 7.105,3.066 C7.105,2.121 6.797,1.372 6.174,0.833 C5.551,0.273 4.732,0.007 3.717,0.007 L3.724,0 Z M3.444,8.96 C3.101,8.96 2.821,9.072 2.59,9.289 C2.359,9.506 2.247,9.786 2.247,10.129 C2.247,10.472 2.359,10.752 2.59,10.969 C2.821,11.186 3.101,11.312 3.444,11.312 C3.787,11.312 4.067,11.2 4.298,10.983 C4.529,10.766 4.655,10.472 4.655,10.129 C4.655,9.786 4.529,9.506 4.312,9.289 C4.081,9.072 3.787,8.96 3.444,8.96 Z"></path>
+const Empty: React.FC = props => (
+  <svg
+    width="46.25775px"
+    height="46.36575px"
+    viewBox="0 0 46.25775 46.36575"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g transform="translate(-801.05, -274.05)">
+        <g transform="translate(796, 270)">
+          <g transform="translate(1, 0)">
+            <rect x="0" y="0" width="54" height="54"></rect>
+            <g transform="translate(4.05, 4.05)" fillRule="nonzero">
+              <rect
+                fill="#E6E6E6"
+                x="5.3055"
+                y="0"
+                width="35.79525"
+                height="28.134"
+                rx="2.72025"
+              ></rect>
+              <rect
+                fill="#F8F8F8"
+                x="11.04975"
+                y="5.0625"
+                width="24.1515"
+                height="1.593"
+                rx="0.7965"
+              ></rect>
+              <rect
+                fill="#F8F8F8"
+                x="11.04975"
+                y="10.60425"
+                width="16.08525"
+                height="1.593"
+                rx="0.7965"
+              ></rect>
+              <path
+                d="M43.53075,46.36575 L2.72025,46.36575 C1.22175,46.36575 0,45.15075 0,43.6455 L0,20.277 C0,18.7785 1.215,17.55675 2.72025,17.55675 L18.576,17.55675 C19.494,17.55675 20.3445,18.01575 20.85075,18.78525 L22.32225,21.0195 C22.82175,21.78225 23.679,22.248 24.597,22.248 L43.5375,22.248 C45.036,22.248 46.25775,23.463 46.25775,24.96825 L46.25775,43.6455 C46.25775,45.144 45.04275,46.36575 43.5375,46.36575 L43.53075,46.36575 Z"
+                fill="#F8F8F8"
+              ></path>
+            </g>
+          </g>
         </g>
       </g>
     </g>