From 6a7f7b5d9aaef607b8014c54252fa63e07ec8260 Mon Sep 17 00:00:00 2001 From: Sherry-hue <37186915+Sherry-hue@users.noreply.github.com> Date: Thu, 20 Mar 2025 12:07:45 +0800 Subject: [PATCH] feat(web): list add sticky && gap attribute --- .changeset/fine-baboons-teach.md | 8 + .../web-elements/src/XList/x-list.css | 33 +++- .../src/transformLynxStyles.ts | 6 + .../web-tests/tests/web-elements.spec.ts | 12 +- .../axis-gap-flow/index-chromium-linux.png | Bin 0 -> 5453 bytes .../axis-gap-flow/index-firefox-linux.png | Bin 0 -> 28242 bytes .../axis-gap-flow/index-webkit-linux.png | Bin 0 -> 4574 bytes .../x-list/axis-gap/index-chromium-linux.png | Bin 0 -> 4069 bytes .../x-list/axis-gap/index-firefox-linux.png | Bin 0 -> 24384 bytes .../x-list/axis-gap/index-webkit-linux.png | Bin 0 -> 3864 bytes .../web-elements/x-list/axis-gap-flow.html | 171 ++++++++++++++++++ .../tests/web-elements/x-list/axis-gap.html | 169 +++++++++++++++++ .../web-elements/x-list/sticky-flow.html | 2 +- .../web-elements/x-list/sticky-offset.html | 2 +- .../tests/web-elements/x-list/sticky.html | 2 +- 15 files changed, 393 insertions(+), 12 deletions(-) create mode 100644 .changeset/fine-baboons-teach.md create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-webkit-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-chromium-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-firefox-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-webkit-linux.png create mode 100644 packages/web-platform/web-tests/tests/web-elements/x-list/axis-gap-flow.html create mode 100644 packages/web-platform/web-tests/tests/web-elements/x-list/axis-gap.html diff --git a/.changeset/fine-baboons-teach.md b/.changeset/fine-baboons-teach.md new file mode 100644 index 0000000000..c815408fbc --- /dev/null +++ b/.changeset/fine-baboons-teach.md @@ -0,0 +1,8 @@ +--- +"@lynx-js/web-style-transformer": patch +"@lynx-js/web-elements": minor +--- + +feat: 1. list adds support for the `sticky` attribute. Now sticky-offset, sticky-top, and sticky-bottom will only take effect when `sticky` is `true`. + +2. Added support for `list-main-axis-gap`, `list-cross-axis-gap`. diff --git a/packages/web-platform/web-elements/src/XList/x-list.css b/packages/web-platform/web-elements/src/XList/x-list.css index b9a024ee1a..ad4e2c82fd 100644 --- a/packages/web-platform/web-elements/src/XList/x-list.css +++ b/packages/web-platform/web-elements/src/XList/x-list.css @@ -8,6 +8,8 @@ x-list { scrollbar-width: none; --list-item-sticky-offset: 0; --list-item-span-count: 0; + --list-main-axis-gap: 0; + --list-cross-axis-gap: 0; } x-list > *:not(list-item) { @@ -29,6 +31,8 @@ x-list::part(content) { overflow: inherit; position: relative; content-visibility: auto; + row-gap: inherit; + column-gap: inherit; } x-list::part(content), x-list::part(slot) { @@ -79,28 +83,33 @@ x-list[scroll-orientation="horizontal"][enable-scroll="false"] { overflow-x: hidden !important; } -list-item[sticky-top], list-item[sticky-bottom] { +x-list[sticky="true"] list-item[sticky-top], +x-list[sticky="true"] list-item[sticky-bottom] { position: sticky; z-index: 1; } -x-list > list-item[sticky-top], x-list > lynx-wrapper > list-item[sticky-top] { +x-list[sticky="true"] > list-item[sticky-top], +x-list[sticky="true"] > lynx-wrapper > list-item[sticky-top] { top: var(--list-item-sticky-offset); } -x-list > list-item[sticky-bottom], -x-list > lynx-wrapper > list-item[sticky-bottom] { +x-list[sticky="true"] > list-item[sticky-bottom], +x-list[sticky="true"] > lynx-wrapper > list-item[sticky-bottom] { bottom: var(--list-item-sticky-offset); } -x-list[scroll-orientation="horizontal"] > list-item[sticky-top], -x-list[scroll-orientation="horizontal"] > lynx-wrapper > list-item[sticky-top] { +x-list[sticky="true"][scroll-orientation="horizontal"] > list-item[sticky-top], +x-list[sticky="true"][scroll-orientation="horizontal"] + > lynx-wrapper + > list-item[sticky-top] { top: unset; left: var(--list-item-sticky-offset); } -x-list[scroll-orientation="horizontal"] > list-item[sticky-bottom], -x-list[scroll-orientation="horizontal"] +x-list[sticky="true"][scroll-orientation="horizontal"] + > list-item[sticky-bottom], +x-list[sticky="true"][scroll-orientation="horizontal"] > lynx-wrapper > list-item[sticky-bottom] { bottom: unset; @@ -141,10 +150,14 @@ x-list[list-type="single"] { display: flex; flex-direction: column; align-items: stretch; + row-gap: var(--list-main-axis-gap); + column-gap: var(--list-cross-axis-gap); } x-list[list-type="single"][scroll-orientation="horizontal"] { flex-direction: row; + row-gap: var(--list-cross-axis-gap); + column-gap: var(--list-main-axis-gap); } /* list-type flow */ @@ -154,6 +167,8 @@ x-list[list-type="flow"]::part(content) { grid-auto-rows: min-content; justify-items: stretch; align-items: start; + grid-row-gap: var(--list-main-axis-gap); + grid-column-gap: var(--list-cross-axis-gap); } x-list[list-type="flow"][scroll-orientation="horizontal"]::part(content) { @@ -162,6 +177,8 @@ x-list[list-type="flow"][scroll-orientation="horizontal"]::part(content) { grid-auto-columns: min-content; justify-items: start; align-items: stretch; + grid-row-gap: var(--list-cross-axis-gap); + grid-column-gap: var(--list-main-axis-gap); } x-list[list-type="flow"] list-item[full-span]:not([full-span="false"]) { diff --git a/packages/web-platform/web-style-transformer/src/transformLynxStyles.ts b/packages/web-platform/web-style-transformer/src/transformLynxStyles.ts index 9ba258f68f..facfa1dc5c 100644 --- a/packages/web-platform/web-style-transformer/src/transformLynxStyles.ts +++ b/packages/web-platform/web-style-transformer/src/transformLynxStyles.ts @@ -268,6 +268,12 @@ const renameRules: { 'flex-basis': [ '--flex-basis', ], + 'list-main-axis-gap': [ + '--list-main-axis-gap', + ], + 'list-cross-axis-gap': [ + '--list-cross-axis-gap', + ], }; export function transformLynxStyles( hypenNameStyles: [string, string][], diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts b/packages/web-platform/web-tests/tests/web-elements.spec.ts index 1b62648473..0f58e0ade5 100644 --- a/packages/web-platform/web-tests/tests/web-elements.spec.ts +++ b/packages/web-platform/web-tests/tests/web-elements.spec.ts @@ -2053,7 +2053,17 @@ test.describe('web-elements test suite', () => { await page.mouse.wheel(0, 500); await diffScreenShot(page, title, 'sticky-y-scroll'); }); - test('full-span', async ({ page, browserName }, { titlePath }) => { + test('full-span', async ({ page }, { titlePath }) => { + const title = getTitle(titlePath); + await gotoWebComponentPage(page, title); + await diffScreenShot(page, title, 'index'); + }); + test('axis-gap', async ({ page }, { titlePath }) => { + const title = getTitle(titlePath); + await gotoWebComponentPage(page, title); + await diffScreenShot(page, title, 'index'); + }); + test('axis-gap-flow', async ({ page }, { titlePath }) => { const title = getTitle(titlePath); await gotoWebComponentPage(page, title); await diffScreenShot(page, title, 'index'); diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-chromium-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-chromium-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..d114ec9aa22aa7136340ad806fe5adf2c179cd89 GIT binary patch literal 5453 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 F?Qe)IH!uJI literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap-flow/index-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..c1a979e2dd045c2a2ed2dd248c7e1c1e1b931cde GIT binary patch literal 28242 zcmeHwcUY5Ix9^)6B!GoTRa#6`6hUw-AP7XIs353-AfUtws0fULC@rxOsdljeBQqi@ z!U!TFC8H>g1yG8Jlo$)BR6zn#a#xaf$N9YToHO^F`<&;y&&7Y>B|H0Fd+oJ;tM2WQ zl@7LJ@J6~0gJI>Qxv@Fg#HKU5W z-+Gmi--<&rqP@&cM4CoR~XT-ci(d19_#+k)+x&9{?!&NfGS zmt8M8zj0m|h00)I1R{wXyPg^3(SAE<=4)3Q|BVC^SyA!{WhRmFS~5hDT5*_#WyLLU zml1sf22ed1SfasIZTyi*B@lRwPHj7U{PbB=Oy7dqhF+2{PsZ*p->Zd&yAz3A-)FD4 z$%)^^J}g6GjUE5;1$wmtd51c7W2Z;TrP~t_nLV?zZibiI>eI2F@Qod*Uoi|B{b#p4m7(M z7BA$VbRw~|Vha!ABeIm)zYw_{#Z*3P6m6X8bpCt8guMO_oR@{O_=h!UH}YtF3&GmQ zU(C@L7))K_d3j8j^>F9iXZI~F2|oU4XSb2Zs9=q~4>^wEdi>7&^fhZfsJgD7*u}B6 zx)8LcM8V7LzO5SKR62-3n(5xp(?4E!N7RGKQ9fnO4{K`2~sLy{ohu+u~ z-!C{4*>|fcf^xU@#p|0Yh+m3%3L+^q4EHUOwaD7^pimH>_hosFRQQ(2!!9QYTq#jn zx!tFPJ!zEC_65JjdMn|pxNMM>js?^?uW`hAaK*sL8OzJh$c<@7TIQq%S{5$rW+`Dy zMJyo7*;VdjoJ&*}K$OSn>PU-BK#Kx;lkCxi`c&-tLajoyhw~>>v3khMKh}amAR5g{J z2&AOvLC5DeZ*#$AlLUaJq?tbzt=|*?$BepH4iP^FhR?QNmVgBRy#g6KeaUKqPUC!A3w-;sJ0lM94WN@((^hZ-e_pv9 z__j^+9OBza;M?hmhinjWF@TL~-Q7D8->$*i*XV9vhx6?ntoww<9T_R#V7S@ry%d~p zDMdisaP01-h%bv7n90F>Z$#`qMMbQabrmUA3IT9^)RG(${x&Xbs*euh%Lv;>*ft_< zBF*~uR?>lejVww*doRGg@2hcR@(5oc~ntlVE{H-)~0RoGS08I}D3(n)nRD#zJ${DD3<026TA zzBvv(e}wUA#=BL^Yc2rqi!0_FoPeX#VDYKW=&?eCltU9eCQGQT zNP@@0v+hzLH3nq#&yh#O>;qzYZLS&NYfCYQk3;9&qDgp>5)O|8b8;8stYMsEVMcMQ zCnHY10Mxci?WLmUKH%ir9q^%UW&;B3QAX8m?6Rg>j-HlQd2Us>yFO)^ZJk*7y zHa*>q#w%iVqoi!T2y@(ldHgqs7XFH4sG%tRrogA0|N2C`|bJi zm|5{F1vES9G5PxS#$lJs8gWvq@}n{-h%6qzdn@AIT@b5a@9ntb&dmYdRi3+Djj-4h z#K6pHFTQV#lpNT&o{+gn0n{CUR~HI(5wCs%cAP!84HS3+!{^~_%%H4J+(oVpDuk< zI?(Iv@Bodw50pe@3pS%2+5$Ac|JWjRapXYLrezhJ#6`|%GCUtV?1#_Ccn!1VHg6BY zr)Ot?Yj|6)IUGIzz?~Eh_b`F?DVNsZ`yD)%uurv_4VOM4W8uj@OOPyVQ`pfHehJI! zeYzX%|9_|p9$ZJPCMiMcQ7;iK?6^Q0NrK)PO>{;8$Djk@HluwfBEAq(%%zf$b&Q2o z6jAZ#xipA)Hy=H{2;cRkpjFcj=pmxi!Ra$OSuoUJ*ilF?8vZ)tkp~^2P%fhx>#R9J*B)x&$XXcj zYd6t@UmNgyD(M#8XE}DWj)c^|-Dc>#2XVSa<|>Kh7`d-RM$M`ItRPyNnNoVdOWA^ zp)rY-(LV1pO~Q?bQz4e=EVCP^&iugUc{EK5yeIe8J#Qxhg$%hdT391Q->KRvfsZCr z_T2R-u~w7AJYH|A!SyQEiD^gRW!$z2>poA(3|&{Ur&yz_I@6|JQ1q5mF%PX@h5gGY zu9IV2h~O^$M!`=IrqgB>xnZ@B8*h%22rILmczzs~nZIqAU6!5sDpGh)jn*D145YUt zq1Ei?9wqR`M<|LT?m(N8=eFgRG#jk;-i@21C6lDcuvf^kvc1|8hkBaky|lWp_rqXh zQO^rbVedBf{Ygko-m0kogoX8H({B`8@Sk`k4ai}ocN2CyNMs^MH|rzTIbLq(T?2l~ z0a|dwJieXRw(+IW=(%T`MJot{28E(KomY|Hq`JbV`a zY`Lf7{DGPNmV+BgR9x*ZzW9bV=e{UVT_5UP5@&qFYoOJYi z%Q4NJIw3#dpYY0v7e{el83%jyFE2??v+)dmHR!ch&|u6zsPuuIVu&LS#@+xhe*ar2 z{&GgjRZ)iKYD|Un6%4E2u!@Cm5w{Em_uQUL4+7$4m{RlGb%|O{tSAIr>{{oaO`7?ADB0LxDPj8qM?pna5YqfuW z2n}BbbL-CA88cNvsXO3M?!tB3={Vs#)A+J8=&g$rygkvAZ{sDTKa)54Asi7nU#d!dReXJbhvv{{35Xkxj5=j~&IWeqC%@)FiF3kfu$6aM|9c z_VjWIUe1MZeaF_5s*7>>{4ouF6HMl-OP`P{ISEX`{Dq!&xG6ZN0*_|y3dl0NgRrW5 zg$ptaJqBP`Jlw(&MN44qhY$PCkf1SlGmw8`;;lmn*;T>9&Dwc|h_i<~Va{AtKB*Q?r zGZymZ5G6`G|LuM#!*P@xt`x3pphRH%XQN&Ksst_E)znR~g06?06AsaR?{w)AT``s*fPLMk5u;D~|O96@pMk8_#~sMWtR-fcOsw#{0~XCrITG=d^yesyMi z9zU8BWwAT@TMf$LU70BgnjwI-=sLpj55LyFf42?JtHi6K2$d~svvBYY6mHF3!cqN~ zT%{u7%V1Y``R=nr`5o1+whP})reua#m#ng_UYAmaHo}P_iY>pshjF@Pk=Zao+=uuElJA-S(j^y!1Bf&$z5^lY=18R5 zdZW8=vRLB2ed^aCEcjZ*d7F^TpL_i*PQ*&vlwD9Pua1u~j5le^;XE-+==+*UAGa`I zxIgkY1lPz0R3l6T7auuGpi!2G4RRUZH^;XDzS% zhHE2Pv33=+1*@<}qDa~X24;JiwJS1TE5P$GUh!cpdR_+6v+nGzF*s&jrb2!7-pPz( zIKf$aA?W<@tN4Ng#Ip8|%@VkT(P4;WR zvv~E~!vqITUII|(r-(%LhYa9Ia6S^8kK{DO%29E3Bo!pWjFAkQ*xIuH+lj}K;Cv)F z2Zb65&PRfCJnQqHWE@6<^M9M*yhRfmF8zfftDV>VV6a?hwXkK;EwyWA$cuhLTq4U7 z_Bc|6eF>D8>or87(1nnVB~3%?p73i>n5!Nos%AfQwegJTkB>2J&w~hgF26EayL5k$ zv_#~>e1vrtbkl~*g-1kz+Bh@)jlIR?MUI0nBjZBqD&19X&%$4eD%!!G6~%*32EBrc zyDxGqh24SrZf8)eu}0?b7);pfPmlOk$x)bJmiibe(${yXp6QlvT;mH`?@@-Cr3tgc9q)J2P`RRbv+P{azf-W zx>@hB&iY;ScvC%olx1vRrKQ$Rg0w%EYNQ6`W8hwF2w#cbIMmKLQ!s^p+JmOu|Ao=^kNodaZAD+hdXgVj{7WFSvL1tjMxI4Mmtp6QHtu&2$p55QM6A&ee!6P*%1@hPw z$gGrTht@wY*R`D3)#`2Q85v%ZJal&1cV15gq5^tLEw}3QgjKsNxz&c+c?rZls*npA z{P2b{(5BYaB-9Gz687x=`aGdb=u=-FX(8-W|4Uh&ykiEo@ZC{P)8I7z3%e-ay6-u^ zU}bUhy=vFXNUg4m9af_B$Uy6y@uR$kzi>ot<;lWVIY@#?hm~trV|`~L7YOIYcb940 z43f6mEA}lBMb@uu@9${R?mFUVC6XdRab!t%lCjW}d$+0K!oSX9viW|}3Y1sN`W=!( zDQD4cKt>4qyDr8_Ge74cS-dm)NeoJvoPef2hpknrco887qU9ao_i9iPqZT^X0=DmL zM7uH_TFvy0CyYg$T@KN-UF;&%FvflWsmd6Qs|c}uLjNpv)QP8T-3mj`KmX!RB#l-Hps1g0y01YAp!kT|ewaj1hTb~%|%uJ18?P|I_nZfiSG!IuO zbq=nPxiFC7P?JyI0gVQEd*^fjcjSO(J4P>OnS37E{^wTJ6)6R*UB!c(xhAXOTT5lr z{D|hT8KDf9nhO=1 ze=t;>$7SDxHQu}byzUC@d8&5u2f1G%SK_olh0dVb!JKxhwTPc#TUyCPk{)d0Ob2U6 z1K1pKC&VKVyALK;7qb{QSuqSze?tw)le9zTZ->_UVj-{nD9J-RO42N~x_(cvE_gGR zqI>aV_evK~g#cHee9zQ(LI>t{qS;-t=bm*XM|5p2>{(y3!q~bMG)JRJy{js1XWIgi z9J8MR5yq+SZ;|p9T3hRjJMVFpjBoh8%&d_DjY$okL#GmmZz=H3zRzB^nqi$`lh1f* z2R@!b&yP@@PiG6WtfBV8_iO-cHi&YO%Fl*vY1pYHR%ddM703qlGckxMry6wY5EP%*5rIwzV z-0T=`YnpJ7#0=HoMw6XEvaXm;43AsK^j2dh59x0#H}7z3cxG%{KhQ`ih2u)Ox8uUA zzv(hk@W<~W*kZ>p8X&k{eL)RbaVY@F<)8Iz zSd7!KW2b*LCDka@yNIn|)8N*U&+FB?8aiykzFwmU3JtA6!Fy)%>N{S#e*Gv9TuvT3 zDAcuFAPj1{mKh)NXbEk7S2QOz{@jgIr<8o438nVi!Hfj%QV&S`#9MzMP3L2zfm4pzgJ(gT~zJ8r{g9pvHb4 z@9_44O#XV(zjSfw6-|eOdPe&|FI#MV2-Y(BNdwuvjuv}|ql&i*sd+b7?_N|#V=$i( ziClxqz0kfF4ocmVey#VU%=}%H#PD&v)=W~_FqQMK^z8UhA35}y-q@W49fId>Cf-t# z9);sx5wT9PcP+He^Dk|}+ILaP!#;d_IDWwtk$V9phIW|Er&=p3*S6Fb zf1KBC`6USQ(sLIMq!$kf5<)r;&}ZeP@D}G-vAFk$W@9n$WZ|xcpzd#u`&NsZ;e@n` z)=`Ufx)Tp2UlYOl@D)}JYwY3_9g#k$H4dM(blkhVgko!@xp#939B;E6)d|UVi!aCe z1y~WNYegCes^hv_Y5G~u??kqz(v!Yk=WL2UV$zz$Sr>dHM3Thr_ZDgga8EwCevxrk zM1U!+N|^uDJ>up&_^mK>EsT*>%uMm+d8UF1#}GQ#$3$I@Q3pag>2} z4N&K9hPWl{n<~Jt!S!Khnc(1dudu)p-!yB_h`lA5ky_wCbe9X2hF1ioxe1g>rbF_b z%GB$}Ft$6O%B>H-oDU|=?_SGjyI!}PtaxP>uRhaa@=%-$*o~S$Kb~hm+qhAaGsyb{ zz^@64r>I$MV29r#7Q-5p{y}<6x(xhOaLO4?TmajxX$y$8R5gII6#DMD=U`|C)I|UD zq0n5aO=YBH0qZ&ga^`P?ocEQ|w7o=WXYQj30hC9_oujz>2x~Az=HUzP@L80(Tz-QLp{J`{^vuXR0plDj191qH*b9Ws$eCn5*)j~ z*Ex?)g*m6Dk7IuYt_4FPei|Goz2N82Rn%{T-$^iWjltyNH<5W%F<-$7y?xt2mA zJ1YmYyIzP+atExsZDhTjdK7B*PXnC~VNfzqV{cyho_t*nhJs)54~9Z}An2JqptHhw z+wG} zg_;?0aMIM|Q+N#xD2 zk(-xYUBWB`ZPpr5{C^uybNA1gN~jm$zupx=sN8JAZ zEfX^0_WvVae#Gq`iTD3WYT$o3!93#XkGT3MH82wIk0km=5`F&@i9Wd2f$88Ys^A@+ znU(K1?{>;I(zNMW&#jsJ$DFojami4tq^loSeFBNkCkaarkWNFdw&$c-QiZ~d z+qB=xAH$bK$8gy1p+t1%bDJ+zd8ttE#gcAAm0Wa(N~}HP`ERm)Z$sfa>z&(NYo;P( z-l?tH%URqtkaoN$5L$LI3K6)ZL?qyfE3;6bz$;4kC1HJK@SOXmu z_wlwCNFI~*?VysZ?^}-g-v9DtBNpT|vE2!%edRA7W$D9mZ~kijH>b6@7!&~r73Sy` zh`-P>var7}12*PA+%a+68X@WPG0A2zE^$BQ?kw$xD_Ba>^zgQeF_U@qI*S|T$i>1f zd?xMvA0?Mn3`Rl$M?-Qv-X7W$EHAG0m;uEA0#j6;70Cya0hIwlm-#udc<8T%7KY6M z3G@os@htXacgguoaifE1)497r<0{YIIyK=D$kTm_0NgsKxWbAxh(6a@G znUYh6o1nIkuy@}+-IY+MaPw9*l}PDD&@fYUnVrvKC?=Gs8|>%uK=A&sO%X}8A~kCP ztnk_1y^=dX)U#Q;BA-@Pnz2n`kZE>>7>+E07vLm`cZQ>x=E zh-1Y9&wd7Z{2gUau1S`e2+Q1*l+-9!1)T~tXAe0@zN-swlip}>PE?7WZ4*N^%HukW z;&wz@@=KKH7Q%kf(W8*Tx8km?@ZO09-uNq)DfEO>`u^qmmSs*J3&kr@_e{y$C48ts zcQBp7Kam{U_rQ>*Jy6SmODk*ri~l%t9Y*a_tTn<0hZSh!OsJyMXX~M}=)8Y?NW*8^ z&b-O|=$W+kUCG*}t8krcnNso6nkN_^`K=O4y3FB(2)K@c-X*!Ds^UCDr+K&|!nnA@ z3mPVJ{V3x@7$yD9wu8O5DIJlK{&uSpF*ZSF{us&;pk3LwSKZl{N%|!f$hbDLP}=D z*Fo7Z?Qa#tm@1IKLWLcl=3sl8%=uq4lZA;{c(WK&ooz9Tn0@N0#h16M5~59@>FRES z0sm4AT>N2QD`~spY7xUP49IG$cXdYDUI?G>OC(*U!S!bshQ4(qg_a3*;Mm)WL#3wT zEoGRCCv-{L_i3;@!rSs|H7|Yax^cLcsGo^jMY>r&$GMkQgDtj{(AMYL2UWx^QS9Hzo4rVD{DrN_ zI)lvNRXW+@g%;mh;E*8en~ z&?G3zHHYpZXBkr&mZh+N@BlYiILO&kwCk#Kjik+Mo9G=|3B2rNt-ztL6zDGtiz9L; zW!Fe96Nbqn2VZao8VunApk`sGU?B5$vH8Y<-hLfn!9c?uC2GYv?z+*eY#o`1x=PxO zB2)g&C$#pxh#Ft1odYL3B;20P8kE=F}n9V=p7@ODY z9yu}OYUs24*Q$M~1YYYL;a1BDVU2sCg|L49!Ro(k!i~bA?8u!3fkU6Xi;08389s~D z>s&NGIDqxN#lljnySv1tfS-0n6=*6%B9oc@KY;*EJ@snA8 z6WyT=jiND{B@A6%@?^bg;D@u6ju6|D6G=Hq+lq$xt3dg+1_i*a4-)VUciNp2p>nd3$L@FI2t-2E*kcx zS;p1wD(^MAF6r)!T?A?c271him*RV#>{p3!;_*!SR-OK!Kc{vV%MU(wwJG@I;-s9r zl~}2m_oN)VF#3Rt_$WTRi`)}LQBPnwNQjXFd<$GoR-1OCPHZJoWC7K*SDunM0M>wf z*0QMvL^_;Wj^DwolN@A(J~FWpQA~^nj5W>9T@76;WNe_yMRMU^4|q-$qplv8%ycg25(qAPSUh>S`lC7|8WyJpSu6h|;u$@$yFNB`N{fcX1F9c&^< zR91nCvsP>_cwt~VzzaJg{xdjRlH2W=rU2w0pVlpx>w)9utxm3fl1)7T{Ym4mESE6g z5{$WY;JGUM7#xGQop018xuQUgfS*MEZZ|EUjV=7sRf&r2gU*r`g3B`Tj4Pd?_`BPv zj%M@|xI>RdUtTBvGgPplG7QUMe*}w{HfQ_HsnFYkWkGL?1aQVfU0iyfO*FK?#f-D@ zAlZNytNDtXBe~8R`s2j#Pc?!jvEkiY{eB~TgWKkM)2~Sycv}{6ty5&3r%GmA1tpm0 zfB3|3ACX8bx<+EK_|H&x#xEkfOy|`nmtD^|$w&siTLe{0?5jB$+KbRNuhaFQl5VQ* zM^QfuVzqfxrQ|N5zwrV_gyjDVArX3+1s|aiQ`zykTNj1G)1J@ zC*>0deiMmtB5M@S4Izvw!Cw*_)l-ZF9h=+iv8|m;tuj`r;F}45uDd4#4aYKoE(lYz(2DGq>JwEU5NFk|tJ4#1$%w z93sIfUOekgr0#aF<Z8Mg(C*5Jm(6dCem}f+BSU5k?SU1QGtfM+9!NEccxbo*N-AH0=BqF?6lv zW% zNb0h}st8CB8-ajCz|laI6o{NgBBuxmB;ibU@a?YV)$OkD?e5!syYo-pOlH0_^Zk9U z@0|U@(?xT=@p=FNG;yv@Ujcwh1^}!nSgQsdiLddeKtC!mU%BiCDmqNZp`G8v?8Y5f z3vJ13L(Twz&KaE3=LbmCsR7?VUX5F66LATxZ0{ZCN3L)_0=3RK9sTg~rL}sZN>|Mi z*WX^*>UK@T`arF2Q13mfk8n7*2Bgl;+YfY4I~_O<-|d7u9hR#*acrWXOwvda&pf$3 zitSTy4kewhGzgata*x&yWj7>O4lSa&iOwkWaFbVfeN}?uzRL-hB8luCfze*B4g@6V zr~z3>;EV57(y9ra_e9M#ZE5YnHAGv*5wg)p*B{!>>8S#H4S`L~z-Mnx-64wY3JvG~ z&`V{Y%xIC4dgmXy$KICfTA`;-IVPl7!anf$t8cyAKDK5KG6I2X67hO zFu5Wv>b6JHiGwJVdK_Ro|Ao^m0L4a%QIFT={uHdO7w>H zB~1%(T@A91qn4y=;TX2Qc!muY$6MCD+BJy_2>V{8_J^WKb6cABu4CPlrp~ph;VNXu z9BK-&y6T5=KlEhS>N&Oykv(db6VhHNuVeSP zm`R?~v2$Nk^E`RQ>-?_owWH(h14;UG&Dvk4892-|f#m#9jMKLX&&%O|S=)~_fR6%! zAJ@KPE&mh#^77nef5>5KJK$|qu7owO3kIzWno8O?_p?;e-sed#lenP)Vf~2Wn`e~( z{P38gdEK}Tz^xAY)pndCBpzPictt2tCb&hJ1T^mO=`gZNQCs<|hL_vf^@Vc#;1$Yx%cqsMaOI8xJz6_dL-qGh-fsUS- zrKdt^AEh$c0=4u~covbPor+xO8!APA%%Oi^y{`jp$DFG5!LM<*i*7+0TMW&&&V+}y zWC{2x>hSy{dHu;T;&D7a#tA}>B1JqEi9pb)%OdjX4Ng8mXY{b7%uR4m+J`vN4e#S$ zO52N;lL!;nz)#9F@Z|yK5uJ*Wwqc?85v9%CeNe{Q=BUHD+W2Q~UmI#5r~ z(PZ#biX=k&r)kN81-dXF3h)4X1NAxq$@5k zj|=ueB%^Vo_<>K8StEtQu1bBikv2$D?pQsIxPu`oRzRz|@bQZQa?=>jj3_xW<%IZ= zzZSkUfVQtc_$NtspuYftHL6JTYs4@YCj`6il#prCGr&IHeLc3r;P%7Mr0tQGidiiC zR*KA{W7n32pUX;7<^ZpD%pC_?a1{%*wXI?3#j%;{oc%Kayc8*etX4BGB zew&uB9T}zamax7L#NWvAzy2y8)cCVwQ#EZs0JBO7;XWuoLvErPkf*cduSW6@Jjp0+i?TuUBu?TEer$GzfUelbnk^QpV_luON!+R<#LLYGkeQIY3n`SoNIYx# zMaXFJDrP&d*oEGnqiD16yL;I))29%T3GM{WcAlyFNDnvFwp{-t(;{JDG9y?WMs-{e zhL5ISJrqk8T*=I_V?`I1G$q$9P6%h|r>xd~6 zkF4CK{V|0bo5ixR5)dXwme*hxKp|FP`|Kz*A7P;=EQY@h%uB3_8K+Zg4G|$&IoMD3Mnh5Ey=&G zbi07rweW;ox?P`>Z$>o4&|^HSr&;WtzDT-hf-vgn(4xe~L^CfOXYkWazhcLkrkTXe zGgLF8tCmAJzbJ_{5D&v(#Si8})ANs)gjzH_-gXBLoBzze2hhOGT@kjLEb#~85lK^@ z9_9hFK|zM8k{iMjm`AF7R$%makG92-LLPOmFBD@lr4xuTjr%$3^S&4P+Dp;0L5G)i zRMPXPHR_z~vw@^h2a0v_1|M%jslHdGCrj2KygQi_-ziPL}1s&6WNlgk@^7+QOL_;mXc0&~cr zx4cn1&tz4M^i+{{wz3H_s9bk7YxosN4S|RnVz+L6vd{L{>Gw^=)wFB!I;>i!UZfJ- z2(#@x<8^61g(R~*JDdXPDLHYI8PnSK0dBe~$o<(BhF&+_UNI2~%c79!hBDOe07lJN z)&^Yd0P#>TP<5D}toF;?rH?)mH*hy(Wl=C$MmJ|Ecy!3V z;a7DOUA!qvK5?+@wXGa8^t9h#MD|~fZqehJYNv%U+TKni%J1-ZTmOq*{vzl9zu-Tu zz2(%{s2XDLDk8j<5O=P1SVZdH15_m|AAkR>p8KUI86wlnRwXOWy+qNvuv6_ioM7mOhPP8<@YB| z?`&NY;ANXIyCBG`Wp7DlYJ4|Ceuv6Px^nvtC4Q`kJ;L-F-h4bgH*(nBt=D=Eypo* zwNXR_Y;16LD=8@r6~&xY5fRNPGf=b@$TCnd4H1~vGqaUD?)i&S z?)uZ&vgZR)?GIiww@t{3LfzJGj&&+d^`M!0z`NpF{s|}7?CQ?)OzzJ4gUw3Js@6Qu z4P)hpX$V|k^Btz-IP}x)cRhSR-$1zbmoa;O_k&NM1ez1=JNYx8@eMm72a{x+x~lw0 zUSGeiYUp3hCN;%0Yp7o)K!XTXrBk5H6#Uxm{mjgLkCu2H^-kQOfM4D$A~}r-hwcfM zHDEiJRz0pN1f#KveW!?oJ)DD&oCxH2x zE=ZZ+R4*5TW-BfJPKe;+Ych=?JE04*-E%H4Kv>cCafE(k_qIHh6sd1@Vz8voc$)EH z3^n}$Pxe*7+DEp*oF0U5CbDrxIHt5j(cAKIC!Hf|MuwWNVSKXEMI^_IX=oOC61;Yp z)gX%A`9n27Ccm{v6~6@6XA1P_a*)I6_&3|@xGK9PhzMG*QY`WMnMY3Mtt&4`dNmXv zvgdBWvtjmfJ1ednt6NI%`p>z|hv1nPS|B@0DO&NP+k#Q<*rTF~K&Y2p$?*yqQaE)` zTemIOL8GnblTNLMw0E(9DNB)I_}_UH?UUciNZ&+pbwZ3>a4I}8P&f9lK*N>*SvoXm zEM}ja^!#>z-3ycC_pylsXHuSBFGE#^h+fVy2OCVuq3q5te!F2+>uuYidjww!0@hd} z5X31;mac5|UQv=tkLiu&sl-rz^nrLm^u=6|dk>d9D7Lmg5$|44#u+9j^1$4|C&F?4 zU^>zsUA85#niz$MhZsM?K9%-zdn@@=Dm!(ny?=?ENOpjfWcDCfzD3!aIx6x{w&l5o z7iu_Rg;#l97wp1o;yl-8xp>WP{MZIv#6rPQlxF)Q*E@Q{aC-H2qBXa@odOG#g~)4h z#_5}@!FNhwJ(e^PZy;EL|{ z1$2QQZhw&=`|AZzFX6__xdWOX7X5W%fKl*lgh>Sx=o-`1aKS_?fT<&qIlSXmt#MNZ zF52Q#pR6j4t)`H>%EbB9GJ<@v;yqOohuOUoyOmaRO4TtYr{`1s4$z&&8Z?KO_F>b@ z00f~U(BG4hBU5E~qN;FF#09ei1raJY^;VOvH3;TtX8h^AN zp)|#_(-CM(N`{`9ra}3fi5ct7beSfyg&3hP#}tr1o0Glc8c{4| zwt3kO9Um+J{|fNyIARV81Ks(2A*ErxA)%?(qK_5>&yR{Vk3{kn5Up$h<-ePUv7ZUX z+j=ZQv;`=4diH~i5IB%O0jO+6@N@kikFscs#rH40f<^vq%r{Nx|tfo?{1kO>$qs6X_ zZvlz|km}vZm#MoiD=5UnJa+fIErW~7@I$}crMbwJUKBT-U=j0_DO84=G-()$~H zS}r53KJ}bEw#;HOh3JHIV)`~-V=0u~-sX=m6GZDK%+5oeTx`hV%d|IG;90jOJoZ2UJC(haglt6RY0QxB#!4_b^=)Q+ahi^|{} zp_C=<4AwTl^U-X90GOTm{IEx0zM4&`PA0_Hxd6oTq$h|tn{d%z`Q?a;&L>2KmhCT$ zAWFv%Qtj8QzeWxfF^}76X(vF$Ft*<{y71n zrkekvoliUJ_Q1oKnMeB~nb#wfO&Gp&-!XdaV22>-$Wdn1HMCtYqgL4^z7&4*{m-^( z-NGI%pH=%JbNvQ6OikCYt75bLzR==ds3!)0M`ESz~r1hDDlPp z{u`Sm#UZH*o0ut7d1yLZ`EuX1u4yRy-aH1EF46LjQEWu%;s0XUO$n;*XQzE*PGYv+itw=#xGJ|+#rHY pW329XhN#%oj6JMZ$3zbm9NYP|{irB%1MuGt3JM6_TeTZ|?t5W<8-D-* literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-firefox-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-firefox-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..c2e3842364f338fafc4da389e8c15985dba21985 GIT binary patch literal 24384 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 literal 0 HcmV?d00001 diff --git a/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-webkit-linux.png b/packages/web-platform/web-tests/tests/web-elements.spec.ts-snapshots/x-list/axis-gap/index-webkit-linux.png new file mode 100644 index 0000000000000000000000000000000000000000..135a417268a35aeabc2503df10f45be6b8434e4c GIT binary patch literal 3864 zcmeH~dr;F?7RPS@g#w1PvXUy0t|Z2m0--98B_XX!5yHcs2&sw?u@^Ge)GF` z?mfSA?&o{Xxreue_%E?sVF>_O60mvGRsdjh08CgGiwz@`1`^Zof@N&=-vDZQ?MDqC zW*Hj-!Ym9=jz#=80Khu~HhmgKEt~i!>F?4^2jSF!xIDG{-BS+_UiUEh0O3@Zxf8u% z-*=xT*!m^^;Foo7(`R;(WfM1>^wG!77RTH>bM(wTRNZu<-}~R&Ztx7Wb81T?yX>uq zZ6(=}Dm#WJyQ8UGX`hhufHj@q zlO10)c##|rSc3~#AFBSe!;6Wfi@~>8u;m~uKm8iEstU!M%dOi(N}qii;RM5;KcsO- zZM4lA-yBk5KQcME{>M!qXxCi_!ATcUUns_n%Sw^@KH3a|cHVW^$VeIX>PLVoJ2)FQ zZ}R2NtE|ECZEoTC?2o-OcTscI<4U~I2 zbYrXsFl^Hfc)WhluUKu?f}=KI0EhUCGe$ex#)301{ro*l5sxfSG8a0U=FfB%!SW5x zKmWx954KqGxebi3jTOEY9%Cm?J^W-CvgSLF8@apOSC!4hsSzM3HcL6X-si=^y<$Q3 z@KQkfSlBe*ROD2QO6o;BZJ99%^1%S7EaZT zh=XBI9P!P`(?jx$m5gLgbk|&(=I?v^USc7#)TPVTZtxj_|*6xcjU9 zO~`?qm2?Q#s;G#6+#f$VvUIfxdF$m7VOnpl25o~sZtrt4D*GW~9zZL)O#h6zv4C;T zzks+6*7CDU-WD;gRWl-g(#CZ1XPiGTKa7dd>3hpX^d)hH7JOEs_c18h4#{)Lo;(mf zM-<~rqB8G(QM8DUSdPDzDl3v*D5Xc6f)XSz`j4+1&U2mo9{71(JH~MQwm+QLzmJyz zo+`Vn7eLPYTo2{=viDnnew#M|^)f2AJ~IEQHwnZTqg$suC00GG6#}wl{a+OviTgq( zc?snFdMmf^U`Agh6RBGR&2X4BowKCF2kNwAP&$&krvPH;r)P*qB0Cf*{$~KJ>zs1(%PF%<1Kmw9q04qFy&y`XUP*>d1#e7>=?V4?UHixifi#D;g@khEuae+O7Ub~*@% zZfJA3b?m*?4EbTex?>m-(<){kd5VOD3f!#nin?$Q3KN22LqT=P;pw`WxT1IX5zFba zLw1bNoWB^XmMz233B?Y?5$*O^&=TfiEl>~$IXVu7=K~3l4CE~NXf0rUOF9gjFS!Pt zeoUJ<>wmx`$`LoXEPnuPB=^^Y`JZyj{3+dDmJ2R;kbEb;QVsz>BNK@Bwp<0aa;{QxjLAGt zNj(O-;l^-@yik#*i&$?R*@Oxu;M=)VH*0UgB38ay%aCWKX#yqkzCY5T|Gg;Xx$g^C z3RjqtQ+pCc)y?Wb^@Mg@88!Fc0yIXf^P7$&5S7@m&kO?(AA|LkkCv&XV|Vovzj6;xA$gz zxO^sSnO{j6Y(NIx21 + + + + + web playground + + + + + + + + + + + + + + + + + 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 + 11 + 12 + 13 + 14 + 15 + 16 + 17 + 18 + 19 + 20 + + + + 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 + 11 + 12 + 13 + 14 + 15 + 16 + 17 + 18 + 19 + 20 + + + + diff --git a/packages/web-platform/web-tests/tests/web-elements/x-list/axis-gap.html b/packages/web-platform/web-tests/tests/web-elements/x-list/axis-gap.html new file mode 100644 index 0000000000..ce31e9fe52 --- /dev/null +++ b/packages/web-platform/web-tests/tests/web-elements/x-list/axis-gap.html @@ -0,0 +1,169 @@ + + + + + + web playground + + + + + + + + + + + + + + + + + 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 + 11 + 12 + 13 + 14 + 15 + 16 + 17 + 18 + 19 + 20 + + + + 1 + 2 + 3 + 4 + 5 + 6 + 7 + 8 + 9 + 10 + 11 + 12 + 13 + 14 + 15 + 16 + 17 + 18 + 19 + 20 + + + + diff --git a/packages/web-platform/web-tests/tests/web-elements/x-list/sticky-flow.html b/packages/web-platform/web-tests/tests/web-elements/x-list/sticky-flow.html index 3846eab443..958d79b437 100644 --- a/packages/web-platform/web-tests/tests/web-elements/x-list/sticky-flow.html +++ b/packages/web-platform/web-tests/tests/web-elements/x-list/sticky-flow.html @@ -53,7 +53,7 @@ - + - + 1 - + 1