# MeNav 资源目录

## 目录

- [目录概述](#目录概述)
- [资源列表](#资源列表)
- [资源使用说明](#资源使用说明)
- [添加新资源](#添加新资源)

## 目录概述

`assets` 目录包含 MeNav 项目所需的所有静态资源文件，包括样式表、图标、图片等。这些资源文件直接被复制到生成的站点中，用于网站的展示和功能实现。

## 资源列表

目录包含以下主要资源：

- **style.css**: 网站的主样式表文件
  - 定义了网站的整体样式、布局和主题
  - 包含响应式设计和动画效果的实现

- **menav.svg**: 网站图标和项目logo
  - 显示在浏览器标签页、书签和收藏夹中
  - 作为网站的标识符
  - SVG格式，包含黑色字母"M"和蓝色向上箭头设计

- **preview_light.png**: 明亮主题预览图
  - 用于README文档中展示网站明亮主题效果
  - 作为项目展示素材

- **preview_dark.png**: 暗黑主题预览图
  - 用于README文档中展示网站暗黑主题效果
  - 作为项目展示素材

## 资源使用说明

### 样式表

`style.css` 文件包含网站的所有样式定义，遵循以下组织结构：

- 基础样式 - 通用元素样式定义
- 布局样式 - 页面结构和布局定义
- 组件样式 - 特定UI组件的样式定义
- 响应式样式 - 适配不同设备屏幕的媒体查询
- 主题样式 - 明亮和暗黑主题的颜色方案

样式表支持主题切换功能，通过CSS变量实现不同主题下的颜色变换。

### 图标与图片

- 网站图标 (`menav.svg`) 自动应用于生成的网站
- 预览图片用于项目文档和宣传

## 添加新资源

向资源目录添加新文件时，请遵循以下指南：

1. **文件命名**:
   - 使用小写字母和连字符 (`-`)
   - 避免使用空格和特殊字符
   - 名称应清晰表达文件用途

2. **图片优化**:
   - 压缩图片以减小文件大小
   - 使用适合web的格式 (PNG, JPG, WebP)
   - 考虑添加合适的分辨率版本

3. **样式扩展**:
   - 新的样式应该添加到 `style.css` 的合适部分
   - 遵循现有的命名规范和组织结构
   - 确保添加响应式设计支持

添加新资源后，构建系统会自动将这些文件复制到生成的网站中。