1 views collected around this technical thread.
This article explains how the vueuse utility library works with both Vue 2 and Vue 3 by leveraging the vue‑demi compatibility layer, and then dives into the implementation of its useDark hook, showing the underlying media‑query logic and CSS techniques for dark‑mode support.
This article walks through practical ways to implement true dark mode on web pages—including manual toggles, system‑preference detection, CSS variables, stylesheet swapping, filter tricks, and common pitfalls—while providing complete code examples and explanations.
This article explores eight practical techniques for implementing theme switching in web applications—including class toggling, stylesheet swapping, CSS variables, alternate rel links, Less modifyVars, Ant Design/Vant custom themes, Element‑UI dynamic theming, and JSS—detailing code snippets, advantages, and limitations of each approach.
This roundup covers ESLint 8’s full ES2022 support, React’s new Developer Tooling team, several open‑source build tools such as unbuild, tsup, refine and VS Code’s Webview UI Toolkit, plus featured articles on a TypeScript‑based autonomous parking algorithm and a comprehensive guide to implementing Dark Mode on the web.
This roundup highlights the Next.js 11.1 and Vue 3.2 releases with their new features and performance boosts, introduces several emerging open‑source projects such as quickjs‑rs, MDX, mdast, Puerts, wasm‑pack, instant.page and txiki.js, and summarizes practical articles on one‑click dark‑mode support and dramatically shrinking Next.js bundle size.
This article explains how to automatically replace literal color values with Semi Design CSS variables for dark‑mode support by parsing style files with PostCSS, calculating color similarity with chroma‑js, and applying a custom Stylelint rule that can lint and autofix the code.
This article details the background, research, system architecture, specific implementation, SDK integration, and future planning of JD's skinning PaaS platform, which unifies UI theming across web and native apps, supports dark mode, and optimizes resource management.
The article describes how Ctrip and Trip unified their disparate front‑end stacks by building a shared component library, splitting styles, adapting dark mode, implementing i18n/l10n, integrating automated testing in GitLab pipelines, and streamlining release and monitoring to improve development efficiency and reduce duplication.
This article outlines the decision‑making process for styling, icon, dark‑mode, RTL, and global configuration choices when building a custom front‑end component library, comparing Sass/Less, Atomic CSS, CSS‑in‑JS, various icon strategies, and implementation patterns for maintainability and scalability.
This article explains how to create a website‑wide dark mode switch with only HTML and CSS by using an invisible checkbox as a toggle, the :checked pseudo‑class together with +/~ sibling selectors, and CSS filter functions like invert() and hue‑rotate() to transform colors, images and media without any JavaScript.
This article provides a detailed guide on implementing dark mode across web (H5) and native mobile applications, covering system compatibility, CSS media queries, CSS variables, postcss handling, component library adaptation, and platform-specific configurations for iOS, Android, and Flutter.
Implementing dark mode in the Qidian Reading app, this guide explains using CSS custom variables and a custom SCSS loader to achieve low‑maintenance theme switching across native and embedded web pages, handling low‑end devices, code examples, and best‑practice considerations.
This article explains how to add dark mode support to H5 pages by using JavaScript to toggle CSS classes and CSS media queries, discusses system compatibility across platforms, provides practical code examples, and outlines additional media features for broader UI adaptations.
This article analyses the differences between PC and mobile Internet, evaluates how major Chinese apps adapted their launch, splash and home screens to a gray‑white theme for the Qingming memorial day, and discusses various technical solutions such as theme switching, skin packages, server‑side control and local color manipulation for mobile UI dynamic theming.
This article details the motivations, design goals, technical solutions for native iOS, React Native and Web pages, handling of large‑scale parallel development, compatibility strategies, performance measurements and future plans of the dark‑mode adaptation implemented in the 58.com mobile application.
This article explains why dark mode has become a web design priority, describes the system‑level nature of dark/light themes, and provides practical CSS and JavaScript solutions—including media queries, custom properties, color‑scheme, filters, mix‑blend‑mode, and transition effects—to implement seamless dark mode support across browsers.
The article delivers a detailed 117‑page, eleven‑chapter overview of Youku’s full Dark Mode implementation, explaining the motivation, battery and accessibility benefits, design methodology—including color token systems and contrast hierarchy—and the coordinated technical execution across iOS and Android platforms.