style(logo): logo图标组件优化

src/icons/ConsoleLogo.tsx

@@ -15,34 +15,16 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { SVGProps } from "react";
-import tsIcon from "../icons/tuxingyunlogo.png";
-
-
+import LoginMinIOLogo from "./LoginMinIOLogo";
 
 const ConsoleLogo = (props: SVGProps<SVGSVGElement>) => {
-
   return (
-    // <svg
-    //   {...props}
-    //   className={`min-icon`}
-    //   fill={"currentcolor"}
-    //   xmlns="http://www.w3.org/2000/svg"
-    //   viewBox="0 0 121.755 29.822"
-    // >
-    //   <path
-    //     className="prefix__a"
-    //     d="M15.647 15.935l-1.772 1.194a6.088 6.088 0 00-5.135-2.652 6.348 6.348 0 00-6.522 6.654 6.348 6.348 0 006.522 6.654 6.031 6.031 0 005.124-2.64l1.735 1.266a8.126 8.126 0 01-6.859 3.411A8.422 8.422 0 010 21.131a8.422 8.422 0 018.74-8.691 7.963 7.963 0 016.907 3.495zM35.641 21.131a8.422 8.422 0 01-8.74 8.691 8.422 8.422 0 01-8.739-8.691 8.421 8.421 0 018.739-8.691 8.422 8.422 0 018.74 8.691zm-15.261 0a6.347 6.347 0 006.521 6.654 6.347 6.347 0 006.521-6.654 6.347 6.347 0 00-6.521-6.654 6.347 6.347 0 00-6.521 6.654zM53.729 29.581h-1.917l-10.2-13.26-.012 13.248h-2.122V12.681h1.917l10.21 13.26V12.693h2.122zM69.551 16.02a8.835 8.835 0 00-5-1.555c-2.471 0-4.231 1.109-4.231 2.929 0 1.531 1.29 2.315 3.821 2.628l1.484.181c2.856.35 5.3 1.507 5.3 4.484 0 3.364-3.05 5.123-6.7 5.123a10.935 10.935 0 01-6.654-2.194l1.157-1.687a9.018 9.018 0 005.5 1.868c2.519 0 4.5-1.025 4.5-2.929 0-1.567-1.41-2.314-4.038-2.64l-1.567-.193c-2.784-.337-5-1.627-5-4.508 0-3.255 2.893-5.075 6.449-5.075a10.336 10.336 0 016.076 1.844zM91.268 21.131a8.422 8.422 0 01-8.74 8.691 8.422 8.422 0 01-8.739-8.691 8.421 8.421 0 018.739-8.691 8.422 8.422 0 018.74 8.691zm-15.261 0a6.348 6.348 0 006.521 6.654 6.347 6.347 0 006.521-6.654 6.347 6.347 0 00-6.521-6.654 6.348 6.348 0 00-6.521 6.654zM106.897 29.569h-11.79V12.693h2.122v14.863h9.668zM121.76 29.569h-11.982V12.693h11.862v1.988h-9.74v5.389h9.427v2H111.9v5.509h9.86zM14.9.167h2.576v7.547H14.9zM11.801.238l-5.23 3.194a.229.229 0 01-.242 0L1.099.238a.726.726 0 00-.374-.1H.719a.717.717 0 00-.717.717v6.864h2.574V4.462a.258.258 0 01.392-.22l2.931 1.793a.919.919 0 00.944.009L9.935 4.23a.258.258 0 01.388.222v3.267h2.575V.855a.717.717 0 00-.717-.717h-.006a.723.723 0 00-.374.1zM30.348.165h-2.613v3.463a.258.258 0 01-.379.228L20.585.249a.723.723 0 00-.337-.084.717.717 0 00-.717.717v6.832h2.592V4.306a.258.258 0 01.379-.227l6.8 3.606a.714.714 0 00.336.083.716.716 0 00.717-.717V.165zM32.439 7.712V.165h1.2v7.547zM40.536 7.878c-3.189 0-5.451-1.513-5.451-3.939S37.361 0 40.536 0s5.466 1.513 5.466 3.939-2.236 3.939-5.466 3.939zm0-6.87c-2.371 0-4.2 1.036-4.2 2.931s1.826 2.93 4.2 2.93 4.212-1.022 4.212-2.93-1.84-2.931-4.212-2.931z"
-    //   />
-    // </svg>
-    <div style={{display: "flex"}}>
-      <img
-          width="35"
-        height="35"
-          src={tsIcon}
-          alt={"preview"}
-        />
-        <div style={{color: "#ffffff", fontSize: "25px",marginLeft:"5px"}} >土星云</div>
+    <div style={{ display: "flex" }}>
+      <LoginMinIOLogo style={{ width: 35, height: 35 }} />
+      <div style={{ color: "#ffffff", fontSize: "25px", marginLeft: "5px" }}>
+        土星云
       </div>
+    </div>
   );
 };
 

src/icons/LoginMinIOLogo.tsx

@@ -16,33 +16,20 @@
 
 import * as React from "react";
 import { SVGProps } from "react";
-import tsIcon from '../icons/tuxingyunlogo.png';
+import tsIcon from "../icons/tuxingyunlogo.png";
 
 const LoginMinIOLogo = (props: SVGProps<SVGSVGElement>) => (
-  // <svg
-  //   xmlns="http://www.w3.org/2000/svg"
-  //   width="284.616"
-  //   height="49.568"
-  //   viewBox="0 0 284.616 49.568"
-  //   className={"min-icon"}
-  //   fill={"currentcolor"}
-  //   {...props}
-  // >
-  //   <g transform="translate(0.5 0.5)">
-  //     <path
-  //       d="M10822.423,3589.089c0-14.873,14.033-24.285,33.612-24.285s33.7,9.328,33.7,24.285-13.782,24.282-33.7,24.282C10836.374,3613.371,10822.423,3604.046,10822.423,3589.089Zm7.731,0c0,11.763,11.263,18.065,25.881,18.065s25.966-6.3,25.966-18.065c0-11.681-11.345-18.068-25.966-18.068S10830.154,3577.408,10830.154,3589.089Zm-43.43,23.094-41.918-22.23a1.586,1.586,0,0,0-2.329,1.4v21.011H10726.5v-42.123a4.421,4.421,0,0,1,4.42-4.422h.029a4.4,4.4,0,0,1,2.077.519l41.752,22.233a1.587,1.587,0,0,0,2.334-1.4v-21.35h16.11v42.454a4.42,4.42,0,0,1-6.493,3.905Zm-88.75.186v-46.534h15.884v46.534Zm-28.218,0v-20.147a1.588,1.588,0,0,0-2.392-1.367l-19.068,11.186a5.668,5.668,0,0,1-5.818-.055l-18.07-11.057a1.589,1.589,0,0,0-2.416,1.355v20.084h-15.876v-42.323a4.423,4.423,0,0,1,4.423-4.422h.038a4.453,4.453,0,0,1,2.3.648l32.246,19.694a1.429,1.429,0,0,0,1.5,0l32.243-19.694a4.453,4.453,0,0,1,2.3-.648h.041a4.421,4.421,0,0,1,4.42,4.422v42.323Zm136.353-.011v-46.534h7.39v46.534Z"
-  //       transform="translate(-10606.116 -3564.803)"
-  //       stroke="rgba(0,0,0,0)"
-  //       strokeWidth="1"
-  //     />
-  //   </g>
-  // </svg>
-  <img
-          width="150"
-        height="150"
-          src={tsIcon}
-          alt={"preview"}
-        />
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="150"
+    height="150"
+    viewBox="0 0 150 150"
+    className={"min-icon"}
+    fill={"currentcolor"}
+    {...props}
+  >
+    <image style={{ width: "100%" }} xlinkHref={tsIcon}></image>
+  </svg>
 );
 
 export default LoginMinIOLogo;