Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Redesigned mobile navbar, ToC highlight, updated gitalk and so on #616

Closed
wants to merge 1 commit into from

Conversation

liuzikai
Copy link

@liuzikai liuzikai commented Feb 5, 2020

Thanks for this incredible theme! I have been playing with it for days, and made some revisions based on my own needs. I just sorted out some of them and see whether it's helpful for you.

Redesigned mobile navbar

image

I put the tabs into a navbar-burger, but keep the toc and search outside.

Sticky navbar

If navbar.sticky is set, the navbar can stick on the top as page scroll. Top margins of sticky sidebars are adjusted automatically.

Dropdown menus on navbar

image

image

ToC highlight

image

Also the scroll positions of toc links are adjusted so that the headers won't be covered by sticky navbar (reference)

More flexible settings for pages and posts respectively

I would like to have different layouts for pages (home, tags, archives, etc.) and posts, so I add quite a lot of settings.

Hide left and/or right columns in posts

Set sidebar.left.hide_in_post and/or sidebar.right.hide_in_post to true.

Hide left and/or right columns in a specific post

Add no_left_widget: true and/or no_right_widget: true at the beginning of a post .md file.

Hide a widget in posts

Set widgets.?.hide_in_post to true.

Left and/or right columns sticky only on pages

Set sidebar.left.sticky_page_only and/or sidebar.right.sticky_page_only to true.

Sticky ToC

Set sticky in ToC config.

Allow disabling shadow right sidebar in left sidebar

set sidebar.left.shadow_right to false

For me, I set left and right columns sticky on pages, so the left and right areas won't seem so empty as I scroll down the main page (demo).

But in posts, I hide the right columns, hide all widgets except profile and toc, set left column not sticky but toc sticky. So as I scroll down, the left sidebar will goes up but toc will finally stick to the top. (demo)

New layout 'error_page' and 'raw'

I wan't to customize some pages but keep Hexo generate header and footer.

For the error_page layout (write layout: error_page at the beginning of the md file), all widgets and comments will be hidden, leaving only header, footer and the main column, which can be used to generate error pages (demo).

The raw layout, (write layout: raw at the beginning of the md file) don't even generate any columns, giving more flexibility for those who want to directly write html (between {% raw%} and {% endraw %}) but keep header, footer and the ability of using markdown.

Customize how a post/page appears in insight search

  • Add summary: (your excerpt) at the beginning of md file and insight will use it as the excerpt of the post/page.
  • Add hide_in_search: true at the beginning of md file to hide the post/page in insight search.

Fix Gitalk against Github warning email of API deprecation.

See this issue. Since gitalk hasn't been updated on npm for long, I use this pull request and made it a local js file.

I also revise some spec files, but I haven't test whether it can generate correct default configs. Maybe you want to have a test on it :)

…igurable insight search; more control of layout of posts and pages; updated gitalk.
@ppoffice
Copy link
Owner

ppoffice commented Feb 5, 2020

@liuzikai Thank you for your suggestions. I think Icarus could use some of the changes in your pull request. However, I have been working on rewriting the theme (hexo-theme-icarus:dev) and the new version is very different from the current one regarding layouts and scripts implementation. The changes in this PR will soon be obsolete when the next version is released.

Moreover, some of the changes here are more of a personal designing preference to me and they may not be very useful to other users. You can post a tutorial of why and how you made these changes and link it in a GitHub issue. I will be glad to keep it open for references.

Finally, you are welcome to split this PR into several smaller PRs and create requests for those you think are important, each with a single change/feature. I will review every PR and see if we can integrate it into the new Icarus. Thank you again for your contribution.

@liuzikai
Copy link
Author

liuzikai commented Feb 6, 2020

Right some changes are basically for my personal needs and may not be helpful for most users. Personally I think the toc highlight and the mobile navbar maybe the most helpful. I will look into your dev branches and split the PR if I have time. Feel free to close this PR if you like :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants