feat(header): add logo

components/layout/AppLayout.module.css

@@ -10,7 +10,7 @@
 
 .brand {
   display: flex;
-  width: 196px;
+  width: 190px;
   align-items: center;
   gap: 8px;
   color: #1d2129;

components/layout/AppLayout.tsx

@@ -278,10 +278,37 @@ export default function AppLayout({
               size="sm"
             />
             <Flex className={classes.headerNav}>
-              <Box className={classes.brand} visibleFrom="sm">
+              <Flex
-                <span className={classes.brandMark}>C</span>
+                align="center"
-                标注平台
+                gap={10}
-              </Box>
+                className={classes.brand}
+                visibleFrom="sm">
+                <Box
+                  component="img"
+                  src={`${process.env.NEXT_PUBLIC_BASE_PATH}/header.svg`}
+                  alt="酷哇标注平台"
+                  w={32}
+                  h={32}
+                  style={{
+                    flexShrink: 0,
+                    display: "block",
+                  }}
+                />
+                <Box
+                  component="span"
+                  style={{
+                    color: "#0B1E43",
+                    fontSize: "20px",
+                    lineHeight: "28px",
+                    letterSpacing: 0,
+                    fontWeight: 600,
+                    fontStyle: "normal",
+                    whiteSpace: "nowrap",
+                    fontFamily: '"PingFang SC", "Microsoft YaHei", sans-serif',
+                  }}>
+                  酷哇标注平台
+                </Box>
+              </Flex>
               <Space w={"1rem"} hiddenFrom="sm" />
               {headItems}
             </Flex>

public/header.svg

@@ -0,0 +1,26 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.72131 7.97323L7.77543 10.3299L16.0003 5.54456L24.2738 10.3582L28.3342 8.00521L16.0003 0.829102L3.72131 7.97323Z" fill="url(#paint0_linear_300_8367)"/>
+<path d="M13.8691 13.9176L16.0001 12.6777L18.1442 13.9252L21.9243 11.7157L16.0001 8.2689L10.0962 11.7039L13.8691 13.9176Z" fill="url(#paint1_linear_300_8367)"/>
+<path d="M25.2219 21.6404V12.0299L29.2742 9.68164V23.998L16.9482 31.1695V26.4541L25.2219 21.6404Z" fill="#1874FF"/>
+<path d="M19.0916 18.0737V15.6176L19.092 15.6323L22.8805 13.4055V20.2782L16.9482 23.7297V19.3208L19.0916 18.0737Z" fill="#1874FF"/>
+<path d="M15.0518 26.4536L6.77814 21.6399V11.9728L2.72583 9.61719V23.9975L15.0518 31.169V26.4536Z" fill="url(#paint2_linear_300_8367)"/>
+<path d="M9.11923 13.3376V20.2777L15.0518 23.7293V19.3205L12.9081 18.0732V15.55L9.11923 13.3376Z" fill="url(#paint3_linear_300_8367)"/>
+<defs>
+<linearGradient id="paint0_linear_300_8367" x1="14.104" y1="4.62169" x2="19.7265" y2="13.0418" gradientUnits="userSpaceOnUse">
+<stop stop-color="#06C3FF"/>
+<stop offset="1" stop-color="#0B60F3"/>
+</linearGradient>
+<linearGradient id="paint1_linear_300_8367" x1="14.104" y1="4.62169" x2="19.7265" y2="13.0418" gradientUnits="userSpaceOnUse">
+<stop stop-color="#06C3FF"/>
+<stop offset="1" stop-color="#0B60F3"/>
+</linearGradient>
+<linearGradient id="paint2_linear_300_8367" x1="10.311" y1="15.5246" x2="10.7851" y2="28.7987" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF8F90"/>
+<stop offset="1" stop-color="#F62F3F"/>
+</linearGradient>
+<linearGradient id="paint3_linear_300_8367" x1="10.311" y1="15.5246" x2="10.7851" y2="28.7987" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF8F90"/>
+<stop offset="1" stop-color="#F62F3F"/>
+</linearGradient>
+</defs>
+</svg>