.header{ display: flex; backdrop-filter: blur(3.4000000953674316px); box-shadow: 1px 2px 5px 0 rgba(0, 102, 101, 0.25); border: 1px solid; border-image-source: linear-gradient(96.54deg, #FFFFFF -0.94%, rgba(255, 255, 255, 0) 25.28%, rgba(167, 229, 228, 0) 59.69%, #A7E5E4 79.76%); border-top-left-radius: 20px; background-color: #fff; } .logo{ position: relative; font-size: 20px; font-weight: 400; color: #fff; border-top-left-radius: 20px; display: flex; align-items: center; justify-content: center; height: 54px; width: 258px; } .logo::before{ position: absolute; display: block; content:''; top: -7px; left: -57px; width: 327px; height: 95px; background-image: url("@/assets/img/planImg1.png"); background-repeat: no-repeat; background-size: cover; border-top-left-radius: 20px; z-index: -1; } .menu{ :global(.ant-menu-title-content){ color: rgba(0, 102, 101, 1); font-size:16px; } :global(.parallelogram-container___Lxkxf){ height:30px; margin-top: 12px; } } .parallelogram-container { /* 平行四边形变换 */ transform: skewX(-45deg); //-webkit-transform: skewX(-15deg); /* 基础样式 */ display: inline-flex; align-items: center; padding: 0 34px; background-color: #e0f0f0; /* 浅蓝底色 */ //border: none; cursor: pointer; /* 文字样式重置(因为容器有倾斜,内部文字需要反向倾斜) */ font-size: 16px; color:#006665; border: 1px solid; border-image-slice:1; border-image-source: linear-gradient(96.05deg, #FFFFFF 9.52%, rgba(255, 255, 255, 0) 27.03%, rgba(0, 143, 142, 0) 60.86%, #0E5A4B 72.09%); } .text-content { /* 文字反向倾斜,保持正常显示 */ transform: skewX(45deg); //-webkit-transform: skewX(15deg); margin-right: 8px; } .addBtn{ background-size:cover; background-position:center; color:#fff; opacity:0.7; border-radius:4px; height: 36px; } .delBtn{ background-size:cover; background-position:center; color:#000; //opacity:0.7; border-radius:4px; width: 88px; height: 36px; } .exportBtn{ background-size:cover; background-position:center; color:#fff; opacity:0.7; border-radius:4px; width: 88px; height: 36px; } .resetBtn{ background-size:cover; background-position:center; color:#006665; //opacity:0.7; border-radius:4px; width: 88px; height: 36px; } .view{ background-color:#B7E5D533; margin-right:30px; border:none; } .paibanBg{ background-size: cover; background-position: center; width: 100%; height: 631px; } .tree{ background-color: #E7F2ED; :global(.ant-tree-switcher-leaf-line::after){ border-bottom:1px solid #006665; } :global(.ant-tree-switcher-leaf-line::before){ border-inline-end:1px solid #006665; } :global(.ant-tree-checkbox-inner){ border:1px solid #006665 !important; } :global(.ant-tree-indent-unit::before){ border-inline-end:none !important; } } .font1{ color: #999999; font-size: 14px; } .box{ display:flex; flex-wrap:wrap; margin:20px 0; } .tag{ margin-right:20px; margin-bottom: 10px; } .ul{ li{ margin-bottom: 10px; } } .customDrawer{ :global(.ant-drawer-header){ background-color:#B8E0D833 !important; } }