bbioonThemes
  • Home
  • Blog

Category: Front-end

Design, Development, Front-end

Styling a native select with the Customizable Select API

Chromium made the native select element styleable. This walks through appearance: base-select, the ::picker pseudo-element, sibling-index() for per-option maths, and the anchor positioning that makes a radial picker possible, without giving up keyboard support.

Read Article
Design, Development, Front-end

Modern CSS features that replaced my JavaScript hacks

A pass through the CSS landing in browsers now: random() and random-item(), clip-path folded corners, the containing-block catch in anchor positioning, and tabular-nums for WooCommerce dashboards that refuse to sit still.

Read Article
Development, Front-end

Replacing Moment.js with the native JS Temporal API

Moment.js is in maintenance mode and still costs you bundle size. The JS Temporal API is native, immutable and Stage 4, so this walks through creating dates, arithmetic, Intl formatting and a time zone refactor in a WooCommerce extension.

Read Article
Design, Development, Front-end

Why SmashingConf Amsterdam is on my list for April 2026

SmashingConf Amsterdam runs in April 2026 at the Pathé Tuschinski. What pulled me in is the live-work format: speakers working through CSS and accessibility problems on stage instead of walking an audience through finished slides.

Read Article
Design, Development, Front-end

CSS corner-shape: bevels and scoops without clip-path

Chromium ships corner-shape, so beveled and scooped corners no longer need clip-path or SVG masks. What each value does, how it pairs with border-radius, and how to ship it behind @supports while Firefox and Safari get plain rounded corners.

Read Article
Bug Fixing, Design, Development, Front-end

Scalable z-index values without magic numbers

Magic numbers like z-index: 99999 are guesses. How I set up z-index tokens in CSS variables, pair a modal with its backdrop using calc(), and use isolation to keep a component’s layering inside the component.

Read Article
Development, Front-end

Dynamic forms in React: schema or component logic

RHF and Zod handle flat CRUD forms well, but branching logic leaks across the schema, the state and the JSX. Where SurveyJS keeps those rules instead, and how to pick between the two.

Read Article
Development, Front-end

Select html in CSS: which root selector to use

Five ways to target the root element in CSS: the plain html selector, :root, :scope, the top-level nesting ampersand, and structural tricks that can only match html. Which ones belong in production, and how their specificity differs.

Read Article
Development, Front-end

JavaScript bookmarklets still beat installing an extension

Bookmarklets still solve small browser problems faster than installing an extension. How to wrap one in an IIFE, why you should URL-encode it, editing the CSSOM instead of injecting a style tag, and what Content Security Policy does to all of it.

Read Article
Accessibility, Development, Front-end

Popover API vs Dialog API: how to pick the right one

Popover API and Dialog API solve different problems: one is for light non-modal UI, the other for true modals that block the page. This post breaks down when to use each, with working code.

Read Article

Posts navigation

Previous 1 … 3 4 5 … 8 Next

bbioonThemes

Senior WordPress Engineer
Toptal & Codeable Expert

Connect

  • GitHub
  • Twitter
  • LinkedIn
  • Codeable

Explore

  • Expertise
  • Work
  • Insights
  • Blog

Resources

  • bbioonThemes
  • Contact
  • Privacy Policy
© 2026 bbioonThemes. All rights reserved.
Privacy