Support for YubiKey OTP 2 factor authenticator

CHANGELOG.md

@@ -2,6 +2,7 @@
 ## mm/dd/2022
 
 1. [](#new)
+   * Support for `YubiKey OTP` 2-Factor authenticator
    * New `elements` container field that shows/hides children fields based on boolean trigger value
 2. [](#improved)
    * Added new asset language strings

classes/plugin/Controllers/Login/LoginController.php

@@ -278,8 +278,13 @@ class LoginController extends AdminController
         $code = $data['2fa_code'] ?? null;
         $secret = $user->twofa_secret ?? null;
         $redirect = (string)$this->getRequest()->getUri();
+        $twofa_valid = $twoFa->verifyCode($secret, $code);
 
-        if (null === $twoFa || !$user->authenticated || !$code || !$secret || !$twoFa->verifyCode($secret, $code)) {
+        $yubikey_otp = $data['yubikey_otp'] ?? null;
+        $yubikey_id = $user->yubikey_id ?? null;
+        $yubikey_valid = $twoFa->verifyYubikeyOTP($yubikey_id, $yubikey_otp);
+
+        if (null === $twoFa || !$user->authenticated || (!$twofa_valid && !$yubikey_valid) ) {
             Admin::DEBUG && Admin::addDebugMessage('Admin login: 2FA check failed, log out!');
 
             // Failed 2FA auth, logout and redirect to the current page.

languages/en.yaml

@@ -758,6 +758,9 @@ PLUGIN_ADMIN:
   2FA_SECRET: "2FA Secret"
   2FA_SECRET_HELP: "Scan this QR code into your [Authenticator App](https://learn.getgrav.org/admin-panel/2fa#apps). Also it's a good idea to backup the secret in a safe location, in case you need to reinstall your app. Check the [Grav docs](https://learn.getgrav.org/admin-panel/2fa) for more information "
   2FA_REGENERATE: "Regenerate"
+  YUBIKEY_ID: "YubiKey ID"
+  YUBIKEY_OTP_INPUT: "YubiKey OTP"
+  YUBIKEY_HELP: "Insert your YubiKey into your computer and click the button to generate an OTP. The first 12 chars are your client ID and will be saved."
   FORCE_LOWERCASE_URLS: "Force lowercase URLs"
   FORCE_LOWERCASE_URLS_HELP: "By default Grav will set all slugs and routes to be lowercase. With this set to false, Uppercase slugs and routes can be used"
   INTL_ENABLED: "Intl module integration"

pages/admin/login.md

@@ -37,4 +37,9 @@ forms:
         id: twofa-code
         autofocus: true
         placeholder: PLUGIN_ADMIN.2FA_CODE_INPUT
+        description: or
+      yubikey_otp: 
+        type: text
+        id: yubikey-otp
+        placeholder: PLUGIN_ADMIN.YUBIKEY_OTP_INPUT
 ---

themes/grav/css-compiled/template.css

@@ -1912,6 +1912,12 @@ table.noflex {
     display: none; }
   #admin-login .form-data {
     padding-right: 0; }
+  #admin-login .form-description {
+    display: block;
+    margin-top: -15px;
+    padding-bottom: 15px;
+    text-align: center;
+    font-size: 110%; }
   #admin-login .wrapper-spacer {
     width: 100% !important;
     display: block !important;

themes/grav/scss/template/_login.scss

@@ -57,6 +57,7 @@
             width: 100%;
             @include flex(1);
         }
+
     }
 
     .form-field {
@@ -72,6 +73,14 @@
         padding-right: 0;
     }
 
+    .form-description {
+        display: block;
+        margin-top: -15px;
+        padding-bottom: 15px;
+        text-align: center;
+        font-size: 110%;
+    }
+
     .wrapper-spacer {
         width: 100% !important;
         display: block !important;