@@ -12,16 +12,19 @@ import { userCompanies, getIconSvg } from '../data/users';
1212 <div class =" marquee-content" >
1313 { userCompanies .map ((company ) => (
1414 <div class = " logo-item" title = { company .fullName } >
15- <svg viewBox = " 0 0 200 40" fill = " currentColor" class = " company-logo" set :html = { getIconSvg (company .iconType ) + ` <text x="45" y="26" font-size="12" font-weight="600">${company .name }</text> ` } />
15+ { company .customIcon && <><img src = { company .customIcon } alt = { company .fullName } /><span class = " company-name" >{ company .name } </span ></>}
16+ { ! company .customIcon && <svg viewBox = " 0 0 200 40" fill = " currentColor" class = " company-logo" set :html = { getIconSvg (company .iconType ) + ` <text x="45" y="26" font-size="12" font-weight="600">${company .name }</text> ` } />}
1617 </div >
1718 ))}
1819 </div >
19-
20+
2021 <!-- 复制一组实现无缝滚动 -->
2122 <div class =" marquee-content" aria-hidden =" true" >
2223 { userCompanies .map ((company ) => (
2324 <div class = " logo-item" title = { company .fullName } >
24- <svg viewBox = " 0 0 200 40" fill = " currentColor" class = " company-logo" set :html = { getIconSvg (company .iconType ) + ` <text x="45" y="26" font-size="12" font-weight="600">${company .name }</text> ` } />
25+ { company .customIcon && <><img src = { company .customIcon } alt = { company .fullName } /><span class = " company-name" >{ company .name } </span ></>}
26+
27+ { ! company .customIcon && <svg viewBox = " 0 0 200 40" fill = " currentColor" class = " company-logo" set :html = { getIconSvg (company .iconType ) + ` <text x="45" y="26" font-size="12" font-weight="600">${company .name }</text> ` } />}
2528 </div >
2629 ))}
2730 </div >
@@ -97,6 +100,9 @@ import { userCompanies, getIconSvg } from '../data/users';
97100 opacity: 0.6;
98101 transition: all 0.3s ease;
99102 cursor: default;
103+ display: flex;
104+ align-items: center;
105+ gap: 12px;
100106 }
101107
102108 .logo-item:hover {
@@ -122,6 +128,18 @@ import { userCompanies, getIconSvg } from '../data/users';
122128 object-fit: contain;
123129 }
124130
131+ .logo-item .company-name {
132+ font-size: 14px;
133+ font-weight: 500;
134+ color: var(--text-secondary);
135+ white-space: nowrap;
136+ transition: color 0.3s ease;
137+ }
138+
139+ .logo-item:hover .company-name {
140+ color: var(--text-primary);
141+ }
142+
125143 @keyframes marquee {
126144 0% {
127145 transform: translateX(0);
0 commit comments