CodingGarden / listd

listd is a Full Stack App that will allow users to create, share and watch lists of YouTube channels. This app is being built LIVE on Twitch https://twitch.tv/codinggarden
https://twitch.tv/codinggarden
MIT License
192 stars 53 forks source link

FR: set HTML direction #83

Open omar2205 opened 1 year ago

omar2205 commented 1 year ago

Describe the problem

we don't add a dir prop to the HTML element.

Describe the proposed solution

In

  1. https://github.com/CodingGarden/listd/blob/main/src/app.html#L2

    - <html lang="%lang%">
    + <html lang="%lang%" dir="%dir%">
  2. https://github.com/CodingGarden/listd/blob/main/src/hooks.server.ts#L25

    - return resolve(event, { transformPageChunk: ({ html }) => html.replace('%lang%', locale) });
    + const direction = (new Intl.Locale(locale)).textInfo.direction
    + return resolve(event, { transformPageChunk: ({ html }) => html.replace('%lang%', locale).replace('%dir%', direction) });

Intl.Locale ref: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Locale

Have you checked if this issue has already been raised?

Code of Conduct

ostadomid commented 1 year ago

I changed app.d.ts file content and seems it works correctly.

declare global {
    namespace App {
          // old stuff
    }
    namespace Intl {
            interface Locale {
        textInfo: {
            direction: 'rtl' | 'lrt';
        };
    }
   }
}