Commit cce84b6f authored by Vanesssa's avatar Vanesssa

modified: src/main/webapp/js/page.js

	modified:   src/main/webapp/skins/finding/css/finding.css
	modified:   src/main/webapp/skins/yilia/article.ftl
	modified:   src/main/webapp/skins/yilia/css/yilia.css
	modified:   src/main/webapp/skins/yilia/footer.ftl
	deleted:    src/main/webapp/skins/yilia/images/header-bg.jpg
	deleted:    src/main/webapp/skins/yilia/images/next.jpg
	deleted:    src/main/webapp/skins/yilia/images/preview.jpg
	modified:   src/main/webapp/skins/yilia/js/yilia.js
	src/main/webapp/js/lib/highlight/
parent b1512991
This diff is collapsed.
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
* skin finding style * skin finding style
* *
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 1.0.0.0, Jun 4, 2015 * @version 1.0.1.0, Nov 2, 2015
*/ */
/* start reset */ /* start reset */
html { html {
...@@ -427,6 +427,7 @@ pre code, pre tt { ...@@ -427,6 +427,7 @@ pre code, pre tt {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
font-family: "Merriweather", "Microsoft Yahei", 'Helvetica'; font-family: "Merriweather", "Microsoft Yahei", 'Helvetica';
outline: none;
} }
.form button { .form button {
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<body> <body>
<#include "side.ftl"> <#include "side.ftl">
<main> <main>
<article class="post"> <article class="post article-body">
<header> <header>
<h2> <h2>
<a rel="bookmark" href="${servePath}${article.articlePermalink}"> <a rel="bookmark" href="${servePath}${article.articlePermalink}">
...@@ -49,7 +49,23 @@ ...@@ -49,7 +49,23 @@
${article.articleSign.signHTML} ${article.articleSign.signHTML}
</div> </div>
</#if> </#if>
<#if nextArticlePermalink?? || previousArticlePermalink??>
<aside class="fn-clear">
<#if previousArticlePermalink??>
<a class="fn-left" rel="prev" href="${servePath}${previousArticlePermalink}">
<strong>&lt;</strong> ${previousArticleTitle}
</a>
</#if>
<#if nextArticlePermalink??>
<a class="fn-right" rel="next" href="${servePath}${nextArticlePermalink}">
${nextArticleTitle} <strong>&gt;</strong>
</a>
</#if>
</aside>
</#if>
</section> </section>
<footer class="fn-clear share"> <footer class="fn-clear share">
<div class="fn-right"> <div class="fn-right">
<span class="icon icon-t-weibo" data-type="tencent"></span> <span class="icon icon-t-weibo" data-type="tencent"></span>
...@@ -59,30 +75,9 @@ ...@@ -59,30 +75,9 @@
</div> </div>
</footer> </footer>
</article> </article>
<@comments commentList=articleComments article=article></@comments> <@comments commentList=articleComments article=article></@comments>
<#if nextArticlePermalink?? || previousArticlePermalink??>
<aside class="read-next">
<#if nextArticlePermalink??>
<div class="read-next-story " style="background-image: url('${staticServePath}/skins/${skinDirName}/images/next.jpg')"
onclick="window.location = '${servePath}${nextArticlePermalink}'">
<section class="post">
<h2>${nextArticleTitle}</h2>
<p>${nextArticleAbstract}</p>
</section>
</div>
</#if>
<#if previousArticlePermalink??>
<div class="read-next-story prev " style="background-image: url('${staticServePath}/skins/${skinDirName}/images/preview.jpg')"
onclick="window.location = '${servePath}${previousArticlePermalink}'">
<section class="post">
<h2>${previousArticleTitle}</h2>
<p>${previousArticleAbstract}</p>
</section>
</div>
</#if>
</aside>
</#if>
<#include "footer.ftl"> <#include "footer.ftl">
<@comment_script oId=article.oId> <@comment_script oId=article.oId>
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
* skin yilia style * skin yilia style
* *
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 1.0.0.0, Nov 1, 2015 * @version 1.1.0.0, Nov 2, 2015
*/ */
/* start reset */ /* start reset */
html { html {
...@@ -65,7 +65,7 @@ h4, h5, h6 { ...@@ -65,7 +65,7 @@ h4, h5, h6 {
-webkit-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1; -webkit-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
-moz-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1; -moz-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
-o-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1; -o-font-feature-settings: 'dlig' 1, 'liga' 1, 'lnum' 1, 'kern' 1;
color: #2E2E2E; color: #666;
line-height: 1.15em; line-height: 1.15em;
font-family: "Open Sans", "Microsoft Yahei", 'Helvetica'; font-family: "Open Sans", "Microsoft Yahei", 'Helvetica';
text-rendering: geometricPrecision; text-rendering: geometricPrecision;
...@@ -149,11 +149,16 @@ hr { ...@@ -149,11 +149,16 @@ hr {
} }
blockquote { blockquote {
-moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
margin: 1.75em 0 1.75em -2.2em; margin: 1.75em 0 1.75em 0;
padding: 0 0 0 1.75em; padding: 0 0 0 1.75em;
border-left: #4A4A4A 0.4em solid; border-left: 5px solid;
transition: all 0.3s ease;
}
blockquote:hover {
border-color: #b0a0aa;
} }
blockquote p { blockquote p {
...@@ -191,18 +196,7 @@ code, tt { ...@@ -191,18 +196,7 @@ code, tt {
} }
pre { pre {
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0 0 1.75em 0;
border: #E3EDF3 1px solid;
width: 100%;
padding: 10px;
font-family: Inconsolata, monospace, "Microsoft Yahei", 'Helvetica';
font-size: 0.9em; font-size: 0.9em;
white-space: pre;
overflow: auto;
background: #F7FAFB;
border-radius: 3px;
} }
pre code, pre tt { pre code, pre tt {
...@@ -305,8 +299,125 @@ pre code, pre tt { ...@@ -305,8 +299,125 @@ pre code, pre tt {
.icon-login:before { .icon-login:before {
content: "\e611"; content: "\e611";
} }
.form {
width: 100%;
padding: 30px;
}
#captcha,
#captchaReply {
height: 27px;
display: inline-block;
vertical-align: inherit;
}
.form input,
.form textarea,
.form button {
border: 1px solid #CCCCCC;
background-color: #FAFAFA;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075) inset;
padding: 7px 8px;
width: 100%;
box-sizing: border-box;
outline: none;
font-family: "Merriweather", "Microsoft Yahei", 'Helvetica';
}
.form button {
width: auto;
vertical-align: bottom;
transition: all 0.3s ease;
cursor: pointer;
}
.form button:hover {
background-color: #b0a0aa;
color: #FFF;
box-shadow: 0 0 0;
border-color: #b0a0aa;
}
.form input:focus,
.form textarea:focus {
background-color: #FFF;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075) inset, 0 0 5px rgba(176, 160, 170, 0.5);
border: 1px solid #b0a0aa;
}
/* end common */ /* end common */
/* start emotions */
.em00, .em01, .em02, .em03, .em04, .em05, .em06, .em07, .em08, .em09,
.em10, .em11, .em12, .em13, .em14 {
background-image: url("../images/emotions/emotions-ease.png");
float: left;
height: 24px;
margin-right: 5px;
width: 24px;
}
#emotions span {
cursor: pointer;
}
.em01 {
background-position: -24px 0;
}
.em02 {
background-position: -48px 0;
}
.em03 {
background-position: -72px 0;
}
.em04 {
background-position: -96px 0;
}
.em05 {
background-position: 0px -24px;
}
.em06 {
background-position: -24px -24px;
}
.em07 {
background-position: -48px -24px;
}
.em08 {
background-position: -72px -24px;
}
.em09 {
background-position: -96px -24px;
}
.em10 {
background-position: 0 -48px;
}
.em11 {
background-position: -24px -48px ;
}
.em12 {
background-position: -48px -48px;
}
.em13 {
background-position: -72px -48px;
}
.em14 {
background-position: -96px -48px;
}
/* end emotions */
/* start side */ /* start side */
.side { .side {
position: fixed; position: fixed;
...@@ -490,14 +601,6 @@ article footer { ...@@ -490,14 +601,6 @@ article footer {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
} }
.post section.tags {
margin: 0;
}
.post header {
padding-bottom: 0;
}
.tags .tag:hover, .tags .tag:hover,
article .abstract a:hover{ article .abstract a:hover{
opacity: 0.7; opacity: 0.7;
...@@ -512,11 +615,6 @@ article .abstract a:hover{ ...@@ -512,11 +615,6 @@ article .abstract a:hover{
transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s;
} }
.post .tags .avatar {
bottom: inherit;
margin-top: 4px;
}
.share span { .share span {
transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s;
cursor: pointer; cursor: pointer;
...@@ -630,8 +728,52 @@ nav.pagination:hover .extend { ...@@ -630,8 +728,52 @@ nav.pagination:hover .extend {
opacity: 1; opacity: 1;
} }
article.post {
visibility: visible;
}
.post .tags .avatar {
bottom: inherit;
margin-top: 4px;
}
.post section.tags {
margin: 0;
}
.post header {
padding-bottom: 0;
}
.post .share { .post .share {
padding: 0; padding: 10px 0 0 0;
margin-top: 15px;
font-size: 14px;
}
.post aside a {
color: #DDD;
}
.post aside a > strong {
background: #ddd;
color: #fff;
border-radius: 50%;
width: 16px;
height: 16px;
display: inline-block;
transition: background 0.3s;
vertical-align: middle;
line-height: 18px;
text-align: center;
}
.post aside a:hover {
color: #4d4d4d;
}
.post aside a:hover > strong {
background-color: #4d4d4d;
} }
/* end article */ /* end article */
...@@ -644,6 +786,53 @@ footer.footer { ...@@ -644,6 +786,53 @@ footer.footer {
opacity: 0.6; opacity: 0.6;
margin: 0 30px 30px; margin: 0 30px 30px;
} }
footer.footer .icon-goup {
position: fixed;
bottom: 35px;
right: 5px;
-webkit-animation: upbounce 4s 2s infinite;
animation: upbounce 4s 2s infinite;
z-index: 10;
font-size: 20px;
cursor: pointer;
color: #b0a0aa;
transition: all 0.3s ease;
}
footer.footer .icon-goup:hover {
color: #4a4a4a;
}
@-webkit-keyframes upbounce {
0%, 10%, 25%, 40%, 50% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
20% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
30% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
}
@keyframes upbounce {
0%, 20%, 50%, 80%, 100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
}
60% {
-webkit-transform: translateY(-5px);
transform: translateY(-5px);
}
}
/* end footer */ /* end footer */
/* start responsive */ /* start responsive */
......
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
<a href="http://b3log.org/services/#solo" target="_blank">Solo</a> ${version} <a href="http://b3log.org/services/#solo" target="_blank">Solo</a> ${version}
</span> </span>
</div> </div>
<span onclick="Util.goTop()" class="icon-goup"></span>
</footer> </footer>
......
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
* @fileoverview util and every page should be used. * @fileoverview util and every page should be used.
* *
* @author <a href="http://vanessa.b3log.org">Liyuan Li</a> * @author <a href="http://vanessa.b3log.org">Liyuan Li</a>
* @version 1.0.0.0, Nov 1, 2015 * @version 1.1.0.0, Nov 2, 2015
*/ */
/** /**
...@@ -31,6 +31,7 @@ var Yilia = { ...@@ -31,6 +31,7 @@ var Yilia = {
init: function () { init: function () {
Util.killIE(); Util.killIE();
this.resetTags(); this.resetTags();
if ($("article").length > 0 && $("article.post").length === 0) {
$(window).scroll(function () { $(window).scroll(function () {
$("article:not(.show)").each(function () { $("article:not(.show)").each(function () {
if ($(this).offset().top <= $(window).scrollTop() + $(window).height() - $(this).height() / 7) { if ($(this).offset().top <= $(window).scrollTop() + $(window).height() - $(this).height() / 7) {
...@@ -40,6 +41,9 @@ var Yilia = { ...@@ -40,6 +41,9 @@ var Yilia = {
}); });
$(window).scroll(); $(window).scroll();
} else if ($("article.post").length === 1) {
$("article.post").addClass('show');
}
}, },
resetTags: function () { resetTags: function () {
$("a.tag").each(function (i) { $("a.tag").each(function (i) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment