V2EX Redesign: 搜索

[disinfeqt]

http://zdxia.com/3IcJ

Advices are welcome. :)

[Paranoid]

相当不错, 不过一度觉得头部区域的渐变和背景不怎么搭.

[sparanoid]

inner shadow 再浅一些，下面增加一条高光线应该会更好些:)

[vayn]

比现在的好看

不过内置搜索这个功能本身太废柴了，倒不如改用CSE...

[disinfeqt]

@Sparanoid 其实我是把 nav bar 假想成一个管道，搜索框是一个缺口 ── 你们能 get 到么？
-______-

[sparanoid]

@disinfeqt got it, 但是缺口颜色要深啊-_

[vayn]

@disinfeqt 这坑挖得太浅，没看出来..

[disinfeqt]

@Sparanoid 其实这个 CSS 是我在 Win 下那台偏色的显示器上写的，还没调就搬过来了嗯...

[disinfeqt]

Firebug 一下，那个搜索框的底色就是 #Wrapper 的 background-color。

[shawiz]

同意底色要加深，文字颜色可以用白色。

[lianghai]

@disinfeqt 这个管道和缺口的想法好玩——不过一直觉得现在 #Top 这样圆滚滚的本来就有点怪……

[ipopo]

http://cl.ly/0R1I102q212F21301T3b
试试，原图用的是D酥的哟。

[disinfeqt]

@ipopo 这也太难看了... 囧

[Sai]

@ipopo 这个像iPhone的滑动解锁 www

[ipopo]

@disinfeqt 好吧 我错了 T T

[sparanoid]

Somewhat I mean it could be like this:

http://cl.ly/3JCO

The #TopMain can be flatter.

[lianghai]

我表示已经被 @Paranoid @Sparanoid 绕晕了……
觉得既然顶上那条已经那么立体了，沿着那个弧面削下去一层也不错——不过这似乎就不是 CSS 能达到的效果了……XD
http://cl.ly/3J0F

[Sai]

@lianghai rgba加个0.1的a就行

[lianghai]

@Sai 呃我没说清楚，其实指的是边缘各处的不同颜色和不同的阴影，这种事情大概得用 CSS3 来给边框贴图了？

[freefcw]

@Sparanoid 这个挺漂亮的

不过现在的搜索功能确实是废柴

[shawiz]

@lianghai 里面可以用 CSS3 渐变实现。

[Livid]

@disinfeqt Thank you very much.

这个新设计和本地的一些其他功能正在调试，会和 SSO 及 V2EX DNS 的一项新功能一起上线。

[lianghai]

@shawiz ...是的，渐变是很简单的，只是复杂的边缘色彩和阴影没法用 CSS 实现，于是不太适合 V2EX。

[makestory]

要实现管道缺口感觉其实不用明显的渐变，颜色稍微深一些就有立体感了。

[Wowbeing]

@ipopo 看上去像滑动解锁

[shawiz]

@lianghai 恩，的确会变得很复杂。特别是一个方向的 inner shadow. 我尝试过做一条高度为 1px 的 div, 然后加 box-shadow 实现了个类似的效果。

[disinfeqt]

Everything can be done with CSS3.
I haven't used :after or :before pseudo class in this case.