docs: Create activity diagram for orders/accounts, update theme

docs/diagrams/customer-account-order-activity-diagram.puml

@@ -0,0 +1,37 @@
+' This diagram illustrates how Customer accounts are handled
+@startuml
+!include theme.puml
+title Customer Account & Order Handling
+start
+:Anonymous;
+if (Has existing account?) then (yes)
+    if (Log in?) then (no)
+    else (yes)
+     stop
+    endif
+else (no)
+    if (Create account?) then (no)
+    else (yes)
+        #66aa66:Create authenticated Customer;
+        stop
+    endif
+endif
+:Create anonymous Order;
+:ArrangingShipping;
+if (Has existing account?) then (yes)
+    :Complete Order;
+    stop
+else (no)
+    if (Guest Customer exists\nwith matching email?) then (no)
+        #98a966:Create guest Customer;
+    else (yes)
+        #98a966:Fetch guest Customer;
+    endif
+    :Associate guest Customer\nwith Order;
+endif
+:Complete Order;
+if (Create account?) then (yes)
+    #66aa66:Create authenticated Customer;
+endif
+stop
+@enduml

docs/diagrams/theme.puml

@@ -3,11 +3,16 @@
 !define LINE    #1a3164
 !define BACKGROUND #b9cefc
 !define BORDER  #e58e26
+!define BLUE  #4067af
+!define BLUE_LIGHT  #c6dbff
 
 ' Base Setting
 skinparam Shadowing false
-skinparam backgroundColor #f4f3f1-#edf3ff
+skinparam backgroundColor #fff
 skinparam ComponentStyle uml2
+skinparam TitleFontSize 18
+skinparam Padding 3
+
 skinparam Default {
   FontName  'Impact'
   FontColor BLACK
@@ -15,6 +20,25 @@ skinparam Default {
   FontStyle plain
 }
 
+skinparam Class {
+  BackgroundColor BLUE_LIGHT
+  BorderColor BLACK
+}
+
+skinparam Activity {
+  FontColor white
+  AttributeFontColor white
+  BackgroundColor BLUE
+  BorderColor BLACK
+  ArrowColor #222266
+}
+
+skinparam ActivityDiamond {
+  BackgroundColor BLUE_LIGHT
+  BorderColor BLACK
+  FontColor BLACK
+}
+
 skinparam Sequence {
   ArrowThickness 2
   ArrowColor LINE
@@ -24,6 +48,13 @@ skinparam Sequence {
   BorderColor BORDER
   BackgroundColor BACKGROUND
 }
+
+skinparam State {
+  FontStyle bold
+  BackgroundColor BLUE_LIGHT
+  BorderColor BLACK
+}
+
 skinparam Participant {
   BackgroundColor BLACK
   BorderColor BORDER