From a9b165e3afdc7f6798cc56c455b6f553cdaea9f1 Mon Sep 17 00:00:00 2001 From: web-padawan Date: Mon, 6 Apr 2020 15:30:49 +0300 Subject: [PATCH 1/3] feat: add RTL specific styles --- bower.json | 2 +- src/vaadin-app-layout.html | 27 ++++++++++++++++-- .../drawer-lumo-dark/rtl/chrome.png | Bin 0 -> 6253 bytes .../drawer-lumo-dark/rtl/firefox.png | Bin 0 -> 4899 bytes .../drawer-lumo/rtl/chrome.png | Bin 0 -> 5884 bytes .../drawer-lumo/rtl/firefox.png | Bin 0 -> 4731 bytes .../drawer-material/rtl/chrome.png | Bin 0 -> 6424 bytes .../drawer-material/rtl/firefox.png | Bin 0 -> 5408 bytes .../primary-drawer-lumo-dark/rtl/chrome.png | Bin 0 -> 6897 bytes .../primary-drawer-lumo-dark/rtl/firefox.png | Bin 0 -> 5456 bytes .../primary-drawer-lumo/rtl/chrome.png | Bin 0 -> 6596 bytes .../primary-drawer-lumo/rtl/firefox.png | Bin 0 -> 5304 bytes .../primary-drawer-material/rtl/chrome.png | Bin 0 -> 6839 bytes .../primary-drawer-material/rtl/firefox.png | Bin 0 -> 5853 bytes test/visual/test.js | 14 +++++++-- theme/lumo/vaadin-app-layout-styles.html | 6 +++- theme/material/vaadin-app-layout-styles.html | 7 +++++ 17 files changed, 50 insertions(+), 6 deletions(-) create mode 100644 test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/firefox.png create mode 100644 test/visual/screens/vaadin-app-layout/drawer-lumo/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/drawer-lumo/rtl/firefox.png create mode 100644 test/visual/screens/vaadin-app-layout/drawer-material/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/drawer-material/rtl/firefox.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/firefox.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/firefox.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/chrome.png create mode 100644 test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/firefox.png diff --git a/bower.json b/bower.json index eee6afb..b5ecdae 100644 --- a/bower.json +++ b/bower.json @@ -27,7 +27,7 @@ "dependencies": { "polymer": "^2.0.0", "vaadin-themable-mixin": "vaadin/vaadin-themable-mixin#^1.2.0", - "vaadin-element-mixin": "vaadin/vaadin-element-mixin#^2.0.0", + "vaadin-element-mixin": "vaadin/vaadin-element-mixin#^2.3.0", "vaadin-lumo-styles": "vaadin/vaadin-lumo-styles#^1.1.0", "vaadin-material-styles": "vaadin/vaadin-material-styles#^1.1.0", "vaadin-button": "vaadin/vaadin-button#^2.1.0" diff --git a/src/vaadin-app-layout.html b/src/vaadin-app-layout.html index d365866..d3d7d24 100644 --- a/src/vaadin-app-layout.html +++ b/src/vaadin-app-layout.html @@ -31,6 +31,11 @@ padding-left: var(--vaadin-app-layout-navbar-offset-left); } + :host([dir="rtl"]) { + padding-left: 0; + padding-right: var(--vaadin-app-layout-navbar-offset-left); + } + :host([hidden]), [hidden] { display: none !important; @@ -79,10 +84,14 @@ z-index: 1; } - :host([primary-section="drawer"][drawer-opened]:not([overlay])) [part="navbar"] { + :host(:not([dir="rtl"])[primary-section="drawer"][drawer-opened]:not([overlay])) [part="navbar"] { left: var(--vaadin-app-layout-drawer-offset-left, 0); } + :host([dir="rtl"][primary-section="drawer"][drawer-opened]:not([overlay])) [part="navbar"] { + right: var(--vaadin-app-layout-drawer-offset-left, 0); + } + :host([primary-section="drawer"]) [part="drawer"] { top: 0; } @@ -149,10 +158,24 @@ touch-action: manipulation; } - :host([drawer-opened]:not([overlay])) { + :host([dir="rtl"]) [part="drawer"] { + left: auto; + right: var(--vaadin-app-layout-navbar-offset-start, 0); + transform: translateX(100%); + } + + :host([dir="rtl"][drawer-opened]) [part='drawer'] { + transform: translateX(0%); + } + + :host(:not([dir="rtl"])[drawer-opened]:not([overlay])) { padding-left: var(--vaadin-app-layout-drawer-offset-left); } + :host([dir="rtl"][drawer-opened]:not([overlay])) { + padding-right: var(--vaadin-app-layout-drawer-offset-left); + } + @media (max-width: 800px), (max-height: 600px) { :host { diff --git a/test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..73d3eaa64eff6040b9b8ee52b00abba5b68438db GIT binary patch literal 6253 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 FzX0oG|D*r_ literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/drawer-lumo-dark/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..574396295683e0b5ef436302a1d2cdbc9632d580 GIT binary patch literal 4899 zcmeHJYgp3R*2k=4r!noVM$1yWI9lVaH18K|YH}PKsqrn;GA(aiR8&O53usPqX1tBo zU|MxC#ktZy?gs$or zLNFSm>V1JRjaN>dKD&=wcDv<=f1KWT7-r0%>|4EYGxECow(oYl-u^tgHQ3^QypfHg z^vK4qf4_M2*f%!c@4oTcw&jOiyPF#ScyRLR!0q0a->Q2++w`gsaX{fVu6?VE25MZ!HKkYrFAOA1Ta@BplE<~(2BaxGZit)2E1E1>?3+`3t zfa33z*B|IK&kT)+2?yGraXTD+KtzAC3;7ziY~8ZLa!3d&&vwBj9UyvbQ1eOpb4T-e zgq@|&6E{-_A0Xz7%Wfr%NKTpaffb3Ix2r=n2NjF!i7HWLQM;q!Yrb|$t{nXFuC*e=y+=>h%ne+4|--Xuu=t= zeQx|2#D+kHBbaxztSks)uopF{$2}K8ME2FR_t#lRVyo?z?zzr@1+Q3eJ9E>vL@maA zRaLhnB`~x(t#;=A5wrD=LiD$O1Pab{ZOryWgG^(=&}ja@^48?IIbY+HAP7=B7I2y9 z3rmw1(w~|)w<%uO^(|IRvf`?+u(_MuvhlZXp;KIZTc!_x9 zH%S7QMvLxEI#V1x1vWJi-B_sKYS|84$Y_m140oxYBm_FOzr6RI*D9CqP^Db)^GRE& zGH-ShH$x}ojXGR?@ZzjwA)1Qr_zTSRTGVnxfd{f|x(}y{JyeHn0kp5hs>{muGp`bT zNMuAomQ87*qP|9)5)zM1E{iFF_UDOn=sZ2SDx70AWF8tUm)ReoMXB!2*59I{>($*}8Mi3O zy(hNr0sx-i@%Ti)oLifK){~B?H#Np-rR$(qAnUe6`wZqF5uT7d_-W4Qp~*j0^+b#FidTPr(XCJy9FV3j6ZUPEYNDk2-28 zFdpgI$Z6N;^zrB6qjT205#%93%TaS|sP>9~*6L{PM2c=bMoz~oSy9MPEB;=w-#&$N(bj{s1p%>Tx9Ej2~ zd_eb&n0yiMxslcmd@HObMtv)JT}oMZ+>$){*cUnp=J<{b%7h50K+aCq{8h!7-?I)S z$ozi>8_C6Qi)W_#%ULBN^DJh3;!~o;WcmuABQ!mUQz6)Sl|`WlvxjBlKiP=6crjLJ zrpvZud9;rs&nQQaiUJGGGh>q3zxt*whvDZap?sqm!TUM&oL`DRJ%)oyfp(f@=9>*| ze$eX0P5!XywSCa#SWcuhV2RZnLiBWauj(OA<98sSZa@`vzi!X?h^_N+D|RL-Rf@@T zX9SmW#m3p*n~8WIzmaNbX#DP0UZ1b1t)08aLjIMwr-dY&-f)3XAM$^z>5G4srp?nH z`?koNaDKxC@HyI>wuyQ2p=#zY0fP+wY4pLMx%`0aDk5v6`7)I-{EfrxItm zN~!_W-95vP{*&*q={+EB8RM&)JDx|K?^BE z??AIJ4-~K18<#Mf8=UshH?w%x=q*vS1!{Cs1VC#`vIRcxxh=)bzNjsj9J-AQ@ z>dk_@GU1x6txGnn_`n^xDjvjTio&dPqoH;gqb`haHfd6_BEdTi#(4U z00vJxyH7Ac0Gi#%Z#J-?jruUj2c#=)B~m@CV>?{@*s+0-5MyLuI9` z?zQWjtLH+p_#VR;GH7s-Lvvg5~UO5{PTRsR(9 zLPX~g`Y%_pB8j9(mGSsABof)Wkr?8*#Ax=2dc|3Bm7=bZ-Ps{KL6p~yi{Q|9p%YiT z(_kxLg8$C%gvKqV%893Sspb0;&_>som3#Wr;vvlq>(*>j81L=Y)uyHeS0`>qk)mm{ zqt8ZC7X#h+l7bz#?Wlv9o?^~Y)uTn%A+j7FdU1=Qk89to{?Scw9kg0oR=QeC1jnlO zV5PrR$0(o+Dn1PfBQE~cYtLx=JB*rRQx~Rc+z|SF4Z!Xk^<0wWl3SW>1JYe|XQ0z) z73*lZM6gzzNRWofBw?q3BH=TP3deU%^^2f{Geae^5Og7Su#&OuPcK@r5R&H@g@Te z0Xj95u9qP809lq@ANzW5+c8ig30NCKJowg`j}sWfM5dP1 z`33$mPvW>6@Z=a#N2m+mvoV$&3Nn@J*A{t){Y78G5+@(^#9g4%vVfqN+R~YK>&{}h zozf0}hq|_JfOo|&f@s;SAbSX{QjADqixL3=dmsjc5FkLvLV{Z1xIqmH zvPK1=5Ef+%NZ3T#0!aY@NeGZ4i4c-VLIQy-H~8t?^Wolm?)`ZCW#<2Xo|$*vS>E5w zGq=uxeGER||GAEijsfWOsh@Oo{-XWVwfStDmWB9sMd|45?FOCt?tDt2kVA|qlwIR5 zXHm|i{k0M@amR$Sr<@a-fNtBy+S4^`;>aPL!C4Ay{7&0^`8j9AFSql8S1^3{KY}h! zUIn#2JNF$(k=MujJGL2wYc05BpF1^BQ-Ziz5$hc*{)*o);KCl;fAGP|?qpGxk$ZSA z`1{j+Sz>|Zz1JQN%t7=v;7`S?QjeJ^?A*|yG417a_BE~+3UoKW;N(rJv-Pi=^s&yC zP4<=7CQaM&*(N)u^GWV=^UWVG-AxyDj-+kU|3V2qW{sh#>Z;hDgc|*XpSla|=zDS@ z9jRZ>n0jKTP`ynYyb=XP(BHZK&AGg6;huBWd8W)zixqyI-%9 ztDaJ~P!i_JoLp~z`Emh@b6ci3Thkx~E>wF+BTme?31yVY_GN&=86J1aa5EHX^{_-7 zp*iUf1_Mvrunw$OSE5{>`pfggo@DRf*rA?O+13ry(|oh0c{sDW5WDw=N*y(wZR|ch zU`a$_qr)WJ`g$q(Q>5WTee&Kq3Rg`jXo89N)eI!(K}-U zIV9XsI|vcCjT1Cg`4amY0y4H^{ZiIk%HhrIxEN=OK$>ZpVmRA3%hsKCG#JfrGP-Q3 zqLlenQWy9}90HWU51SBa#(T$kY+Zz)k*L8aQhK2y8kPcR zG&lLRHljL(Tj$)v`qX=T>k}7P__CiB<3nr*srqVk04?PRaQ#NQH`}alHETMTtdiYV zE>7<0SF2+#sc%g+Rde_3<>WdOmLt`w_t%H)d@(aSo7V zbXW?k@ZHDBg%^k1cg^2y zma^$){eAB*URj&M0J;m@Bo(zXKG6)EkU|Vy&oWW47-xP!Pd_a1RE))N(8oXtaTDP! z3n&OovvTmR+C{K8tcan%%J1Q;4kcyAyS)rK%}zMo%H(LBWF2hHCsbZ8H}WW4b<-yy0JN z-Y=KT>t|#y4f*1HP>vw!EAN)rKbBK>M@&2rUuN+MOZRDx8U<~ccV9V%wi@40A0^g( z6UJ_LWGYqnD~7{o7ibs9++}lX)R=gY!O_CnxQ7ljqr>DuKN1YU*K$a?1h1w_;DmCb*aB^ol^G^L4536 z|6!Uh9qhA8z-cZbhF_Pa%{<~Rh@-*2Bxv>$+kx}~SBu2~iOmuQwm+-bB?#q^+76*%T(;(G@HNmTKHmPe z4i5KhmDKd#lGwEoU?Rnbvc$HaRw6cAx9JMw)muF;$x2_eLNpQ$X%F%Zt^rB1Eig$) zc^2p4O%qde=B6%q3$fl@mIR7{Ncg*#e} zQHzESVZvF$R)=Chd^~EiuXP$Zwo7l~;k`L{zQn%xBPQ4x$xMeu&rDY=^RKZ=(`w(N zV+FwE2dUfU4nbg?%2sK1iM3=&&S9(`@@4sZ|yICMSeu86Y+W8u)`#8lT*qb}mI=5%^~3}s&Mzm_fgLo5N%a7w z`VjFkn)mltvua$&4squ|1l09j_@l3$cl9y+8jCa*7-8dqL0O&y&Dni_F-l(31<9`s z%waMo3(I#~^`CC9U(6gdTMHexiD3*6o5AO%oA9dXddc{=+s(D<@D@h?fc7k8BL&Pt zD>3q26nSw(Fu}`0zI$Ll0sjrC?6&90752P5*#v`T?IAhs6dOfPKe2-ZVAsjUETa11 zgAB5!8KjtyRQ8hN(}-V&u4%`Sge|RXs8!H7QeWFh2>a&LbqB3^k@- zylN1RAJ8jlY#uI*h_Tr)Hp8?XJmN@nBPu`SF9o$dOO|(Y)%d7*V*7cGshUmZIMXd| zz^{LLV|G71T&Z2RQc&s9K5axv29!?@Ap`~>DQ7X`AIsTNRz+*a5*r6^KbR8K}30B#N-X>JJ5Ii{NqIoS71;82PB2isMTa zlw2|WY4(yV6Vd7lRgO}kePpYM0Y9^sHqa_o&Ro{=L%FseN28J9DO>&l3Q} z6U8{&^Uk-E!YDA$;bX<>la#u zW}Sv|O3=`g>CDm+=Zwm+^MX}2v&d#gcdOSMf&x0JzBT!aDZvn%hzc?qy}hBKxBou_T)@Ew|Uo$LU57 z(c~6J1J~|E@_+sf9`96Gv5&F>3*ot<1EsX;);pCL0o?gSfEP`8HbJ~)m$?)`=uZmA${wdpUgqcB{5{Z*mSL2l=uQp z^TwDIbI~JdrvbA_f;|a{x*Am6ex@5|C-$`jJwsyhdC6DI^%e?)gLm}19NaqAi~Wtt8eVJJ)|v$fs1Dez;s6Ur z&<60g4G2_aI-+zLiCuR(CTI%jAYSJ~DL2NZdxWwGw*TtjA;bak&1O}{s_+*h?Oe;> z=H@`HkiJuiy3V(C`{c(yW4iN!Wm0# zZCtvzpRo0DP_-#rQA;UWY_-EYRa0~ggP`S8?{-IXA|l!VA{)ftO~#(Z9OUA(SRO1ug_qg{7t|P7$lGVY;n+*mLS3 zW9(w??gOXGVi(Ih03m(s4z1}h(p3@6OV zrvx;4#H`n@LHWD)nSBkbWb`_2NgTn~WrRIksTK@+xq(yOsv_9QBgK}S{&dbs5DZ-x zk;KZa0{41_B}3B_%zck1`2$tLh3}`;TeUXrZ0eQW8*9DRlN{&YKX#tO@=Q-dyMJux z$<_~oqMzX&JD`lMq?IerkYzVgWhM9Slmn>cwWNlboaxMn?mxl}le90h?n#NWl^dn` zXA4=F)1ws4c$H|8;l-aio7&p$zp>Dbksf9~FkN)mZqCnsvf?-f=8KC>=dK*rR@rE% zwa&t12$0>81PVa!EJboe>D?M}9Imo$_-3n$eEEtNC0!tI4}bLSM)bJ8Tr|A=%=2gf z8l6h&%sV`rPxB+M)pB2?gL=T8Wj)(_%i1PZwzuy;tXojn_ndp;aPE*J_h;4kFfKAd z^5QIbi&N6s##?=vwgOYf?dIa9$)?u8rWbjKn8_>+3ud;P8xhr9`mY(B7fAv|GXrK91Y2i-MZlggduIy&Bw;{9jQqkqg1&QNgA^J`EJ7HQ~*zS;ylHn-DFOK90d zzW>w<{%!RBbi%(2`F|>Dlk-2{qx?(5{4;ugM(=;Kj{CEW{x8eS|JTu*)#xo#{wOf~ S;-^o`IgmH_RL%F7um1-V!a6Dd literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/drawer-lumo/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/drawer-lumo/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..4e95b9dab300be4fdeb79d22d6fe4adb26bb1ff5 GIT binary patch literal 4731 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 I+|@gO1DOJ?f&c&j literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/drawer-material/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/drawer-material/rtl/chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..a9122072337307f93ef21af3b26ecf3f200fcf6e GIT binary patch literal 6424 zcmeHL`$N*%wx=3%nsPkn%vAQ0sZ1*^Q_A;anx>3Qoyp9%91}HC)6o)aGb%oyG(mn0>ML3jhFM2EO?H6#(EfLvxee=UWXd(zh1|09f$A-=DpjiIZ?JdBuunf)#r7 zh5cCT!m@Oz!7B4L=aSdVts$jE?N@L?rK$VdJO#Wh|PXU{a?CWoh^v>qb zjqC@&CL{ae8zcR8lTkUq(K|-^Zygj-czDXC+ABcfif%DY{ZS$k1wy>n>Gk!=-tO1g zjT8LGY^OGY=y+a5K&erdlx;N28>56{5_=&A z6KW}FA}4p*706+!CWcAh{(f6LN=Vw`%pK|X^l9YZ&;?m)m-t;SbKl)zz@k`gvg0`< zn)bn*(UI;va3RIVaO*qKx6uh-qR?TM9hUy($=O!JZHctUp}r*1Ro?SJa*08R{`Exl z>L}+4(IGYyFnZC zEOlZ)f{_VMUgI7vI!&#L06U+MZ?HW;kf;AJ&3<#JVW4q?YSDDY=yh*RaNM>t0|Gh~=lVbv!jQeT z*^)T;bES>EzbNQ|vYuueUmCCX&Jc8u%8O>nq%3Z|T_gT+vPO2BqUCsav_C!ERPR-` z7@l3Mhsy+r6`e}XPw)k$aW#34Sp9j19|V7*LLivvJwhajusaW1o9q`RvY7Ot%4Ue~ zuI};;{bXfPZq!gUF<&qmTr$^#5T!v=?5fwNU5k_oxudot(lz@ywRUz&@sLnI$t=!C z)1h3kfFxPgf(unV)Diiv) zzSeu+S-`KWkO!Zjuigh+`_rGtZm2&l3q6__i$>4BYoB3=>+ye?`Os(=in{wW1saGC zMY~XY#cpfaG;6F&QkLbO5KLye(rnMrZ&k=yjkq(xx06hkFTqX6`fIyd39h!v5o(D! zIrlteuP#w$P-G9s;idAEW>vBNZ){;_=_ z`C=*o_P{azdg0{}+w=Abl`YE9u zshR01xaGOLEdV8QM5{{@@faP^0{3;wo6l3^|LSep;(?mEcv7-uOVF;aN4o{eop;H^ z(OQ@l3$pf8}rhfC=9jl^h$Ft{DFcdUwuRk2hn+PT;uD}^TIQLuK z`^r8=)RjN0O}#nOFPy4{c%mLuyK>Vtn+sBYvNi_Lqa5P_ZT}{X7-Wwt=?H)bp?8?S z<#ZgjF_~_$HT7X^27x5&-Rnd&$5|)KHDOU+2+(` zACWLIE3?<4N&u9gHy$}K?ydN? z=eLE&5n;(Lm2=-gik*jQ?gZtF!>f8vr-(D%3URl*%RGbF`$d{nugwlCx(-BY$_=09 zX9!rU;4yh{5~PWud=rcn5d=!qO{>jjbCY_D2T2r(vFJ#|8a% z?^&?(TnKZ<*%W6LSdIJA20p92{1WOce-{20vOMOSz@tLecoN+p4$&{YS7LcFwtMl5#xR z%h|n1#3XuFmuas@m1VfRs#v1Vd9xpZRQ4mj-buqH+oQ z!_yL$vTlbuQIJP@kW)4fbTTqRoNv{}E&ioRXV*kay2z6zr}De6DFE!S)cCXnR(J&n zG5B9h$K=$sFn0JjD&Ds>s0r(g7?gHJFR9WNIHRG;$qn?unF+FNp{R-f?#Q~OMco*O z!$G!~8vJTGbiAj>tJ$=tb?NsiB2s+>Wyoa-<D#>>Kl?;rE^4I@^X(cpR1cI3a2s0q@6s@zh{b zQya6FvPu5>IL*XiCjfK&e?ZjCVdIQ{KBW3V%SB4(`^>#Zu%LL^dmrEnBGCqjS^uf9 zrmanN+}zxNdT_esTyN<5+Db6e;w`b}O05;R|KYyU^78V_Wv320^H6EGI_670_#0jX zw8~*K=jlhy@pS%lM_MqV-H^YD^Wv%I+E=g0tUf^F9TtoAfx(FV=RdY#Pep%s(_7U+ ze{rRDj!u0`~LsyVd?NClBcDWq=E{-HU{ZD}jMU zX#$#Al+NB@w3H-uE=u2MqJ~u0W91Yc%@(3@4n}>?e8t;Xf_E7DH!4pZ?WfGy3|o$1 z*v=E0WP)NXP^}71z4*(^tHBBQ@2L3Cw}y$26W=77#GSZduP6o52n(HI1!>S2bSaVWl;%=k;?fKs_2Cp{d@Vgm6+pB%7j~a+{;i z$;8d20vjQ#<)A4r+eyB!u)te4=>uq&-Kv*pU+E_$@*l3@T=DLdtYE`nl#-@9%TEBP z0}J$b!2na7=6%k7)LI4Nlalpe;=_j>#>+-~3CE?!x^@pF{crEfFwP)qKz6aYKl8;> z>nr!3;rU8R)@i*wXA9zED()p*cZ!FS1&6--v9!}|)16n)bu%=^Y#RVPR(77JWs7gE z%RSV6n8D|I-S4j)IunNGy>wL@EV6n?I~y1n2yQ6C0051<&&(bNzmTR*lv{!0b?THt zltZA6>O=yv*2%oV4O4Z7;!-MzTjecGW9@l8r^vaUx5ir`0-w>gBd}rL7V}uf4b_2X zAa@E1xogRC+C@N<-dO0Yr`ppzOZPBD1pOg_ZZ^DD0!-xf)T#6rZ>h!thC%EFcgF{O6Q}_WFJW<_u@% zb$G1o1ImF~V6IQoz2M)Sc3Q@9ojkYiZrqFVsvMhcnXso^ZrlJXa7YtbUC;{+_cwA?f}c9iWII;FbgCc4QT zs>kD3t-ykO4=?rb6hfwWlb5OBVGk7W@WAYOXjT+3vp!cgR*$d8IV489HP5b45igw( z8zr5sqEF=?2l0XBpdfE;b1VojckiLP&4vQACq?2dNTjRs^^c6$MKy1*9nffRD zTrzUY%a8eiGpa5QxZBSw?+RA$@4QD>ziAkj#O!CEXi`CkI?FxEcEYe%!Pk^E@e`dN zJj&{CV4qwn#M<&`t;Yh#98<&)ab_J?^*K|z0?`sTY&Qem?rcRyTQluEFi1bf_W3=w z%lbImn<+`L*Lt!Y_b4}GhMo{=(DlG} zkb6(_@#-%n$R?sdvIB9q>N0h8yKeKxu(U%q88)!;!egK?nm4iZYGiiWvlw@3UT8w0 zsfw61pNFF`>%__7*gc@aHj&QMv5;L5`c5g7^dUUkq$I# z;^FWX`_uEL6txQlrlYId+-=cPH~*|dbTl&Ba#H4x4{<%bC^o1&=7GF&yjVA&Q`*Z{ zhPHPtOPN#e@lfGQX`He_`{`YJk>=!2*~DtwV(iASZE-LBlU64L#^*Fi$r}<#HtxsV z35R8iVtD~5Q{QU}jDXa#>?0f)^uCWGH+KyULvcA%wAH*{D7anaP$03wy1MgdTM(j3 z0VwT4d`8!qGnDnSftG7D8cHG!OMPBlI0d2uA*I`H2Ikp&8Dxjl&Af&zL||$U}sC7aXlPrg|B&w7lUK@Wj{r~t*HeSatD~J4lX-2Gy!R*aY`1HA1<9!*VI%3XGi`Ju*N9gp3($?M}kqkAij994qRQDJ%om4GpeN!J%!3nrL^o}DL zym4+{^w5)D+ZXH%ar+bG+nr-2>BV5gbvQ}+ZeR6Ci^E9SKt|P`<_T-Ml-{|q5v=7o z*`DwtH_uYU0dYZ*g?i%t0JM8&c7Z<15Z3tzgpn1i1R;K}2!HqaN)tM7db zssEo0%dIIp*NoSc^EbksLG*%76o&A1s?7Y!=uX4Oub-a~9Y1{dtzq?QdgI2P`7Z!R z|0w8~{1xyt!prDo|JFLwpI6cP&q{xK5%E7J|BuQ44{lrE7=zaTAK%jh&lQz(%ja7r QjCzC5`+wi~-QR!yZ}v%Z-2eap literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/drawer-material/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/drawer-material/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..dafa7d38e2a2a66a44d78f5c93cde501d3a8c636 GIT binary patch literal 5408 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 literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..7dd1875b6b0f9c2efb58254544b8d3416979664e GIT binary patch literal 6897 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 W=idy!$%ZQ2Vt>{73gJiJKmH95Y literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/primary-drawer-lumo-dark/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..c76582e33725d0db7966f8047b7e8d14ec03bf8a GIT binary patch literal 5456 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 WnK=2UtN!f>z)t#q*Kj=a*Z%^c+Iw^W literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..0b8b8d465cd0975ce23279aaaae425df71b113e2 GIT binary patch literal 6596 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 literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/primary-drawer-lumo/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..10eb7bed4faba830871ab246207c092785b1198c GIT binary patch literal 5304 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 literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/chrome.png new file mode 100644 index 0000000000000000000000000000000000000000..91979a902618dc308284b2aee4b40360c5daf74d GIT binary patch literal 6839 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 Ya0KT|Fh0JjA_E>j`5Y(zc>dRa0o1Bl`~Uy| literal 0 HcmV?d00001 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/firefox.png new file mode 100644 index 0000000000000000000000000000000000000000..915b6c77e2c83db8b5aee054a327733daea0438e GIT binary patch literal 5853 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 literal 0 HcmV?d00001 diff --git a/test/visual/test.js b/test/visual/test.js index c1bb354..f452968 100644 --- a/test/visual/test.js +++ b/test/visual/test.js @@ -22,14 +22,24 @@ gemini.suite('vaadin-app-layout', function(rootSuite) { suite .setUrl(`/drawer.html?theme=${theme}`) .setCaptureElements('#drawer-tests') - .capture('default'); + .capture('default') + .capture('rtl', actions => { + actions.executeJS(function(window) { + window.document.documentElement.setAttribute('dir', 'rtl'); + }); + }); }); gemini.suite(`primary-drawer-${theme}`, function(suite) { suite .setUrl(`/primary-drawer.html?theme=${theme}`) .setCaptureElements('#primary-drawer-tests') - .capture('default'); + .capture('default') + .capture('rtl', actions => { + actions.executeJS(function(window) { + window.document.documentElement.setAttribute('dir', 'rtl'); + }); + }); }); gemini.suite(`tabs-${theme}`, function(suite) { diff --git a/theme/lumo/vaadin-app-layout-styles.html b/theme/lumo/vaadin-app-layout-styles.html index 724810b..ac049e8 100644 --- a/theme/lumo/vaadin-app-layout-styles.html +++ b/theme/lumo/vaadin-app-layout-styles.html @@ -9,10 +9,14 @@ background: var(--lumo-base-color) linear-gradient(var(--lumo-contrast-5pct), var(--lumo-contrast-5pct)); } - :host(:not([overlay])) [part="drawer"] { + :host(:not([dir='rtl']):not([overlay])) [part='drawer'] { border-right: 1px solid var(--lumo-contrast-10pct); } + :host([dir='rtl']:not([overlay])) [part='drawer'] { + border-left: 1px solid var(--lumo-contrast-10pct); + } + :host([overlay]) [part="drawer"]::before { background: var(--lumo-base-color); } diff --git a/theme/material/vaadin-app-layout-styles.html b/theme/material/vaadin-app-layout-styles.html index f0d691a..e82e483 100644 --- a/theme/material/vaadin-app-layout-styles.html +++ b/theme/material/vaadin-app-layout-styles.html @@ -18,9 +18,16 @@ [part="drawer"] { background: var(--material-background-color); + } + + :host(:not([dir='rtl'])) [part='drawer'] { border-right: 1px solid var(--material-secondary-background-color); } + :host([dir='rtl']) [part='drawer'] { + border-left: 1px solid var(--material-secondary-background-color); + } + :host([primary-section="drawer"]) [part="drawer"] { z-index: 1; } From 87da0f0ec595d7f36c0fc2a4b9e5f74070c83890 Mon Sep 17 00:00:00 2001 From: web-padawan Date: Tue, 7 Apr 2020 10:23:37 +0300 Subject: [PATCH 2/3] chore: update dependencies versions --- bower.json | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/bower.json b/bower.json index b5ecdae..877c312 100644 --- a/bower.json +++ b/bower.json @@ -28,16 +28,15 @@ "polymer": "^2.0.0", "vaadin-themable-mixin": "vaadin/vaadin-themable-mixin#^1.2.0", "vaadin-element-mixin": "vaadin/vaadin-element-mixin#^2.3.0", - "vaadin-lumo-styles": "vaadin/vaadin-lumo-styles#^1.1.0", - "vaadin-material-styles": "vaadin/vaadin-material-styles#^1.1.0", - "vaadin-button": "vaadin/vaadin-button#^2.1.0" + "vaadin-lumo-styles": "vaadin/vaadin-lumo-styles#^1.6.0", + "vaadin-material-styles": "vaadin/vaadin-material-styles#^1.3.2", + "vaadin-button": "vaadin/vaadin-button#^2.3.0-alpha1" }, "devDependencies": { "iron-component-page": "^3.0.0", - "iron-demo-helpers": "^2.0.0", "webcomponentsjs": "^1.0.0", "web-component-tester": "^6.1.5", - "vaadin-demo-helpers": "vaadin/vaadin-demo-helpers#^3.0.0", + "vaadin-demo-helpers": "vaadin/vaadin-demo-helpers#^3.1.0-alpha1", "vaadin-tabs": "vaadin/vaadin-tabs#^3.0.2", "vaadin-icons": "vaadin/vaadin-icons#^4.2.0" } From ec2316f3ca822dc60643f907f24a442abb6e3352 Mon Sep 17 00:00:00 2001 From: web-padawan Date: Tue, 7 Apr 2020 15:38:39 +0300 Subject: [PATCH 3/3] fix: add missing RTL styles --- src/vaadin-app-layout.html | 5 +++++ .../drawer-material/rtl/chrome.png | Bin 6424 -> 6426 bytes .../drawer-material/rtl/firefox.png | Bin 5408 -> 5400 bytes .../primary-drawer-material/rtl/chrome.png | Bin 6839 -> 6841 bytes .../primary-drawer-material/rtl/firefox.png | Bin 5853 -> 5856 bytes .../material/vaadin-drawer-toggle-styles.html | 9 ++++++++- 6 files changed, 13 insertions(+), 1 deletion(-) diff --git a/src/vaadin-app-layout.html b/src/vaadin-app-layout.html index d3d7d24..d5922f3 100644 --- a/src/vaadin-app-layout.html +++ b/src/vaadin-app-layout.html @@ -164,6 +164,11 @@ transform: translateX(100%); } + :host([dir="rtl"]) [part="navbar"], + :host([dir="rtl"]) [part="navbar"]::before { + transition: right var(--vaadin-app-layout-transition); + } + :host([dir="rtl"][drawer-opened]) [part='drawer'] { transform: translateX(0%); } diff --git a/test/visual/screens/vaadin-app-layout/drawer-material/rtl/chrome.png b/test/visual/screens/vaadin-app-layout/drawer-material/rtl/chrome.png index a9122072337307f93ef21af3b26ecf3f200fcf6e..19a1d8dd86c3b6b5f9636789a52309eece2716b1 100644 GIT binary patch delta 4609 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 vlcT#pP(KAPp*lQso`jf2zY9`S7&~i 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 diff --git a/test/visual/screens/vaadin-app-layout/drawer-material/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/drawer-material/rtl/firefox.png index dafa7d38e2a2a66a44d78f5c93cde501d3a8c636..60abd1ed1f554909bcd3f00cbf2cbd03c7c4b833 100644 GIT binary patch delta 3704 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 delta 5247 zcmX9?e>{`x`(IH$=aigt>LfYYIfpp?A{Lrqb?Q_I9SRxN2`%}tB4%cLRG;en5Fv!I zIzoPpXcL=FDw;8sG21Z0md*T{jbYn&KHtBd*L^?tb6xlKzOVazJ@2d8vB~kF6+rMf zdHj4bQ9g|RGgR`2WL~69kNnNQzO80&?b#zvHFu1^9lVriok({$Y1a~M-^8s zvf6$$wSIm+hh{gk)~xU?9E?AuQmEU$0YnKLH%W6KI-VgRN&-4MI;u8+K!3lu{O<2E zi;eY$aR{k?3<8nd|M&R%$MwP7J~MA5Zf|bauYj9bu=J;$C)a03{Tp10JF6?VCD}}I zE>Q}lT+yYLM(5gGPr>S`{FEoZeY3tQXyc)&s<5+YghRa?@eu@A8<$l`#KWfc0v<#; z{Pp^hgIWDkYk!~x4i97RyKa4Gb;7Ndk84bF66B*}i?m^z*4N~5q~e!WtPkpRYt}j6 z{kf_|rIIWD>gp`}YWCBT0)-LRHk;RL|DlBOu|VkU9(24wLTW(vYblwCM&`sCcx(>#pRzbh2`-+$ z*ivQMH^i_O25bpk)4h5za4akLN7#ZhR_a z&-&S>mEClg7-he7tY|KS^uOl%1Y;;?(Vsr$3e;%%e^Z3VvZ*co=Cqsve>3Sd)*?+M z=AH`-4$j_M?CV73j))qa&Ccv^oN0tB-;683IO@|A{JfD6;-6b6FA}}$%)f9(=l@FF zo_Tc9IEG#Mlzej!^KrM!YXBV=$8Lw;t$#o7Lmai~Y396l+o<17+jqO&kT6|r6h|tH z37|dDAy_8W&4WUxgh+PBO%&S4+kNNtD(IcoSiTT4zucyd2p{IqjAX!rCxzD%7YtME z--ITUZ)17huAdLz)Q?%&(k9Rjmy}j!j@4#qjE>pc~|5aB0>)V=doq%+R>MK$N zU1_*(Hm~hm%6^JaO*1mR@f%M140ohrWwW>@uJZe|MPlJAA)xHINi}{pi>Q#=>gs$@ zftbzIS`R=&$Cu*qTSRx^OUI@-BQH5a$5U2L<>ZA<#d@izKE7OM0WYUDwzYZ0e^XyT z1vZ}ck+EouZ=ZK^_I2B5&*kNJ4Gs?e3NhDjfpp?PKuwVJr*r8oD3zpdpy;1YSVbMj zMEUHKi@F{sTx^t=QdsiM)_E9=4Q^?hRY6I_uKJxjf+1X-eW%T}c73W3EGBYXJ0=!d zj#HFj-SgrT`m+q9gnPsDknoI)B&-y|2_A8K{7;Wt;`noUDKi6q6bS%mc^h?g^oToe8fwsDdv)f)CnJls)A52%7>$GriiS97`in_j^AR@n)xKGxp$pc<=nIt6$UN zO;w_6vG(E}Bt?0(qr-N>#?Cc66^qHxt-VR#GhBFqIq&2UNYG6ZV#Z3=%1V7x3}mQmR2+x4R+OBrWizxJyUZ!8zjmT(8e2q8KLAu zEvYeqNn~U`Q_%QySwRS#x%J&E1AWrklNrTY45N6wju4x|pUh8Kp7=FqLzpMfS>vHp znV=@#Lio$a#_lq8Vta+~@6W@=RXv2CBFr{xPJ< zvCabj69jGe<$a&cPUn76*_if+e{s~gV^3Hsz8UyEdSEby(x8!1qzImecS@oo*({q`|3hhzZ+D!6s}f3J;Z7b=kpl$Fd1q> zSZ@;!UnMYHD3`42rg1jrVLIBHXbVtmYN7rS-Kx47EL=jBu-4F5)%V=6nh$wHZj_1m z3^&Cz(PIOurEpARo*){p+Y1ZpsbqrLcY)XW3lz3wVc-C5;rgnUSg@PzN`iqSlL4Fs zFcZWH^@&%9WM~M85;yEVOB<5M>Ui(u`ze!bD==N@DZp5C^Z6%sL9@_QcOnNbX;3Ro zAWlj9ae2(_P?M(K)#}Zl?!EeWhd!JcaeX{J_;UY6%03vCSDPX`wzK5xOF-mI4asUw zJFK1=5Zq2gU?f6}4QuiTq4M&TwW`rBSORL8eW-VqbuZT=Antv}@OJgsBEvOdZoKDs zeVnWs8VvubZ8DrsQMeo*>wfLpID0c26F*&S67R_BQkpLePOS8;#>aP@yMmuFSWTGL z@*qx5c_cjG5F5gYwo3vg_}hyXR_=#GN;{`=pb*P5=@WC1V(7y0Y&mX$dvDTXAhIvd zCY#7%ptgx~I3061Z(Y2<78Dn$=i{~qL}=C>8788y%j#l*H;mzr*`(3@K)_{HkdVQ- zx&C$oliEti7fUEMKm|ou;V90n$@E^8k7P`R)iHYo-)F}LL=~rm+os~OV!EEqZ zAI9Nv7;#QJc2GqEJ&Ca1U~laH_g**B!=?aCnoMD4qlaSp#mzYzEns;Vu`p>ezu}KJ zRYbQBSw;dAYXqq)1KD@jF0{)0;|yuy&5IZ5Ju9oP%QJxmlXG9|nQYXBOmrpYi&9-o zoO+0S?du9r;fvw+oDCxavCr2>nFmnY%EzCsE(lliC3ktc!$kp_6~fW$SU~e-#62g0 zNwqXcWhCn>)}`Z?SjAk`n%)OCZkCz7T@+HpvD|Jaa(TENl{6ugq0mha52&A$cezru z+IOw;Pi0dd<|gaJUSOF@S1=HZcRUT>#TsAr>1DnyFo;6qZ7Xsjmi+njIBk#nA!G;> z%8I6#&Vqe(bIuI};LRfZegD`S=!iLPVzMzk_0bem<^G;O#?pW3v-;Q=` zr(vm1f!QHg8vMSDaM z_Z4E`fRT;r#luAYiu5B_=Q8>TCXIt6%a#<^`wXy25%?r7US(Nq5-ItMWzbEh{e-gf z*2K5vnjJV*KHgF01w}B+87VbGk0e078tim_itj1-G=8ns~N zgqlC^#=m~2al}irC#pp@HtmuGg=*pjv(cXZr*-Y{@ut)hDmvj8#FaxpnC=01auqSt zJKPLg0%9@SG%<(af|h+S?c6H%^FJOl47d=fsiwDJFI*Fe1TUEZO?NDdo9jy9Z!~)@ z!ouH0M5wZCr$l769)lArC|s5gPcN&C0je#U{Glsh;% z1%yhE>x+Mw@hlqX8qa|vmfDf1nBJcW(pf*iWkz^mwUX(YbwYRj2m;;Ss68C@?(grt z+zc;$wO(>Tp#N7p$MhTnO7rb$&lwBV#eyeGD@`rcmwrcYOp`&@?|8*$zZKXFo9rwh zW5?<`8%EEA-mLZ=af~`vY_n|=oDuh+67@;klJCx3G z%a!*H4nFM=Ek6*QDf43iri{6}Yci%bx}&o*RBZ%G>%HY!maTU)L|Bzyq{dttndGS~$8ap7yhyg4+k@ ztQLz{mR@dcMdF)b1gM&WaUZcMBpP1-Gzn%BF^m;bqr9XeJu_33zF{Nj_yc2OWB(27 z|73BIn1j)0cIQoI`~`Yg!)8W%FEDksrgaB<7y7+mjH1a_xHecTlcOaxc0RCB{6LFk zC}?o@Y-;^MW8?2PfW991G6B{j_xC;Fevh&w816)N#1WmoIs}1aBc&aO7e8^S5S85i^H=1%a*u2MX5!y*}TYYgLM; zMcdHr;?72wWp7nZe3T%&Y2%?$9uC~ThoY77QoiyODggD1+fs~gM#%eQi8SK5jWJW1 z8kUN24W&S)7LTkQG4Jezl;|yC&(E8UPw!?v6x;Bwtlq;wMjXH0aWCc5 zT;Bu#z}eHQCEbELaL-*-FG_xL#~{Hsexg0OL-*3ompoj;6Up@A*4zv|AIz^v4m)Yga!txRl~WY=zmG-O@PlnQZ^kDPkz--nK|w#zgzXLLNCi6QftR$@a4h zdv%GvZ_#I|R@{<99l5z=XIraApShwUVfNTv_qnSpjHOiZ9s!AwHIIRe8^WVFz&#n^ z*0IXnp&BF5Xydrb` z7D7t#a&;H3wK=GE)9sHJg-zNxv|u20Zxg-F*S6j0}s$SaeGPSO4ZrW?M zi*=?f+fh-=9$8y#ZH+2+`J-+Rb8^J7^86`y0ODZm>+R+6ZbpgsvA9pZ8zlxgG7jVv4Jd^%uUpK%)t*wKSSbP-~Dpwx~IC zDpAo2?|-Qbu(M4$o48tluc_2@>(y{jtG+RT0{gS28Sn(!d0~oOK=qyBM7E%+)fAOc zS-bQ({YH{WKy`R{xbv9EVEJIx`D%i}H=y9O@3xjz*i02Fe$<>>St*qGEG|Kn{~*_X z{-2Kj1LW0asmEr=AI~csagtEN{+_$UHG{|meboWo-R0>U8E5##qJ{&fX(f+fpeG^g vjguWGL22<=!^ZiY4F-*)-_LK@sfBMoM(`~(Il0~<0D1i8bCUe)rQ81p&Dt42 diff --git a/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/firefox.png b/test/visual/screens/vaadin-app-layout/primary-drawer-material/rtl/firefox.png index 915b6c77e2c83db8b5aee054a327733daea0438e..d23b0d007c80bd26a87477ca2a2d69fcc5ab4fa2 100644 GIT binary patch delta 2967 zcmXw4d05if8veO7I_2avb+g5#28*7oEHQVXWy;V-%Nos`q(!Atqsc9m_|a{erl-kD zGQ|a)7ReOQNC|OaX38y<5^+PsQc+aE4UqMB@jmySf4=8A=R5Ct&iB6G`-yiB?|kTL zL95z=UIu2JJEPD_$&T3g`96eiCm}UG9o5UXT4{p-0KmDo>!fiMg^rk$jk`B_Y7zhZ z<0~-y-4+|_qRv_eT#wIoTrj7_c!qdKGoLf@x(u(TGz=P*5_)u0t$NdGo!|I48LlXp zgnp%Hauluw;RK65P3z)}irn4P z>rcHaFQ1*)4sXt5QDdohKws1ej2sj>!-rBs^4#N)m&o#~b;?+Q!d`E3BO4Ze*y-q* zcSjo{)0T8hxnbm#RmUILU>Tv)y5xLl_-pLJ0IR&LhK#ND#PR*+r~8;M3dt^ndV*zU z0JCN-5$?AhhrAo3U6{X7+=6UHCS~VTiB$d8A{$ZGaoz|VbjJ4ztDBAQ5FEcq4D9pb z-BPkeR((T(^ueiu%-sivV=;x*%Oj8-D_*aJ@ov7h-30KEJH7+QZr+3puLVFRYIB0SGv#q%f`Xv=aMUmTOPHw~O7;8-H zCivA`AyG~(1eOZ7NY3dLGVQM@5*-Jpg6GtJ%gv?;}|F&>DmgjN@2pa5Vs+N z+ksXdj^`J5#*RGI8aj4#6oIcvBM7)NxK>Y^7Bp$eTu$x4LSWjdTEnI^yGH#Qwr@bq zh|Hgy=x(_i+8+<^#8zYgAuMtrvPU@m~v$g z?|$jVL4MurWJ73$SsXzLtZlG^dF2bL)(%p1(VN=T|-%etCLzgZm9r*H~SHFKIrity{fC^Lc>3 zLh%``zNA}AHiBo7Zoad>A6m}GN)^Hi3I#v$DPn6F4ePPKA#*Rb>(rm%77{IMPN-6T zCK%=s9Atnbh5H`AOXW$i8_%4Y{FR^UruiRrHC`TB3^;8HE}GA~tTC`n!7)jN6iNs; zqLkX$O`-%6!f}hbDNeuOjRdJE19NWVfTwvAva&EauHsx}^V=NP=4KD}h2y*?=CVZp z=y&GGl(s+ViB$0}6jU8+W zp^#3epDY)i@qd%`4FLG8%ME@ZPjGT_l1)wqM@B}*5VT_p3k#z`DBbaxjIms+bz82k zbCf9*q1C5<3L#* zovuF2u3P8|F=Mqqf(0#YCMG4tB_x!`!B&|st!yl2TcxC=Jb(5K7L@JS`srDaKqySz z2eVpv3uZ$Y2G`SWbc!uCgORLD&t@ zV>vXtFJ}y|n(9nZyNnJ~dYJRV;BXm!Mod}o!I+fKpLLOSDC5losh$jzcZ98Y>Qlbg z=;!~hUoJYAVLn~Spqs)k^S$E<1q=qm<^dZQ*r)Ch(UqyGFUqIngRf48mnFtZY4$OY zti9=A6WCRo^Z`4KSJDvueFSC1kYch;#4f1G&_@_mE41aVVCp&4h1%RI2ICL0uF-zT zg`1n59lgHX1*7pYaRuI^E>UzsL$QUKd6GY-|&}YwdD7R?kD<|C!lrC zv&)F*Pkm(#5M3DWKP~)N)OMh{Ac0$|(8L?+AMFTR5QcudlXF{2ni>;U$VXtA`Y<^s z2?v$Ag2|k!xBB`M#s|SGlBSc70`jFXYdA}nH0F)QD45=p1qn|W;;B8h!@rEONFJ=C*;|Jqu zjI6MnGB;Eo2`oum8oS3{s*Y0SAKuN~iu|gy=NgttUA=g7w-wN~#eBGLzcsKeFPgPy nO|B(tc(v4$G`xD_+C`|NzUFiJcUBm43V=Qo`UB&@*?<2Bt3^$t delta 2949 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 Ves1)!7aRxN{^fPD{`ln^{{?#sG8F&- diff --git a/theme/material/vaadin-drawer-toggle-styles.html b/theme/material/vaadin-drawer-toggle-styles.html index e1d2480..ac93b7e 100644 --- a/theme/material/vaadin-drawer-toggle-styles.html +++ b/theme/material/vaadin-drawer-toggle-styles.html @@ -8,11 +8,18 @@ min-width: 0 !important; width: 48px; height: 48px; - margin-right: 1em; padding: 0; border-radius: 50%; } + :host(:not([dir="rtl"])) { + margin-right: 1em; + } + + :host([dir="rtl"]) { + margin-left: 1em; + } + [part="icon"], [part="icon"]::after, [part="icon"]::before {