refactor(frontend): 移除未使用的CSS和HTML文件

清理前端项目中未使用的CSS样式文件和HTML模板文件,包括notification.css、main.css、style.css和auth/index.html
This commit is contained in:
祀梦
2025-12-23 21:12:24 +08:00
parent e63ef0af0a
commit 001e496d16
6 changed files with 0 additions and 1803 deletions
-215
View File
@@ -1,215 +0,0 @@
/* 首页通用交互样式 */
/* 滚动时导航栏样式 */
.navbar-scrolled {
background-color: rgba(255, 255, 255, 0.95) !important;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(10px);
}
.navbar-scrolled .navbar-brand,
.navbar-scrolled .nav-link {
color: #333 !important;
}
.navbar-scrolled .navbar-toggler-icon {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(0, 0, 0, 0.7)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
/* 滚动动画效果 */
.feature-card, .hero-content {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.6s ease, transform 0.6s ease;
}
.feature-card.animate-in,
.hero-content.animate-in {
opacity: 1;
transform: translateY(0);
}
/* 返回顶部按钮 */
#backToTop {
position: fixed;
bottom: 30px;
right: 30px;
width: 50px;
height: 50px;
background-color: #4e73df;
color: white;
border: none;
border-radius: 50%;
cursor: pointer;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.2rem;
box-shadow: 0 4px 15px rgba(78, 115, 223, 0.3);
}
#backToTop:hover {
background-color: #2e59d9;
transform: translateY(-3px);
box-shadow: 0 6px 20px rgba(78, 115, 223, 0.4);
}
#backToTop.show {
opacity: 1;
visibility: visible;
}
/* 通知样式 */
.notification {
position: fixed;
top: 20px;
right: 20px;
padding: 15px 20px;
border-radius: 8px;
background-color: white;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
z-index: 9999;
opacity: 0;
transform: translateX(100%);
transition: opacity 0.3s ease, transform 0.3s ease;
max-width: 350px;
display: flex;
align-items: center;
}
.notification.show {
opacity: 1;
transform: translateX(0);
}
.notification-content {
display: flex;
align-items: center;
gap: 10px;
}
.notification i {
font-size: 1.2rem;
}
.notification-success {
border-left: 4px solid #1cc88a;
}
.notification-success i {
color: #1cc88a;
}
.notification-error {
border-left: 4px solid #e74a3b;
}
.notification-error i {
color: #e74a3b;
}
.notification-info {
border-left: 4px solid #36b9cc;
}
.notification-info i {
color: #36b9cc;
}
/* 移动端菜单优化 */
@media (max-width: 991.98px) {
.navbar-collapse {
background-color: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
margin-top: 10px;
}
.navbar-nav .nav-link {
padding: 10px 15px;
border-radius: 4px;
margin-bottom: 5px;
}
.navbar-nav .nav-link:hover {
background-color: #f8f9fc;
}
}
/* 平滑滚动优化 */
html {
scroll-behavior: smooth;
}
/* 当前页面高亮 */
.nav-link.active {
color: #4e73df !important;
font-weight: 600;
}
.nav-link.active::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 100%;
height: 2px;
background-color: #4e73df;
border-radius: 2px;
}
/* 按钮悬停效果增强 */
.btn {
transition: all 0.3s ease;
}
.btn:hover {
transform: translateY(-2px);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
/* 卡片悬停效果 */
.feature-card {
transition: all 0.3s ease;
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}
/* 加载动画 */
.loading-spinner {
display: inline-block;
width: 20px;
height: 20px;
border: 3px solid rgba(255, 255, 255, 0.3);
border-radius: 50%;
border-top-color: white;
animation: spin 1s ease-in-out infinite;
}
@keyframes spin {
to { transform: rotate(360deg); }
}
/* 响应式调整 */
@media (max-width: 768px) {
#backToTop {
bottom: 20px;
right: 20px;
width: 45px;
height: 45px;
}
.notification {
left: 20px;
right: 20px;
max-width: none;
}
}
-47
View File
@@ -1,47 +0,0 @@
/* 通知消息样式 */
.notification {
position: fixed;
top: 20px;
right: 20px;
padding: 15px 25px;
background: white;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
display: flex;
align-items: center;
z-index: 1000;
transform: translateX(120%);
transition: transform 0.3s ease;
border-left: 4px solid #4e73df;
max-width: 350px;
}
.notification.show {
transform: translateX(0);
}
.notification.success {
border-left-color: #2ecc71;
}
.notification.error {
border-left-color: #e74c3c;
}
.notification i {
margin-right: 10px;
font-size: 1.2em;
}
.notification.success i {
color: #2ecc71;
}
.notification.error i {
color: #e74c3c;
}
.notification-content {
font-size: 14px;
color: #333;
}
File diff suppressed because it is too large Load Diff
-213
View File
@@ -1,213 +0,0 @@
// 首页通用JavaScript功能
// 主è¦å¤„ç†å¯¼èˆªæ äº¤äº’ã€é¡µé¢æ»šåŠ¨æ•ˆæžœç­‰é€šç”¨åŠŸèƒ½
class MainPage {
constructor() {
this.init();
}
init() {
// åˆå§‹åŒ–所有功èƒ? this.initNavbar();
this.initScrollEffects();
this.initSmoothScroll();
this.initBackToTop();
this.initMobileMenu();
this.initAuthButtons();
}
// åˆå§‹åŒ–导航æ äº¤äº’
initNavbar() {
const navbar = document.querySelector('.navbar');
if (!navbar) return;
// 滚动时改å˜å¯¼èˆªæ æ ·å¼
window.addEventListener('scroll', () => {
if (window.scrollY > 50) {
navbar.classList.add('navbar-scrolled');
} else {
navbar.classList.remove('navbar-scrolled');
}
});
// åˆå§‹åŒ–当å‰é¡µé¢é«˜äº? this.highlightCurrentPage();
}
// 高亮当å‰é¡µé¢å¯¼èˆªé“¾æŽ¥
highlightCurrentPage() {
const currentPath = window.location.pathname;
const navLinks = document.querySelectorAll('.nav-link');
navLinks.forEach(link => {
const href = link.getAttribute('href');
if (href && currentPath.includes(href.replace('.html', ''))) {
link.classList.add('active');
}
});
}
// åˆå§‹åŒ–滚动效æž? initScrollEffects() {
// 滚动时显ç¤?éšè—元素
const observerOptions = {
root: null,
rootMargin: '0px',
threshold: 0.1
};
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('animate-in');
}
});
}, observerOptions);
// 观察需è¦åŠ¨ç”»çš„å…ƒç´ 
document.querySelectorAll('.feature-card, .hero-content').forEach(el => {
observer.observe(el);
});
}
// åˆå§‹åŒ–平滑滚åŠ? initSmoothScroll() {
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', (e) => {
e.preventDefault();
const targetId = anchor.getAttribute('href');
if (targetId === '#') return;
const targetElement = document.querySelector(targetId);
if (targetElement) {
targetElement.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});
}
// åˆå§‹åŒ–返回顶部按é’? initBackToTop() {
const backToTopBtn = document.createElement('button');
backToTopBtn.id = 'backToTop';
backToTopBtn.innerHTML = '<i class="fas fa-chevron-up"></i>';
backToTopBtn.title = '返回顶部';
document.body.appendChild(backToTopBtn);
// 滚动时显ç¤?éšè—按钮
window.addEventListener('scroll', () => {
if (window.scrollY > 300) {
backToTopBtn.classList.add('show');
} else {
backToTopBtn.classList.remove('show');
}
});
// 点击返回顶部
backToTopBtn.addEventListener('click', () => {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
});
}
// åˆå§‹åŒ–移动端èœå
initMobileMenu() {
const navbarToggler = document.querySelector('.navbar-toggler');
const navbarCollapse = document.querySelector('.navbar-collapse');
if (!navbarToggler || !navbarCollapse) return;
navbarToggler.addEventListener('click', () => {
navbarCollapse.classList.toggle('show');
});
// 点击èœå•项åŽè‡ªåŠ¨å…³é—­ç§»åŠ¨èœå
document.querySelectorAll('.navbar-nav .nav-link').forEach(link => {
link.addEventListener('click', () => {
if (navbarCollapse.classList.contains('show')) {
navbarCollapse.classList.remove('show');
}
});
});
}
// åˆå§‹åŒ–è®¤è¯æŒ‰é’®çжæ€? initAuthButtons() {
// 检查用户是å¦å·²ç™»å½•
this.checkLoginStatus().then(user => {
const loginBtn = document.getElementById('loginBtn');
const registerBtn = document.getElementById('registerBtn');
const heroLoginBtn = document.getElementById('heroLoginBtn');
if (user) {
// ç”¨æˆ·å·²ç™»å½•ï¼Œæ˜¾ç¤ºä»ªè¡¨æ¿æŒ‰é’? // æ ¹æ®ç”¨æˆ·è§’色设置正确的仪表æ¿è·¯å¾„
let dashboardUrl = '/dashboard';
if (user.role === 'student') {
dashboardUrl = '/student/dashboard';
} else if (user.role === 'teacher') {
dashboardUrl = '/teacher/dashboard';
} else if (user.role === 'admin') {
dashboardUrl = '/admin/dashboard';
}
if (loginBtn) {
loginBtn.textContent = '进入仪表æ?;
loginBtn.href = dashboardUrl;
}
if (heroLoginBtn) {
heroLoginBtn.textContent = 'è¿å¥ä»ªè¡¨æ?;
heroLoginBtn.href = dashboardUrl;
}
if (registerBtn) {
registerBtn.style.display = 'none';
}
}
});
}
// 检查登录状� async checkLoginStatus() {
try {
const apiBase = window.location.protocol === 'file:' ? 'http://localhost:3000/api' : '/api';
const response = await fetch(`${apiBase}/auth/me`);
const data = await response.json();
return data.success && data.user;
} catch (error) {
console.log('用户未登�);
return false;
}
}
// 显示通知
showNotification(message, type = 'info') {
// 创建通知元素
const notification = document.createElement('div');
notification.className = `notification notification-${type}`;
notification.innerHTML = `
<div class="notification-content">
<i class="fas ${type === 'success' ? 'fa-check-circle' : type === 'error' ? 'fa-exclamation-circle' : 'fa-info-circle'}"></i>
<span>${message}</span>
</div>
`;
// 添加到页é? document.body.appendChild(notification);
// 显示通知
setTimeout(() => {
notification.classList.add('show');
}, 10);
// 自动éšè—
setTimeout(() => {
notification.classList.remove('show');
setTimeout(() => {
if (notification.parentNode) {
notification.parentNode.removeChild(notification);
}
}, 300);
}, 3000);
}
}
// 页é¢åŠ è½½å®ŒæˆåŽåˆå§‹åŒ–
document.addEventListener('DOMContentLoaded', () => {
new MainPage();
});
-130
View File
@@ -1,130 +0,0 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>摮衣鞟貍蝞∠蝟餌</title>
<link rel="stylesheet" href="/public/css/style.css">
<link rel="stylesheet" href="/public/css/main.css">
</head>
<body>
<!-- 撖潸⏛?-->
<nav class="navbar">
<div class="navbar-brand">
<i class="fas fa-graduation-cap"></i>
<span>XX摮行嵗鞟貍蝞∠蝟餌</span>
</div>
<div class="navbar-menu">
<a href="/" class="btn btn-secondary">
<i class="fas fa-home"></i> 銝駁△
</a>
<div class="navbar-user">
<a href="/login" class="btn btn-primary" id="loginBtn">
<i class="fas fa-sign-in-alt"></i>
</a>
<a href="/register" class="btn btn-secondary" id="registerBtn">
<i class="fas fa-user-plus"></i> 瘜典
</a>
</div>
</div>
</nav>
<!-- 銝颱?-->
<main>
<!-- -->
<section class="hero-section">
<div class="hero-content">
<h1 class="hero-title">XX摮行嵗摮衣鞟貍蝞∠蝟餌</h1>
<p class="hero-subtitle">
擃䀹鞟貍蝞∠撟喳蝱嚗䔶蛹摮行嵗撣𣂷冽䲮雿滨鞟貍蝞∠滚𦛚嚗? 摰䂿緵鞟貍敶訫䰻霂U霈∪雿枏? </p>
<div class="cta-buttons">
<a href="/login" class="btn btn-primary" id="heroLoginBtn">
<i class="fas fa-sign-in-alt"></i> 蝡见朖
</a>
<a href="#features" class="btn btn-secondary">
<i class="fas fa-info-circle"></i>
</a>
</div>
</div>
</section>
<!-- 寡𠧧 -->
<section id="features" class="features-section">
<h2 class="section-title">蝟餌寡𠧧</h2>
<div class="features-grid">
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-user-graduate"></i>
</div>
<h3 class="feature-title">摮衣鞟貍亥砭</h3>
<p class="feature-description">
摮衣嗆䰻衤葵鈭箸蝏抬𡠺鞟貍靽⊥嚗? 鞟貍頞见飵脰扇敶閙䰻? </p>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-chalkboard-teacher"></i>
</div>
<h3 class="feature-title">鞟貍蝞∠</h3>
<p class="feature-description">
臭噶䰻霂W郎蝏抬蝏拍霈∪
𣂷憭𡁶唳旿撖澆枂? </p>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-user-shield"></i>
</div>
<h3 class="feature-title">蝞∠鞉綉?/h3>
<p class="feature-description">
蝞∠睃虾蝞∠韐行煺縑蝟餌蝏蠘恣亥”嚗? 霈曄蔭𣬚頂蝏笔蝖桐唳旿摰匧? </p>
</div>
<div class="feature-card">
<div class="feature-icon">
<i class="fas fa-chart-line"></i>
</div>
<h3 class="feature-title">蝏蠘恣</h3>
<p class="feature-description">
𣂷銝啣㦛銵函霈∪𡠺鞟貍笆瘥𥪜㦛銵函嚗? 撣桀𨭌摮行嵗餈𥡝坔郎霂蝑𡝗𣈲? </p>
</div>
</div>
</section>
<!--𢆡瑕𡢢 -->
<section class="cta-section">
<h2 class="cta-title">蝡见朖雿㯄鞟貍蝞∠</h2>
<p style="font-size: 1.2rem; color: #666; margin-bottom: 40px; max-width: 600px; margin-left: auto; margin-right: auto;">
XX摮行嵗鞟貍蝞∠蝟餌嚗䔶撉屸鞟貍蝞∠滚𦛚? </p>
<div class="cta-buttons">
<a href="/login" class="btn btn-primary">
<i class="fas fa-sign-in-alt"></i>憪衤蝙? </a>
<a href="#" class="btn btn-secondary">
<i class="fas fa-book"></i>
</a>
</div>
</section>
</main>
<!-- 憿菔 -->
<footer class="footer">
<div class="footer-content">
<h3 style="margin-bottom: 20px;">XX摮行嵗摮衣鞟貍蝞∠蝟餌</h3>
<p style="color: #ccc; margin-bottom: 20px; max-width: 600px; margin-left: auto; margin-right: auto;">
鈭𦒘蛹摮行嵗𣂷銝㮖𡝗蝏拍恣單䲮獢? </p>
<div class="footer-links">
<a href="#"><i class="fas fa-info-circle"></i> 睲賑</a>
<a href="#"><i class="fas fa-envelope"></i> 𠉛頂睲賑</a>
<a href="#"><i class="fas fa-shield-alt"></i> </a>
<a href="#"><i class="fas fa-file-contract"></i> 滚𦛚⊥狡</a>
</div>
<div class="copyright">
<p>穢 2023 XX摮行嵗摮衣鞟貍蝞∠蝟餌 ?/p>
<p>𠉛頂嚗?10-12345678 | 桃拳嚗䬙ontact@school.edu.cn</p>
</div>
</div>
</footer>
<script src="/public/js/main.js"></script>
</body>
</html>
-1
View File
@@ -1,5 +1,4 @@
@echo off @echo off
:: 使用简单的语法避免编码引起的解析错误
cd /d %~dp0 cd /d %~dp0
cd ..\backend cd ..\backend