Commit b6d55d35 authored by Peidong Xie's avatar Peidong Xie 💬
Browse files

小幅度重构

新增
. 增加 NJU-GitLab 地址
. 控制台加入彩色日志

修复
. 修复文档搜索使用的雨雀 API 弃用的问题
. 修复文档搜索 encode 不完全的问题

更新
. 更新预约系统链接
. 更新版权声明时间

优化
. 升级 Jekyll 版本号
. 升级 RubyGems 配置文件
. 统一全局 jQUery 并使用 CDN
. 用事件监听取代事件回调
. 用 key/code 取代 keyCode
. 用静态查找元素取代动态查找元素
. 引入 sass
. 补充 .gitignore
. 完善说明文档
. 格式化代码
. 去掉过时文件
parent 352c49a4
_site/
.sass-cache/
_site
.sass-cache
.jekyll-cache
.jekyll-metadata
Gemfile.lock
*.gem
*.swp
# node
node_modules/
package-lock.json
\ No newline at end of file
package-lock.json
source "https://gems.ruby-china.com"
gemspec
source 'https://gems.ruby-china.com'
gem 'jekyll', '~> 4.2'
group :jekyll_plugins do
gem 'jekyll-timeago', '~> 0.14'
end
# 南京大学 IT 侠
# 南京大学 IT 侠网站主页
系统 [Jekyll](jekyllrb.com/docs/quickstart/)
主题 [forty](https://github.com/andrewbanchich/forty-jekyll-theme)
- 框架: [Jekyll](https://jekyllrb.com/docs/)
- 主题: [Forty](https://github.com/andrewbanchich/forty-jekyll-theme)
*建议使用 Git 远程更新,不要直接在网站上更改*
## 项目地址
## 本地测试
- NJU-GitLab: [https://git.nju.edu.cn/nju-itxia/home](https://git.nju.edu.cn/nju-itxia/home)
- GitHub: [https://github.com/NJU-itxia/home](https://github.com/NJU-itxia/home)
*要求安装 ruby 与 ruby-gem *
> 推荐从 NJU-GitLab 克隆仓库;建议使用 Git 远程更新,不要直接在网站上更改
``` sh
git clone https://github.com/NJU-itxia/home.git
cd home
gem install bundler #太慢记得换源
bundle install
bundle exec jekyll server #本地运行
bundle exec jekyll #查看其他命令
## 本地启动
推荐使用 Docker 启动
### Docker
```sh
docker run --rm -it -p="4000:4000" -v="$PWD:/srv/jekyll" jekyll/jekyll jekyll serve
```
> 需要安装 Docker
### Ruby
```sh
gem install jekyll jekyll-timeago bundler
bundle exec jekyll serve
```
如果要在docker运行,需按照以上配置镜像,为减少麻烦可以用:
> 需要安装 Ruby 与 RubyGems
## 本地开发
### 新增页面
- 新建 Markdown 文件
- 增加头部说明,如下
```
docker run [各种参数] [镜像名] bundle exec jekyll server -H 0.0.0.0
---
layout: post
title: YOUR-TITLE
image: YOUR-IMAGE
---
```
做好端口映射后便可外部访问
- 增添后续内容
- 如需将链接加入首页模块,编辑`./_data/index_url.yml`并同步修改`./_config.yml`内的`tiles-count`一项数字
### 更新数据
更新内容常包括主席团更替、捐赠公示和资金去向等等
> 具体请直接参考`./_data`下的 .yml 文件,以及`./assets/images`下的图片
> 格式很简单,请务必注意缩进
## 目录结构
``` sh
```sh
.
├── _config.yml # 配置文件
├── _data
│   ├── budget_list.yml # 资金去向公示
│   ├── donation_list.yml # 捐赠列表
│   ├── index_url.yml # 首页模块
│   ├── president_xianlin.yml # 仙林主席
│   └── president.yml # 鼓楼主席
├── _includes
│   ├── footer.html # 底部导航栏
│   ├── head.html # 样式与脚本
│   ├── header.html # 顶部导航栏
│   └── tiles.html
├── _sass
├── _site # 构建产物
├── appointment # 预约系统(废弃)
├── assets
│   ├── css
│   ├── fonts
│   ├── images # 图片存放位置
│   └── js
├── index.md # 主页
├── introduction.md # 介绍页面
├── donation.md # 捐赠页面
├── recruiment.md # 招新页面
├── service.md # 服务页面
├── document.md # 共享文档
├── coroperation.md # 合作页面(未发布)
├── board_games.md # 桌游目录页面
├── _data # 数据存储
│   ├── budget_list.yml # 资金去向公示
│   ├── donation_list.yml # 捐赠列表
│   ├── index_url.yml # 首页模块
│   ├── president.yml # 鼓楼主席
│   └── president_xianlin.yml # 仙林主席
├── guide
│   └── markdown # Markdown 教程
├── _includes
│   ├── footer.html # 底部导航栏文件(联系我们、友情链接等)
│   ├── head.html
│   ├── header.html # 导航栏
│   └── tiles.html
├── tools
│   └── mdcvt # 公众号工具
├── _config.yml
├── .gitignore
├── .gitlab-ci.yml
├── bonus.html # 蓝屏彩蛋
├── bsod.html # 蓝屏彩蛋
├── CNAME
├── favicon.ico # 图标
├── LICENSE.md
├── README.md
├── favicon.ico
├── ...
└── _site # 静态文件存放位置
```
## 使用
### 增加页面或者更新
- 新建 `page.md`
- 增加头文件
```
---
title: YOUR-TITLE
layout: post
image:
---
├── index.md # 主页
├── service.md # 预约页面
├── recruiment.md # 招新页面
├── document.md # 教程页面
├── warranty.md # 维权指引页面
├── donation.md # 捐赠页面
├── introduction.md # 关于页面
├── board_games.md # 桌游目录页面
```
- 在头文件后增添内容
- 如需将链接加入首页模块,请编辑 `./_data/index_url.yml`
- 注意`./_config.yml`内的`tiles-count`一项数字对应于主页的模块数,需要同步修改。
### 更新介绍与捐赠页面
介绍页面涉及到主席团的更替,捐赠页面也需要实时更新。
具体请直接参考`./_data`下的 .yml 文件。
> 格式很简单,请务必注意缩进
# Site settings
# site settings
title: NJU-ITXIA
subtitle:
# subtitle:
email: njuitxia@outlook.com
description: 侠之大者为国为民 侠之小者为友为邻
baseurl: "" # the subpath of your site, e.g. /blog
url: "https://itxia.club" # the base hostname & protocol for your site
author:
# street_address: 仙林/鼓楼
# city:
# state:
# zip_code: 55555
# country: United States of America
# phone: (716) 555-5555
url: https://itxia.club # the base hostname & protocol for your site
# author:
# street_address:
# city:
# state:
# zip_code:
# country:
# phone:
# Homepage tiles
# homepage tiles
tiles-source: pages # accepts "posts" or "pages"
tiles-count: 6
# Social settings
help_url: https://itxia.site
weixin_url: assets/images/weixin.jpg
bbs_url: http://bbs.nju.edu.cn/bbsdoc?board=NoteBook
facebook_url:
github_url: https://github.com/NJU-itxia/
blog_url: https://itxia.github.io/
# gitlab_url: https://gitlab.com/u/andrewbanchich
# googleplus_url: https://plus.google.com/u/0/+AndrewBanchich
# instagram_url: https://instagram.com
# linkedin_url: https://www.linkedin.com/in/andrew-banchich-a4ba1195
pinterest_url:
slack_url:
# twitter_url: https://twitter.com/andrewbanchich
# social settings (key must match name of font awesome icon)
# see https://fontawesome.com/icons?d=gallery&p=2&s=brands
# Icons are not shown if value is empty
# You need to restart jekyll for changes to have an effect
socials:
BBS: http://bbs.nju.edu.cn/bbsdoc?board=NoteBook
Blog: https://itxia.github.io/
CRM: https://nju-itxia.mikecrm.com/
Gallery: https://nju-itxia.github.io/gallery/
GitHub: https://github.com/nju-itxia/
GitLab: https://git.nju.edu.cn/nju-itxia/
Help: https://itxia.site/
HelpNew: https://nju.itxia.cn/
WeChat: assets/images/weixin.jpg
# Google-Plus:
# Instagram:
# LinkedIn:
# Twitter:
# Facebook:
# Slack:
# Build settings
# build settings
markdown: kramdown
sass:
style: compressed
exclude:
- "*.gemspec"
- LICENSE.md
- CONTRIBUTING.md
- README.md
......@@ -85,4 +85,3 @@
- detail: 仙林-抽纸,垃圾袋,硅脂
date: 2019.10.18
fee: 254.60
\ No newline at end of file
......@@ -22,4 +22,3 @@
image: intro.jpg
description:
url: introduction
......@@ -2,22 +2,18 @@
time: 2015.09 - 2016.09
college: 工程管理学院
img: masa.jpg
- name: 张荣杰
time: 2016.09 - 2017.06
college: 工程管理学院
img: rongjie.jpg
- name: 杨凡
time: 2017.07 - 2018.06
college: 地理科学与工程学院
img: yangfan.jpg
- name: 谢沛东
time: 2018.07 - 2019.06
college: 软件学院
img: xiepeidong.jpg
- name: 范如铭
time: 2019.07 至今
college: 匡亚明学院
......
---
layout: page
title: Elements
---
<!-- Main -->
<div id="main" class="alt">
<!-- One -->
<section id="one">
<div class="inner">
<header class="major">
<h1>Elements</h1>
</header>
<!-- Content -->
<h2 id="content">Sample Content</h2>
<p>Praesent ac adipiscing ullamcorper semper ut amet ac risus. Lorem sapien ut odio odio nunc. Ac adipiscing nibh porttitor erat risus justo adipiscing adipiscing amet placerat accumsan. Vis. Faucibus odio magna tempus adipiscing a non. In mi primis arcu ut non accumsan vivamus ac blandit adipiscing adipiscing arcu metus praesent turpis eu ac lacinia nunc ac commodo gravida adipiscing eget accumsan ac nunc adipiscing adipiscing.</p>
<div class="row">
<div class="6u 12u$(small)">
<h3>Sem turpis amet semper</h3>
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat commodo eu sed ante lacinia. Sapien a lorem in integer ornare praesent commodo adipiscing arcu in massa commodo lorem accumsan at odio massa ac ac. Semper adipiscing varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
</div>
<div class="6u$ 12u$(small)">
<h3>Magna odio tempus commodo</h3>
<p>In arcu accumsan arcu adipiscing accumsan orci ac. Felis id enim aliquet. Accumsan ac integer lobortis commodo ornare aliquet accumsan erat tempus amet porttitor. Ante commodo blandit adipiscing integer semper orci eget. Faucibus commodo adipiscing mi eu nullam accumsan morbi arcu ornare odio mi adipiscing nascetur lacus ac interdum morbi accumsan vis mi accumsan ac praesent.</p>
</div>
<!-- Break -->
<div class="4u 12u$(medium)">
<h3>Interdum sapien gravida</h3>
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
</div>
<div class="4u 12u$(medium)">
<h3>Faucibus consequat lorem</h3>
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
</div>
<div class="4u$ 12u$(medium)">
<h3>Accumsan montes viverra</h3>
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
</div>
</div>
<hr class="major" />
<!-- Elements -->
<h2 id="elements">Elements</h2>
<div class="row 200%">
<div class="6u 12u$(medium)">
<!-- Text stuff -->
<h3>Text</h3>
<p>This is <b>bold</b> and this is <strong>strong</strong>. This is <i>italic</i> and this is <em>emphasized</em>.
This is <sup>superscript</sup> text and this is <sub>subscript</sub> text.
This is <u>underlined</u> and this is code: <code>for (;;) { ... }</code>.
Finally, this is a <a href="#">link</a>.</p>
<hr />
<h2>Heading Level 2</h2>
<h3>Heading Level 3</h3>
<h4>Heading Level 4</h4>
<hr />
<p>Nunc lacinia ante nunc ac lobortis. Interdum adipiscing gravida odio porttitor sem non mi integer non faucibus ornare mi ut ante amet placerat aliquet. Volutpat eu sed ante lacinia sapien lorem accumsan varius montes viverra nibh in adipiscing blandit tempus accumsan.</p>
<!-- Lists -->
<h3>Lists</h3>
<div class="row">
<div class="6u 12u$(small)">
<h4>Unordered</h4>
<ul>
<li>Dolor etiam magna etiam.</li>
<li>Sagittis lorem eleifend.</li>
<li>Felis dolore viverra.</li>
</ul>
<h4>Alternate</h4>
<ul class="alt">
<li>Dolor etiam magna etiam.</li>
<li>Sagittis lorem eleifend.</li>
<li>Felis feugiat viverra.</li>
</ul>
</div>
<div class="6u$ 12u$(small)">
<h4>Ordered</h4>
<ol>
<li>Dolor etiam magna etiam.</li>
<li>Etiam vel lorem sed viverra.</li>
<li>Felis dolore viverra.</li>
<li>Dolor etiam magna etiam.</li>
<li>Etiam vel lorem sed viverra.</li>
<li>Felis dolore viverra.</li>
</ol>
<h4>Icons</h4>
<ul class="icons">
<li><a href="#" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon fa-facebook"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon fa-instagram"><span class="label">Instagram</span></a></li>
<li><a href="#" class="icon fa-github"><span class="label">Github</span></a></li>
<li><a href="#" class="icon fa-dribbble"><span class="label">Dribbble</span></a></li>
<li><a href="#" class="icon fa-tumblr"><span class="label">Tumblr</span></a></li>
</ul>
<ul class="icons">
<li><a href="#" class="icon alt fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="#" class="icon alt fa-facebook"><span class="label">Facebook</span></a></li>
<li><a href="#" class="icon alt fa-instagram"><span class="label">Instagram</span></a></li>
</ul>
</div>
</div>
<h4>Definition</h4>
<dl>
<dt>Item1</dt>
<dd>
<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Lorem ipsum dolor.</p>
</dd>
<dt>Item2</dt>
<dd>
<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Lorem ipsum dolor.</p>
</dd>
<dt>Item3</dt>
<dd>
<p>Lorem ipsum dolor vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan eu faucibus. Integer ac pellentesque praesent. Lorem ipsum dolor.</p>
</dd>
</dl>
<h4>Actions</h4>
<ul class="actions">
<li><a href="#" class="button special">Default</a></li>
<li><a href="#" class="button">Default</a></li>
</ul>
<ul class="actions small">
<li><a href="#" class="button special small">Small</a></li>
<li><a href="#" class="button small">Small</a></li>
</ul>
<div class="row">
<div class="6u 12u$(small)">
<ul class="actions vertical">
<li><a href="#" class="button special">Default</a></li>
<li><a href="#" class="button">Default</a></li>
</ul>
</div>
<div class="6u$ 12u$(small)">
<ul class="actions vertical small">
<li><a href="#" class="button special small">Small</a></li>
<li><a href="#" class="button small">Small</a></li>
</ul>
</div>
<div class="6u 12u$(small)">
<ul class="actions vertical">
<li><a href="#" class="button special fit">Default</a></li>
<li><a href="#" class="button fit">Default</a></li>
</ul>
</div>
<div class="6u$ 12u$(small)">
<ul class="actions vertical small">
<li><a href="#" class="button special small fit">Small</a></li>
<li><a href="#" class="button small fit">Small</a></li>
</ul>
</div>
</div>
<!-- Blockquote -->
<h3>Blockquote</h3>
<blockquote>Fringilla nisl. Donec accumsan interdum nisi, quis tincidunt felis sagittis eget tempus euismod. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis iaculis volutpat ac adipiscing accumsan faucibus. Vestibulum ante ipsum primis in faucibus vestibulum. Blandit adipiscing eu felis.</blockquote>
<!-- Table -->
<h3>Table</h3>
<h4>Default</h4>
<div class="table-wrapper">
<table>
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item1</td>
<td>Ante turpis integer aliquet porttitor.</td>
<td>29.99</td>
</tr>
<tr>
<td>Item2</td>
<td>Vis ac commodo adipiscing arcu aliquet.</td>
<td>19.99</td>
</tr>
<tr>
<td>Item3</td>
<td> Morbi faucibus arcu accumsan lorem.</td>
<td>29.99</td>
</tr>
<tr>
<td>Item4</td>
<td>Vitae integer tempus condimentum.</td>
<td>19.99</td>
</tr>
<tr>
<td>Item5</td>
<td>Ante turpis integer aliquet porttitor.</td>
<td>29.99</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2"></td>
<td>100.00</td>
</tr>
</tfoot>
</table>
</div>
<h4>Alternate</h4>
<div class="table-wrapper">
<table class="alt">
<thead>
<tr>
<th>Name</th>
<th>Description</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>Item1</td>
<td>Ante turpis integer aliquet porttitor.</td>
<td>29.99</td>
</tr>
<tr>
<td>Item2</td>
<td>Vis ac commodo adipiscing arcu aliquet.</td>
<td>19.99</td>
</tr>
<tr>
<td>Item3</td>
<td> Morbi faucibus arcu accumsan lorem.</td>
<td>29.99</td>
</tr>
<tr>
<td>Item4</td>
<td>Vitae integer tempus condimentum.</td>
<td>19.99</td>
</tr>
<tr>
<td>Item5</td>
<td>Ante turpis integer aliquet porttitor.</td>
<td>29.99</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan="2"></td>
<td>100.00</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="6u$ 12u$(medium)">
<!-- Buttons -->
<h3>Buttons</h3>
<ul class="actions">
<li><a href="#" class="button special">Special</a></li>
<li><a href="#" class="button">Default</a></li>
</ul>
<ul class="actions">
<li><a href="#" class="button big">Big</a></li>
<li><a href="#" class="button">Default</a></li>
<li><a href="#" class="button small">Small</a></li>
</ul>
<ul class="actions">
<li><a href="#" class="button special big">Big</a></li>
<li><a href="#" class="button special">Default</a></li>
<li><a href="#" class="button special small">Small</a></li>
</ul>
<ul class="actions fit">
<li><a href="#" class="button special fit">Fit</a></li>
<li><a href="#" class="button fit">Fit</a></li>
</ul>
<ul class="actions fit small">
<li><a href="#" class="button special fit small">Fit + Small</a></li>
<li><a href="#" class="button fit small">Fit + Small</a></li>
</ul>
<ul class="actions">
<li><a href="#" class="button special icon fa-search">Icon</a></li>
<li><a href="#" class="button icon fa-download">Icon</a></li>
</ul>
<ul class="actions">
<li><span class="button special disabled">Special</span></li>
<li><span class="button disabled">Default</span></li>
</ul>
<!-- Form -->
<h3>Form</h3>
<form method="post" action="#">
<div class="row uniform">
<div class="6u 12u$(xsmall)">
<input type="text" name="demo-name" id="demo-name" value="" placeholder="Name" />
</div>
<div class="6u$ 12u$(xsmall)">
<input type="email" name="demo-email" id="demo-email" value="" placeholder="Email" />