feat(timeline): add timeline layout #253
Conversation
|
I have changed the base branch as |
neoFelhz
changed the title
Prettify the code & if <!--more--> is used when writing hexo post, show more excerpt.
|
I think this figure may be a demo?
Also, the icon can be changed.
|
neoFelhz
changed the title
| @@ -133,6 +133,10 @@ sidebar: | |||
| #link: "/about" | |||
| #icon: person | |||
| #divider: false | |||
| timeline: #can use different languages | |||
There was a problem hiding this comment.
I don't think we needn't add this configuration to config file. As you can see, we have gallery page and links page and they are not included in config file.
We needn't configuring it for users.
| left: 0; | ||
| width: 60px; | ||
| height: 40px; | ||
| border-radius: box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05); |
There was a problem hiding this comment.
Invalid property name here.
There was a problem hiding this comment.
Thanks for your suggestion. I try to fix it as following.
@@ -88,7 +88,8 @@
left: 0;
width: 60px;
height: 40px;
- border-radius: box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
+ border-radius: 0.25em;
+ box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05); This property is used to control the shape of corner as shown in the following figure.
If reviewers don't like the material design of the square card that is broken by this property, you can also delete directly on this line of code. 😄
layout/_widget/page-timeline.ejs
Outdated
| style: 'none' | ||
| }) %> | ||
| </span> | ||
| </div> |
There was a problem hiding this comment.
There are some issue with tag categories between post excerpt.
Try to add double <br> between line 414 and 415?
There was a problem hiding this comment.
this need to be changed in css, not html.
There was a problem hiding this comment.
Sorry for that. I just copied the CSS from the typecho repo. I think there are still some issues in the style.
I tried to fix the float layout problem. I did several attempts but were not satisfied. This commit may be a acceptable modification. I hope someone who knows more CSS styles than me would prettify it.
Finally, I recommend that use fewer words to describe the tags and categories, which means you won't meet the above issue.
There was a problem hiding this comment.
I think the problem is that the alignment would be broken while there are too many texts. But as we seen the content's width is short, especially displaying on the mobile. If we don't focus on how to fix the original style, I think we have two ways.
- Align tags & categories to the left and divide them into two lines.
- Put two icons on the upper right corner instead of lables that looks like in post page. Click to drop lists.
If you have a good idea, we can discuss it. ❤️
P.S. I expect someone to rewrite a more cool style. @neoFelhz @Halyul
There was a problem hiding this comment.
@ghouzenyan OK. I will try to find a way to solve it.
Anyway, thanks for your contribution!
Correct spelling and float style errors. Add '...' after excerpts.
What kind of change does this PR introduce? (check one with "x")
Does this PR introduce a breaking change? (check one with "x")
Description
Implement the page-timeline-material feature in typecho-theme-material repo with Hexo.
If you prefer the voez or other styles, just modify the css style which you like.
Enjoy it!
Verification steps
No verification steps.