Has anyone fixed code blocks for RTL language pages?

[dogweather]

Here's the problem: when the page is, say, Hebrew, the codeblocks are also (incorrectly) shown in RTL:

I was able to fix this in the Ananke theme with this:

layouts/_default/_markup/render-codeblock.html

{{ $class := .Attributes.class | default "" }}
{{ $lang  := .Attributes.lang  | default .Type }}

{{ if transform.CanHighlight $lang }}
    <div dir="ltr" class="{{ $class }}">{{ highlight .Inner $lang }}</div>
{{else}}
    <pre dir="ltr"><code class="{{ $class }}">{{.Inner}}</code></pre>
{{end}}

This resolves the RTL problem, but it breaks the Hextra styling. It worked with Ananke, so I'm not why this doesn't work with Hextra:

[dogweather]

I solved it, by making a custom layouts/partials/components/codeblock.html. I just added the dir="ltr" attributes:

{{ $filename := .filename | default "" -}}
{{ $lang := .lang | default "" }}
{{ $content := .content }}
{{ $options := .options | default (dict) }}

{{- if $filename -}}
  <div class="filename" dir="auto">{{ $filename }}</div>
{{- end -}}
{{- if transform.CanHighlight $lang -}}
  <div dir="ltr">{{- highlight $content $lang $options -}}</div>
{{- else -}}
  <pre dir="ltr"><code>{{ $content }}</code></pre>
{{- end -}}

It's an interesting use case: This is needed for all programming languages shown in codeblocks. Could this be a useful PR for the theme?

[imfing]

not sure but might be related to this pr #301

[dogweather]

Thanks! @Goudarz what would you think about this change, hard-coding all codeblocks dir="ltr"? Or should it be an option? Does anyone ever display code RTL?