1,205° 20171,513字0条评论

Bitcron主题「方」

受人欢迎的「墨」、为了证明自己的「庸」、尝试符合大众口味的「入灰」,都不及把「日记」截图设为相册封面时的愉悦,和面对「淡泊」时的再次动心。以前我分不清到底是能力限制了我的审美,还是我本就喜欢简洁的设计。但当写出了好几个“复杂”的主题之后,我好像有点明白了,即使我仍说不准这是否是惯性,但我决定直面自己的内心,做自己喜欢的设计。

Bitcron主题「方」
「方」是一个正经的Bitcron主题

上面这些废话并不是「方」的来源,而是完成主题之后的感受。说起来源,其实是偶然翻阅OneDrive时看到「网页设计」文件夹里躺着几份“古时候”做的设计。有些对于当时的我来说是没有能力实现的,而有些则有着妥协的意味。在现在的我看来,妥协的确实远远简单于天马行空的,于是顺手实现了简单的那份,而天马行空待有机会再看吧。

三年前的设计图
三年前的设计图

虽然最后还是决定改掉方块的背景色,但2px的边框被保留了下来并感到做了非常正确的决定。如果没有那些红字标注,也许我会把所有的边框都设置为1px,我毫不怀疑这个微小的变动会像蝴蝶效应一般,最终改变整个主题的风格走向。「幸好、幸好」,我在心里默默说着。

一旦发现主题「太过朴素」之后,之前的华美风Mockup似乎就不太适合了(可参见「淡泊」的效果图)。于是我又到老地方——Pixeden寻找新的免费素材,在此真诚感谢设计师们的无私奉献。(虽然我隐隐开始想要自己做Mockup了,如果实在找不到合适的素材的话。)

特点和注意

其实我有点厌倦这种格式了,但还没想到更好的,就先这样吧。所以按照惯例说说这个主题的特点和需要注意的地方。

下面说明一下style.scss中可自定义样式的各参数:

1) 基本设置

2) 菜单方块大小(※根据$max-width的变化而调整)

3) 悬停时菜单栏方块的背景

4) /posts页面的缩略图

5) 集大成者

/* 用于blockquote、pre、评论、TOC、脚注、/posts页面等 */
.module {
    font-size: $font-size*0.9; /* 字体为一般正文的0.9倍 */
    line-height: $line-height;
}
/* 用于各类边框 */
.square {
    border: 2px solid $border-color; 
    background: #fff;
    transition: 0.5s;
    &:hover, &:focus {
        box-shadow: 0 0 8px $border-color;
    }
}

在线预览

demo.shuiba.co

安装配置

付费购买

主题「方」的定价为¥60。购买前请先确认版权声明,如果购买则默认同意此声明。

支付宝二维码
支付宝二维码

更新日志

更多主题

Bitcron主题

EOF
901°
VSCOer标志设计
Comments
Write a Comment
点击加载Disqus