V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
kokdemo
V2EX  ›  分享创造

更强的 V2EX 界面修改方案 v2ex.k 0.1.0 发布!!

  •  3
     
  •   kokdemo ·
    kokdemo · 2015-02-12 00:17:16 +08:00 · 11947 次点击
    这是一个创建于 3571 天前的主题,其中的信息可能已经有所发展或是发生改变。

    上周六晚上,我发布了 v2ex.k 的0.0.1版本,收到了很多的反馈和支持,这让我对这个项目充满信心。那个周末连续更新到了0.0.5版本。

    但我希望这个项目可以做到更好。

    经过几个晚上的加工,0.1.0版本终于定型。截至我写这个帖子的时候,已经达到了0.1.1版本,紧急修复了一个bug。

    如果对v2ex.k 不太熟的同学可以先看一下原来的帖子: http://www.v2ex.com/t/169091

    或者github主页: https://github.com/kokdemo/v2ex.k

    或者直接安装一下试试: https://chrome.google.com/webstore/detail/v2exk/dnbmbhefokngmkalbdcgjdlgoppfhndn

    特性

    1. 全新的界面颜色。
    2. 左侧导航栏。
    3. 快速阅读模式。
    4. 左侧显示通知条数。
    5. 自定义颜色设置。

    6. 全键盘操作模式。

    截图

    截图

    观察力比较好的同学已经能看出一些端倪来了,主要修改的地方见下面的描述。


    更新

    2015.2.11:

    • 全新的默认主题颜色。
    • 正式迈入0.1版本,修改原有的iframe模式为ajax模式,读取速度更快。
    • 修改CSS,减少页面空隙,提升页面利用率。
    • 增加全键盘操作,提升了笔记本的阅读效率。
    • 优化了快速阅读区域中的中文阅读效果,修改了字体渲染效果。
    • 优化左侧导航栏的视觉效果,全部使用icon代替原有文字。

    帮助

    1. 使用快速阅读只需要点击列表中除了链接之外的空白即可。
    2. 右侧的快速阅读区域可以点击进入具体的帖子。
    3. 自定义颜色设置具体如下

    <code>

    .k_color_dark{
        background-color: #3C7300;/*主要导航条颜色*/
    }
    
    .k_color_light{
        background-color: #5CB000;/*次级导航条颜色*/
    }
    
    span a.node.k_color_node{
        background-color: #B9D998;/*小标签背景颜色*/
        color: #FFF;
    }
    
    td a.count_livid.k_color_count{
        background-color: #3C7300;/*回帖数目背景颜色*/
    }   
    
    #Wrapper.k_color_background{
        background-color: #E2F1D0;/*背景颜色*/
    }
    
    .k_color_hover:hover{
        background-color: #2980B9;/*导航条放置变色*/
    }
    
    .k_color_item{
        background-color: #FFF;/*列表项背景颜色*/
    }
    
    .k_color_item a:link,.k_color_item a:visited,.k_color_item a:active{
        color: #3C3B47; /*列表项文字颜色*/
        text-shadow: none;
    }
    
    .k_color_choosen{
        background-color: #eeeeee;/*被选择的列表项的背景颜色*/
    }
    
    #k_tabbar a.tab_current:link, #k_tabbar a.tab_current:visited, #k_tabbar a.tab_current:active{
        background-color: #505770; /*次级导航条被选中颜色*/
        border-top-left-radius:0;
        border-bottom-left-radius:0;
    }
    

    </code>

    4 . 全键盘使用:

    • 在没有开启快速阅读模式下:

      • 方向键上,方向键下,会自动选择帖子列表的第一项,并进入快速阅读模式。
      • 空格键,会回到顶部。
      • 方向键左,会回到上一页。
    • 在开启了快速阅读模式之后:

      • 方向键上下,切换上一条/下一条帖子。
      • 空格键,会回到顶部。
      • 方向键右,进入这个帖子。

    For chrome

    https://chrome.google.com/webstore/detail/v2exk/dnbmbhefokngmkalbdcgjdlgoppfhndn

    感谢

    首先要感谢V2EX Next项目 https://dribbble.com/shots/1355911-V2EX-Next 上一个版本的配色很受大家诟病,我将配色向next项目靠拢,果然好多了!

    其次要感谢
    @rainy3636
    @loading
    @romotc
    @yrom
    @vimutt
    @233
    @branchzero
    @Jreen
    @julijulilijuliju
    @liwanglin12
    @elvba 等同学的反馈,尤其是@branchzero反馈特别仔细;新的快速阅读的想法也是来自@elvba。

    接着要感谢一下 @caoyue 制作的ff版本 https://github.com/caoyue/userjs/blob/master/v2ex.k.user.js

    以及 @break 制作的衍生版本 https://github.com/jShi-git/purple-v2ex

    我的思路和他的有很多相似的地方。


    ps

    写完帖子也有12点多了……希望大家能够用的开心!

    还是那句话:

    『用更好的UI开始新的一天。』

    第 1 条附言  ·  2015-02-12 08:17:42 +08:00
    0.1.2更新:

    修复快速阅读模式https的支持
    103 条回复    2017-04-03 16:01:23 +08:00
    1  2  
    heliar
        101
    heliar  
       2015-03-02 11:55:18 +08:00
    话说。。被墙了之后从快速阅读模式右方向键进入回复主题如何设置成走https呢。。http目前无法打开的
    kokdemo
        102
    kokdemo  
    OP
       2015-03-02 14:21:20 +08:00
    @heliar ……呃

    我正在用晚上的闲暇时间弄下一个版本,这个问题会统一在下个版本下来考虑进去的

    我现在上v2是直接fq模式的……
    benjaminv
        103
    benjaminv  
       2017-04-03 16:01:23 +08:00
    果然 V2 眼尖的人多. 我现在已经用上新皮肤啦. 谢谢
    1  2  
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5318 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 08:08 · PVG 16:08 · LAX 00:08 · JFK 03:08
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.