Skip to content

Implement flex-wrap: balance and flex-line-count (CSS Flexbox Level 2) - #12

Open
nicoburns wants to merge 2 commits into
mainfrom
devin/1786712136-flex-wrap-balance
Open

Implement flex-wrap: balance and flex-line-count (CSS Flexbox Level 2)#12
nicoburns wants to merge 2 commits into
mainfrom
devin/1786712136-flex-wrap-balance

Conversation

@nicoburns

Copy link
Copy Markdown
Member

Summary

Implements the CSS Flexbox Level 2 balancing features, Servo-only and gated behind a new layout.flexbox.balance pref (default off):

  • flex-wrap now parses the full Level 2 grammar nowrap | [ wrap | wrap-reverse ] || balance. The property switches from a generated keyword property to a custom specified::FlexWrap type (which is also the computed value) with two new variants:
    pub enum FlexWrap { Nowrap, Wrap, WrapReverse, Balance, WrapReverseBalance }
    wrap balance, balance wrap, and bare balance all compute to Balance; wrap-reverse balance computes to WrapReverseBalance; nowrap balance is rejected. Serialization round-trips to the canonical forms balance / wrap-reverse balance. The balance keyword only parses when layout.flexbox.balance is enabled (always false on Gecko builds).
  • New flex-line-count longhand (positive <integer>, initial 1, animatable by computed value), engine = "servo" with servo_pref = "layout.flexbox.balance", per https://drafts.csswg.org/css-flexbox-2/#flex-line-count-property.

Gecko compatibility: since flex-wrap is no longer a keyword property, gecko.mako.rs gains manual set/copy/reset/clone_flex_wrap impls mapping to StyleFlexWrap (the balance variants, unreachable on Gecko, fall back to Wrap/WrapReverse). flex-line-count is skipped entirely for Gecko.

Verified with cargo build --features servo; consumed by DioxusLabs/blitz to plumb both properties through to Taffy's balancing implementation (DioxusLabs/taffy#1105).

Link to Devin session: https://dioxus.staging.devinenterprise.com/sessions/b7bd5b365d054b87a6053872323832b2
Requested by: @nicoburns

…el 2

Adds the full Level 2 flex-wrap grammar (nowrap | [ wrap | wrap-reverse ] || balance)
with Balance and WrapReverseBalance computed values, and a new flex-line-count
longhand (positive integer, initial 1). Both are Servo-only, gated behind the
new layout.flexbox.balance pref, and disabled for Gecko.
@staging-devin-ai-integration

Copy link
Copy Markdown

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR that start with 'DevinAI' or '@devin'.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant