TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

Drop Caps and Design Systems

57 点作者 willlll将近 6 年前

3 条评论

johnnyAghands将近 6 年前
Very interesting read, aside from the issue at hand, I was really drawn to how they pulled off this kind of change in a giant org with many heads. Routinely, the root issue is easily addressable, however, it&#x27;s a different story when it&#x27;s something that&#x27;s cross org. Usually you hit a wall and can&#x27;t move forward without a consensus and some kind of org wide champion.<p>At the end of the day the process this team followed has all the hallmarks of a great culture (-- perhaps another article?). I&#x27;m curious what kind of management by-in was required, or if this was strictly driven by engineering and design.<p>God -- It really shows I&#x27;ve been in an enterprise for far too long. :,)
dusted将近 6 年前
Breaks normal in-browser search, at least for me. Since dropcap is an established layout element, maybe it should be a style property instead, so that the browser can render it correctly and also allow for search.
评论 #20284019 未加载
评论 #20288079 未加载
dredmorbius将近 6 年前
I&#x27;m a fan of drop caps as a visual element -- they, along with a bolded lede line, very much help draw the eye to section starts, in a way which is very nondistraction (IMO).<p>A recent example, adding drop caps (and a number of other styling changes) to unv.is:<p><a href="https:&#x2F;&#x2F;mastodon.cloud&#x2F;@dredmorbius&#x2F;102329333215634483" rel="nofollow">https:&#x2F;&#x2F;mastodon.cloud&#x2F;@dredmorbius&#x2F;102329333215634483</a><p>Because I&#x27;m restyling a page, that&#x27;s restricted to CSS-only methods, which for that site works marvelously. And on the principle of divorcing content and presentation, it appeals strongly.<p>But on Wikipedia&#x2F;Mediawiki, attempting to add drop-caps + bold lede-line results in a very annoying sift of the text offset by the drop cap *merely by defining a selector for ::first-line (Firefox&#x2F;OSX):<p><a href="https:&#x2F;&#x2F;mastodon.cloud&#x2F;@dredmorbius&#x2F;102329661015728246" rel="nofollow">https:&#x2F;&#x2F;mastodon.cloud&#x2F;@dredmorbius&#x2F;102329661015728246</a><p>Somewhat maddenning.