Persian like languages not encoding

[arashsheyda]

Describe the bug

first of all, thanks for your great work

the bug appears when characters are like persian or hebrew (rtl languages probably) , it seems it can't encode them. here are some outputs: hebrew, persian, english

I think it might do something with nuxt server components

thank you again

Reproduction

No response

System / Nuxt Info

------------------------------
- Operating System: `Windows_NT`
- Node Version:     `v18.14.1`
- Nuxt Version:     `3.3.3`
- Nitro Version:    `1.0.0`
- Package Manager:  `pnpm@7.25.0`
- Builder:          `vite`
- User Config:      `extends`, `app`, `router`, `experimental`, `components`, `modules`, `i18n`, `headlessui`, `colorMode`, `tailwindcss`, `runtimeConfig`, `nitro`
- Runtime Modules:  `nuxt-icon@0.3.3`, `@pinia/nuxt@0.4.7`, `@nuxtjs/i18n@8.0.0-beta.10`, `@nuxt/devtools@0.3.1`, `nuxt-headlessui@1.1.1`, `@nuxtjs/color-mode@3.2.0`, `@nuxtjs/tailwindcss@6.6.5`, `@pinia-plugin-persistedstate/nuxt@1.1.1`
- Build Modules:    `-`
------------------------------

[harlan-zw]

Hey @arashsheyda, thanks for the issue.

This isn't really a bug, more a documentation issue. By default the Inter font is used to render the OG Image, you'll need need to include a font that has the characters you want to support.

export default defineNuxtConfig({
  ogImage: {
      fonts: [
        // will load this font from Google fonts
        'Noto+Sans+Hebrew:400'
      ]
  }
})

I'll update the docs to make this clearer

[jesspinklet]

How did you manage to handle RTL? Fonts will make the characters appear correctly. Is there any way to handle the direction for Arabic and Persian lang?

[arashsheyda]

@jesspinklet I handled it like this: https://github.com/persiansda/sabbath-school/blob/nuxt/components/app/OgImage/Base.vue

[jesspinklet]

@jesspinklet I handled it like this: https://github.com/persiansda/sabbath-school/blob/nuxt/components/app/OgImage/Base.vue

Thanks for replying back. Using Satroi renderer, the direction attribute and direction css property is not working for RTL regardless of checking i18n direction, text-align is working but it's just the alignment, the word orders aren't correct. Am I missing something here?

I found this issue that might be related.

[arashsheyda]

@jesspinklet oh I didn't know that