没想到我只是学了个 CSS,就能感受到垃圾代码的恶臭了

本贴最后更新于 761 天前,其中的信息可能已经时异事殊

并没有系统地学习 CSS 的我虽然能写出来勉强能用的主题,但是我那混乱的代码已经堆积起来,让我难以修改问题、增添功能。没头没脑地用选择器和!important,还有每次手动用拾色器选个颜色弄出个新颜色代码用来声明,感觉整个主题的代码混乱不堪,我自己都快绷不住了。

虽然 pink-room 下载量也几百了,但没什么人反馈,github 上也没有 issue。感觉不到使用者的存在,着实有点没有修复缺陷和改进的动力。

过段时间(指不知道啥时候)一定得重构,不然这主题没法写了。

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22346 引用 • 89415 回帖 • 1 关注

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 加油

  • Bard

    特意下载了下,支持楼主

    但我个人的确对这个风格不是很感冒

    1 回复
  • Zhangwuji

    提点意见,楼主需要多收集点反馈

    1 回复
  • Bard

    我最近在用 notion-theme,备用 Rem craft

    我喜欢这种看起来极简,用起来功能丰富度一点不弱的吧

    前者的隐藏顶栏,我也很喜欢,隐藏后也是极简

    两侧栏可以鼠标触发,感觉也是很不错

    或许楼主可以朝着这个风格方向改一下

    可以一件切换颜色这个功能挺好

    1 回复
  • 其实我觉得主题首先是自己用,在有余力的情况下再考虑别人的需求。

    所以就不要想太多啦,像我现在更新主题,纯粹就是为了方便我自己多个设备下载用,也不太管别人的反馈。

    当然如果你是想通过做主题学习 css,然后再学前端 js 开发的话,那确实得花点心力。如果只是想好好做一个主题,就不要想太多啦,社区优秀的主题都是花了很多时间一点点迭代的

    1 回复
  • 页签栏可以优化一下

    1 回复
  • AMBERWIN

    ❤️ ❤️ ❤️

  • 主题还是很不错的,提两个小建议,这个颜射设置这里,下面那些数字是不是不要更简洁?下面的 1,2,3,4 和 I,II,III 等。

    image.png

    另外,就是折叠标题后,太不明显了,比如我这个

    image.png

    2 回复
  • 你好,Sofill- 主题很重视折叠标题效果,正在优化折叠标题文字立体感增强 ,你有什么好的建议吗 ❤️

    1 回复
  • Bard

    多合一是趋势,考虑一下不trollface

    1 回复
  • 不考虑,trollface 欢迎 pr

  • Nofood

    已经做得很不错了 👍 写代码确实磨人。改来改去的都不知道心中的完美是什么样了。。。

    image.png
    楼下某位主题开发者的注释huaji

    不是不想提建议,奈何水平太低提不出好建议。要不加个打字机模式?
    说到颜色拾取 vscode 有个插件可以让代码展示颜色。notepad3 也有这个功能。比从其他地方复制代码略微方便些。
    颜色拾取.gif

    1 回复
  • wickysi

    pink-room 主题用了快 1 个月了,挺好的,没有遇到什么问题。😄

  • StarDustSheep
    作者

    我想要的是把某个文件夹中使用过的所有颜色代码汇总起来,在修改颜色代码的时候能跳出它的界面,这样我就能看看之前是不是有用过很相似的颜色了。我还没找到这样的插件。或许在最开始选色的时候就应该按照某种设计规范来。

    1 回复
  • StarDustSheep
    作者

    之后会看看有什么好的样式能用的。有过很多想法,但苦于自己对 css 掌握得不够好的原因只选了目前这个比较保守的方案。

  • StarDustSheep
    作者

    加上这个数字是因为……思源默认的字色和下面的背景色啊,有些难以区分。尤其是背景色,太浅了,在白色的菜单背景上很难找到自己要找的那个颜色,有个数字就能比较方便地定位用。

    不过我最大的疑问就是,有多少人是在用思源这个默认的字色和底色,如果用,那用哪几个比较多呢……由于思源默认字体样式的局限性很大,不少主题都搞了自己新的标准。而我怕使用默认样式的人很多,且已经做了不少标注了,所以就没修改默认的字色和底色的标准,以免用户被主题的字体样式标准“绑架”。

    最近加入的公共 CSS 片段应该能解决这个问题,我会再研究研究其他主题的标准,看看要不要也将我自己的标准变成默认。当用户能容易找到自己想要的样式的话,也就不需要这什么编号了。

    image.png

    image.png

  • StarDustSheep
    作者

    我之前也做过立体感很强的样式,最后我自己用起来都难受。如果立体感很强,注意力很容易被吸引,这导致在阅读其他部分文本的时候会受干扰。如何做好这个平衡是件很困难的事。

    1 回复
  • StarDustSheep
    作者

    我并未学过计算机,对 CSS 的学习了解很浅,很多功能和效果不知道怎么做才好。所以是尽量不在原版上做过多修改,一加功能,就有可能有各种问题需要解决(我在群里看他们经常为了这些功能做了很多工作),我觉得目前我是没能力和精力加上太多功能。

    隐藏顶栏有个问题是鼠标直接移动到屏幕边缘试图点击页签的时候,其实会点到顶栏,故不能进行页签跳转。这和使用浏览器时轻松拖动鼠标滑到顶部就能切换页签的体验不一样,所以我一直觉得这个设计还是有很大缺陷,体验不是很好,所以没想去做过。

    至于侧栏,新版本思源可以在右下角手动隐藏了。

    一键切换颜色的功能是 Dark+ 作者帮我弄的 😂 ,我不会 JS。因为有些人不是很喜欢粉色嘛,实际上粉色界面确实容易让人思绪躁动起来,有些难以专心。所以我就做在界面结构没变的情况下又做了两套配色。

  • 确实很难平衡,现在的设计趋势都是扁平化

  • Nofood 1

    比方说编辑 蓝色.css 的时候,它会提醒你这个颜色(或代码)在 绿色.css 里用过?我不知道是否有编辑器能支持。现在大多数编辑器都支持重复项高亮。但应该满足不了你的需求。

    说到先定义选色规范。VS code 的插件 Color Manager 或许能帮到你。它可以自建调色板,这样不管是编辑哪个文件都能插入设定好的颜色。也能搜索代码中的颜色导入调色板。

    颜色拾取 1.gif

    你的主题配色很好看,不愧是学美术的。尤其使卷轴模式配上背景图。
    但是我的眼睛觉得太亮了。所以。。。暗色主题什么时候出,来个五彩斑斓的黑huaji

    1 回复
  • StarDustSheep
    作者

    我现在手里有之前的宇宙风格暗色主题 Stardust 的代码还没整理。暗色主题是全新的一套设计了,需要花不少时间去调整至能用的状态,而 pink-room 就已经让我有些猪脑过载了,所以就一直没重构它的代码。

  • profox

    哈哈 我也常用粉色主题的,那也说两句:

    标题与上下块的间距,可否不要搞成目前的等距?我建议尝试一下上宽下窄。

    逻辑是这样的:标题是向上分断,向下包含的。距离上块距离宽,有分离分段感;距离下块距离稍窄,有引领聚合感。

    1 回复
  • StarDustSheep
    作者

    下个小版本给标题加大外部上边距

请输入回帖内容 ...

推荐标签 标签

  • 游戏

    沉迷游戏伤身,强撸灰飞烟灭。

    176 引用 • 815 回帖
  • Elasticsearch

    Elasticsearch 是一个基于 Lucene 的搜索服务器。它提供了一个分布式多用户能力的全文搜索引擎,基于 RESTful 接口。Elasticsearch 是用 Java 开发的,并作为 Apache 许可条款下的开放源码发布,是当前流行的企业级搜索引擎。设计用于云计算中,能够达到实时搜索,稳定,可靠,快速,安装使用方便。

    117 引用 • 99 回帖 • 212 关注
  • Firefox

    Mozilla Firefox 中文俗称“火狐”(正式缩写为 Fx 或 fx,非正式缩写为 FF),是一个开源的网页浏览器,使用 Gecko 排版引擎,支持多种操作系统,如 Windows、OSX 及 Linux 等。

    8 引用 • 30 回帖 • 408 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念,推广开源项目,为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖 • 1 关注
  • SpaceVim

    SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
    及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
    语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
    即用的 Vim-IDE。

    3 引用 • 31 回帖 • 99 关注
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 51 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司,该公司位于捷克的布拉格,并在俄国的圣彼得堡及美国麻州波士顿都设有办公室,该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境:IntelliJ IDEA

    18 引用 • 54 回帖
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    12 引用 • 54 回帖 • 63 关注
  • 黑曜石

    黑曜石是一款强大的知识库工具,支持本地 Markdown 文件编辑,支持双向链接和关系图。

    A second brain, for you, forever.

    15 引用 • 122 回帖
  • 微软

    微软是一家美国跨国科技公司,也是世界 PC 软件开发的先导,由比尔·盖茨与保罗·艾伦创办于 1975 年,公司总部设立在华盛顿州的雷德蒙德(Redmond,邻近西雅图)。以研发、制造、授权和提供广泛的电脑软件服务业务为主。

    8 引用 • 44 回帖
  • C++

    C++ 是在 C 语言的基础上开发的一种通用编程语言,应用广泛。C++ 支持多种编程范式,面向对象编程、泛型编程和过程化编程。

    107 引用 • 153 回帖
  • 工具

    子曰:“工欲善其事,必先利其器。”

    286 引用 • 729 回帖
  • JWT

    JWT(JSON Web Token)是一种用于双方之间传递信息的简洁的、安全的表述性声明规范。JWT 作为一个开放的标准(RFC 7519),定义了一种简洁的,自包含的方法用于通信双方之间以 JSON 的形式安全的传递信息。

    20 引用 • 15 回帖 • 3 关注
  • Sphinx

    Sphinx 是一个基于 SQL 的全文检索引擎,可以结合 MySQL、PostgreSQL 做全文搜索,它可以提供比数据库本身更专业的搜索功能,使得应用程序更容易实现专业化的全文检索。

    1 引用 • 210 关注
  • TextBundle

    TextBundle 文件格式旨在应用程序之间交换 Markdown 或 Fountain 之类的纯文本文件时,提供更无缝的用户体验。

    1 引用 • 2 回帖 • 48 关注
  • Linux

    Linux 是一套免费使用和自由传播的类 Unix 操作系统,是一个基于 POSIX 和 Unix 的多用户、多任务、支持多线程和多 CPU 的操作系统。它能运行主要的 Unix 工具软件、应用程序和网络协议,并支持 32 位和 64 位硬件。Linux 继承了 Unix 以网络为核心的设计思想,是一个性能稳定的多用户网络操作系统。

    944 引用 • 943 回帖
  • DevOps

    DevOps(Development 和 Operations 的组合词)是一组过程、方法与系统的统称,用于促进开发(应用程序/软件工程)、技术运营和质量保障(QA)部门之间的沟通、协作与整合。

    47 引用 • 25 回帖 • 1 关注
  • 尊园地产

    昆明尊园房地产经纪有限公司,即:Kunming Zunyuan Property Agency Company Limited(简称“尊园地产”)于 2007 年 6 月开始筹备,2007 年 8 月 18 日正式成立,注册资本 200 万元,公司性质为股份经纪有限公司,主营业务为:代租、代售、代办产权过户、办理银行按揭、担保、抵押、评估等。

    1 引用 • 22 回帖 • 762 关注
  • 机器学习

    机器学习(Machine Learning)是一门多领域交叉学科,涉及概率论、统计学、逼近论、凸分析、算法复杂度理论等多门学科。专门研究计算机怎样模拟或实现人类的学习行为,以获取新的知识或技能,重新组织已有的知识结构使之不断改善自身的性能。

    83 引用 • 37 回帖 • 1 关注
  • Sym

    Sym 是一款用 Java 实现的现代化社区(论坛/BBS/社交网络/博客)系统平台。

    下一代的社区系统,为未来而构建

    524 引用 • 4601 回帖 • 700 关注
  • flomo

    flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。

    5 引用 • 107 回帖
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架,使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用,例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 21 关注
  • OpenResty

    OpenResty 是一个基于 NGINX 与 Lua 的高性能 Web 平台,其内部集成了大量精良的 Lua 库、第三方模块以及大多数的依赖项。用于方便地搭建能够处理超高并发、扩展性极高的动态 Web 应用、Web 服务和动态网关。

    17 引用 • 40 关注
  • HBase

    HBase 是一个分布式的、面向列的开源数据库,该技术来源于 Fay Chang 所撰写的 Google 论文 “Bigtable:一个结构化数据的分布式存储系统”。就像 Bigtable 利用了 Google 文件系统所提供的分布式数据存储一样,HBase 在 Hadoop 之上提供了类似于 Bigtable 的能力。

    17 引用 • 6 回帖 • 73 关注
  • 链书

    链书(Chainbook)是 B3log 开源社区提供的区块链纸质书交易平台,通过 B3T 实现共享激励与价值链。可将你的闲置书籍上架到链书,我们共同构建这个全新的交易平台,让闲置书籍继续发挥它的价值。

    链书社

    链书目前已经下线,也许以后还有计划重制上线。

    14 引用 • 257 回帖
  • Caddy

    Caddy 是一款默认自动启用 HTTPS 的 HTTP/2 Web 服务器。

    12 引用 • 54 回帖 • 164 关注
  • 小薇

    小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。

    由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!

    34 引用 • 467 回帖 • 742 关注