[{"data":1,"prerenderedAt":1226},["ShallowReactive",2],{"docs-side-nav":3,"docs-header-nav":197,"/docs/examples/dividers":270,"docs-bottom-nav":1153},{"id":4,"extension":5,"items":6,"meta":194,"stem":195,"__hash__":196},"navigation/data/navigation.json","json",[7,34,46,70,104,155,170],{"name":8,"items":9},"Getting Started",[10,13,16,19,22,25,28,31],{"title":11,"path":12},"What is Maizzle?","/docs/introduction",{"title":14,"path":15},"Installation","/docs/installation",{"title":17,"path":18},"Editor Setup","/docs/editor-setup",{"title":20,"path":21},"Compatibility","/docs/compatibility",{"title":23,"path":24},"Upgrade Guide","/docs/upgrade-guide",{"title":26,"path":27},"Resources","/resources",{"title":29,"path":30},"Glossary","/glossary",{"title":32,"path":33},"CLI","/docs/cli",{"name":35,"items":36},"Concepts",[37,40,43],{"title":38,"path":39},"Environments","/docs/environments",{"title":41,"path":42},"Tailwind CSS","/docs/tailwindcss",{"title":44,"path":45},"Build Process","/docs/build-process",{"name":47,"items":48},"Configuration",[49,52,55,58,61,64,67],{"title":50,"path":51},"CSS","/docs/configuration/css",{"title":53,"path":54},"Build","/docs/configuration/build",{"title":56,"path":57},"Server","/docs/configuration/server",{"title":59,"path":60},"Components","/docs/configuration/components",{"title":62,"path":63},"Expressions","/docs/configuration/expressions",{"title":65,"path":66},"PostHTML","/docs/configuration/posthtml",{"title":68,"path":69},"PostCSS","/docs/configuration/postcss",{"name":71,"items":72},"Development",[73,76,79,81,83,86,89,92,95,98,101],{"title":74,"path":75},"Layouts","/docs/layouts",{"title":77,"path":78},"Templates","/docs/templates",{"title":59,"path":80},"/docs/components",{"title":62,"path":82},"/docs/expressions",{"title":84,"path":85},"Tags","/docs/tags",{"title":87,"path":88},"Assets","/docs/assets",{"title":90,"path":91},"Events","/docs/events",{"title":93,"path":94},"Functions","/docs/functions",{"title":96,"path":97},"Markdown","/docs/markdown",{"title":99,"path":100},"Plaintext","/docs/plaintext",{"title":102,"path":103},"API","/docs/api",{"name":105,"items":106},"Transformers",[107,110,113,116,119,122,125,128,131,134,137,140,143,146,149,152],{"title":108,"path":109},"What are Transformers?","/docs/transformers",{"title":111,"path":112},"Filters","/docs/transformers/filters",{"title":114,"path":115},"Inline CSS","/docs/transformers/inline-css",{"title":117,"path":118},"Safe Selectors","/docs/transformers/safe-class-names",{"title":120,"path":121},"CSS Purging","/docs/transformers/purge-css",{"title":123,"path":124},"Shorthand CSS","/docs/transformers/shorthand-css",{"title":126,"path":127},"Attribute To Style","/docs/transformers/attribute-to-style",{"title":129,"path":130},"Remove Attributes","/docs/transformers/remove-attributes",{"title":132,"path":133},"Add Attributes","/docs/transformers/add-attributes",{"title":135,"path":136},"Replace Strings","/docs/transformers/replace-strings",{"title":138,"path":139},"Widow Words","/docs/transformers/widows",{"title":141,"path":142},"URL Parameters","/docs/transformers/url-parameters",{"title":144,"path":145},"Base URL","/docs/transformers/base-url",{"title":147,"path":148},"Six HEX","/docs/transformers/six-hex",{"title":150,"path":151},"Prettify","/docs/transformers/prettify",{"title":153,"path":154},"Minify","/docs/transformers/minify",{"name":156,"items":157},"Starter Components",[158,161,164,167],{"title":159,"path":160},"Spacer","/docs/components/spacer",{"title":162,"path":163},"Divider","/docs/components/divider",{"title":165,"path":166},"Button","/docs/components/button",{"title":168,"path":169},"VML","/docs/components/vml",{"name":171,"items":172},"Examples",[173,176,179,182,185,188,191],{"title":174,"path":175},"Spacers","/docs/examples/spacers",{"title":177,"path":178},"Dividers","/docs/examples/dividers",{"title":180,"path":181},"Buttons","/docs/examples/buttons",{"title":183,"path":184},"Cards","/docs/examples/cards",{"title":186,"path":187},"Grids","/docs/examples/grids",{"title":189,"path":190},"Google Fonts","/docs/examples/google-fonts",{"title":192,"path":193},"Reverse Stack","/docs/examples/reverse-stack",{},"data/navigation","lXnN10nQFMOp0U7LPKSlEiRFYPoRC0dC5rgvZn8-pes",{"id":4,"extension":5,"items":198,"meta":269,"stem":195,"__hash__":196},[199,209,214,223,236,254,260],{"name":8,"items":200},[201,202,203,204,205,206,207,208],{"title":11,"path":12},{"title":14,"path":15},{"title":17,"path":18},{"title":20,"path":21},{"title":23,"path":24},{"title":26,"path":27},{"title":29,"path":30},{"title":32,"path":33},{"name":35,"items":210},[211,212,213],{"title":38,"path":39},{"title":41,"path":42},{"title":44,"path":45},{"name":47,"items":215},[216,217,218,219,220,221,222],{"title":50,"path":51},{"title":53,"path":54},{"title":56,"path":57},{"title":59,"path":60},{"title":62,"path":63},{"title":65,"path":66},{"title":68,"path":69},{"name":71,"items":224},[225,226,227,228,229,230,231,232,233,234,235],{"title":74,"path":75},{"title":77,"path":78},{"title":59,"path":80},{"title":62,"path":82},{"title":84,"path":85},{"title":87,"path":88},{"title":90,"path":91},{"title":93,"path":94},{"title":96,"path":97},{"title":99,"path":100},{"title":102,"path":103},{"name":105,"items":237},[238,239,240,241,242,243,244,245,246,247,248,249,250,251,252,253],{"title":108,"path":109},{"title":111,"path":112},{"title":114,"path":115},{"title":117,"path":118},{"title":120,"path":121},{"title":123,"path":124},{"title":126,"path":127},{"title":129,"path":130},{"title":132,"path":133},{"title":135,"path":136},{"title":138,"path":139},{"title":141,"path":142},{"title":144,"path":145},{"title":147,"path":148},{"title":150,"path":151},{"title":153,"path":154},{"name":156,"items":255},[256,257,258,259],{"title":159,"path":160},{"title":162,"path":163},{"title":165,"path":166},{"title":168,"path":169},{"name":171,"items":261},[262,263,264,265,266,267,268],{"title":174,"path":175},{"title":177,"path":178},{"title":180,"path":181},{"title":183,"path":184},{"title":186,"path":187},{"title":189,"path":190},{"title":192,"path":193},{},{"id":271,"title":177,"body":272,"description":1145,"extension":1146,"meta":1147,"navigation":1148,"path":178,"seo":1149,"sitemap":1150,"stem":1151,"__hash__":1152},"docs/docs/examples/dividers.md",{"type":273,"value":274,"toc":1134},"minimark",[275,279,283,286,291,299,363,369,372,414,418,424,449,454,490,503,507,510,515,521,528,552,559,583,587,590,597,621,624,648,663,667,674,709,712,716,719,743,747,752,758,811,817,827,831,838,961,964,987,997,1000,1009,1020,1130],[276,277,177],"h1",{"id":278},"dividers",[280,281,282],"p",{},"A Divider is a visible horizontal line that separates content areas.",[280,284,285],{},"Similar to Spacers, Dividers provide consistent vertical spacing while also offering visual separation of your content.",[287,288,290],"h2",{"id":289},"div","Div",[280,292,293,294,298],{},"The simplest, most reliable way to create a visual, horizontal divider line in HTML emails is to use a ",[295,296,297],"code",{},"\u003Cdiv>"," element:",[300,301,307],"pre",{"className":302,"code":303,"filename":304,"language":305,"meta":306,"style":306},"language-html shiki shiki-themes tailwind-css tailwind-css","\u003Cdiv class=\"h-px leading-px bg-slate-300\" role=\"separator\">&zwj;\u003C/div>\n","emails/example.html","html","",[295,308,309],{"__ignoreMap":306},[310,311,314,318,321,325,328,331,335,337,340,342,344,347,349,352,355,358,360],"span",{"class":312,"line":313},"line",1,[310,315,317],{"class":316},"soJEP","\u003C",[310,319,289],{"class":320},"sizJ4",[310,322,324],{"class":323},"sQMLp"," class",[310,326,327],{"class":316},"=",[310,329,330],{"class":323},"\"",[310,332,334],{"class":333},"sfCc6","h-px leading-px bg-slate-300",[310,336,330],{"class":323},[310,338,339],{"class":323}," role",[310,341,327],{"class":316},[310,343,330],{"class":323},[310,345,346],{"class":333},"separator",[310,348,330],{"class":323},[310,350,351],{"class":316},">",[310,353,354],{"class":320},"&zwj;",[310,356,357],{"class":316},"\u003C/",[310,359,289],{"class":320},[310,361,362],{"class":316},">\n",[280,364,365,366,368],{},"The ",[295,367,346],{}," role indicates that this is a divider that separates and distinguishes sections of content.",[280,370,371],{},"You may adjust the top and bottom spacing around the divider with margin utilities:",[300,373,375],{"className":302,"code":374,"filename":304,"language":305,"meta":306,"style":306},"\u003Cdiv class=\"h-px leading-px bg-slate-300 my-8\" role=\"separator\">&zwj;\u003C/div>\n",[295,376,377],{"__ignoreMap":306},[310,378,379,381,383,385,387,389,392,394,396,398,400,402,404,406,408,410,412],{"class":312,"line":313},[310,380,317],{"class":316},[310,382,289],{"class":320},[310,384,324],{"class":323},[310,386,327],{"class":316},[310,388,330],{"class":323},[310,390,391],{"class":333},"h-px leading-px bg-slate-300 my-8",[310,393,330],{"class":323},[310,395,339],{"class":323},[310,397,327],{"class":316},[310,399,330],{"class":323},[310,401,346],{"class":333},[310,403,330],{"class":323},[310,405,351],{"class":316},[310,407,354],{"class":320},[310,409,357],{"class":316},[310,411,289],{"class":320},[310,413,362],{"class":316},[287,415,417],{"id":416},"semantic","Semantic",[280,419,420,421,298],{},"To create a semantic Divider, we can use a regular ",[295,422,423],{},"\u003Chr>",[300,425,427],{"className":302,"code":426,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-gray-500 h-px\">\n",[295,428,429],{"__ignoreMap":306},[310,430,431,433,436,438,440,442,445,447],{"class":312,"line":313},[310,432,317],{"class":316},[310,434,435],{"class":320},"hr",[310,437,324],{"class":323},[310,439,327],{"class":316},[310,441,330],{"class":323},[310,443,444],{"class":333},"border-0 bg-slate-500 text-gray-500 h-px",[310,446,330],{"class":323},[310,448,362],{"class":316},[450,451,453],"h3",{"id":452},"how-it-works","How it works",[455,456,457,465,476],"ol",{},[458,459,460,461,464],"li",{},"We first reset the ",[295,462,463],{},"border-width",", so we can apply our own colors",[458,466,467,468,471,472,475],{},"We use a combination of ",[295,469,470],{},"background-color"," and ",[295,473,474],{},"color"," - the latter is for Outlook (Windows)",[458,477,478,479,482,483,486,487],{},"Removing the border means the element now has no ",[295,480,481],{},"height",", so we use ",[295,484,485],{},"h-px"," to set it to ",[295,488,489],{},"1px",[280,491,365,492,494,495,502],{},[295,493,423],{}," Divider is based on Mark Robbins' excellent work, available at ",[496,497,501],"a",{"href":498,"rel":499},"https://www.goodemailcode.com/email-code/hr",[500],"nofollow","goodemailcode.com",".",[450,504,506],{"id":505},"customization","Customization",[280,508,509],{},"You can customize the divider and give it a custom width or height, change its color, the top/bottom space around it, and even its alignment.",[511,512,514],"h4",{"id":513},"width","Width",[280,516,517,518,520],{},"An ",[295,519,423],{}," goes full width by default, but we can set a custom width.",[280,522,523,524,527],{},"While we're at it, let's also use ",[295,525,526],{},"max-w-full",", to make it responsive.",[300,529,531],{"className":302,"code":530,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-slate-500 h-px w-[400px] max-w-full\">\n",[295,532,533],{"__ignoreMap":306},[310,534,535,537,539,541,543,545,548,550],{"class":312,"line":313},[310,536,317],{"class":316},[310,538,435],{"class":320},[310,540,324],{"class":323},[310,542,327],{"class":316},[310,544,330],{"class":323},[310,546,547],{"class":333},"border-0 bg-slate-500 text-slate-500 h-px w-[400px] max-w-full",[310,549,330],{"class":323},[310,551,362],{"class":316},[280,553,554,555,558],{},"Need a custom width for mobile devices? Use the ",[295,556,557],{},"sm"," breakpoint:",[300,560,562],{"className":302,"code":561,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-slate-500 h-px sm:w-16 max-w-full\">\n",[295,563,564],{"__ignoreMap":306},[310,565,566,568,570,572,574,576,579,581],{"class":312,"line":313},[310,567,317],{"class":316},[310,569,435],{"class":320},[310,571,324],{"class":323},[310,573,327],{"class":316},[310,575,330],{"class":323},[310,577,578],{"class":333},"border-0 bg-slate-500 text-slate-500 h-px sm:w-16 max-w-full",[310,580,330],{"class":323},[310,582,362],{"class":316},[511,584,586],{"id":585},"margin","Margin",[280,588,589],{},"You may customize top and bottom spacing with CSS margins.",[280,591,592,593,596],{},"For example, let's add ",[295,594,595],{},"32px"," to the top and bottom:",[300,598,600],{"className":302,"code":599,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-slate-500 h-px my-8\">\n",[295,601,602],{"__ignoreMap":306},[310,603,604,606,608,610,612,614,617,619],{"class":312,"line":313},[310,605,317],{"class":316},[310,607,435],{"class":320},[310,609,324],{"class":323},[310,611,327],{"class":316},[310,613,330],{"class":323},[310,615,616],{"class":333},"border-0 bg-slate-500 text-slate-500 h-px my-8",[310,618,330],{"class":323},[310,620,362],{"class":316},[280,622,623],{},"Need uneven spacing?",[300,625,627],{"className":302,"code":626,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-slate-500 h-px mt-4 mb-8\">\n",[295,628,629],{"__ignoreMap":306},[310,630,631,633,635,637,639,641,644,646],{"class":312,"line":313},[310,632,317],{"class":316},[310,634,435],{"class":320},[310,636,324],{"class":323},[310,638,327],{"class":316},[310,640,330],{"class":323},[310,642,643],{"class":333},"border-0 bg-slate-500 text-slate-500 h-px mt-4 mb-8",[310,645,330],{"class":323},[310,647,362],{"class":316},[649,650,651,652,654,655,658,659,662],"alert",{},"\nNote that \n",[295,653,423],{},"\n elements come with margins by default, so you might want to set a custom one or reset it with \n",[295,656,657],{},"m-0","\n. For example, Chrome resets to \n",[295,660,661],{},"8px","\n.\n",[511,664,666],{"id":665},"alignment","Alignment",[280,668,669,670,673],{},"You can use the ",[295,671,672],{},"align"," attribute to align a Divider.",[300,675,677],{"className":302,"code":676,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr align=\"right\" class=\"border-0 bg-slate-500 text-slate-500 h-px mt-4 mb-8\">\n",[295,678,679],{"__ignoreMap":306},[310,680,681,683,685,688,690,692,695,697,699,701,703,705,707],{"class":312,"line":313},[310,682,317],{"class":316},[310,684,435],{"class":320},[310,686,687],{"class":323}," align",[310,689,327],{"class":316},[310,691,330],{"class":323},[310,693,694],{"class":333},"right",[310,696,330],{"class":323},[310,698,324],{"class":323},[310,700,327],{"class":316},[310,702,330],{"class":323},[310,704,643],{"class":333},[310,706,330],{"class":323},[310,708,362],{"class":316},[280,710,711],{},"By default, it will be centered.",[511,713,715],{"id":714},"vertical","Vertical",[280,717,718],{},"For a vertical Divider, simply use a narrow width and a bigger height:",[300,720,722],{"className":302,"code":721,"filename":304,"language":305,"meta":306,"style":306},"\u003Chr class=\"border-0 bg-slate-500 text-slate-500 w-px h-16 m-0\">\n",[295,723,724],{"__ignoreMap":306},[310,725,726,728,730,732,734,736,739,741],{"class":312,"line":313},[310,727,317],{"class":316},[310,729,435],{"class":320},[310,731,324],{"class":323},[310,733,327],{"class":316},[310,735,330],{"class":323},[310,737,738],{"class":333},"border-0 bg-slate-500 text-slate-500 w-px h-16 m-0",[310,740,330],{"class":323},[310,742,362],{"class":316},[450,744,746],{"id":745},"outlook-note","Outlook note",[280,748,365,749,751],{},[295,750,423],{}," divider is harder to control in Outlook on Windows - it usually renders wider than intended and you can't use left/right CSS margins.",[280,753,754,755,757],{},"A proposed solution, as seen in Mark's example, is to wrap it in a ",[295,756,297],{}," and add margins to that instead:",[300,759,761],{"className":302,"code":760,"filename":304,"language":305,"meta":306,"style":306},"\u003Cdiv class=\"mx-6\">\n  \u003Chr class=\"border-0 bg-slate-500 text-gray-500 h-px\">\n\u003C/div>\n",[295,762,763,782,802],{"__ignoreMap":306},[310,764,765,767,769,771,773,775,778,780],{"class":312,"line":313},[310,766,317],{"class":316},[310,768,289],{"class":320},[310,770,324],{"class":323},[310,772,327],{"class":316},[310,774,330],{"class":323},[310,776,777],{"class":333},"mx-6",[310,779,330],{"class":323},[310,781,362],{"class":316},[310,783,785,788,790,792,794,796,798,800],{"class":312,"line":784},2,[310,786,787],{"class":316},"  \u003C",[310,789,435],{"class":320},[310,791,324],{"class":323},[310,793,327],{"class":316},[310,795,330],{"class":323},[310,797,444],{"class":333},[310,799,330],{"class":323},[310,801,362],{"class":316},[310,803,805,807,809],{"class":312,"line":804},3,[310,806,357],{"class":316},[310,808,289],{"class":320},[310,810,362],{"class":316},[280,812,813,814,816],{},"In our tests, the semantic ",[295,815,423],{}," divider has been hard to control in Outlook on Windows, so we recommend using the Div or Table Divider.",[280,818,819,820,823,824,826],{},"The Maizzle Starter includes a ",[496,821,822],{"href":163},"Divider component"," that uses the ",[295,825,297],{}," technique.",[287,828,830],{"id":829},"table-divider","Table divider",[280,832,833,834,837],{},"The spacing above and below the Table Divider line is defined through the vertical padding of the inner ",[295,835,836],{},"\u003Ctd>"," element, with Tailwind CSS utilities:",[300,839,841],{"className":302,"code":840,"filename":304,"language":305,"meta":306,"style":306},"\u003Ctable class=\"w-full\" role=\"separator\">\n  \u003Ctr>\n    \u003Ctd class=\"py-6\">\n      \u003Cdiv class=\"bg-slate-300 h-px leading-px\">&zwj;\u003C/div>\n    \u003C/td>\n  \u003C/tr>\n\u003C/table>\n",[295,842,843,873,882,903,932,942,952],{"__ignoreMap":306},[310,844,845,847,850,852,854,856,859,861,863,865,867,869,871],{"class":312,"line":313},[310,846,317],{"class":316},[310,848,849],{"class":320},"table",[310,851,324],{"class":323},[310,853,327],{"class":316},[310,855,330],{"class":323},[310,857,858],{"class":333},"w-full",[310,860,330],{"class":323},[310,862,339],{"class":323},[310,864,327],{"class":316},[310,866,330],{"class":323},[310,868,346],{"class":333},[310,870,330],{"class":323},[310,872,362],{"class":316},[310,874,875,877,880],{"class":312,"line":784},[310,876,787],{"class":316},[310,878,879],{"class":320},"tr",[310,881,362],{"class":316},[310,883,884,887,890,892,894,896,899,901],{"class":312,"line":804},[310,885,886],{"class":316},"    \u003C",[310,888,889],{"class":320},"td",[310,891,324],{"class":323},[310,893,327],{"class":316},[310,895,330],{"class":323},[310,897,898],{"class":333},"py-6",[310,900,330],{"class":323},[310,902,362],{"class":316},[310,904,906,909,911,913,915,917,920,922,924,926,928,930],{"class":312,"line":905},4,[310,907,908],{"class":316},"      \u003C",[310,910,289],{"class":320},[310,912,324],{"class":323},[310,914,327],{"class":316},[310,916,330],{"class":323},[310,918,919],{"class":333},"bg-slate-300 h-px leading-px",[310,921,330],{"class":323},[310,923,351],{"class":316},[310,925,354],{"class":320},[310,927,357],{"class":316},[310,929,289],{"class":320},[310,931,362],{"class":316},[310,933,935,938,940],{"class":312,"line":934},5,[310,936,937],{"class":316},"    \u003C/",[310,939,889],{"class":320},[310,941,362],{"class":316},[310,943,945,948,950],{"class":312,"line":944},6,[310,946,947],{"class":316},"  \u003C/",[310,949,879],{"class":320},[310,951,362],{"class":316},[310,953,955,957,959],{"class":312,"line":954},7,[310,956,357],{"class":316},[310,958,849],{"class":320},[310,960,362],{"class":316},[280,962,963],{},"How it works:",[965,966,967,972,978],"ul",{},[458,968,969,971],{},[295,970,898],{}," adds 24px top and bottom padding",[458,973,974,975,977],{},"the ",[295,976,297],{}," is the horizontal line: we set its height and line-height to 1px, and give it a background color",[458,979,980,981,983,984,986],{},"we use a ",[295,982,354],{}," to add something inside the ",[295,985,297],{},", so it can take up height",[280,988,989,990,993,994,996],{},"Feel free to use ",[295,991,992],{},"&nbsp;"," instead of ",[295,995,354],{}," - both work just fine 👌",[450,998,746],{"id":999},"outlook-note-1",[280,1001,365,1002,1004,1005,1008],{},[295,1003,297],{}," element where we use ",[295,1006,1007],{},"leading-px"," needs some extra attention for Outlook. Otherwise, it will render thicker than intended.",[280,1010,1011,1012,1015,1016,1019],{},"To make Outlook respect the line height you set on elements, you may use the ",[295,1013,1014],{},"mso-line-height-rule-exactly"," class that is available from the ",[295,1017,1018],{},"tailwindcss-mso"," plugin (included in the Starter).",[300,1021,1023],{"className":302,"code":1022,"filename":304,"language":305,"meta":306,"style":306},"\u003Ctable class=\"w-full\" role=\"separator\">\n  \u003Ctr>\n    \u003Ctd class=\"py-6\">\n      \u003Cdiv class=\"bg-slate-300 h-px leading-px mso-line-height-rule-exactly\">&zwj;\u003C/div>\n    \u003C/td>\n  \u003C/tr>\n\u003C/table>\n",[295,1024,1025,1053,1061,1079,1106,1114,1122],{"__ignoreMap":306},[310,1026,1027,1029,1031,1033,1035,1037,1039,1041,1043,1045,1047,1049,1051],{"class":312,"line":313},[310,1028,317],{"class":316},[310,1030,849],{"class":320},[310,1032,324],{"class":323},[310,1034,327],{"class":316},[310,1036,330],{"class":323},[310,1038,858],{"class":333},[310,1040,330],{"class":323},[310,1042,339],{"class":323},[310,1044,327],{"class":316},[310,1046,330],{"class":323},[310,1048,346],{"class":333},[310,1050,330],{"class":323},[310,1052,362],{"class":316},[310,1054,1055,1057,1059],{"class":312,"line":784},[310,1056,787],{"class":316},[310,1058,879],{"class":320},[310,1060,362],{"class":316},[310,1062,1063,1065,1067,1069,1071,1073,1075,1077],{"class":312,"line":804},[310,1064,886],{"class":316},[310,1066,889],{"class":320},[310,1068,324],{"class":323},[310,1070,327],{"class":316},[310,1072,330],{"class":323},[310,1074,898],{"class":333},[310,1076,330],{"class":323},[310,1078,362],{"class":316},[310,1080,1081,1083,1085,1087,1089,1091,1094,1096,1098,1100,1102,1104],{"class":312,"line":905},[310,1082,908],{"class":316},[310,1084,289],{"class":320},[310,1086,324],{"class":323},[310,1088,327],{"class":316},[310,1090,330],{"class":323},[310,1092,1093],{"class":333},"bg-slate-300 h-px leading-px mso-line-height-rule-exactly",[310,1095,330],{"class":323},[310,1097,351],{"class":316},[310,1099,354],{"class":320},[310,1101,357],{"class":316},[310,1103,289],{"class":320},[310,1105,362],{"class":316},[310,1107,1108,1110,1112],{"class":312,"line":934},[310,1109,937],{"class":316},[310,1111,889],{"class":320},[310,1113,362],{"class":316},[310,1115,1116,1118,1120],{"class":312,"line":944},[310,1117,947],{"class":316},[310,1119,879],{"class":320},[310,1121,362],{"class":316},[310,1123,1124,1126,1128],{"class":312,"line":954},[310,1125,357],{"class":316},[310,1127,849],{"class":320},[310,1129,362],{"class":316},[1131,1132,1133],"style",{},"html pre.shiki code .soJEP, html code.shiki .soJEP{--shiki-light:#CBD5E1;--shiki-dark:#CBD5E1}html pre.shiki code .sizJ4, html code.shiki .sizJ4{--shiki-light:#EC4899;--shiki-dark:#EC4899}html pre.shiki code .sQMLp, html code.shiki .sQMLp{--shiki-light:#0EA5E9;--shiki-dark:#0EA5E9}html pre.shiki code .sfCc6, html code.shiki .sfCc6{--shiki-light:#1D4ED8;--shiki-dark:#1D4ED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":306,"searchDepth":784,"depth":784,"links":1135},[1136,1137,1142],{"id":289,"depth":784,"text":290},{"id":416,"depth":784,"text":417,"children":1138},[1139,1140,1141],{"id":452,"depth":804,"text":453},{"id":505,"depth":804,"text":506},{"id":745,"depth":804,"text":746},{"id":829,"depth":784,"text":830,"children":1143},[1144],{"id":999,"depth":804,"text":746},"How to create dividers or horizontal rules for HTML emails.","md",{},true,{"title":177,"description":1145},{"loc":178},"docs/examples/dividers","QHQPU7lyc7D6pBqEx4u2E7A-19c-UHHe1Dsv6QnzXOI",{"id":4,"extension":5,"items":1154,"meta":1225,"stem":195,"__hash__":196},[1155,1165,1170,1179,1192,1210,1216],{"name":8,"items":1156},[1157,1158,1159,1160,1161,1162,1163,1164],{"title":11,"path":12},{"title":14,"path":15},{"title":17,"path":18},{"title":20,"path":21},{"title":23,"path":24},{"title":26,"path":27},{"title":29,"path":30},{"title":32,"path":33},{"name":35,"items":1166},[1167,1168,1169],{"title":38,"path":39},{"title":41,"path":42},{"title":44,"path":45},{"name":47,"items":1171},[1172,1173,1174,1175,1176,1177,1178],{"title":50,"path":51},{"title":53,"path":54},{"title":56,"path":57},{"title":59,"path":60},{"title":62,"path":63},{"title":65,"path":66},{"title":68,"path":69},{"name":71,"items":1180},[1181,1182,1183,1184,1185,1186,1187,1188,1189,1190,1191],{"title":74,"path":75},{"title":77,"path":78},{"title":59,"path":80},{"title":62,"path":82},{"title":84,"path":85},{"title":87,"path":88},{"title":90,"path":91},{"title":93,"path":94},{"title":96,"path":97},{"title":99,"path":100},{"title":102,"path":103},{"name":105,"items":1193},[1194,1195,1196,1197,1198,1199,1200,1201,1202,1203,1204,1205,1206,1207,1208,1209],{"title":108,"path":109},{"title":111,"path":112},{"title":114,"path":115},{"title":117,"path":118},{"title":120,"path":121},{"title":123,"path":124},{"title":126,"path":127},{"title":129,"path":130},{"title":132,"path":133},{"title":135,"path":136},{"title":138,"path":139},{"title":141,"path":142},{"title":144,"path":145},{"title":147,"path":148},{"title":150,"path":151},{"title":153,"path":154},{"name":156,"items":1211},[1212,1213,1214,1215],{"title":159,"path":160},{"title":162,"path":163},{"title":165,"path":166},{"title":168,"path":169},{"name":171,"items":1217},[1218,1219,1220,1221,1222,1223,1224],{"title":174,"path":175},{"title":177,"path":178},{"title":180,"path":181},{"title":183,"path":184},{"title":186,"path":187},{"title":189,"path":190},{"title":192,"path":193},{},1780318593009]