diff --git a/apps/www/components/InlineCode.tsx b/apps/www/components/InlineCode.tsx new file mode 100644 index 00000000000..a51bf846fe8 --- /dev/null +++ b/apps/www/components/InlineCode.tsx @@ -0,0 +1,11 @@ +const InlineCodeTag = ({ children }: any) => { + // If children isn't a string, just return it as is, just in case + if (typeof children !== 'string') return children + + // check the length of the string inside the tag + // if it's fewer than 70 characters, add a white-space: pre so it doesn't wrap + const classes = children.length < 70 ? 'short-inline-codeblock' : '' + + return {children} +} +export default InlineCodeTag diff --git a/apps/www/lib/mdx/mdxComponents.tsx b/apps/www/lib/mdx/mdxComponents.tsx index 3f2f1762858..5464795d445 100644 --- a/apps/www/lib/mdx/mdxComponents.tsx +++ b/apps/www/lib/mdx/mdxComponents.tsx @@ -4,6 +4,7 @@ import CodeBlock from '~/components/CodeBlock/CodeBlock' import ImageGrid from '~/components/ImageGrid' import Quote from '~/components/Quote' import Chart from '~/components/Charts/PGCharts' +import InlineCodeTag from '~/components/InlineCode' // import all components used in blog articles here // to do: move this into a helper/utils, it is used elsewhere @@ -47,6 +48,7 @@ export default function mdxComponents(type?: 'blog' | 'lp' | undefined) { } return }, + code: (props: any) => {props.children}, } return components diff --git a/apps/www/public/rss.xml b/apps/www/public/rss.xml index 0431b705c82..34781c63723 100644 --- a/apps/www/public/rss.xml +++ b/apps/www/public/rss.xml @@ -5,9 +5,16 @@ https://supabase.com Latest news from Supabase en - Mon, 07 Nov 2022 03:03:30 +0000 + Wed, 16 Nov 2022 03:03:30 +0000 + https://supabase.com/blog/fetching-and-caching-supabase-data-in-next-js-server-components + Fetching and caching Supabase data in Next.js 13 Server Components + https://supabase.com/blog/fetching-and-caching-supabase-data-in-next-js-server-components + Next.js 13 introduces new data fetching and caching methods to enable React Server Components and Suspense. + Wed, 16 Nov 2022 03:03:30 +0000 + + https://supabase.com/blog/authentication-in-ionic-angular Authentication in Ionic Angular with Supabase https://supabase.com/blog/authentication-in-ionic-angular diff --git a/apps/www/styles/index.css b/apps/www/styles/index.css index bec4557690d..b86beb234ef 100644 --- a/apps/www/styles/index.css +++ b/apps/www/styles/index.css @@ -421,3 +421,10 @@ launch week .recharts-surface { overflow: visible; } + +/* Fix inline code block wrapping */ +@media screen and (min-width: 769px) { + .short-inline-codeblock { + white-space: pre !important; + } +}