\n \u003C/template>\n\n \u003Ctemplate #panel>\n \u003Cdiv class=\"flex h-full content-center pt-[130px]\">\n \u003CUNavigationTree id=\"navtree\" :links=\"links\" default-open />\n \u003C/div>\n \u003C/template>\n \u003C/UHeader>\n\u003C/template>\n```\n\n### Workaround \nFor classes: split links in multiple UHeaderLinks with custom ui prop.\n\n\n\n```vue\n\u003Ctemplate #center>\n \u003Cdiv class=\"flex flex-row flex-nowrap gap-5\">\n \u003CUHeaderLinks\n :links=\"linksA\"\n :ui=\"{\n wrapper: 'hidden lg:flex flex-row flex-nowrap items-center gap-x-8',\n }\"\n />\n \u003CUHeaderLinks\n :links=\"linksB\"\n :ui=\"{\n wrapper: 'hidden lg:flex flex-row flex-nowrap items-center gap-x-8',\n inactive: 'hover:text-primary text-red-500 italic',\n default: {\n popover: {\n ui: {\n wrapper: 'text-red-500 italic',\n },\n },\n },\n }\"\n />\n \u003C/div>\n\u003C/template>\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[1984,1987,1990],{"name":1985,"color":1986},"bug","d73a4a",{"name":1988,"color":1989},"pro","5BD3CB",{"name":1991,"color":1992},"triage","ffffff",2306,"nuxt","ui","open","HeaderLinks: properties class and icon has no effects","2025-02-17T00:12:08Z","https://github.com/nuxt/ui/issues/2306",0.7643332,{"description":2002,"labels":2003,"number":2004,"owner":1994,"repository":2005,"state":2006,"title":2007,"updated_at":2008,"url":2009,"score":2010},"",[],1049,"nuxt.com","closed","[Code] Community","2022-12-15T08:50:03Z","https://github.com/nuxt/nuxt.com/issues/1049",0.7323024,{"description":2012,"labels":2013,"number":2015,"owner":1994,"repository":1995,"state":2006,"title":2016,"updated_at":2017,"url":2018,"score":2019},"### Environment\n\n- Operating System: Windows_NT\r\n- Node Version: v20.14.0\r\n- Nuxt Version: 3.13.2\r\n- CLI Version: 3.14.0\r\n- Nitro Version: 2.9.7\r\n- Package Manager: pnpm@9.4.0\r\n- Builder: -\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\n\n### Version\n\n2.18.6\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-jideye\n\n### Description\n\nI've been trying to add font size to a textarea using Nuxt UI, but I'm having trouble getting it to work. For testing purposes, I've tried almost all available options, but none of them seem to be working.\r\n\r\n``` \r\n\u003CUTextarea\r\n :rows=\"10\"\r\n v-model=\"encoderForm.input\"\r\n placeholder=\"Text to encode\"\r\n :ui=\"{\r\n placeholder: 'text-[40px] text-red-500',\r\n base: 'text-[40px]',\r\n form: 'text-[40px]',\r\n rounded: 'rounded-md text-[40px]',\r\n }\" \r\n/>\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2014],{"name":1985,"color":1986},2273,"Nuxt UI - Textarea font size not working","2024-10-02T14:20:24Z","https://github.com/nuxt/ui/issues/2273",0.74007016,{"description":2021,"labels":2022,"number":2025,"owner":1994,"repository":2005,"state":2006,"title":2026,"updated_at":2027,"url":2028,"score":2029},"Hover color should be green on `ProseA`\n\n\n\nReading [typography tokens](https://github.com/nuxt-themes/typography/blob/main/tokens.config.ts), colors should be declared inside `tokens.config.ts` this way.\n\n(Tried with `colors` and `color`, both don't work)\n\n```js\nexport default defineTheme({\n typography: {\n color: {\n // palette() returns the good color scheme\n primary: palette('#00dc82')\n }\n }\n})\n```",[2023],{"name":1985,"color":2024},"ff281a",1076,"[Typography] ProseA hover color not applied","2023-06-06T12:14:34Z","https://github.com/nuxt/nuxt.com/issues/1076",0.7408063,{"description":2031,"labels":2032,"number":2039,"owner":1994,"repository":1995,"state":2006,"title":2040,"updated_at":2041,"url":2042,"score":2043},"### Environment\r\n\r\n- Operating System: Darwin\r\n- Node Version: v20.9.0\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: pnpm@9.0.0\r\n- Builder: -\r\n- User Config: app, runtimeConfig, stripe, devtools, modules, gtag, supabase, imports, i18n, colorMode, vue, vite\r\n- Runtime Modules: @nuxtjs/i18n@8.3.1, @nuxtjs/supabase@1.2.1, @nuxt/ui@2.15.2, nuxt-svgo@4.0.0, nuxt-lodash@2.5.3, nuxt-gtag@2.0.5, @nuxtjs/google-fonts@3.2.0, @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0, @nuxt/image@1.6.0, @vueuse/nuxt@10.9.0, @unlok-co/nuxt-stripe@3.0.0\r\n- Build Modules: -\r\n\r\n### Version\r\n\r\n2.15.2\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-ui-pqemsg?file=app.vue\r\n\r\n### Description\r\n\r\nWeird behavior with modals on mobile devices(with tap event)\r\nWhen I have modal opened with `prevent-close` attr, I cannot click anything inside modal.\r\nIn element inspection I notice that `touch-action: auto;` adds to clicked elements.\r\n\r\nInitially I noticed this bug on my project.\r\nBy default I have modal opened on the page with prevent close attr, and when I opened another modal, on mobile devices the actions inside second modal were blocked.\r\nBut during creation of reproduction, I've noticed that button don't respond even in the first modal(on mobile device)\r\n\r\nI was able to fix it(in my project), by closing the first modal.\r\nBut it's weird because on desktops everything works fine\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2033,2034,2036],{"name":1985,"color":1986},{"name":2035,"color":1992},"wontfix-v2",{"name":2037,"color":2038},"upstream","78bddb",1746,"On mobile device can't click inside items of modal if multiple are open","2025-03-28T17:57:30Z","https://github.com/nuxt/ui/issues/1746",0.74810326,{"description":2045,"labels":2046,"number":2053,"owner":1994,"repository":1995,"state":2006,"title":2054,"updated_at":2055,"url":2056,"score":2057},"### Description\n\nHello! I'm working on a huge project that relies on Nuxt UI v2. We want to upgrade to Nuxt UI v3, but the changes are vast, and I'm wondering if it is possible to have version 2 and version 3 at the same time somehow so we can do an incremental upgrade. If it's not possible, then I would LOVE for this to be a feature request to be able to do somehow.\n\nThanks!",[2047,2050],{"name":2048,"color":2049},"question","d876e3",{"name":2051,"color":2052},"v3","49DCB8",3562,"Incremental upgrade possible?","2025-03-17T16:11:35Z","https://github.com/nuxt/ui/issues/3562",0.75178325,{"description":2059,"labels":2060,"number":2063,"owner":1994,"repository":1995,"state":2006,"title":2064,"updated_at":2065,"url":2066,"score":2067},"### Environment\n\n- Docspage\n- nuxt/ui: v3.0.0-alpha.5 \n\n### Version\n\nv3.0.0-alpha.5 \n\n### Reproduction\n\nhttps://ui3.nuxt.dev/components/slideover\n\n### Description\n\ncompared to https://ui.nuxt.com/components/slideover the new slideover feels somehow laggy. I think its due to the early focus trap and the delay from opening and closing.\n\n### Additional context\n\nwhen closing the slideover the delay for the scrollbar is prettry big.\n\n### Logs\n\n_No response_",[2061,2062],{"name":1985,"color":1986},{"name":2051,"color":2052},2321,"Slideover feels strange","2024-10-15T15:29:56Z","https://github.com/nuxt/ui/issues/2321",0.7537951,{"description":2069,"labels":2070,"number":2074,"owner":1994,"repository":1995,"state":2006,"title":2075,"updated_at":2076,"url":2077,"score":2078},"### Environment\n\n- Operating System: Windows 10 \n- Node Version: v22.10.0 \n- Nuxt Version: 3.16.0 \n- CLI Version: 3.22.5 \n- Nitro Version: 2.11.5 \n- Package Manager: pnpm@9.15.7 \n- Builder: -\n- User Config: compatibilityDate, devtools, modules, css, meta, ssr, runtimeConfig, ui \n- Runtime Modules: @nuxt/ui@3.0.0-beta.3, @nuxt/icon@1.10.3, @nuxt/fonts@0.11.0, @vueuse/nuxt@12.8.2\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nNuxt UI 3.0\n\n### Reproduction\n\n```\n\u003Ctemplate>\n\u003CUInput\n v-model=\"translation\"\n ref=\"translationField\" \n />\n\u003C/template>\n\n\u003Cscript setup>\nconst translationField = ref(null)\n\nfunction nextCard() {\n translationField.value.focus() // throws: 'focus is not a function'\n \n nextTick(() => {\n translationField.value.focus() // same error\n })\n\n // below works ok\n nextTick(() => {\n const input = translationField.value?.$el?.querySelector('input')\n if (input) {\n input.focus()\n }\n })\n}\n\u003C/script>\n```\n\n\n### Description\nStandard Vue method of using template ref (for setting a focus, here) throws: 'focus() is not a function'\nIn the above code snippet I included workaround (credits to Sonnet 3.5)\nTried it dozen of times and checked this place to see if it has not been solved earlier.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2071,2072,2073],{"name":1985,"color":1986},{"name":2051,"color":2052},{"name":1991,"color":1992},3644,"\u003CUInput> template ref does not work","2025-03-21T13:14:18Z","https://github.com/nuxt/ui/issues/3644",0.7611915,{"description":2080,"labels":2081,"number":2085,"owner":1994,"repository":1994,"state":2006,"title":2086,"updated_at":2087,"url":2088,"score":2089},"super bad bug but I am tired and don't feel like providing a reproduction.\r\n\r\npls fix asap",[2082],{"name":2083,"color":2084},"needs reproduction","FBCA04",26910,"this is a bug report","2024-04-23T16:28:57Z","https://github.com/nuxt/nuxt/issues/26910",0.76350355,{"description":2091,"labels":2092,"number":2095,"owner":1994,"repository":1995,"state":2006,"title":2096,"updated_at":2097,"url":2098,"score":2099},"### Environment\n\n-\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.16.0\n\n### Reproduction\n\n- \n\n### Description\n\nUpgraded all deps to the latest and bam Nuxt 3.16.0 is added. We get errors now as Nuxt UI 3 still ships with\n\n`'@unhead/vue': 1.11.20(vue@3.5.13(typescript@5.8.2))\n`\n\nAs of Nuxt 3.16.0 ships with @unhead2:\nhttps://nuxt.com/blog/v3-16#unhead-v2\n\nActual error:\n`[@nuxt/scripts 9:42:20 PM] ERROR Nuxt Scripts requires Unhead >= 2, you are using v1.11.20. Please run nuxi upgrade --clean to upgrade...`\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2093,2094],{"name":1985,"color":1986},{"name":2051,"color":2052},3513,"Nuxt 3.16.0 - ships with @unhead2","2025-03-10T08:49:36Z","https://github.com/nuxt/ui/issues/3513",0.76625776,["Reactive",2101],{},["Set"],["ShallowReactive",2104],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"OP_3H583vKRYxBUzEd4eKIitgCyiJp-kaCfhJmZ_WSk":-1},"/nuxt/nuxt.com/661"]