Adding fallback to 2FA docs due to Safari 13 not yet supporting webp

content/security/2fa.md

@@ -25,13 +25,22 @@ use, have a look at Aegis Authenticator
 ([F-Droid](https://f-droid.org/de/packages/com.beemdevelopment.aegis/) | [Google Play Store](https://play.google.com/store/apps/details?id=com.beemdevelopment.aegis&hl=en_US)).
 
 ### Step 1: Navigate to your user settings
-![User Settings](/assets/images/security/2fa/user-settings.webp)
+<picture>
+  <source srcset="/assets/images/security/2fa/user-settings.webp" type="image/webp">
+  <img src="/assets/images/security/2fa/user-settings.png" alt="User Settings">
+</picture>
 
 ### Step 2: Navigate to the Security tab and click on the Enroll button
-![Security Settings](/assets/images/security/2fa/security-settings.webp)
+<picture>
+  <source srcset="/assets/images/security/2fa/security-settings.webp" type="image/webp">
+  <img src="/assets/images/security/2fa/security-settings.png" alt="Security Settings">
+</picture>
 
 ### Step 3: Scan the QR code and enter the verification code
-![Scanning QR Code](/assets/images/security/2fa/qr-scan.webp)
+<picture>
+  <source srcset="/assets/images/security/2fa/qr-scan.webp" type="image/webp">
+  <img src="/assets/images/security/2fa/qr-scan.jpg" alt="Scanning QR Code">
+</picture>
 
 After scanning the QR code with your app, enter the six digit code displayed
 in your app into the "Passcode" field of the settings form, then click "Verify".
@@ -42,7 +51,10 @@ using the scratch token.
 
 That token is showed to you right after setting up 2FA:
 
-![Scratch token](/assets/images/security/2fa/scratch-token.webp)
+<picture>
+  <source srcset="/assets/images/security/2fa/scratch-token.webp" type="image/webp">
+  <img src="/assets/images/security/2fa/scratch-token.png" alt="Scratch token">
+</picture>
 
 Please store that token in a safe place.