[{"data":1,"prerenderedAt":378},["ShallowReactive",2],{"navigation_docs":3,"-overview-theming":106,"-overview-theming-surround":374},[4,36,72],{"title":5,"icon":6,"redirect":7,"path":8,"stem":9,"children":10,"page":35},"Get Started","heroicons-outline:star","/get-started/introduction","/get-started","1.get-started",[11,15,20,25,30],{"title":12,"path":7,"stem":13,"icon":14},"Introduction","1.get-started/1.introduction","uil:info-circle",{"title":16,"path":17,"stem":18,"icon":19},"Installation","/get-started/installation","1.get-started/2.installation","uil:play-circle",{"title":21,"path":22,"stem":23,"icon":24},"Configuration","/get-started/configuration","1.get-started/3.configuration","uil:wrench",{"title":26,"path":27,"stem":28,"icon":29},"Enabling Capacitor","/get-started/enabling-capacitor","1.get-started/4.enabling-capacitor","nonicons:capacitor-16",{"title":31,"path":32,"stem":33,"icon":34},"Watchouts","/get-started/watch-outs","1.get-started/5.watch-outs","uil:exclamation-triangle",false,{"title":37,"icon":38,"redirect":39,"path":40,"stem":41,"children":42,"page":35},"Overview","heroicons-outline:sparkles","/overview/routing","/overview","2.overview",[43,47,52,57,62,67],{"title":44,"path":39,"stem":45,"icon":46},"Routing","2.overview/1.routing","uil:sign-alt",{"title":48,"path":49,"stem":50,"icon":51},"Theming","/overview/theming","2.overview/2.theming","uil:palette",{"title":53,"path":54,"stem":55,"icon":56},"Ionic Auto-Imports","/overview/ionic-auto-imports","2.overview/3.ionic-auto-imports","uil:channel",{"title":58,"path":59,"stem":60,"icon":61},"Module Utilities","/overview/module-utilities","2.overview/4.module-utilities","uil:layer-group",{"title":63,"path":64,"stem":65,"icon":66},"Icons","/overview/icons","2.overview/5.icons","uil:illustration",{"title":68,"path":69,"stem":70,"icon":71},"Deployment","/overview/deployment","2.overview/6.deployment","uil:rocket",{"title":73,"icon":74,"redirect":75,"path":76,"stem":77,"children":78,"page":35},"Cookbook","heroicons-outline:bookmark-alt","/cookbook/customising-app-vue","/cookbook","3.cookbook",[79,82,86,90,94,98,102],{"title":80,"path":75,"stem":81},"Customising app.vue","3.cookbook/1.customising-app-vue",{"title":83,"path":84,"stem":85},"Local Development","/cookbook/local-development","3.cookbook/2.local-development",{"title":87,"path":88,"stem":89},"App Tabs","/cookbook/app-tabs","3.cookbook/3.app-tabs",{"title":91,"path":92,"stem":93},"useHead / Page Meta","/cookbook/page-metadata","3.cookbook/4.page-metadata",{"title":95,"path":96,"stem":97},"iOS and Android Apps","/cookbook/creating-ios-android-apps","3.cookbook/5.creating-ios-android-apps",{"title":99,"path":100,"stem":101},"Web And Device","/cookbook/web-and-device","3.cookbook/6.web-and-device",{"title":103,"path":104,"stem":105},"Live Updates","/cookbook/live-updates","3.cookbook/7.live-updates",{"id":107,"title":48,"body":108,"description":144,"extension":368,"links":369,"meta":370,"navigation":371,"path":49,"seo":372,"stem":50,"__hash__":373},"docs/2.overview/2.theming.md",{"type":109,"value":110,"toc":366},"minimark",[111,115,135,351,362],[112,113,114],"p",{},"Ionic provides many css variables with which their components derive css styles. These variables can be overridden to customise the theme of your app.",[112,116,117,118,122,123,126,127,130,131,134],{},"In its most simple form, you can create a ",[119,120,121],"code",{},"~/assets/css/ionic.css"," file and add it to the ",[119,124,125],{},"css"," property in your ",[119,128,129],{},"nuxt.config.ts"," file. You can then add css variables that you'd like to override within this file, under the ",[119,132,133],{},":root"," selector:",[136,137,138,292],"code-group",{},[139,140,145],"pre",{"className":141,"code":142,"filename":143,"language":125,"meta":144,"style":144},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight",":root {\n  --ion-color-primary: #57e389;\n  --ion-color-primary-rgb: 87, 227, 137;\n  --ion-color-primary-contrast: #000000;\n  --ion-color-primary-contrast-rgb: 0, 0, 0;\n  --ion-color-primary-shade: #4dc879;\n  --ion-color-primary-tint: #68e695;\n\n  /* And so on... */\n}\n","assets/css/ionic.css","",[119,146,147,163,181,206,221,242,257,272,279,286],{"__ignoreMap":144},[148,149,152,156,160],"span",{"class":150,"line":151},"line",1,[148,153,155],{"class":154},"sMK4o",":",[148,157,159],{"class":158},"spNyl","root",[148,161,162],{"class":154}," {\n",[148,164,166,170,172,175,178],{"class":150,"line":165},2,[148,167,169],{"class":168},"sTEyZ","  --ion-color-primary",[148,171,155],{"class":154},[148,173,174],{"class":154}," #",[148,176,177],{"class":168},"57e389",[148,179,180],{"class":154},";\n",[148,182,184,187,189,193,196,199,201,204],{"class":150,"line":183},3,[148,185,186],{"class":168},"  --ion-color-primary-rgb",[148,188,155],{"class":154},[148,190,192],{"class":191},"sbssI"," 87",[148,194,195],{"class":154},",",[148,197,198],{"class":191}," 227",[148,200,195],{"class":154},[148,202,203],{"class":191}," 137",[148,205,180],{"class":154},[148,207,209,212,214,216,219],{"class":150,"line":208},4,[148,210,211],{"class":168},"  --ion-color-primary-contrast",[148,213,155],{"class":154},[148,215,174],{"class":154},[148,217,218],{"class":168},"000000",[148,220,180],{"class":154},[148,222,224,227,229,232,234,236,238,240],{"class":150,"line":223},5,[148,225,226],{"class":168},"  --ion-color-primary-contrast-rgb",[148,228,155],{"class":154},[148,230,231],{"class":191}," 0",[148,233,195],{"class":154},[148,235,231],{"class":191},[148,237,195],{"class":154},[148,239,231],{"class":191},[148,241,180],{"class":154},[148,243,245,248,250,252,255],{"class":150,"line":244},6,[148,246,247],{"class":168},"  --ion-color-primary-shade",[148,249,155],{"class":154},[148,251,174],{"class":154},[148,253,254],{"class":168},"4dc879",[148,256,180],{"class":154},[148,258,260,263,265,267,270],{"class":150,"line":259},7,[148,261,262],{"class":168},"  --ion-color-primary-tint",[148,264,155],{"class":154},[148,266,174],{"class":154},[148,268,269],{"class":168},"68e695",[148,271,180],{"class":154},[148,273,275],{"class":150,"line":274},8,[148,276,278],{"emptyLinePlaceholder":277},true,"\n",[148,280,282],{"class":150,"line":281},9,[148,283,285],{"class":284},"sHwdD","  /* And so on... */\n",[148,287,289],{"class":150,"line":288},10,[148,290,291],{"class":154},"}\n",[139,293,297],{"className":294,"code":295,"filename":129,"language":296,"meta":144,"style":144},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  css: ['~/assets/css/ionic.css'],\n})\n","ts",[119,298,299,318,343],{"__ignoreMap":144},[148,300,301,305,308,312,315],{"class":150,"line":151},[148,302,304],{"class":303},"s7zQu","export",[148,306,307],{"class":303}," default",[148,309,311],{"class":310},"s2Zo4"," defineNuxtConfig",[148,313,314],{"class":168},"(",[148,316,317],{"class":154},"{\n",[148,319,320,324,326,329,332,335,337,340],{"class":150,"line":165},[148,321,323],{"class":322},"swJcz","  css",[148,325,155],{"class":154},[148,327,328],{"class":168}," [",[148,330,331],{"class":154},"'",[148,333,121],{"class":334},"sfazB",[148,336,331],{"class":154},[148,338,339],{"class":168},"]",[148,341,342],{"class":154},",\n",[148,344,345,348],{"class":150,"line":183},[148,346,347],{"class":154},"}",[148,349,350],{"class":168},")\n",[112,352,353,354,361],{},"To learn more about theming and which variables to override, check out Ionic's ",[355,356,360],"a",{"href":357,"rel":358},"https://ionicframework.com/docs/theming/basics",[359],"nofollow","official theming documentation",".",[363,364,365],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}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 .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-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 .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}",{"title":144,"searchDepth":165,"depth":165,"links":367},[],"md",null,{},{"icon":51},{"title":48,"description":144},"Uc4nfTO3GAHKo_Lj4akp3QG8rKWL5TEwZTkojeaUR_4",[375,377],{"title":44,"path":39,"stem":45,"description":376,"icon":46,"children":-1},"Routing within your Nuxt Ionic application will feel very similar, but with a couple of differences.",{"title":53,"path":54,"stem":55,"description":369,"icon":56,"children":-1},1775601896862]