[{"data":1,"prerenderedAt":773},["ShallowReactive",2],{"docs-side-nav":3,"docs-header-nav":197,"/docs/transformers/shorthand-css":270,"docs-bottom-nav":700},{"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":123,"body":272,"description":693,"extension":694,"meta":695,"navigation":657,"path":124,"seo":696,"sitemap":697,"stem":698,"__hash__":699},"docs/docs/transformers/shorthand-css.md",{"type":273,"value":274,"toc":688},"minimark",[275,279,300,303,306,357,360,393,396,428,435,440,443,500,503,571,575,582,622,625,685],[276,277,123],"h1",{"id":278},"shorthand-css",[280,281,282,283,287,288,291,292,295,296,299],"p",{},"Rewrite longhand CSS inside ",[284,285,286],"code",{},"style"," attributes with shorthand syntax. Only works with ",[284,289,290],{},"margin",", ",[284,293,294],{},"padding"," and ",[284,297,298],{},"border",", and only when all sides are specified.",[280,301,302],{},"Shorthand syntax for CSS properties means less code, so fewer bytes to send over the wire. Today, most email clients support shorthand CSS.",[280,304,305],{},"Something like this:",[307,308,313],"pre",{"className":309,"code":310,"language":311,"meta":312,"style":312},"language-html shiki shiki-themes tailwind-css tailwind-css","\u003Cp class=\"mx-2 my-4\">Example\u003C/p>\n","html","",[284,314,315],{"__ignoreMap":312},[316,317,320,324,327,331,334,337,341,343,346,349,352,354],"span",{"class":318,"line":319},"line",1,[316,321,323],{"class":322},"soJEP","\u003C",[316,325,280],{"class":326},"sizJ4",[316,328,330],{"class":329},"sQMLp"," class",[316,332,333],{"class":322},"=",[316,335,336],{"class":329},"\"",[316,338,340],{"class":339},"sfCc6","mx-2 my-4",[316,342,336],{"class":329},[316,344,345],{"class":322},">",[316,347,348],{"class":339},"Example",[316,350,351],{"class":322},"\u003C/",[316,353,280],{"class":326},[316,355,356],{"class":322},">\n",[280,358,359],{},"... instead of becoming this:",[307,361,363],{"className":309,"code":362,"language":311,"meta":312,"style":312},"\u003Cp style=\"margin-left: 2px; margin-right: 2px; margin-top: 4px; margin-bottom: 4px;\">Example\u003C/p>\n",[284,364,365],{"__ignoreMap":312},[316,366,367,369,371,374,376,378,381,383,385,387,389,391],{"class":318,"line":319},[316,368,323],{"class":322},[316,370,280],{"class":326},[316,372,373],{"class":329}," style",[316,375,333],{"class":322},[316,377,336],{"class":329},[316,379,380],{"class":339},"margin-left: 2px; margin-right: 2px; margin-top: 4px; margin-bottom: 4px;",[316,382,336],{"class":329},[316,384,345],{"class":322},[316,386,348],{"class":339},[316,388,351],{"class":322},[316,390,280],{"class":326},[316,392,356],{"class":322},[280,394,395],{},"... is rewritten to this:",[307,397,399],{"className":309,"code":398,"language":311,"meta":312,"style":312},"\u003Cp style=\"margin: 4px 2px;\">Example\u003C/p>\n",[284,400,401],{"__ignoreMap":312},[316,402,403,405,407,409,411,413,416,418,420,422,424,426],{"class":318,"line":319},[316,404,323],{"class":322},[316,406,280],{"class":326},[316,408,373],{"class":329},[316,410,333],{"class":322},[316,412,336],{"class":329},[316,414,415],{"class":339},"margin: 4px 2px;",[316,417,336],{"class":329},[316,419,345],{"class":322},[316,421,348],{"class":339},[316,423,351],{"class":322},[316,425,280],{"class":326},[316,427,356],{"class":322},[280,429,430,431,434],{},"By default, ",[284,432,433],{},"shorthandCSS"," is disabled.",[436,437,439],"h2",{"id":438},"usage","Usage",[280,441,442],{},"Enable it for all tags:",[307,444,449],{"className":445,"code":446,"filename":447,"language":448,"meta":312,"style":312},"language-js shiki shiki-themes tailwind-css tailwind-css","export default {\n  css: {\n    shorthand: true,\n  }\n}\n","config.js","js",[284,450,451,463,474,488,494],{"__ignoreMap":312},[316,452,453,456,459],{"class":318,"line":319},[316,454,455],{"class":326},"export",[316,457,458],{"class":326}," default",[316,460,462],{"class":461},"sprQ5"," {\n",[316,464,466,469,472],{"class":318,"line":465},2,[316,467,468],{"class":339},"  css",[316,470,471],{"class":461},":",[316,473,462],{"class":461},[316,475,477,480,482,485],{"class":318,"line":476},3,[316,478,479],{"class":339},"    shorthand",[316,481,471],{"class":461},[316,483,484],{"class":326}," true",[316,486,487],{"class":461},",\n",[316,489,491],{"class":318,"line":490},4,[316,492,493],{"class":461},"  }\n",[316,495,497],{"class":318,"line":496},5,[316,498,499],{"class":461},"}\n",[280,501,502],{},"Enable it only for a selection of tags:",[307,504,506],{"className":445,"code":505,"filename":447,"language":448,"meta":312,"style":312},"export default {\n  css: {\n    shorthand: {\n      tags: ['td', 'div'],\n    }\n  }\n}\n",[284,507,508,516,524,532,556,561,566],{"__ignoreMap":312},[316,509,510,512,514],{"class":318,"line":319},[316,511,455],{"class":326},[316,513,458],{"class":326},[316,515,462],{"class":461},[316,517,518,520,522],{"class":318,"line":465},[316,519,468],{"class":339},[316,521,471],{"class":461},[316,523,462],{"class":461},[316,525,526,528,530],{"class":318,"line":476},[316,527,479],{"class":339},[316,529,471],{"class":461},[316,531,462],{"class":461},[316,533,534,537,539,542,545,548,551,554],{"class":318,"line":490},[316,535,536],{"class":339},"      tags",[316,538,471],{"class":461},[316,540,541],{"class":339}," [",[316,543,544],{"class":339},"'td'",[316,546,547],{"class":461},",",[316,549,550],{"class":339}," 'div'",[316,552,553],{"class":339},"]",[316,555,487],{"class":461},[316,557,558],{"class":318,"line":496},[316,559,560],{"class":461},"    }\n",[316,562,564],{"class":318,"line":563},6,[316,565,493],{"class":461},[316,567,569],{"class":318,"line":568},7,[316,570,499],{"class":461},[436,572,574],{"id":573},"disabling","Disabling",[280,576,577,578,581],{},"Set it to ",[284,579,580],{},"false"," or simply omit it:",[307,583,585],{"className":445,"code":584,"filename":447,"language":448,"meta":312,"style":312},"export default {\n  css: {\n    shorthand: false,\n  }\n}\n",[284,586,587,595,603,614,618],{"__ignoreMap":312},[316,588,589,591,593],{"class":318,"line":319},[316,590,455],{"class":326},[316,592,458],{"class":326},[316,594,462],{"class":461},[316,596,597,599,601],{"class":318,"line":465},[316,598,468],{"class":339},[316,600,471],{"class":461},[316,602,462],{"class":461},[316,604,605,607,609,612],{"class":318,"line":476},[316,606,479],{"class":339},[316,608,471],{"class":461},[316,610,611],{"class":326}," false",[316,613,487],{"class":461},[316,615,616],{"class":318,"line":490},[316,617,493],{"class":461},[316,619,620],{"class":318,"line":496},[316,621,499],{"class":461},[436,623,102],{"id":624},"api",[307,626,629],{"className":445,"code":627,"filename":628,"language":448,"meta":312,"style":312},"import { shorthandCSS } from '@maizzle/framework'\n\nconst html = await shorthandCSS('html string')\n","app.js",[284,630,631,653,659],{"__ignoreMap":312},[316,632,633,637,640,644,647,650],{"class":318,"line":319},[316,634,636],{"class":635},"s8qYB","import",[316,638,639],{"class":461}," {",[316,641,643],{"class":642},"sO1gY"," shorthandCSS",[316,645,646],{"class":461}," }",[316,648,649],{"class":461}," from",[316,651,652],{"class":635}," '@maizzle/framework'\n",[316,654,655],{"class":318,"line":465},[316,656,658],{"emptyLinePlaceholder":657},true,"\n",[316,660,661,664,667,670,673,676,679,682],{"class":318,"line":476},[316,662,663],{"class":635},"const",[316,665,666],{"class":339}," html ",[316,668,333],{"class":669},"sVevU",[316,671,672],{"class":326}," await",[316,674,643],{"class":675},"s2ImL",[316,677,678],{"class":339},"(",[316,680,681],{"class":339},"'html string'",[316,683,684],{"class":339},")\n",[286,686,687],{},"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);}html pre.shiki code .sprQ5, html code.shiki .sprQ5{--shiki-light:#44403C;--shiki-dark:#44403C}html pre.shiki code .s8qYB, html code.shiki .s8qYB{--shiki-light:#3730A3;--shiki-dark:#3730A3}html pre.shiki code .sO1gY, html code.shiki .sO1gY{--shiki-light:#2563EB;--shiki-dark:#2563EB}html pre.shiki code .sVevU, html code.shiki .sVevU{--shiki-light:#35393E;--shiki-dark:#35393E}html pre.shiki code .s2ImL, html code.shiki .s2ImL{--shiki-light:#00BF99;--shiki-dark:#00BF99}",{"title":312,"searchDepth":465,"depth":465,"links":689},[690,691,692],{"id":438,"depth":465,"text":439},{"id":573,"depth":465,"text":574},{"id":624,"depth":465,"text":102},"Group CSS properties of the same type into shorthand inline CSS.","md",{},{"title":123,"description":693},{"loc":124},"docs/transformers/shorthand-css","HqpMo3vbqyxrzGXvCBUpS5oNiNAsV_oR76ghKozV2jE",{"id":4,"extension":5,"items":701,"meta":772,"stem":195,"__hash__":196},[702,712,717,726,739,757,763],{"name":8,"items":703},[704,705,706,707,708,709,710,711],{"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":713},[714,715,716],{"title":38,"path":39},{"title":41,"path":42},{"title":44,"path":45},{"name":47,"items":718},[719,720,721,722,723,724,725],{"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":727},[728,729,730,731,732,733,734,735,736,737,738],{"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":740},[741,742,743,744,745,746,747,748,749,750,751,752,753,754,755,756],{"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":758},[759,760,761,762],{"title":159,"path":160},{"title":162,"path":163},{"title":165,"path":166},{"title":168,"path":169},{"name":171,"items":764},[765,766,767,768,769,770,771],{"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},{},1780318596427]