emulsion 2.8.8-2.8.9 㧠layout çšã¹ã¿ã€ã«ã«å€æŽããããŸããã®ã§ããããã®èª¬æãããŸãã
ã°ã«ãŒãããã¯ã暪䞊ã³ãã®å€æŽ
åãããã¯ã®å¹ ã¯ãåçå¹ ããfit-content å¹ ã«å€æŽã«ãªããŸããã
åãããã¯åºå®å¹ ããµããŒãããŸããã
fillã¯ãçŸåšã®ãšãããµããŒãã§ããŠããŸããã代æ¿ããšããŠãé«åºŠãªèšå®/è¿œå CSSã¯ã©ã¹ã§ãfill ã¯ã©ã¹ã䜿çšã§ããŸãã
暪䞊ã³ã®æãçŽäžã®ãžã¢ã©ã€ã³ãããã¯ã®è¡šç€ºãå€æŽïŒå®éšçïŒ
is-layout-default ãš is-layout-constrained ã«ã€ããŠ
emulsion 2.8.8 â 2.8.9ã§ãç¹ã«ãis-layout-default ã§ã®ã¹ã¿ã€ã«ã®ä¿®æ£ãè¡ããŸããã
ãã®ä¿®æ£ã¯ã次ã®emulsion 2.9.0ã§ãããã«ç¶ç¶ããŠä¿®æ£äºå®ã§ãã
is-layout-default ãš is-layout-constrained ã£ãŠäœïŒ
ãããã®ã¬ã€ã¢ãŠãã¯ã©ã¹ã«ã€ããŠã¯ãæ¥æ¬èªç°å¢ã§ã¯ã»ãšãã©èª¬æãããŠããªãã®ã§ãããããŒããäœæããå Žåãªã©ã«éèŠãªãã€ã³ããªã®ã§ããªã«?ã£ãŠãšããããå§ããŸãã
ãããã®ã¯ã©ã¹ã¯ãå·Šç»åã®ãã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ãã®ç¶æ ã«ããã©ã¡ããã®ã¯ã©ã¹ãã°ã«ãŒããããã¯ã«è¿œå ãããŸãã
is-layout-constrained ã¯ãON
is-layout-default ã¯ãOFF
is-layout-defaultã¯ãWP6.2ã§ã®is-layout-flowãšåãã§ãã
is-layout-constrained ãæå®ãããã°ã«ãŒããªã©ã®åèŠçŽ ã¯ã³ã¢ã§ã¹ã¿ã€ã«ãèšå®ãããŸãïŒemulsion ããŒãã§ã¯ãlayout çšCSSã䜿ã£ãŠããªãã®ã§ãäžè¬çãªããŒãã§ã®ã話ã§ãïŒ
body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
max-width: var(--wp--style--global--content-size);
margin-left: auto !important;
margin-right: auto !important;
}
éå»ã®ããŒãžã§ã³ã§ã¯ãããã«å ããŠãOWL ã»ã¬ã¯ã¿ã䜿çšãããŠããŸããããããã§ã¯å²æããŸã
ã€ãŸãããã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ããONã«ãªã£ãŠããå Žåã¯ãã³ã³ãã³ããå¹ åºã®å€ãæå®ããªãå Žåã§ããç¹æã®ã¬ã€ã¢ãŠãçšã®ã¹ã¿ã€ã«ãé©çšãããããšã«ãªããŸãã
å®éã«ãã°ã«ãŒãã®åèŠçŽ ã«ã«ã¹ã¿ã HTMLã«èšè¿°ãããã®ã§æ¯èŒããŠã¿ãŸããã
HTMLã®ãœãŒã¹ïŒã«ã¹ã¿ã HTMLãããã¯ã§èšè¿°ãããã®ïŒ
<h2>ã«ã¹ã¿ã HTMLãããã¯</h2>
<span>hello world</span>
<input type="text" class="is-style-start-content" value="hello world" >
<a href="https://example.com">example.com</a>
ã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ãON
ã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ãOFF
ãã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ããOFFã«ããå Žåã¯ãå¹ åºãå šå¹ ãšãã£ãã¬ã€ã¢ãŠããã³ã³ãããŒã«ããæ©èœã¯ã衚瀺ãããªããªããŸãã
ãã£ã衚瀺ã®ä»æ¹ãéãã®ãããããŸããã
ããã©ã«ãããŒãïŒTwenty Twenty Three ïŒã§ãäžèšã®éãã«ãªããã©ããæ€èšŒããŠã¿ããšã以äžã®ãããªè¡šç€ºã«ãªããŸããã
ãªã«ïŒãèšã£ãŠãããããªçµæã«ãªã£ãŠããªããããªãïŒã£ãŠããšã«ãªããã§ãããäžçªç®ã®ãã«ã¹ã¿ã HTMLãããã¯ã®èŠåºãã®äžã®ãinline,inline-blockèŠçŽ ã®äœçœ®ã巊端ã«å¯ã£ãŠããŸãããã
inline èŠçŽ ã䜿çšãããread more blockã¯ã巊端ã«å¯ã£ãŠè¡šç€ºãããããšã¯ãããŸãããããªããã®å·®ãçãŸããã®ã§ãããã
.wp-block-read-more {
display: block;
width: -moz-fit-content;
width: fit-content;
}
ãšãã£ãã¹ã¿ã€ã«ãèŠã€ãããŸããããã®ãããã¯ã«ã¯ãdisplay:blockãæå®ãããŠããŸããinline-block,inlineãªèŠçŽ ã¯ãblockã«å€æŽããªããšããŸã衚瀺ã§ããªããšããããšã瀺åããŠããŸãããä»ãã¹ãããèŠçŽ ã«ã¯ããããã£ãã¹ã¿ã€ã«ãæå®ãããŠããªãããã«ã巊端ã«å¯ã£ãŠè¡šç€ºãããŠããŠããããã«read more blockã®ãããªèšå®ãè¡ãããã°ãå€åäžã§ç€ºããããã«è¡šç€ºããããã ãããšèããŠããŸãã
é¢åããããŠããããªããã
max-width: var(--wp--style--global--content-size);
ã§ãå¹
ãæå®ããŠãããŸãããå®éã«å¹
ãé©çšããããã©ããã¯ãdisplayãšããããããã£ã«ã©ããªå€ãèšå®ãããŠãããã«ãã£ãŠãå¹
ãåæ ãããã©ããã決ãŸããŸãã
ã§ã¯ãããå°ã詳ãããã©ããªå€ã®å Žåã«ãèŠçŽ ã®å¹ ããããŒãžã³ãåæ ããã®ãèŠãŠãããŸãããã
display propertyã®å€ | ã¹ã¿ã€ã«ã®é©çš |
---|---|
block | å¹
ã¯é©çšãããŒãžã³ãé©çš max-widthã¯å¹ããã©ãwidth:autoãåæ |
flex | å¹
ã¯é©çšãããŒãžã³ãé©çš å·Šå³æãã®åŸæ¹ã«ããå Žåãmarginã®èšç®æ¹æ³ããããã¯ãšç°ãªãäœçœ®ããã«æ³šæ max-widthã¯å¹ããã©ãwidth:autoãåæ |
grid | å¹
ã¯é©çšãããŒãžã³ãé©çš å·Šå³æãã®åŸæ¹ã«ããå Žåãmarginã®èšç®æ¹æ³ããããã¯ãšç°ãªãäœçœ®ããã«æ³šæ max-widthã¯å¹ããã©ãwidth:autoãåæ |
inline | å¹ ã¯é©çšãããªããautoã¯é©çšãããªã |
inline-block | å¹
ã¯é©çšãautoã¯é©çšãããªã margin:auto;ã§ã¯ãªãæ°å€ã§æå®ãããå Žåã¯ãmarginã¯æå¹ max-widthã¯ãå®çšäžå¹ããªãã |
inline-flex | å¹
ã¯é©çšãautoã¯é©çšãããªã margin:auto;ã§ã¯ãªãæ°å€ã§æå®ãããå Žåã¯ãmarginã¯æå¹ max-widthã¯ãå®çšäžå¹ããªãã |
inline-grid | å¹
ã¯é©çšãautoã¯é©çšãããªã margin:auto;ã§ã¯ãªãæ°å€ã§æå®ãããå Žåã¯ãmarginã¯æå¹ max-widthã¯ãå®çšäžå¹ããªãã |
display:inline-block; ã®æå®ãããå Žåã«ã¯ãå¹
ã¯ãã³ã³ãã³ãå¹
ãé©çšãããŸãããmargin:auto;ã¯é©çšãããŸããã®ã§ã巊端ã«é
眮ãããŸãã
marginã®åã»ãããå¿
èŠã§ããã!important ãåã»ããããã®ã¯å€§å€ã§ãã
blockãflexã§width ãæå®ãããŠããå Žåã¯ããã©ãŠã¶ãµã€ãºãå€æŽããå Žåã«max-widthããããããã§ããªãŒããŒãããŒãããå¹ ãæå®ããå Žåã¯ãmax-width:100%;ã§äžæžãããªããã°ãªããªãã
is-layout-defaultã®ä¿®æ£ãè¡ã£ããšåé ã«èšè¿°ããŸããããemulsion ããŒãã¯ã©ããªééãããããã©ã®ããã«ä¿®æ£ããããšããŠããã®ãïŒ
Twenty Twenty Twoã®ç©ãŸãã§å§ãŸã£ããã¬ã€ã¢ãŠãã®ã¹ã¿ã€ã«
ã€ãŸãããã¯ããããã¯ãåºå¹ ã®æã«ã¯ãåãããã¯ã¯å¹ ãã£ã±ãã«è¡šç€ºããããšããæå³ã§ãæ®å¿µãªãããemulsionããŒãã§ã¯ãã¡ãã¥ãŒã®èª¬æãæºããããšãã§ããªããšããããšã«ãªããŸãã
ããã¯ããšã£ãŠãæ¥ããããã®ã§ãè¶ å€æ ãªæ¹æ³ãè¿œå ããããšã«ããŸããã
ããã ãèŠããŠåž°ã£ãŠãã ãããã
åãããã¯ãããããŒã³ãšå¹ ãã£ã±ãã«è¡šç€ºããããã«ã¯ãã³ã³ãã³ãå¹ ã«100%ãã»ããããŠãã ããã
block layout ãšäœ¿ãæ¹ â Emulsion Theme 2022/8æé
ãã®åŸããããŒã³ãšå¹ ãã£ã±ãã«è¡šç€ºãããæå³ã«ã€ããŠèããããã«ãªã£ãã
ãã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ãONã¯ãã³ã³ãã³ãã®å¹ ãæå®ããã¯ã©ã¹ããªãèŠçŽ ïŒããã©ã«ãã®ãå¹ ãªãããå«ãïŒã«å¯ŸããŠãâwpâstyleâglobalâcontent-sizeããã決ãæã¡ããã¹ã¿ã€ã«ãã§ããããšã«æãè³ãã
ãã®ããã«èãããšãis-layout-defaultã¯ãå¹ ã¯ã©ã¹ãæããªãèŠçŽ ã«ã¯ãããããã®displayããããã£ã«å¿ããå¹ ã§è¡šç€ºãããšããããšã«ãªããïŒã ãããdisplay:blockãæã£ãŠããå Žåã¯ã芪èŠçŽ ãšåãå¹ ã§è¡šç€ºãã display:inline-blockãªããshrink-fitãªå¹ ã§è¡šç€ºãããããããŒã³ãšè¡šç€ºãããæ¬åœã®æå³ã ãšæããïŒ
ãã®ããã2.8.9ãŸã§ã®ä¿®æ£ã§ãã芪ãããã¯å¹ ã«ãããŒã³ãšäŒžã°ãã以äžã®èšå®ã
.is-layout-default > * {
--thm_wide_width:var(--wp--custom--width--full);
--wp--style--global--wide-size:var(--wp--custom--width--full);
--thm_content_width:var(--wp--custom--width--full);
--wp--style--global--content-size:var(--wp--custom--width--full);
}
以äžã®ããã«ä¿®æ£ããã
.is-layout-default > * {
--thm_wide_width:auto;
--wp--style--global--wide-size:auto;
--thm_content_width:auto;
--wp--style--global--content-size:auto;
}
å®éã«ä¿®æ£çããå床ãã¹ãããŠãããã¡ã«ãããã«çåããããŠããã
.is-layout-default çŽäžã§ãæ瀺çã«å¹
ã¯ã©ã¹ãæå®ãããŠããå Žåã«ããã©ãããŠãã®å¹
ã¯ã©ã¹ãé©çšããã«ãautoã«å€æŽããå¿
èŠãããã®ïŒããšããçåã ã£ãã
ããã©ã«ãããŒãã§ã¯å¹
ãé©çšãããŠããªãããã«èŠãããã©ãçåã¯è§£æ¶ããªã
ãªã®ã§ã2.9.0ã§ã¯ãCSSå€æ°ã®äžæžããããããšããæ¹åã§ä¿®æ£ãè¡ãããšã«ããã
emulsion ããŒãã§ã¯ãaligncenter,alignleft,alignright,alignwide,alignfullã®5åã®ã³ã¢å¹
ã¯ã©ã¹ã«å¯Ÿå¿ããŠããŸãããä»ã«è¿œå CSSã¯ã©ã¹çšã«alignnone(width:var(--wp--style--global--content-size)
)ã䜿ããŸããããããã®æ瀺çãªå¹
ã¯ã©ã¹ã䜿ã£ãå Žåã¯ã.is-layout-defaultã§ããå¹
ãé©åã«åæ ããããšã念é ã«çœ®ãããšã«ããŸãã
ãã®ããã«ããããšã§ããã¿ãŒã³ãªã©ãã匵ãä»ãããããããã¯çãããæ£ããæåã瀺ãããã«ãªãã®ã§ã¯ãªãããšæãã
Tips
ãã³ã³ãã³ãå¹ ã䜿çšããã€ã³ããŒãããã¯ãON ã®ç¶æ ã§ãã«ã¹ã¿ã HTMLã«èšè¿°ããèŠçŽ ãã巊端ã«è¡šç€ºãããŠããŸãå Žåã«ã䟿å©ãªã¯ã©ã¹ã
is-style-start-content, is-style-start-wide classes
<p style="display:inline-block">巊端ã«è¡šç€ºãããŠããŸããããã¯</p>
<p style="display:inline-block" class="is-style-start-content">巊端ã«è¡šç€ºãããŠããŸãããã㯠ã¯ã©ã¹ãè¿œå ããŠäœçœ®ä¿®æ£</p>
<p style="display:inline-block" class="is-style-start-wide">巊端ã«è¡šç€ºãããŠããŸãããã㯠ã¯ã©ã¹ãè¿œå ããŠäœçœ®ä¿®æ£ãå¹
åºäœçœ®ã«ä¿®æ£</p>
example
巊端ã«è¡šç€ºãããŠããŸããããã¯
巊端ã«è¡šç€ºãããŠããŸãããã㯠ã¯ã©ã¹ãè¿œå ããŠäœçœ®ä¿®æ£
巊端ã«è¡šç€ºãããŠããŸãããã㯠ã¯ã©ã¹ãè¿œå ããŠäœçœ®ä¿®æ£ãå¹ åºäœçœ®ã«ä¿®æ£
ãµã€ããšãã£ã¿ emulsion 2.9.0å€æŽäºå®
ãã¿ã³ç¶ã®èŠçŽ ã®ããã©ã«ãã®ããã¹ãè²ãšèæ¯è²ãé©åã«è¡šç€ºã§ããªãåé¡ãä¿®æ£
emulsion ããŒãã§ã¯ããã¿ã³ç¶ã®èŠçŽ ãäžæ¬æå®ããCSSå€æ°ãçšæããŠããããã¿ã³ãããã¯ãRead Moreãããã¯ãã³ã¡ã³ãã®ç·šéãªã³ã¯ãçã ã¯ããã®å€æ°ã䜿ã£ãŠããŠããŸãã
ãã®CSSå€æ°ã®å€ãå€æŽããå Žåã«ãé©åã«é©çšãããªãããšããããä¿®æ£ãè¡ããŸããã
ãã¿ã³ã®ããã©ã«ãèæ¯è²ã¯ã以äžã®æ¹æ³ã§å€æŽã§ããŸãã
ãµã€ããšãã£ã¿ã®ãè¿œå CSSã«ä»¥äžãè¿œå ããŸãã
body{
--wp--custom--color--button-text:#fff;
--wp--custom--color--button-bg:blue;
}
ãªã³ã¯è²ãåæ ããŠãªãåé¡ãä¿®æ£
ãªã³ã¯hoverè²ã¯ãã°ããŒãã«ã¹ã¿ã€ã«ã§ã®è²ã®æäœã¯åäœããŸããã
hoverè²ãµããŒãããŸãã
ãªã³ã¯è²ã¯ã--wp--custom--color--pallette-primary
ãããŒè²ã¯ã--wp--custom--color--pallette-secondary
ã«é¢é£ä»ããããŠããŸãã®ã§ããããã®CSSå€æ°ã®å€ãå€æŽããŠããã ãããšã§å¯Ÿå¿ã§ããŸãã
ã°ããŒãã«ã¹ã¿ã€ã«ã®å€æŽã«ã€ããŠã®Tips
ã°ããŒãã«ã¹ã¿ã€ã«ã®å€æŽãè¡ãå ŽåãäŸãã°ãèæ¯è²ãããå°ããèªåã®æèŠã«åããããããšãã£ãäºããå€æŽãè©ŠããŠã¿ããããããšããããšæããŸãã
é»ç³»ã®èæ¯ã«ããå Žåã¯ãé»ç³»ã®ã¹ã¿ã€ã«ããªãšãŒã·ã§ã³ãéžæããŠããèæ¯ãå€æŽãçœç³»ã®èæ¯è²ãèšå®ããå Žåã¯ãçœç³»ã®ã¹ã¿ã€ã«ããªãšãŒã·ã§ã³ãã»ããããŠãããèæ¯è²ã調æŽããããã«ããŠãã ããã
èæ¯è²ãå€æŽããå Žåãããã¹ãè²ãå¿
ãæå®ããããã«ãå§ãããŸãã
ããã¯ãã°ããŒãã«ã¹ã¿ã€ã«ã®å€æŽã ãã§ãªãããããã¯ã®è²æå®ã®å Žåãåæ§ã§ã
倧æµã®å Žåãããã³ããšã³ãã衚瀺ãããšãã£ãã·ã¥ãå¹ããŠæ°ããèšå®ãããã«åæ ããªãã®ã§ãF5ã§ãªãã¬ãã·ã¥ãããã Control + Shift + R (win)ããå§ãããŸãã
ã¹ã¿ã€ã«ããªãšãŒã·ã§ã³ã®èšå®ããªãããŒãçã§ã¯ãã¬ããã®è²ãå€æŽããããšã§å¯Ÿå¿ã§ããŸãã
ãã¬ããã®é è²ã§ãã©ã®è²ãã©ã®éšåã«äœ¿ããããã¯ãããŒãã«ãã£ãŠç°ãªããšæããŸãããemulsionããŒãã®å Žåã ãšã以äžã®ããã«ãªããŸãã
- èæ¯è²
- ããã¹ãè²
- ãªã³ã¯è²
- ãªã³ã¯ãããŒè²
- äºåè²
- äºåè²ãèæ¯è²ã®åå¯Ÿè² (Complementary colors â Wikipedia)
emulsion ããŒãã®ãããã¯ãã¬ãã
Note:ãemulsion ããŒãã§ã¯ãäžèšã®ã°ããŒãã«ãã¬ãã以å€ã«ã段èœãããã¯ãèŠåºããããã¯ãã°ã«ãŒããããã¯ããã¿ã³ãããã¯ãã§ã¯ãããã¯ãã¬ããã䜿çšããŠããŸãããããã¯ãã¬ããã¯ã匷調ã®ããã®ãã¬ããã§ãã
ãã®ãã¬ããã¯ããã©ã«ãã§ã以äžã®CSSå€æ°ãå®çŸ©ãããŠããŸãããããã¯ãã°ããŒãã«ãã¬ãããšéãããµã€ããšãã£ã¿ã®ãã¬ããã§ã¯èª¿æŽã§ããŸããã®ã§ãè¿œå CSSçã§ãå¿ èŠãªå Žåã¯ã«ã¹ã¿ãã€ãºããŠãã ããã
- é»
--wp--custom--color--pallette-blocks-black: #000000
- çœ
--wp--custom--color--pallette-blocks-white: #ffffff
- Muted Color
--wp--custom--color--pallette-blocks-muted: #ecf0f1
- Alert Color
--wp--custom--color--pallette-blocks-alert: #ED4F32
- Warning Color
--wp--custom--color--pallette-blocks-warning: #EDE04D
- Notice Color
--wp--custom--color--pallette-blocks-notice: #4bb1cf
ãªãããšãããšããã¬ããã®è²èšå®ãè¡ããããçœç³»ã®ãã¬ããïŒçœç³»ã®é è²ã®ã¹ã¿ã€ã«ããªãšãŒã·ã§ã³ïŒã§ãèæ¯è²ãå€æŽããå Žåããã¬ãããçœç³»çšã®ãã¬ããã®ãŸãŸã«ãªããæçš¿ãªã©ã§é è²ãã»ããããŠããå Žåæå³ããªãé è²ã§è¡šç€ºãããŠããŸãäºãããããã§ãã
emulsion 2.9.0ã§ã¯ãçœç³»ã®é
è²(ããã©ã«ã)ã§ãèæ¯è²ãé»ã«å€æŽãããããŠãããããªãã«å€æŽå¯èœã«èª¿æŽããŸãããããã¬ããã®åé¡ã¯ä¿®æ£ã§ããŠããŸãã
theme.jsonã®æžãæãäœæ¥ãè¡ãããã³ããšã³ãã§ã¯ããã¬ããåé¡ã®å¯Ÿçã®èŠéããç«ã¡ãŸããã(2023/10/17)
ãã ããæçš¿ã®ç·šéç»é¢ã§ã¯ãã³ã¢ã®ãâwpâpresetâxxxãCSS å€æ°ã«äŸåããã¹ã¿ã€ã«ãå€æ°èŠãããŸãããã®ãããé»ç³»ã®èæ¯ã䜿çšããå Žåã¯ãé»ç³»ã®ã¹ã¿ã€ã«ããªãšãŒã·ã§ã³ãéžæããå¿ èŠããããŸãã
WordPressã§ã¯ãããã³ããšã³ãã§ããããã¯ã¯ã©ã¹ã䜿çšããªããããã¯ããããŸãïŒul, ol, p) ãªã¹ããããã¯ã®èæ¯ã®å€æŽãè¡ããšãä»ã®ãªã¹ãèŠçŽ ã®èæ¯ã«ã圱é¿ãåãã ãããŸãã®ã§ã泚æãå¿ èŠã§ãã
emulsion 2.9.0 + WordPress 6.4 ã§ã°ããŒãã«ã¹ã¿ã€ã«ã®ãµããŒãã®èŠéã
è²
é ç® | çš®å¥ | ããŒããµããŒã |
---|---|---|
ããã¹ã | ããã¹ãè² | ã |
èæ¯ | èæ¯è² | ã |
ã°ã©ããŒã·ã§ã³ | ã | |
ãªã³ã¯ | ããã¹ãè² | ã |
ãããŒè² | ã | |
ãã£ãã·ã§ã³ | ããã¹ãè² | ã |
ãã¿ã³ | ããã¹ãè² | ã |
èæ¯è² | ã | |
èæ¯ã°ã©ããŒã·ã§ã³ | ã | |
èŠåºã | ããã¹ãè² | ã |
èæ¯è² | ã | |
èæ¯ã°ã©ããŒã·ã§ã³ | ã |
ã°ããŒãã«ã¹ã¿ã€ã«ããµããŒãããããã«ããã¿ã³ã®é è²ãå€æŽã«ãªããŸãã
äŸ
midnightã®èæ¯ã«ããããæãè¿œå ããŠãããã®ãåé€ããŸãã
ãããæã衚瀺ããããã«äœ¿çšããŠããtheme.jsonã®èšå®ã¯ã以äžã®éãã§ãã
å¿ èŠã«å¿ããŠä¿®æ£ããŠãã ãããïŒã°ããŒãã«ã¹ã¿ã€ã«ãèæ¯ã°ã©ããŒã·ã§ã³ãèšå®ãããšãã«åœ±é¿ãåºãå¯èœæ§ããããŸãïŒ
{
"version": 2,
"title": "Midnight",
"settings": {
"color": {
"gradients": [
{
"gradient": "radial-gradient(circle at 5px 5px,rgba(0,0,0,.3) 2px,transparent 0px,transparent 0px) 0 0 / 8px 8px, linear-gradient(180deg, var(--wp--preset--color--base) 0%,var(--wp--preset--color--base) 200%)",
"name": "Dots",
"slug": "dots"
}
]
}
},
"styles": {
"color": {
"gradient": "var(--wp--preset--gradient--dots)"
}
}
}
ã¿ã€ãã°ã©ãã£ãŒ
æªå¯Ÿå¿
ã¬ã€ã¢ãŠã
ããã§ã®ããã£ã³ã°ã¯ãbody èŠçŽ ã®ããã£ã³ã°ïŒbodyèŠçŽ ã®å åŽäœçœïŒã«ãªããŸãã
ãããã¯ééã¯ãã°ãªãã衚瀺ã®ããã¯ã¹ã®ééãã«ã©ã ãããã¯ã®ééãªã©ã«åœ±é¿ãåã³ãŸãã
é ç® | çš®å¥ | ããŒãããµããŒã |
---|---|---|
å¹ | ã³ã³ãã³ã | ã |
å¹ åº | ã | |
ããã£ã³ã° | åçŽæ¹å | ã |
æ°Žå¹³æ¹å | ã | |
ãããã¯éé | ã |
sigh
å æ¥ãæ°ããæ©èœããããã¯ã°ã«ãŒãã®èæ¯æ©èœã䜿çšããå Žåãmin-heightã®ã¹ã¿ã€ã«ãäžæžããããŠãmin-heightæ©èœã䜿çšã§ããªãåé¡ããããæ¯èŒççæéã§ãã®åé¡ã¯ä¿®æ£ãããŸããã
ã»ã£ãšããŠãããšãæ°ããããã³ãã¬ãŒãããŒãã®è¡šç€ºã«åé¡ãçºçããŠããããã§ãã
Twenty Twenty Threeã®äŸ
ãã®åé¡ãé²å±ããªããšãããŒãã®ã¢ããããŒãã¯è¡ãããããããŸããã
æ®å¿µã ãªã ( futenberg 16.8.1 )
WordPress 6.4-RC1 ã«ãŠããã®åé¡ã¯çºçããªããªããŸããã
é¢é£èšäº