\r\n Loading\r\n \u003C/div>\r\n \u003C/template>\r\n \u003Cdiv class=\"content\" ref=\"someRef\">\r\n This text should NOT be large!\r\n Remove the \u003Cpre>ref=\"someRef\"\u003C/pre> from the parent and it works\r\n \u003C/div>\r\n \u003C/ClientOnly>\r\n\u003C/template>\r\n```\r\n\r\n**Expected behaviour when loading the page:**\r\nA big loading spinner, and, when everything is done loading, some normal text, like this:\r\n\r\n\r\n**Instead,** you get this:\r\n\r\n\r\nWhen you remove the `ref=\"someRef\"` from the content div, it works as expected",[],129,"icon","Unexpected behaviour when using an Icon within ClientOnly fallback","2023-12-18T12:08:48Z","https://github.com/nuxt/icon/issues/129",0.7822629,{"description":2008,"labels":2009,"number":2010,"owner":1991,"repository":2011,"state":2012,"title":2013,"updated_at":2014,"url":2015,"score":2016},"- [ ] Roobert font looses it's \"modern\" look on bold weights, I'd use max Semi Bold weight for it in every heading (add more font size instead)\n- [ ] Roobert font has lot's of stylistic set options, like this, compare \"y\" (font-feature-settings: \"ss03\")\n\n\u003Cimg width=\"641\" alt=\"Screenshot 2022-04-05 at 18 07 38\" src=\"https://user-images.githubusercontent.com/45076741/161789876-797bcaa2-a13d-464c-915f-78ecc265f282.png\">\n\n\u003Cimg width=\"641\" alt=\"Screenshot 2022-04-05 at 18 07 24\" src=\"https://user-images.githubusercontent.com/45076741/161789900-aee7f3d2-bc4c-44de-a229-cb6d024ad237.png\">\n\n- [ ] show dropdown on header navigation links on hover, instead of click (#285)\n- [x] dropdown surface looks blurred with background and header, especially on small screens (border/shadow/background/positioning to show it's floating surface could fix this)\n\n\u003Cimg width=\"1019\" alt=\"Screenshot 2022-04-05 at 18 29 57\" src=\"https://user-images.githubusercontent.com/45076741/161790191-27f36aaf-9b76-438a-a981-7d8fb75450d5.png\">\n\n- [ ] white/black contrast button in header looks like it has broken color mode styling (I think primary color is better for CTA)\n- [x] hamburger menu icon is boring and too small\n- [x] different container padding for header and overlaying mobile menu (open/close hamburger button sitting in different places)\n\nhttps://user-images.githubusercontent.com/45076741/161790407-db405256-5b76-4897-b582-aa4c83f8023d.mp4\n\n\n- [x] text size is too small in lot's of places (overlay navigation menu, ...). can hardly read it, also small tap area for touch screens\n\n\u003Cimg width=\"432\" alt=\"Screenshot 2022-04-05 at 18 33 03\" src=\"https://user-images.githubusercontent.com/45076741/161790852-2b8a4087-828e-40b3-b0b1-aaa8372d2d85.png\">\n\n- [x] overlay scrim background is too light in dark mode\n\n\u003Cimg width=\"718\" alt=\"Screenshot 2022-04-05 at 18 34 21\" src=\"https://user-images.githubusercontent.com/45076741/161791059-dfd5a3c8-8054-4ad7-be65-267efe6b206a.png\">\n\n- [ ] native scrollbars looks bad in dark mode (nuxtlabs/nuxt.com#287)\n- [ ] nested navigation in mobile overlay menu looks crowded because of vertical line effect (nuxtlabs/nuxt.com#297)\n\n\u003Cimg width=\"718\" alt=\"Screenshot 2022-04-05 at 18 35 04\" src=\"https://user-images.githubusercontent.com/45076741/161791303-b529765d-8eaf-476e-ac25-3149779166b3.png\">\n\n- [x] ToC is missing on mobile view\n- [x] ToC scrollspy doesn't work\n- [x] not sure about putting Prev/Next in ToC\n- [x] what Play button in ToC means?\n\n\u003Cimg width=\"267\" alt=\"Screenshot 2022-04-05 at 18 36 22\" src=\"https://user-images.githubusercontent.com/45076741/161791589-031ea821-a949-4155-9a72-3c7bcfb0c8a5.png\">\n\n- [ ] nested ToC items has unreadable text size\n- [x] scroll to top on click on ToC items (and text headings) is broken\n- [x] right aligning and truncating of ToC items looks weird\n\n\u003Cimg width=\"214\" alt=\"Screenshot 2022-04-05 at 18 23 22\" src=\"https://user-images.githubusercontent.com/45076741/161791724-2bd0e03e-8d17-4c11-a3c0-a85419b6f3fd.png\">\n\n- [ ] prose text font size is too small\n- [ ] prose underlines in headings interfere reading (maybe adding some space will fix, but I'd remove it completely)\n- [ ] prose no hover effect on clickable headings\n- [ ] prose code snippets highlightning doesn't feel like a part of whole design\n\nMore general suggestions:\n- [ ] full screen container, without max-width\n- [ ] much bigger font sizes almost everywhere, including buttons\n- [ ] do not use very bold Roobert\n",[],272,"nuxt.com","closed","Visual/UX review","2022-07-04T13:36:44Z","https://github.com/nuxt/nuxt.com/issues/272",0.4656453,{"description":2018,"labels":2019,"number":2026,"owner":1991,"repository":2011,"state":2012,"title":2027,"updated_at":2028,"url":2029,"score":2030},"- [x] We never use \"Roobert Bold\" you should replace all the \"font-bold\" by the semi bold version\n\n\n- [x] Prose base color must be gray-600 in light mode \n\n\n- [x] Cards have 12px border radius\n- [x] Buttons have 8px border radius",[2020,2023],{"name":2021,"color":2022},"enhancement","1ad6ff",{"name":2024,"color":2025},"design","00bd6f",515,"[UI] Improvements","2022-05-20T13:20:47Z","https://github.com/nuxt/nuxt.com/issues/515",0.7126844,{"description":2032,"labels":2033,"number":2035,"owner":1991,"repository":2011,"state":2012,"title":2036,"updated_at":2037,"url":2038,"score":2039},"",[2034],{"name":2021,"color":2022},21,"Use `RoobertPRO` font","2022-02-04T13:11:03Z","https://github.com/nuxt/nuxt.com/issues/21",0.7554249,{"description":2041,"labels":2042,"number":2047,"owner":1991,"repository":1992,"state":2012,"title":2048,"updated_at":2049,"url":2050,"score":2051},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v18.20.4\n- Nuxt Version: 3.13.2\n- CLI Version: 3.15.0\n- Nitro Version: 2.9.7\n- Package Manager: pnpm@9.12.1\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.7\n- Build Modules: -\n------------------------------\n\n### Version\n\nv3.0.0-alpha.7\n\n### Reproduction\n\nThe `:ui` prop is not handled by the component ButtonGroup ?\n\n### Description\n\nI tried to add somme classes to the ButtonGroup component, with `class=` attribute, with `:ui=` attribute, but it seems that nothing works.\n\n\n\n### Additional context\n\nI've tried to look into the code, but I don't understand all the magic you've done !\n\n### Logs\n\n_No response_",[2043,2044],{"name":1985,"color":1986},{"name":2045,"color":2046},"v3","49DCB8",2498,"[v3] ButtonGroup : class and ui attributes not handled ?","2024-10-31T09:25:42Z","https://github.com/nuxt/ui/issues/2498",0.7564818,{"description":2053,"labels":2054,"number":2058,"owner":1991,"repository":1991,"state":2012,"title":2059,"updated_at":2060,"url":2061,"score":2062},"Given a template tag that uses a bound style attribute `:style=\"styles\"`, the styles are not properly updated after the server side rendering. Importantly, the computed properties being used in the style tag *are* working, but they simply don't get swapped into the style attribute.\r\n\r\nHere's a reproduction:\r\n```\r\n\u003Ctemplate>\r\n \u003Cdiv class=\"example-bug\" :style=\"styles\">\r\n This container should be {{ size }}px wide with a {{ background }} background.\r\n \u003Ccode>\r\n {{ styles }}\r\n \u003C/code>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\nexport default {\r\n data () {\r\n return {\r\n size: 300\r\n }\r\n },\r\n computed: {\r\n styles () {\r\n return {\r\n width: `${this.size}px`,\r\n backgroundColor: this.background\r\n }\r\n },\r\n background () {\r\n if (this.size \u003C 100) {\r\n return 'red'\r\n } else if (this.size >= 100 && this.size \u003C 200) {\r\n return 'blue'\r\n } else if (this.size >= 200 && this.size \u003C 300) {\r\n return 'green'\r\n } else if (this.size >= 200 && this.size \u003C 300) {\r\n return 'salmon'\r\n } else if (this.size >= 300 && this.size \u003C 400) {\r\n return 'silver'\r\n } else if (this.size >= 400 && this.size \u003C 500) {\r\n return 'gold'\r\n } else {\r\n return 'yellow'\r\n }\r\n }\r\n },\r\n methods: {\r\n resize () {\r\n this.size = window.innerWidth\r\n }\r\n },\r\n created () {\r\n if (typeof window !== 'undefined') {\r\n window.addEventListener('resize', this.resize)\r\n this.resize()\r\n }\r\n }\r\n}\r\n\u003C/script>\r\n\r\n\u003Cstyle lang=\"scss\">\r\n.example-bug {\r\n width: 300px;\r\n background-color: red;\r\n position: absolute;\r\n height: 100vh\r\n}\r\ncode {\r\n font-size: 12px;\r\n display: block;\r\n padding-top: 1em;\r\n}\r\n\u003C/style>\r\n```\r\n\r\nHere is an example of the above ([full video here](https://github.com/journeygroup/nuxt-style-bug/blob/master/nuxt-bug-video.mov?raw=true)):\r\n\r\n\r\nAnd here is a fresh install of nuxt with the above code: https://github.com/journeygroup/nuxt-style-bug\r\n\r\nSomehow the data output in the `\u003Ccode>{{ styles }}\u003C/code>` block is correct, but the same exact property output in the `:style=\"styles\"` attribute is not correct. Also, certain changes in the property will trigger the styles to begin working properly. In this particular case, if I make the window small and the 'color' changes (again) it \"snap out of it\" and start working just fine.\r\n\r\nInterestingly, this does not occur when a page has been navigated to with vue-router and the page was not rendered server-side.\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c517\">#c517\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2055],{"name":2056,"color":2057},"2.x","d4c5f9",599,"Inline styles do not update properly when SSR","2023-01-18T15:39:32Z","https://github.com/nuxt/nuxt/issues/599",0.7645328,{"description":2064,"labels":2065,"number":2066,"owner":1991,"repository":2011,"state":2012,"title":2067,"updated_at":2068,"url":2069,"score":2070},"these should point to module repo + link rather than to nuxt.com",[],1271,"normalize relative links in module readmes","2023-10-10T14:44:46Z","https://github.com/nuxt/nuxt.com/issues/1271",0.7654121,{"description":2072,"labels":2073,"number":2075,"owner":1991,"repository":2011,"state":2012,"title":2076,"updated_at":2077,"url":2078,"score":2079},"\n- [x] You can remove the border & shadow of every color card\n\n\n- [x] For the logo cards, border is enough\n\n\n- [x] [Tablet] Text is unreadable, you can put opacity 10% on bg image like on mobile resolution\n\n\n- [x] [Tablet/Mobile] This hover effect should be the default state on tablet & mobile in order to improve the usability & readability of this page (+ go to font-medium at these resolutions)\n\n\n- [x] [Darkmode] Gray texts should be max gray-200 in dark mode (yours are inverted in dark so i suppose it's max u-gray-700 ?)",[2074],{"name":2021,"color":2022},604,"[Resources] Design Kit improvements V2","2022-06-14T10:53:12Z","https://github.com/nuxt/nuxt.com/issues/604",0.76923895,{"description":2081,"labels":2082,"number":2075,"owner":1991,"repository":2086,"state":2012,"title":2087,"updated_at":2088,"url":2089,"score":2079},"When adding this module to `nuxt.config` it will change the default id of the root dive in the body from `__nuxt` to `nuxt-test`. This can break certain code that relies on that id. for instance i had some css snipet that relies on that id:\r\n\r\n```css\r\nhtml,\r\nbody,\r\n#__nuxt,\r\n#nuxt-test { /* \u003C--- I had to add the new id */\r\n @apply h-full;\r\n \r\n}\r\n```\r\n\r\nI don't know why this module would need to do this but if it's needed it should at least be documented or warned as this small change can break some UIs or some code.",[2083],{"name":2084,"color":2085},"vitest-environment","b60205","test-utils","Changing the app id in the HTML should be documented or removed if not needed","2023-12-05T16:18:51Z","https://github.com/nuxt/test-utils/issues/604",["Reactive",2091],{},["Set"],["ShallowReactive",2094],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"n171BIcOeuz7t3HvRzuwrEkqwo4L7NiyLZv-swN12Mw":-1},"/nuxt/scripts/272"]