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.

Sign up for GitHub

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

Jump to bottom

报纸样式驾到 #569

Merged
merged 7 commits into from
Jul 13, 2017
Merged

报纸样式驾到 #569

merged 7 commits into from
Jul 13, 2017

Conversation

yihui
Copy link
Member

@yihui yihui commented Jul 10, 2017 •
edited
Loading

可能还需要不少微调，但一天有限时间的突击下来，只能先大体这样了。

预览：https://deploy-preview-569--cosx.netlify.com

@yihui yihui force-pushed the theme/hugo-xmag branch from 7a73e32 to c7b4344 Compare July 10, 2017 07:06
@ZhangYet
Copy link
Contributor

ZhangYet commented Jul 10, 2017 •
edited
Loading

阅读全文 的按钮统一在右下角如何？现在的样式里面，阅读全文的颜色是不一样的，然后它的位置是固定的，视觉效果不是很好。另外感觉也别用蓝色了，用灰色加粗会更好看。

@yihui
Copy link
Member Author

yihui commented Jul 10, 2017

关于位置，好的。

关于颜色，我没有专门定义链接颜色（少数地方除外），显示的是浏览器默认的颜色。可以考虑灰色加粗。谢谢！

@ZhangYet
Copy link
Contributor

还有，《十行代码预测插旗西雅图》上面的 WEB API 是文章的 tag 么？如果是，应该放在标题下面才好，现在标题一高一低的。

@yihui
Copy link
Member Author

yihui commented Jul 10, 2017

是文章分类（categories）中的第一类。WEB API 这个例子说明这篇文章的分类信息设置不太合理（#6）。高高低低是因为有些文章缺失了分类信息，应该补上，当然我也可以自动填补一个占位元素，但我希望每篇文章都有分类信息。

@Lchiffon
Copy link
Member

我觉得有点'老气'...
字体感觉有点虚, (同时可能需要添加自适应)
文章块做成白色, 背景做成灰色会不会好一些?

image

@yihui
Copy link
Member Author

yihui commented Jul 11, 2017

有多虚？截图我看看。

自适应已经做了，随着宽度变窄，会自动变两栏、一栏。手机上的字号问题我还没弄，不过很简单。

背景色是个好主意。

@Lchiffon
Copy link
Member

Lchiffon commented Jul 11, 2017 •
edited
Loading

这样的:

image

题外话, 点击绿色的对勾会跳到https://deploy-preview-569--physicist-ralph-51373.netlify.com/
好像和以前不太一样
image

@yihui
Copy link
Member Author

yihui commented Jul 11, 2017

哦，我应该把仿宋去掉。

Netlify 的那个预览链接是错的，我也不知道为什么，最近似乎有点抽风。这也是为什么我把预览链接特别提出来的原因：https://deploy-preview-569--cosx.netlify.com

按照你们的意见改的差不多了，你们再看看？手机端应该也好了。我明天可能还会把主栏宽度略微再加宽一点点。

@Lchiffon
Copy link
Member

image
手机加个padding-left和padding-right?

菜单栏要移上去或者做成绝对位置么(放在最下面会找不到论坛搜索等入口吧~)

@hengqujushi
Copy link

  1. 为什么文章的图片 总有较大的空白？
  2. 时间和作者信息从样式上与正文区分一下（颜色，字体等等，总是有各种办法）？可以强调一下作者信息，甚至作者信息是可以点击的？

@Lchiffon
Copy link
Member

作者的这个问题要干掉这个issue了..
#226

@yihui
Copy link
Member Author

yihui commented Jul 11, 2017

作者的问题我几乎已经在这个主题中解决了，只不过我还没写文档而已（需要在 data/authors.yaml 中定义作者的信息，示例在此）。

@yihui
Copy link
Member Author

yihui commented Jul 11, 2017

@Lchiffon 你手机忒小了 😁 我把菜单改成不能折断了。这个菜单的内容我还想调整一下，我觉得乱七八糟的菜单项太多了。

@hengqujushi 图片空白问题是因为图片本身的尺寸不够方，我已经调整为绝对居中了。时间和作者信息我觉得淡化处理就好了吧。

@Lchiffon
Copy link
Member

一些参考样式
超链接样式: https://tympanus.net/Development/CreativeLinkEffects/
按钮样式: https://tympanus.net/Development/CreativeButtons/
进度条样式: https://tympanus.net/Development/ProgressButtonStyles/
Icon样式: https://tympanus.net/Development/IconHoverEffects/

@yihui
Copy link
Member Author

yihui commented Jul 12, 2017

@Lchiffon 导航的问题我还没有完全决定，我觉得主要是论坛确实需要主站引流量，剩下的所有导航菜单都不那么重要，次重要的是搜索，但放在底部也不是不可以，这页面布局一共就那么三个区，想找搜索链接的人一定会找到。A/B 测试在目前的服务器上是可以做的，等我有空了可以启用试试，但在我目前的时间限制下可能还做不了这个。

图片的空白问题我已经尽量解决，但有些特例无法靠自动化方式解决，比如陈松蹊老师那张照片，原图就有左右空白。自动挡开不了的时候可以开手动挡。这个主题支持自定义模式，在 YAML 中设置一个thumbnail选项指向自定义图片即可，你要保证自定义图片的宽高比合适。这个可以作为编辑部的长期任务去做。我用程序自动化的方式只能帮你们到这儿了。

翻页啊，超链接的样式还没做

你推荐一个链接配色吧。

标题太长会换行

我也犹豫啊，这是个取舍问题，要整齐，还是要内容。你建议超长的标题截断之？

一个文章部分标题作者日期全是黑色，感觉进入了一个黑白世界…

建议一下配色吧。

上半部分两条细黑线也觉得怪…

头部跟正文区总是需要一个分隔标志，你的建议是？

按道理一个主题应该有一个主色调，一两个辅助色，之前的主站是以深红配合logo的颜色做主色调的，但现在的主题感觉基本没考虑什么颜色啊…

现在的考虑主要在最顶部的5像素深红和底部导航区的同样深红。

@Lchiffon
Copy link
Member

Lchiffon commented Jul 12, 2017 •
edited
Loading

配色部分

两个角度, 一个是超链接用颜色稍淡的红色, 就像之前主站一样,
辅助色用深红色(#8C1F22)的互补色比如淡青(#00B0CF)

@HowieHao
Copy link

HowieHao commented Jul 12, 2017 •
edited
Loading

文章更新：可以考虑让最新更新的文章有更大的展示区间（比如合并多个豆腐块）
分类信息：置顶略显突兀，可以考虑放在副标题中，通过字体形式与 时间，作者区分开来

也可考虑在豆腐块末尾增加评论数，浏览数等信息

@yihui
Copy link
Member Author

yihui commented Jul 12, 2017

@HowieHao 很好的建议，这一版不想做了，留着下一次再改吧。请帮个忙把这个建议提交一个新的 Github 事项。

@yihui yihui force-pushed the theme/hugo-xmag branch from fa787a9 to 8393886 Compare July 12, 2017 22:48
Lchiffon
Lchiffon approved these changes Jul 13, 2017
View reviewed changes
Copy link
Member

@Lchiffon Lchiffon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

合并再改, 外加心疼旧主站1s

@yihui yihui merged commit c5425db into master Jul 13, 2017
@yihui yihui deleted the theme/hugo-xmag branch July 13, 2017 03:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@Lchiffon Lchiffon Lchiffon approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
5 participants
@yihui @ZhangYet @Lchiffon @hengqujushi @HowieHao