Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

更新侧边栏 文章页加入标题 close #4

  • Loading branch information...
commit eb25d6749de6f7c1c1a3ae6315817686cf91eea3 1 parent 97358a3
TooBug authored
1  lib/plugins/buildArticles.js
View
@@ -34,6 +34,7 @@ var buildArticles = function(){
function _buildArticle(blog,articleCompileFunc,compileLocals){
compileLocals.title = blog.title;
+ compileLocals.pageTitle = compileLocals.title + ' - ' + compileLocals.blogName;
compileLocals.pubDate = moment(blog.date).format('YYYY-MM-DD HH:mm:ss');
compileLocals.content = markdown(blog.content);
fs.writeFileSync(articlePath + '/' + blog.url + '.html',articleCompileFunc(compileLocals));
1  lib/plugins/buildIndex.js
View
@@ -26,6 +26,7 @@ var buildIndex = function(){
pageCount = Math.ceil(global.blog.blogs.length / 5);
compileLocals.blogName = global.config.blogName;
+ compileLocals.pageTitle = compileLocals.blogName;
compileLocals.blogSubTitle = global.config.blogSubTitle;
compileLocals.blogKeywords = global.config.blogKeywords;
compileLocals.blogDescription = global.config.blogDescription;
1  lib/plugins/buildPages.js
View
@@ -35,6 +35,7 @@ var buildArticles = function(){
function _buildArticle(page,pageCompileFunc,compileLocals){
compileLocals.title = page.title;
+ compileLocals.pageTitle = compileLocals.title + ' - ' + compileLocals.blogName;
compileLocals.pubDate = moment(page.date).format('YYYY-MM-DD HH:mm:ss');
compileLocals.content = markdown(page.content);
fs.writeFileSync(pagePath + '/' + page.url + '.html',pageCompileFunc(compileLocals));
343 skin/css/light.css
View
@@ -1,181 +1,200 @@
* {
- margin: 0;
- padding: 0;
+ margin: 0;
+ padding: 0;
}
a {
- text-decoration: none;
- color: #888;
- -webkit-transition:color .5s;
+ text-decoration: none;
+ color: #888;
+ -webkit-transition:color .5s;
}
a:hover {
- color:#37B8FF;
+ color:#37B8FF;
}
ul {
- list-style: none;
+ list-style: none;
}
@font-face {
- font-family: "HUL";
- src: url("../fonts/HelveticaUltraLight.ttf") format("truetype");
- font-weight: normal;
- font-style: normal;
+ font-family: "HUL";
+ src: url("../fonts/HelveticaUltraLight.ttf") format("truetype");
+ font-weight: normal;
+ font-style: normal;
}
body {
- background: #F9F9F9;
- color: #888;
- min-width: 960px;
- margin: 0 100px;
+ background: #F9F9F9;
+ color: #888;
+ min-width: 960px;
+ margin: 0 100px;
}
header {
- font-family: "HUL", "microsoft yahei";
- padding: 20px 20px 10px 20px;
- box-shadow: 0 1px #37B8FF;
- /*border-bottom: 1px solid #dddddd;*/
+ font-family: "HUL", "microsoft yahei";
+ padding: 20px 20px 10px 20px;
+ box-shadow: 0 1px #37B8FF;
+ /*border-bottom: 1px solid #dddddd;*/
}
header #logo {
- font-size: 48px;
- text-shadow: 1px 1px #eee;
- display: inline-block;
+ font-size: 48px;
+ text-shadow: 1px 1px #eee;
+ display: inline-block;
}
header #logo .subTitle{
- font-size: 24px;
- padding-left: 30px;
+ font-size: 24px;
+ padding-left: 30px;
}
header nav {
- float: right;
- text-align: right;
- display: inline-block;
+ float: right;
+ text-align: right;
+ display: inline-block;
}
header nav ul {
- display: inline-block;
+ display: inline-block;
}
header nav ul li {
- display: inline-block;
- font-size: 30px;
- height: 50px;
- overflow: hidden;
+ display: inline-block;
+ font-size: 30px;
+ height: 50px;
+ overflow: hidden;
}
header nav ul li a {
- position: relative;
- width: 100px;
- line-height: 50px;
- display: block;
- text-align: center;
- -webkit-transition: color .5s;
- -webkit-transition: top .5s;
+ position: relative;
+ width: 100px;
+ line-height: 50px;
+ display: block;
+ text-align: center;
+ -webkit-transition: color .5s;
+ -webkit-transition: top .5s;
}
header nav ul li a:hover {
- top: -50px;
- /*text-shadow: 1px 1px 3px #ccc;*/
- color: #37B8FF;
+ top: -50px;
+ /*text-shadow: 1px 1px 3px #ccc;*/
+ color: #37B8FF;
}
#sidebar {
- float: left;
- width: 200px;
- padding: 20px;
- font-size: 14px;
- line-height: 1.5em;
- margin:25px 10px 0 0;
- background: #f0f0f0;
- text-shadow:1px 1px #e9e9e9;
- position:-webkit-sticky;
+ float: left;
+ width: 240px;
+ font-size: 14px;
+ line-height: 1.5em;
+ margin:25px 10px 0 0;
+ /*background: #f0f0f0;*/
+ text-shadow:1px 1px #e9e9e9;
+ position:-webkit-sticky;
+}
+#sidebar .sideTitle{
+ padding: 10px 20px;
+ background: #ddd;
+ color: #37B8FF;
+ font-size: 18px;
+}
+#sidebar .sideContent{
+ background: #f0f0f0;
+ padding: 20px;
}
#sidebar p {
- margin-bottom: 10px;
+ margin-bottom: 10px;
+}
+#sidebar p.avatar {
+ text-align: center;
+}
+#sidebar p.avatar img{
+ border:1px solid #ddd;
+ padding:1px;
+}
+#sidebar p a{
+ margin-right: 10px;
}
#content {
- margin-left: 250px;
- /*border-left: 1px solid #dddddd;*/
- color: #555;
- /*background: #fff;*/
- padding: 0 20px;
- margin-top: 25px;
+ margin-left: 250px;
+ /*border-left: 1px solid #dddddd;*/
+ color: #555;
+ /*background: #fff;*/
+ padding: 0 20px;
+ margin-top: 25px;
}
#content .indexarticle {
- margin-bottom: 30px;
- padding-bottom: 30px;
- border-bottom: 1px solid #dddddd;
+ margin-bottom: 30px;
+ padding-bottom: 30px;
+ border-bottom: 1px solid #dddddd;
}
#content #article {
- font-size: 14px;
- line-height: 2em;
- letter-spacing: 0.1em;
+ font-size: 14px;
+ line-height: 2em;
+ letter-spacing: 0.1em;
}
#content #article p {
- text-indent: 2.2em;
+ text-indent: 2.2em;
}
#content #article h1 {
- padding-left: 20px;
- border-left: 3px solid #37B8FF;
+ padding-left: 20px;
+ border-left: 3px solid #37B8FF;
}
#content #article h1 a:link {
- border: 0 none;
+ border: 0 none;
}
#content #article h1 .pubDate{
- float: right;
- font-size: 18px;
- line-height: 30px;
- color: #888;
+ float: right;
+ font-size: 18px;
+ line-height: 30px;
+ color: #888;
}
#content #article h3 {
- background: #CCC;
- margin: 20px 0;
- padding: 0 20px;
- border-left: 2px solid #490;
+ background: #CCC;
+ margin: 20px 0;
+ padding: 0 20px;
+ border-left: 2px solid #490;
}
#content #article .articlemore {
- text-align: right;
+ text-align: right;
}
#content #article .articlemore a:link {
- display: inline-block;
- padding: 5px 20px;
- border: 0 none;
- border-left: 2px solid #0099ff;
+ display: inline-block;
+ padding: 5px 20px;
+ border: 0 none;
+ border-left: 2px solid #0099ff;
}
#content #article .articlemore a:link:hover {
- color: #0099ff;
+ color: #0099ff;
}
#content #article #pagination {
- text-align: right;
+ text-align: right;
}
#content #article #pagination a {
- display: inline-block;
- padding: 5px 15px;
- border: 1px solid #dddddd;
+ display: inline-block;
+ padding: 5px 15px;
+ border: 1px solid #dddddd;
}
#content #article button,
#content #article input,
#content #article select,
#content #article textarea {
- font: 500 14px/1.8 'Hiragino Sans GB', sans-serif;
+ font: 500 14px/1.8 'Hiragino Sans GB', sans-serif;
}
#content #article table {
- border-collapse: collapse;
- border-spacing: 0;
+ border-collapse: collapse;
+ border-spacing: 0;
}
#content #article fieldset,
#content #article img {
- border: 0;
+ border: 0;
}
#content #article blockquote {
- margin: 1em 4em 1em 2em;
- padding: 0.6em 1em;
- background: #f1f1f1;
+ margin: 1em 4em 1em 2em;
+ padding: 0.6em 1em;
+ background: #f1f1f1;
}
#content #article blockquote blockquote {
- padding: 0 0 0 1em;
- margin-left: 2em;
- border-left: 0.4em solid #ddd;
+ padding: 0 0 0 1em;
+ margin-left: 2em;
+ border-left: 0.4em solid #ddd;
}
#content #article acronym,
#content #article abbr {
- border-bottom: 1px dotted;
- font-variant: normal;
+ border-bottom: 1px dotted;
+ font-variant: normal;
}
#content #article abbr {
- cursor: help;
+ cursor: help;
}
#content #article del {
- text-decoration: line-through;
+ text-decoration: line-through;
}
#content #article address,
#content #article caption,
@@ -185,86 +204,86 @@ header nav ul li a:hover {
#content #article em,
#content #article th,
#content #article var {
- font-style: normal;
- font-weight: 500;
+ font-style: normal;
+ font-weight: 500;
}
#content #article ul,
#content #article ol {
- list-style: none;
+ list-style: none;
}
#content #article caption,
#content #article th {
- text-align: left;
+ text-align: left;
}
#content #article q:before,
#content #article q:after {
- content: '';
+ content: '';
}
#content #article sub,
#content #article sup {
- font-size: 75%;
- line-height: 0;
- position: relative;
- vertical-align: text-top\9;
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: text-top\9;
}
#content #article :root sub,
#content #article :root sup {
- vertical-align: baseline;
- /* for ie9 and other mordern browsers */
+ vertical-align: baseline;
+ /* for ie9 and other mordern browsers */
}
#content #article sup {
- top: -0.5em;
+ top: -0.5em;
}
#content #article sub {
- bottom: -0.25em;
+ bottom: -0.25em;
}
#content #article a:hover {
- text-decoration: underline;
+ text-decoration: underline;
}
#content #article ins,
#content #article a {
- text-decoration: none;
+ text-decoration: none;
}
#content #article a:link {
- border-bottom: 1px dashed;
- padding-bottom: 3px;
+ border-bottom: 1px dashed;
+ padding-bottom: 3px;
}
#content #article a:hover {
- text-decoration: none;
- color: #0099ff;
+ text-decoration: none;
+ color: #0099ff;
}
#content #article u,
#content #article .typo-u {
- text-decoration: underline;
+ text-decoration: underline;
}
#content #article mark {
- background: #fffdd1;
+ background: #fffdd1;
}
#content #article pre,
#content #article code {
- font-family: "Courier New", Courier, monospace;
+ font-family: "Courier New", Courier, monospace;
}
#content #article pre {
- border: 1px solid #ddd;
- background: #000;
- padding: 10px;
- margin-left: 2.2em;
+ border: 1px solid #ddd;
+ background: #000;
+ padding: 10px;
+ margin-left: 2.2em;
}
#content #article small {
- font-size: 12px;
- color: #888;
+ font-size: 12px;
+ color: #888;
}
#content #article .clearfix:before,
#content #article .clearfix:after {
- content: "";
- display: table;
+ content: "";
+ display: table;
}
#content #article .clearfix:after {
- clear: both;
+ clear: both;
}
#content #article .clearfix {
- zoom: 1;
+ zoom: 1;
}
#content #article p,
#content #article pre,
@@ -274,7 +293,7 @@ header nav ul li a:hover {
#content #article form,
#content #article hr,
#content #article table {
- margin-bottom: 1em;
+ margin-bottom: 1em;
}
#content #article h1,
#content #article h2,
@@ -282,9 +301,9 @@ header nav ul li a:hover {
#content #article h4,
#content #article h5,
#content #article h6 {
- font-weight: 500;
- font-weight: 800\9;
- color: #333;
+ font-weight: 500;
+ font-weight: 800\9;
+ color: #333;
}
#content #article h1,
#content #article h2,
@@ -292,61 +311,61 @@ header nav ul li a:hover {
#content #article h4,
#content #article h5,
#content #article h6 {
- margin-bottom: 0.4em;
- line-height: 1.5;
+ margin-bottom: 0.4em;
+ line-height: 1.5;
}
#content #article h1 {
- font-size: 1.8em;
+ font-size: 1.8em;
}
#content #article h2 {
- font-size: 1.6em;
+ font-size: 1.6em;
}
#content #article h3 {
- font-size: 1.4em;
+ font-size: 1.4em;
}
#content #article h4 {
- font-size: 1.2em;
+ font-size: 1.2em;
}
#content #article h5,
#content #article h6 {
- font-size: 1em;
+ font-size: 1em;
}
#content #article ul {
- margin-left: 1.3em;
- list-style: disc;
- list-style-position: inside;
+ margin-left: 1.3em;
+ list-style: disc;
+ list-style-position: inside;
}
#content #article ol {
- list-style: decimal;
- list-style-position: inside;
- margin-left: 1.9em;
+ list-style: decimal;
+ list-style-position: inside;
+ margin-left: 1.9em;
}
#content #article li ul,
#content #article li ol {
- margin-top: 0;
- margin-bottom: 0;
- margin-left: 2em;
+ margin-top: 0;
+ margin-bottom: 0;
+ margin-left: 2em;
}
#content #article li ul {
- list-style: circle;
+ list-style: circle;
}
#content #article table th,
#content #article table td {
- border: 1px solid #ddd;
- padding: 5px 10px;
+ border: 1px solid #ddd;
+ padding: 5px 10px;
}
#content #article table th {
- background: #fbfbfb;
+ background: #fbfbfb;
}
#content #article table thead th {
- background: #f1f1f1;
+ background: #f1f1f1;
}
#content #article em {
- font-weight: 700;
+ font-weight: 700;
}
#foot {
- font-size: 12px;
- text-align: center;
- /*border-top: 1px solid #dddddd;*/
- padding: 50px 0 20px 0;
+ font-size: 12px;
+ text-align: center;
+ /*border-top: 1px solid #dddddd;*/
+ padding: 50px 0 20px 0;
}
4 skin/html/article.jade
View
@@ -13,7 +13,7 @@ html
| #{title}
em.pubDate #{pubDate}
| !{content}
+
+ include ./include/comments
-
- include ./include/comments
include ./include/footer
2  skin/html/include/head.jade
View
@@ -1,7 +1,7 @@
meta(charset="utf-8")
meta(name="description", content="#{blogDescription}")
meta(name="keywords", content="#{blogKeywords}")
-title #{blogName}
+title #{pageTitle}
link(type="image/x-icon", rel="shortcut icon", href="/favicon.ico")
link(rel="alternate", type="application/rss+xml", title="TooBug", href="/rss/rss.xml")
link(rel="stylesheet", href="/css/light.css")
16 skin/html/include/sidebar.jade
View
@@ -1,10 +1,14 @@
section#sidebar
- div#intro
+ div.sideTitle 作者简介
+ div#intro.sideContent
+ p.avatar
+ img(src="http://tp4.sinaimg.cn/2160639311/180/5633952458/1")
p
| <strong>TooBug</strong>,前端工程师,目前就职于<a href="http://cdc.tencent.com" target="_blank">腾讯CDC</a>。关注体验设计,关注大前端生态圈。
p
- | 新浪微博:<a href="http://weibo.com/toooobug" target="_blank">@TooBug</a>
- p
- | 腾讯微博:<a href="http://t.qq.com/TooBug" target="_blank">@TooBug</a>
- p
- | GitHub:<a href="https://github.com/TooooBug target="_blank">@TooBug</a>
+ a(href="http://weibo.com/toooobug",target="_blank")
+ img(src="http://www.sinaimg.cn/blog/developer/wiki/32x32.png")
+ a(href="http://t.qq.com/TooBug",target="_blank")
+ img(src="http://mat1.gtimg.com/app/opent/images/wiki/resource/weiboicon32.png")
+ a(href="https://github.com/TooooBug",target="_blank")
+ img(src="http://cdn-img.easyicon.cn/png/10981/1098194.gif")
3  skin/html/page.jade
View
@@ -13,5 +13,6 @@ html
em.pubDate #{pubDate}
| !{content}
- include ./include/comments
+ include ./include/comments
+
include ./include/footer
Please sign in to comment.
Something went wrong with that request. Please try again.