优化服务提供logo

This commit is contained in:
2026-03-02 11:22:44 +08:00
parent 79c921f853
commit 8bdd92e83f
4 changed files with 460 additions and 144 deletions
+154 -5
View File
@@ -260,26 +260,175 @@ html:not([data-theme="dark"]) .hero-title-svg::before {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
text-align: center; text-align: center;
transition: all var(--duration-fast); transition: none;
text-decoration: none; text-decoration: none;
pointer-events: none;
cursor: default;
} }
.service-item:hover { .service-item:hover {
transform: translateY(-4px); transform: none;
box-shadow: none; box-shadow: none;
} }
.service-icon { .service-icon {
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
color: var(--color-primary); --svc-stroke: #2f3d4f;
--svc-muted: #5f7288;
--svc-accent: var(--color-primary);
--svc-soft: rgba(9, 105, 218, 0.12);
--svc-soft-strong: rgba(9, 105, 218, 0.2);
color: var(--svc-stroke);
} }
.service-icon svg { [data-theme="dark"] .service-icon {
--svc-stroke: #c4d1de;
--svc-muted: #93a4b7;
--svc-soft: rgba(88, 166, 255, 0.16);
--svc-soft-strong: rgba(88, 166, 255, 0.26);
}
.service-item.service-resources .service-icon {
--svc-accent: #2f7de1;
--svc-soft: rgba(47, 125, 225, 0.14);
--svc-soft-strong: rgba(47, 125, 225, 0.24);
}
.service-item.service-mirror .service-icon {
--svc-accent: #1f9d8d;
--svc-soft: rgba(31, 157, 141, 0.14);
--svc-soft-strong: rgba(31, 157, 141, 0.24);
}
.service-item.service-git .service-icon {
--svc-accent: #8b5cf6;
--svc-soft: rgba(139, 92, 246, 0.14);
--svc-soft-strong: rgba(139, 92, 246, 0.24);
}
.service-item.service-minecraft .service-icon {
--svc-accent: #2e9b45;
--svc-soft: rgba(46, 155, 69, 0.14);
--svc-soft-strong: rgba(46, 155, 69, 0.24);
}
.service-item.service-forum .service-icon {
--svc-accent: #d97706;
--svc-soft: rgba(217, 119, 6, 0.14);
--svc-soft-strong: rgba(217, 119, 6, 0.24);
}
.service-item.service-repair .service-icon {
--svc-accent: #d94f45;
--svc-soft: rgba(217, 79, 69, 0.14);
--svc-soft-strong: rgba(217, 79, 69, 0.24);
}
.service-item.service-workshop .service-icon {
--svc-accent: #c58a00;
--svc-soft: rgba(197, 138, 0, 0.14);
--svc-soft-strong: rgba(197, 138, 0, 0.24);
}
.service-item.service-campus .service-icon {
--svc-accent: #0f8fb8;
--svc-soft: rgba(15, 143, 184, 0.14);
--svc-soft-strong: rgba(15, 143, 184, 0.24);
}
[data-theme="dark"] .service-item.service-resources .service-icon {
--svc-accent: #7db5ff;
--svc-soft: rgba(125, 181, 255, 0.18);
--svc-soft-strong: rgba(125, 181, 255, 0.28);
}
[data-theme="dark"] .service-item.service-mirror .service-icon {
--svc-accent: #5edac7;
--svc-soft: rgba(94, 218, 199, 0.18);
--svc-soft-strong: rgba(94, 218, 199, 0.28);
}
[data-theme="dark"] .service-item.service-git .service-icon {
--svc-accent: #b9a0ff;
--svc-soft: rgba(185, 160, 255, 0.18);
--svc-soft-strong: rgba(185, 160, 255, 0.28);
}
[data-theme="dark"] .service-item.service-minecraft .service-icon {
--svc-accent: #6fda83;
--svc-soft: rgba(111, 218, 131, 0.18);
--svc-soft-strong: rgba(111, 218, 131, 0.28);
}
[data-theme="dark"] .service-item.service-forum .service-icon {
--svc-accent: #f5b04d;
--svc-soft: rgba(245, 176, 77, 0.18);
--svc-soft-strong: rgba(245, 176, 77, 0.28);
}
[data-theme="dark"] .service-item.service-repair .service-icon {
--svc-accent: #ff8a80;
--svc-soft: rgba(255, 138, 128, 0.18);
--svc-soft-strong: rgba(255, 138, 128, 0.28);
}
[data-theme="dark"] .service-item.service-workshop .service-icon {
--svc-accent: #ffd166;
--svc-soft: rgba(255, 209, 102, 0.18);
--svc-soft-strong: rgba(255, 209, 102, 0.28);
}
[data-theme="dark"] .service-item.service-campus .service-icon {
--svc-accent: #68d5ff;
--svc-soft: rgba(104, 213, 255, 0.18);
--svc-soft-strong: rgba(104, 213, 255, 0.28);
}
.service-icon .service-symbol {
width: 90px; width: 90px;
height: 90px; height: 90px;
display: block; display: block;
} }
.service-icon .svc-stroke,
.service-icon .svc-muted,
.service-icon .svc-accent {
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}
.service-icon .svc-stroke {
stroke: var(--svc-stroke);
stroke-width: 2.2;
}
.service-icon .svc-muted {
stroke: var(--svc-muted);
stroke-width: 2.05;
}
.service-icon .svc-accent {
stroke: var(--svc-accent);
stroke-width: 2.3;
}
.service-icon .svc-soft {
fill: var(--svc-soft);
}
.service-icon .svc-soft-strong {
fill: var(--svc-soft-strong);
}
.service-icon .svc-dot {
fill: var(--svc-accent);
}
.service-icon .svc-dot-muted {
fill: var(--svc-muted);
}
.service-item span { .service-item span {
font-weight: 600; font-weight: 600;
color: var(--text-primary); color: var(--text-primary);
@@ -347,7 +496,7 @@ html:not([data-theme="dark"]) .hero-title-svg::before {
margin-bottom: 0.75rem; margin-bottom: 0.75rem;
} }
.service-icon svg { .service-icon .service-symbol {
width: 64px; width: 64px;
height: 64px; height: 64px;
} }
+150 -3
View File
@@ -151,15 +151,162 @@
.service-icon { .service-icon {
margin-bottom: 14px; margin-bottom: 14px;
color: var(--color-primary); --svc-stroke: #2f3d4f;
--svc-muted: #5f7288;
--svc-accent: var(--color-primary);
--svc-soft: rgba(9, 105, 218, 0.12);
--svc-soft-strong: rgba(9, 105, 218, 0.2);
color: var(--svc-stroke);
} }
.service-icon svg { [data-theme="dark"] .service-icon {
--svc-stroke: #c4d1de;
--svc-muted: #93a4b7;
--svc-soft: rgba(88, 166, 255, 0.16);
--svc-soft-strong: rgba(88, 166, 255, 0.26);
}
.service-item.service-resources .service-icon {
--svc-accent: #2f7de1;
--svc-soft: rgba(47, 125, 225, 0.14);
--svc-soft-strong: rgba(47, 125, 225, 0.24);
}
.service-item.service-mirror .service-icon {
--svc-accent: #1f9d8d;
--svc-soft: rgba(31, 157, 141, 0.14);
--svc-soft-strong: rgba(31, 157, 141, 0.24);
}
.service-item.service-git .service-icon {
--svc-accent: #8b5cf6;
--svc-soft: rgba(139, 92, 246, 0.14);
--svc-soft-strong: rgba(139, 92, 246, 0.24);
}
.service-item.service-minecraft .service-icon {
--svc-accent: #2e9b45;
--svc-soft: rgba(46, 155, 69, 0.14);
--svc-soft-strong: rgba(46, 155, 69, 0.24);
}
.service-item.service-forum .service-icon {
--svc-accent: #d97706;
--svc-soft: rgba(217, 119, 6, 0.14);
--svc-soft-strong: rgba(217, 119, 6, 0.24);
}
.service-item.service-repair .service-icon {
--svc-accent: #d94f45;
--svc-soft: rgba(217, 79, 69, 0.14);
--svc-soft-strong: rgba(217, 79, 69, 0.24);
}
.service-item.service-workshop .service-icon {
--svc-accent: #c58a00;
--svc-soft: rgba(197, 138, 0, 0.14);
--svc-soft-strong: rgba(197, 138, 0, 0.24);
}
.service-item.service-campus .service-icon {
--svc-accent: #0f8fb8;
--svc-soft: rgba(15, 143, 184, 0.14);
--svc-soft-strong: rgba(15, 143, 184, 0.24);
}
[data-theme="dark"] .service-item.service-resources .service-icon {
--svc-accent: #7db5ff;
--svc-soft: rgba(125, 181, 255, 0.18);
--svc-soft-strong: rgba(125, 181, 255, 0.28);
}
[data-theme="dark"] .service-item.service-mirror .service-icon {
--svc-accent: #5edac7;
--svc-soft: rgba(94, 218, 199, 0.18);
--svc-soft-strong: rgba(94, 218, 199, 0.28);
}
[data-theme="dark"] .service-item.service-git .service-icon {
--svc-accent: #b9a0ff;
--svc-soft: rgba(185, 160, 255, 0.18);
--svc-soft-strong: rgba(185, 160, 255, 0.28);
}
[data-theme="dark"] .service-item.service-minecraft .service-icon {
--svc-accent: #6fda83;
--svc-soft: rgba(111, 218, 131, 0.18);
--svc-soft-strong: rgba(111, 218, 131, 0.28);
}
[data-theme="dark"] .service-item.service-forum .service-icon {
--svc-accent: #f5b04d;
--svc-soft: rgba(245, 176, 77, 0.18);
--svc-soft-strong: rgba(245, 176, 77, 0.28);
}
[data-theme="dark"] .service-item.service-repair .service-icon {
--svc-accent: #ff8a80;
--svc-soft: rgba(255, 138, 128, 0.18);
--svc-soft-strong: rgba(255, 138, 128, 0.28);
}
[data-theme="dark"] .service-item.service-workshop .service-icon {
--svc-accent: #ffd166;
--svc-soft: rgba(255, 209, 102, 0.18);
--svc-soft-strong: rgba(255, 209, 102, 0.28);
}
[data-theme="dark"] .service-item.service-campus .service-icon {
--svc-accent: #68d5ff;
--svc-soft: rgba(104, 213, 255, 0.18);
--svc-soft-strong: rgba(104, 213, 255, 0.28);
}
.service-icon .service-symbol {
width: 78px; width: 78px;
height: 78px; height: 78px;
display: block; display: block;
} }
.service-icon .svc-stroke,
.service-icon .svc-muted,
.service-icon .svc-accent {
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}
.service-icon .svc-stroke {
stroke: var(--svc-stroke);
stroke-width: 2.2;
}
.service-icon .svc-muted {
stroke: var(--svc-muted);
stroke-width: 2.05;
}
.service-icon .svc-accent {
stroke: var(--svc-accent);
stroke-width: 2.3;
}
.service-icon .svc-soft {
fill: var(--svc-soft);
}
.service-icon .svc-soft-strong {
fill: var(--svc-soft-strong);
}
.service-icon .svc-dot {
fill: var(--svc-accent);
}
.service-icon .svc-dot-muted {
fill: var(--svc-muted);
}
.service-item span { .service-item span {
display: block; display: block;
font-size: 1.08rem; font-size: 1.08rem;
@@ -353,7 +500,7 @@
margin-bottom: 8px; margin-bottom: 8px;
} }
.service-icon svg { .service-icon .service-symbol {
width: 58px; width: 58px;
height: 58px; height: 58px;
} }
+78 -68
View File
@@ -29,103 +29,113 @@
<div class="services-provided"> <div class="services-provided">
<h2 data-cn="@ 服务提供" data-en="@ Services"></h2> <h2 data-cn="@ 服务提供" data-en="@ Services"></h2>
<div class="services-grid-box"> <div class="services-grid-box">
<div class="service-item"> <div class="service-item service-resources">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M10 14L24 14L28 20H54C56.2091 20 58 21.7909 58 24V50C58 52.2091 56.2091 54 54 54H10C7.79086 54 6 52.2091 6 50V18C6 15.7909 7.79086 14 10 14Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M22 34H42" stroke="#64ffda"/> <path class="svc-stroke" d="M17 24h14l4 5h20a4 4 0 0 1 4 4v22a4 4 0 0 1-4 4H17a4 4 0 0 1-4-4V28a4 4 0 0 1 4-4z" />
<path d="M22 42H34" stroke="#64ffda"/> <rect class="svc-soft-strong" x="23" y="33" width="26" height="17" rx="2.6" />
<circle cx="48" cy="42" r="2" fill="#64ffda" stroke="none"/> <path class="svc-accent" d="M28 38h16M28 43h12M28 48h9" />
</svg> <path class="svc-muted" d="M51 35v13M51 48l3-3M51 48l-3-3" />
</svg>
</div> </div>
<span data-cn="资源站" data-en="Resources"></span> <span data-cn="资源站" data-en="Resources"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-mirror">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<circle cx="32" cy="32" r="24" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<circle cx="32" cy="32" r="8" stroke="#ccd6f6"/> <circle class="svc-stroke" cx="36" cy="36" r="17" />
<path d="M32 24V8" stroke="#64ffda"/> <path class="svc-muted" d="M19 36h34M36 19c5 4.7 7.8 10.5 7.8 17S41 48.3 36 53M36 19c-5 4.7-7.8 10.5-7.8 17S31 48.3 36 53" />
<path d="M32 40V56" stroke="#233554"/> <path class="svc-accent" d="M50 29l7 7-7 7" />
<path d="M49 32H56" stroke="#64ffda"/> <path class="svc-accent" d="M57 36H45" />
<path d="M8 32H15" stroke="#233554"/> <path class="svc-accent" d="M22 43l-7-7 7-7" />
<path d="M44 14C48 18 50 24 50 32" stroke="#64ffda" stroke-dasharray="4 4"/> <path class="svc-accent" d="M15 36h12" />
</svg> </svg>
</div> </div>
<span data-cn="校内镜像站" data-en="Mirror Site"></span> <span data-cn="校内镜像站" data-en="Mirror Site"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-git">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<line x1="16" y1="12" x2="16" y2="52" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<circle cx="16" cy="12" r="4" stroke="#ccd6f6"/> <rect class="svc-stroke" x="12" y="19" width="30" height="30" rx="4" />
<circle cx="16" cy="32" r="4" stroke="#ccd6f6"/> <path class="svc-muted" d="M17 27h20M17 33h14" />
<circle cx="16" cy="52" r="4" stroke="#ccd6f6"/> <circle class="svc-dot" cx="49" cy="24" r="3" />
<path d="M16 32C26 32 36 36 36 44V48" stroke="#64ffda"/> <circle class="svc-dot" cx="49" cy="37" r="3" />
<circle cx="36" cy="48" r="4" stroke="#64ffda"/> <circle class="svc-dot" cx="56" cy="47" r="3" />
</svg> <path class="svc-accent" d="M41 24h8" />
<path class="svc-accent" d="M49 24v13" />
<path class="svc-accent" d="M49 37c4 0 7 3 7 7" />
</svg>
</div> </div>
<span data-cn="代码托管" data-en="Git Hosting"></span> <span data-cn="代码托管" data-en="Git Hosting"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-minecraft">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M32 8L54 20V44L32 56L10 44V20L32 8Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M10 20L32 32L54 20" stroke="#ccd6f6"/> <path class="svc-stroke" d="M36 15l20 11v23L36 60 16 49V26l20-11z" />
<path d="M32 56V32" stroke="#ccd6f6"/> <path class="svc-muted" d="M16 26l20 11 20-11M36 60V37" />
<path d="M26 16L32 20L38 16" stroke="#64ffda"/> <path class="svc-accent" d="M20 23h32" />
<path d="M46 29L46 38" stroke="#64ffda"/> <rect class="svc-soft-strong" x="24" y="40" width="6" height="6" rx="1.2" />
</svg> <rect class="svc-soft-strong" x="34" y="43" width="5" height="5" rx="1.1" />
<rect class="svc-dot" x="43" y="39" width="6" height="6" rx="1.2" />
</svg>
</div> </div>
<span data-cn="Minecraft服务器" data-en="Minecraft Server"></span> <span data-cn="Minecraft服务器" data-en="Minecraft Server"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-forum">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M12 16H42V40H20L12 48V16Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M26 10H56V34H44L38 40V34H26V10Z" stroke="#64ffda"/> <path class="svc-stroke" d="M11 28a6 6 0 0 1 6-6h22a6 6 0 0 1 6 6v13a6 6 0 0 1-6 6H28l-8 7v-7h-3a6 6 0 0 1-6-6V28z" />
<line x1="32" y1="20" x2="50" y2="20" stroke="#64ffda"/> <path class="svc-accent" d="M36 19a6 6 0 0 1 6-6h13a6 6 0 0 1 6 6v9a6 6 0 0 1-6 6h-5l-4 4v-4h-4a6 6 0 0 1-6-6v-9z" />
<line x1="32" y1="26" x2="44" y2="26" stroke="#64ffda"/> <circle class="svc-dot" cx="24" cy="35" r="1.8" />
</svg> <circle class="svc-dot" cx="31" cy="35" r="1.8" />
<circle class="svc-dot" cx="46" cy="24" r="1.7" />
<circle class="svc-dot" cx="52" cy="24" r="1.7" />
</svg>
</div> </div>
<span data-cn="OUC论坛" data-en="OUC Forum"></span> <span data-cn="OUC论坛" data-en="OUC Forum"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-repair">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M46 14L50 18L26 42L22 38L46 14Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M22 38L14 46L18 50L26 42" stroke="#ccd6f6"/> <rect class="svc-stroke" x="11" y="18" width="37" height="25" rx="4" />
<path d="M14 46L10 54" stroke="#ccd6f6"/> <path class="svc-muted" d="M29.5 43v6M22 49h15" />
<path d="M45 28L36 19" stroke="#64ffda"/> <path class="svc-accent" d="M38 24.5a4.7 4.7 0 0 0-6.5 6.6l-7.2 7.2 3.4 3.4 7.2-7.2a4.7 4.7 0 0 0 6.6-6.5l-3 3-2.6-2.6 2.1-3z" />
<path d="M20 44L14 50" stroke="#233554"/> <path class="svc-accent" d="M50 19l10 10" />
<path d="M50 15C53 12 58 12 60 14C62 16 62 21 59 24L34 49C32 51 29 51 27 49L25 47C23 45 23 42 25 40L50 15Z" stroke="#64ffda"/> <circle class="svc-dot" cx="55" cy="24" r="2" />
</svg> </svg>
</div> </div>
<span data-cn="电脑维修" data-en="PC Repair"></span> <span data-cn="电脑维修" data-en="PC Repair"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-workshop">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<rect x="10" y="12" width="44" height="40" rx="4" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M10 24H54" stroke="#ccd6f6"/> <rect class="svc-stroke" x="12" y="17" width="48" height="36" rx="5" />
<path d="M20 6V16" stroke="#ccd6f6"/> <path class="svc-muted" d="M12 30h48M24 12v10M48 12v10" />
<path d="M44 6V16" stroke="#ccd6f6"/> <rect class="svc-soft-strong" x="24" y="36" width="24" height="13" rx="3" />
<circle cx="32" cy="38" r="6" stroke="#64ffda"/> <path class="svc-accent" d="M29 42l4 4 9-9" />
<path d="M32 38L36 34" stroke="#64ffda"/> <circle class="svc-dot" cx="22" cy="24" r="1.8" />
<circle cx="32" cy="38" r="2" fill="#64ffda" stroke="none"/> <circle class="svc-dot" cx="30" cy="24" r="1.8" />
</svg> </svg>
</div> </div>
<span data-cn="五八工坊预约" data-en="Workshop Booking"></span> <span data-cn="五八工坊预约" data-en="Workshop Booking"></span>
</div> </div>
<div class="service-item"> <div class="service-item service-campus">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M32 56C32 56 56 44 56 26C56 16 46 10 38 16C35 18 32 22 32 22C32 22 29 18 26 16C18 10 8 16 8 26C8 44 32 56 32 56Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M32 22V36" stroke="#64ffda"/> <path class="svc-stroke" d="M36 14l18 8v14c0 12-7 20-18 25-11-5-18-13-18-25V22l18-8z" />
<circle cx="32" cy="40" r="3" stroke="#64ffda"/> <path class="svc-muted" d="M36 24c-4.5 0-8 3.5-8 8 0 5.5 8 13 8 13s8-7.5 8-13c0-4.5-3.5-8-8-8z" />
<path d="M18 28H24L26 32" stroke="#233554"/> <circle class="svc-soft-strong" cx="36" cy="32" r="3.2" />
<path d="M46 28H40L38 32" stroke="#64ffda"/> <circle class="svc-soft-strong" cx="52" cy="22" r="5.2" />
</svg> <path class="svc-accent" d="M49.5 22H54.5M52 19.5v5" />
</svg>
</div> </div>
<span data-cn="OUC便民服务" data-en="OUC Services"></span> <span data-cn="OUC便民服务" data-en="OUC Services"></span>
</div> </div>
+78 -68
View File
@@ -25,110 +25,120 @@ get_header();
<div class="services-provided"> <div class="services-provided">
<h2 data-cn="# 服务提供" data-en="# Our Services"></h2> <h2 data-cn="# 服务提供" data-en="# Our Services"></h2>
<div class="services-grid-box"> <div class="services-grid-box">
<a href="#" class="service-item"> <a href="#" class="service-item service-resources">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M10 14L24 14L28 20H54C56.2091 20 58 21.7909 58 24V50C58 52.2091 56.2091 54 54 54H10C7.79086 54 6 52.2091 6 50V18C6 15.7909 7.79086 14 10 14Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M22 34H42" stroke="#64ffda"/> <path class="svc-stroke" d="M17 24h14l4 5h20a4 4 0 0 1 4 4v22a4 4 0 0 1-4 4H17a4 4 0 0 1-4-4V28a4 4 0 0 1 4-4z" />
<path d="M22 42H34" stroke="#64ffda"/> <rect class="svc-soft-strong" x="23" y="33" width="26" height="17" rx="2.6" />
<circle cx="48" cy="42" r="2" fill="#64ffda" stroke="none"/> <path class="svc-accent" d="M28 38h16M28 43h12M28 48h9" />
</svg> <path class="svc-muted" d="M51 35v13M51 48l3-3M51 48l-3-3" />
</svg>
</div> </div>
<span data-cn="资源站" data-en="Resources"></span> <span data-cn="资源站" data-en="Resources"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-mirror">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<circle cx="32" cy="32" r="24" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<circle cx="32" cy="32" r="8" stroke="#ccd6f6"/> <circle class="svc-stroke" cx="36" cy="36" r="17" />
<path d="M32 24V8" stroke="#64ffda"/> <path class="svc-muted" d="M19 36h34M36 19c5 4.7 7.8 10.5 7.8 17S41 48.3 36 53M36 19c-5 4.7-7.8 10.5-7.8 17S31 48.3 36 53" />
<path d="M32 40V56" stroke="#233554"/> <path class="svc-accent" d="M50 29l7 7-7 7" />
<path d="M49 32H56" stroke="#64ffda"/> <path class="svc-accent" d="M57 36H45" />
<path d="M8 32H15" stroke="#233554"/> <path class="svc-accent" d="M22 43l-7-7 7-7" />
<path d="M44 14C48 18 50 24 50 32" stroke="#64ffda" stroke-dasharray="4 4"/> <path class="svc-accent" d="M15 36h12" />
</svg> </svg>
</div> </div>
<span data-cn="校内镜像站" data-en="Mirror Site"></span> <span data-cn="校内镜像站" data-en="Mirror Site"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-git">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<line x1="16" y1="12" x2="16" y2="52" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<circle cx="16" cy="12" r="4" stroke="#ccd6f6"/> <rect class="svc-stroke" x="12" y="19" width="30" height="30" rx="4" />
<circle cx="16" cy="32" r="4" stroke="#ccd6f6"/> <path class="svc-muted" d="M17 27h20M17 33h14" />
<circle cx="16" cy="52" r="4" stroke="#ccd6f6"/> <circle class="svc-dot" cx="49" cy="24" r="3" />
<path d="M16 32C26 32 36 36 36 44V48" stroke="#64ffda"/> <circle class="svc-dot" cx="49" cy="37" r="3" />
<circle cx="36" cy="48" r="4" stroke="#64ffda"/> <circle class="svc-dot" cx="56" cy="47" r="3" />
</svg> <path class="svc-accent" d="M41 24h8" />
<path class="svc-accent" d="M49 24v13" />
<path class="svc-accent" d="M49 37c4 0 7 3 7 7" />
</svg>
</div> </div>
<span data-cn="代码托管" data-en="Git Hosting"></span> <span data-cn="代码托管" data-en="Git Hosting"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-minecraft">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M32 8L54 20V44L32 56L10 44V20L32 8Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M10 20L32 32L54 20" stroke="#ccd6f6"/> <path class="svc-stroke" d="M36 15l20 11v23L36 60 16 49V26l20-11z" />
<path d="M32 56V32" stroke="#ccd6f6"/> <path class="svc-muted" d="M16 26l20 11 20-11M36 60V37" />
<path d="M26 16L32 20L38 16" stroke="#64ffda"/> <path class="svc-accent" d="M20 23h32" />
<path d="M46 29L46 38" stroke="#64ffda"/> <rect class="svc-soft-strong" x="24" y="40" width="6" height="6" rx="1.2" />
</svg> <rect class="svc-soft-strong" x="34" y="43" width="5" height="5" rx="1.1" />
<rect class="svc-dot" x="43" y="39" width="6" height="6" rx="1.2" />
</svg>
</div> </div>
<span data-cn="Minecraft服务器" data-en="Minecraft Server"></span> <span data-cn="Minecraft服务器" data-en="Minecraft Server"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-forum">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M12 16H42V40H20L12 48V16Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M26 10H56V34H44L38 40V34H26V10Z" stroke="#64ffda"/> <path class="svc-stroke" d="M11 28a6 6 0 0 1 6-6h22a6 6 0 0 1 6 6v13a6 6 0 0 1-6 6H28l-8 7v-7h-3a6 6 0 0 1-6-6V28z" />
<line x1="32" y1="20" x2="50" y2="20" stroke="#64ffda"/> <path class="svc-accent" d="M36 19a6 6 0 0 1 6-6h13a6 6 0 0 1 6 6v9a6 6 0 0 1-6 6h-5l-4 4v-4h-4a6 6 0 0 1-6-6v-9z" />
<line x1="32" y1="26" x2="44" y2="26" stroke="#64ffda"/> <circle class="svc-dot" cx="24" cy="35" r="1.8" />
</svg> <circle class="svc-dot" cx="31" cy="35" r="1.8" />
<circle class="svc-dot" cx="46" cy="24" r="1.7" />
<circle class="svc-dot" cx="52" cy="24" r="1.7" />
</svg>
</div> </div>
<span data-cn="OUC论坛" data-en="OUC Forum"></span> <span data-cn="OUC论坛" data-en="OUC Forum"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-repair">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M46 14L50 18L26 42L22 38L46 14Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M22 38L14 46L18 50L26 42" stroke="#ccd6f6"/> <rect class="svc-stroke" x="11" y="18" width="37" height="25" rx="4" />
<path d="M14 46L10 54" stroke="#ccd6f6"/> <path class="svc-muted" d="M29.5 43v6M22 49h15" />
<path d="M45 28L36 19" stroke="#64ffda"/> <path class="svc-accent" d="M38 24.5a4.7 4.7 0 0 0-6.5 6.6l-7.2 7.2 3.4 3.4 7.2-7.2a4.7 4.7 0 0 0 6.6-6.5l-3 3-2.6-2.6 2.1-3z" />
<path d="M20 44L14 50" stroke="#233554"/> <path class="svc-accent" d="M50 19l10 10" />
<path d="M50 15C53 12 58 12 60 14C62 16 62 21 59 24L34 49C32 51 29 51 27 49L25 47C23 45 23 42 25 40L50 15Z" stroke="#64ffda"/> <circle class="svc-dot" cx="55" cy="24" r="2" />
</svg> </svg>
</div> </div>
<span data-cn="电脑维修" data-en="PC Repair"></span> <span data-cn="电脑维修" data-en="PC Repair"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-workshop">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<rect x="10" y="12" width="44" height="40" rx="4" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M10 24H54" stroke="#ccd6f6"/> <rect class="svc-stroke" x="12" y="17" width="48" height="36" rx="5" />
<path d="M20 6V16" stroke="#ccd6f6"/> <path class="svc-muted" d="M12 30h48M24 12v10M48 12v10" />
<path d="M44 6V16" stroke="#ccd6f6"/> <rect class="svc-soft-strong" x="24" y="36" width="24" height="13" rx="3" />
<circle cx="32" cy="38" r="6" stroke="#64ffda"/> <path class="svc-accent" d="M29 42l4 4 9-9" />
<path d="M32 38L36 34" stroke="#64ffda"/> <circle class="svc-dot" cx="22" cy="24" r="1.8" />
<circle cx="32" cy="38" r="2" fill="#64ffda" stroke="none"/> <circle class="svc-dot" cx="30" cy="24" r="1.8" />
</svg> </svg>
</div> </div>
<span data-cn="五八工坊预约" data-en="Workshop Booking"></span> <span data-cn="五八工坊预约" data-en="Workshop Booking"></span>
</a> </a>
<a href="#" class="service-item"> <a href="#" class="service-item service-campus">
<div class="service-icon"> <div class="service-icon">
<svg width="64" height="64" viewBox="0 0 64 64" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg class="service-symbol" viewBox="0 0 72 72" fill="none" aria-hidden="true">
<path d="M32 56C32 56 56 44 56 26C56 16 46 10 38 16C35 18 32 22 32 22C32 22 29 18 26 16C18 10 8 16 8 26C8 44 32 56 32 56Z" stroke="#ccd6f6"/> <circle class="svc-soft" cx="36" cy="36" r="24" />
<path d="M32 22V36" stroke="#64ffda"/> <path class="svc-stroke" d="M36 14l18 8v14c0 12-7 20-18 25-11-5-18-13-18-25V22l18-8z" />
<circle cx="32" cy="40" r="3" stroke="#64ffda"/> <path class="svc-muted" d="M36 24c-4.5 0-8 3.5-8 8 0 5.5 8 13 8 13s8-7.5 8-13c0-4.5-3.5-8-8-8z" />
<path d="M18 28H24L26 32" stroke="#233554"/> <circle class="svc-soft-strong" cx="36" cy="32" r="3.2" />
<path d="M46 28H40L38 32" stroke="#64ffda"/> <circle class="svc-soft-strong" cx="52" cy="22" r="5.2" />
</svg> <path class="svc-accent" d="M49.5 22H54.5M52 19.5v5" />
</svg>
</div> </div>
<span data-cn="OUC便民服务" data-en="OUC Services"></span> <span data-cn="OUC便民服务" data-en="OUC Services"></span>
</a> </a>