Add basic Right-to-left (RTL) support

danielchalmers · May 27, 2024 · 792607e · 792607e
1 parent cfb430b
commit 792607e
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 12 deletions.
diff --git a/JournalApp/Data/PreferenceService.cs b/JournalApp/Data/PreferenceService.cs
@@ -55,6 +55,8 @@ public AppTheme SelectedAppTheme
         _ => true,
     };
 
+    public LayoutDirection LayoutDirection => AppInfo.RequestedLayoutDirection;
+
     public bool HideNotes
     {
         get => _preferenceStore.Get("hide_notes", false);

diff --git a/JournalApp/Pages/MainLayout.razor b/JournalApp/Pages/MainLayout.razor
@@ -6,22 +6,24 @@
 @inject NavigationManager NavigationManager
 @inject PreferenceService PreferenceService
 
-<MudThemeProvider Theme="_theme" IsDarkMode="PreferenceService.IsDarkMode" DefaultScrollbar />
+<MudRTLProvider RightToLeft="@(PreferenceService.LayoutDirection == LayoutDirection.RightToLeft)">
+    <MudThemeProvider Theme="_theme" IsDarkMode="PreferenceService.IsDarkMode" DefaultScrollbar />
 
-<MudPopoverProvider />
+    <MudPopoverProvider />
 
-<MudDialogProvider MaxWidth="MaxWidth.Small"
-                   FullWidth="true"
-                   NoHeader="false"
-                   CloseButton="false"
-                   CloseOnEscapeKey="false"
-                   Position="DialogPosition.Center" />
+    <MudDialogProvider MaxWidth="MaxWidth.Small"
+                       FullWidth="true"
+                       NoHeader="false"
+                       CloseButton="false"
+                       CloseOnEscapeKey="false"
+                       Position="DialogPosition.Center" />
 
-<MudSnackbarProvider />
+    <MudSnackbarProvider />
 
-<div class="page">
-    @Body
-</div>
+    <div class="page">
+        @Body
+    </div>
+</MudRTLProvider>
 
 @code {
     bool _hasInitiallyRendered;