diff --git a/docs/frontend-class-diagram.puml b/docs/frontend-class-diagram.puml
index bd8b7c9..2908c58 100644
--- a/docs/frontend-class-diagram.puml
+++ b/docs/frontend-class-diagram.puml
@@ -12,22 +12,10 @@ skinparam wrapWidth 100
 skinparam nodesep 30
 skinparam ranksep 30
 
-top to bottom direction
+left to right direction
 
 title Frontend (Expo React Native)
 
-' ===== SCREENS =====
-package "Screens" #87CEEB {
-    class LoginScreen
-    class RegisterScreen
-    class CalendarScreen
-    class ChatScreen
-    class SettingsScreen
-    class EditEventScreen
-    class EventDetailScreen
-    class NoteScreen
-}
-
 ' ===== COMPONENTS =====
 package "Components" #FFA07A  {
     class AuthGuard
@@ -44,41 +32,53 @@ package "Components" #FFA07A  {
     class TypingIndicator
 }
 
+' ===== SCREENS =====
+package "Screens" #87CEEB {
+    class LoginScreen
+    class RegisterScreen
+    class CalendarScreen
+    class ChatScreen
+    class SettingsScreen
+    class EditEventScreen
+    class EventDetailScreen
+    class NoteScreen
+}
+
 ' ===== SERVICES =====
 package "Services" #90EE90 {
     class ApiClient {
-        +get()
-        +post()
-        +put()
-        +delete()
+        ' +get()
+        ' +post()
+        ' +put()
+        ' +delete()
     }
     class AuthService {
-        +login()
-        +register()
-        +logout()
-        +refresh()
+        ' +login()
+        ' +register()
+        ' +logout()
+        ' +refresh()
     }
     class EventService {
-        +getAll()
-        +getById()
-        +getByDateRange()
-        +create()
-        +update()
-        +delete()
+        ' +getAll()
+        ' +getById()
+        ' +getByDateRange()
+        ' +create()
+        ' +update()
+        ' +delete()
     }
     class ChatService {
-        +sendMessage()
-        +confirmEvent()
-        +rejectEvent()
-        +getConversations()
-        +getConversation()
-        +updateProposalEvent()
+        ' +sendMessage()
+        ' +confirmEvent()
+        ' +rejectEvent()
+        ' +getConversations()
+        ' +getConversation()
+        ' +updateProposalEvent()
     }
     class CaldavConfigService {
-        +getConfig()
-        +saveConfig()
-        +deleteConfig()
-        +sync()
+        ' +getConfig()
+        ' +saveConfig()
+        ' +deleteConfig()
+        ' +sync()
     }
 }
 
@@ -122,16 +122,6 @@ package "Models (shared)" #D3D3D3 {
 
 ' ===== RELATIONSHIPS =====
 
-' Screens -> Services
-LoginScreen --> AuthService
-CalendarScreen --> EventService
-CalendarScreen --> CaldavConfigService
-ChatScreen --> ChatService
-NoteScreen --> EventService
-EditEventScreen --> EventService
-EditEventScreen --> ChatService
-SettingsScreen --> CaldavConfigService
-
 ' Screens -> Components
 CalendarScreen --> EventCard
 ChatScreen --> ProposedEventCard
@@ -143,6 +133,16 @@ EventCardBase --> CardBase
 ModalBase --> CardBase
 DeleteEventModal --> ModalBase
 
+' Screens -> Services
+LoginScreen --> AuthService
+CalendarScreen --> EventService
+CalendarScreen --> CaldavConfigService
+ChatScreen --> ChatService
+NoteScreen --> EventService
+EditEventScreen --> EventService
+EditEventScreen --> ChatService
+SettingsScreen --> CaldavConfigService
+
 ' Auth
 AuthGuard --> AuthStore
 AuthGuard --> CaldavConfigService