Skip to main

Posts by Date

Page 4 of 12

2022 Posts

  1. Title card,
State of CSS Frameworks,
October 2022
    Video post type

    State of CSS Frameworks

    How can we write our styles in style?

    A panel conversation with library and methodology authors and CSS aficionados about recent features added to CSS, developments in how to write more effective, maintainable CSS in small teams and at scale, and what libraries and trends to investigate.

    see all Video posts
  2. Sass logo in black
on top of bright oklch color gradient
    Link post type

    Sass Color Spaces (Request for Comments)

    A new proposal for color management in Sass

    There’s been a lot of exciting work in the CSS color specifications lately, and since the new features are already starting to land in browsers, we’ve been preparing to add support in Sass as well. My proposal for that is published and ready for public feedback!

    see all Link posts
  3. see all Article posts
    Wireframe of card elements
in different sized containers --
some laid out vertically in small spaces,
others horizontal when there's room.
    Article post type

    Use the Right Container Query Syntax

    Size queries are stable, and shipping in browsers

    Since we got a first look at a Container Queries prototype back in April 2021, the syntax has changed a few times. But now the spec is stable, browsers are getting ready to ship, and it’s time to make sure you’re using the same syntax they are!

  4. Grainy art-deco illustration of a rocket launch
    Podcast post type

    Styling the intrinsic web

    A web development podcast from LogRocket

    I talk with Noel Minchow about how to style the intrinsic web, what that means, and how it’s compatible with responsive design.

    see all Podcast posts
  5. Black text on bright yellow sign,
Caution, slip hazard,
with stick figure falling backwards.
    Article post type

    Not All Zeros are Equal

    And every ‘best practice’ comes with caveats

    There’s a well-established ‘best practice’ that CSS authors (as well as linters and minifiers) should remove units from any 0 value. It’s a fine rule in most cases, but there are a few common situations where it will break your code.

    see all Article posts
  6. A scene wipe transition in Star Wars,
as Luke and C-3PO in a speeder
wipe across a close-up
of Luke and Obi-Wan talking.
Over top, a dotted line shows the transition edge,
and a red arrow shows the transition movement
in front of the speeder.
    Article post type

    Every Transition is a Page Transition?

    Experimenting with the shared element transitions API

    There’s a new web API proposal for transitioning shared-elements across pages. It’s great for making smooth page transitions, but what if we apply it to individual elements with changing styles on a single page?

    see all Article posts
  7. see all Article posts
  8. see all Article posts
  9. Article post type

    Replace Dependabot With a Single Dependency Upgrade Pull Request

    Keeping your project dependencies up to date can become an unwieldy task when Dependabot opens a dozen pull requests every week. We present an alternative approach that uses only one scheduled pull request for all upgrades.

    see all Article posts
  10. Word Wrap Show
    Podcast post type

    Teleportation, PapayaWhip, and Cookies

    This episode went a little off the rails…

    I talk with Claire and Steph about changes to the Container Query syntax, our feelings about web components, named CSS colors, how much we like eating cookies, and other wild tangents.

    see all Podcast posts
  11. Video post type

    Making Sense of CSS Layers and Scope

    CSS is evolving rapidly and new features come online all the time. Join Morten & Miriam to talk about what CSS layers and scope are all about and how they will change how we work with and think about the cascade in the future.

    see all Video posts
  12. School schedule grid
    Case Study post type

    TimeDesigner

    Whole-School Design Thinking & Scheduling

    TimeDesigner helps school teams rapidly create multiple scheduling scenarios from various perspectives, and plan ahead for future iterations. OddBird helped Tegy plan, design, develop, launch, and maintain their school scheduling web app using CSS Grid and custom property wizardry on the front-end, and well-tested Django/Python on the back-end. Currently, the…

    see all Case Study posts
  13. see all Link posts
    fragment of an inverted triangle with the cascade --
cascade layers are highlighted below element-attached styles
and above specificity
    Link post type

    A Complete Guide to CSS Cascade Layers

    Cascade layers are a new CSS feature that allows us to define explicit contained layers of specificity, so that we have full control over which styles take priority in a project without relying on specificity hacks or !important. This guide is intended to help you fully understand what cascade layers are for, how and why you might choose to use them, the current levels of support, and the syntax.

2021

  1. certified ooux strategist badge
    Podcast post type

    Bridging Development and Design

    Sondra and Miriam chat with Sophia about using her ORCA methodology (Objects, Relationships, CTAs, and Attributes) in OddBird’s work with clients. We dive into the ways OOUX facilitates a flow of conversation between designers and back-end developers, and get a sneak peak of Miriam’s work on the new container query…

    see all Podcast posts
  2. Now What?
    Podcast post type

    Developing the Future of the Internet

    Miriam talks to Now What? about why the internet looks the way it does, why designers and developers need to collaborate and how the future of the web must be built around inclusivity and respect.

    see all Podcast posts