Huxpro / huxpro.github.io

My Blog / Jekyll Themes / PWA
http://huangxuan.me
Apache License 2.0
6.96k stars 5.08k forks source link

能不能增加一个自动生成的侧边导航栏? #24

Open BruceZhaoR opened 8 years ago

BruceZhaoR commented 8 years ago

加入侧边导航栏 ,让文章脉络清晰,还可以实现跳转,方便阅读。如果用 bootstrap affix 感觉要自己写,太麻烦,不知道有没有自动生成的。最近研究了几天也没有结果,但是看到了这个网站:http://beiyuu.com ,post文章里面有导航栏,且在屏幕变小时自动消失。看了一些原文件是一个js,完全不懂,如果有懂的人可以帮忙修改以嵌入到这个博客中。

Huxpro commented 8 years ago

@BruceZhaoR 非常好的提议!

这个功能实现起来并不复杂,我会加入到迭代计划中 ;)

BruceZhaoR commented 8 years ago

@Huxpro

非常赞! 好期待~
如果有时间,我想帮忙翻译一部分 。

blue20080 commented 8 years ago

如果加入这个功能,那就太棒了!

BruceZhaoR commented 8 years ago

今天看到了一个hexo的next主题, 里面的侧边导航栏好像是JavaScript写的,但是我完全不懂 -_-! 懂的人我觉得可以去扒下代码然后加到这个主题上面来。

LucasIcarus commented 8 years ago

某种程度上我完成了这个功能? 不过我只测试了一篇post,可以正常工作。就是整体的布局和排版可能需要调整。

Huxpro commented 8 years ago

@LucasIcarus Hey bro!

We really appreciate your awesome work in the merged PR https://github.com/Huxpro/huxpro.github.io/pull/55! Since Im busy working on other stuff, this most wanted issue is delayed too much.

Your implementation of the basic idea push me so hard to get everything done ASAP. So bunch of improvements are added upon your codebase.

For instance:

@BruceZhaoR @blue20080 Hope you guys love it! Check React-vs-Angular2 or ios9-safari-web to get the exciting preview!

This new feature would be released in v1.6 few days later, hopefully.

BruceZhaoR commented 8 years ago

Looks great ! :+1:

But, I think there is a potential space for improvement, such as the 'h4' titles don't reveal until you read the 'h3' ,which will make the catalog more brief. Maybe you can check this example: http://v3.bootcss.com/getting-started/#grunt. Forgive me for perfectionism :blush:

Huxpro commented 8 years ago

@BruceZhaoR

Aha, nice suggestion. I consider that should be a option since it influence the flexibility. What I mean is some long post need it while some short not, and somebody want h3 as the folder while some want h2 maybe. So it's hard to cater for all tastes.

tshu-w commented 8 years ago

@Huxpro I am really appreciate with you work.However, I found a question is that the font size between h1 and h2 or h2 and h3 is difficult to distinguish.

Huxpro commented 8 years ago

@voleking Yep, It is. In fact, the font size of h1, h2, h3 are exactly same (13px). The size of h4, h5, h6 are the same (12px) as well.

Since the tag people preferred to use is totally different, It is rough to formulate the hierarchy which impact the font-size and indent. That is the main problem concerned.

tshu-w commented 8 years ago

@Huxpro Well, I find it. I think I would customise my own type temporarily. Hope a good solution.

LucasIcarus commented 8 years ago

@Huxpro love the new style. I couldn't handle the UI at the beginning, poor at the art judgement ,lol~. Now the post looks great. Abandon the animate-scroll is a wise choice, the conflict nearly kill me, poor at coding, lol~. I will follow up the theme, and always wait for sent.

@voleking The key point is to organize the structure of the post when u type. CSS rules can be modified as your will.Regrettably only made the directory a second-level menu.

tshu-w commented 8 years ago

@LucasIcarus Yep, only made the directory a second-level menu is the biggest regret.

Huxpro commented 8 years ago

@LucasIcarus Haha cute. So, I will mention your contribution as a special thank in the later release documentation.

@voleking Yep. As @LucasIcarus said, I convinced that It is not difficult to customize the CSS upon the side-catalog.less which is well separated. Maybe we can design sort of APIs to control the behaviour of catalog creation but I have no idea yet.