From 89d0739bd312173b1dc03f086237e28e1f937b51 Mon Sep 17 00:00:00 2001 From: Quantum Date: Sun, 16 Feb 2025 17:11:52 -0500 Subject: [PATCH] Add python sample code for TOTP digest to code conversion --- index.html | 28 +++++++++++++++++- src/code.scss | 80 ++++++++++++++++++++++++++++++++++++++++++++++++++ src/index.scss | 8 +++++ 3 files changed, 115 insertions(+), 1 deletion(-) create mode 100644 src/code.scss diff --git a/index.html b/index.html index cd707e8..271345e 100644 --- a/index.html +++ b/index.html @@ -124,9 +124,35 @@ and finally
  • Compute the code as y \bmod{10^d}. + style="vertical-align: -3px">, zero-padded to d digits.
    • +

    Express as Python code, the last 3 steps would look like:

    + 
    i = h[-1] & 0xF
+y = (
+    (h[i + 0] & 0x7F) << 24 |
+    (h[i + 1] & 0xFF) << 16 |
+    (h[i + 2] & 0xFF) << 8 |
+    (h[i + 3] & 0xFF)
+)
+code = str(y % 10**d).rjust(d, '0')
+

    To avoid clock synchronization issues, most implementations will accept TOTP codes from the window before and after the one based on the current time. This tool lets you see the previous and next codes to help you debug.

    diff --git a/src/code.scss b/src/code.scss new file mode 100644 index 0000000..3687353 --- /dev/null +++ b/src/code.scss @@ -0,0 +1,80 @@ +.highlight { + background: #f8f8f8; + + .hll { background-color: #ffffcc } + .c { color: #8f5902; font-style: italic } /* Comment */ + .err { color: #a40000; border: 1px solid #ef2929 } /* Error */ + .g { color: #000000 } /* Generic */ + .k { color: #204a87; font-weight: bold } /* Keyword */ + .l { color: #000000 } /* Literal */ + .n { color: #000000 } /* Name */ + .o { color: #ce5c00; font-weight: bold } /* Operator */ + .x { color: #000000 } /* Other */ + .p { color: #000000; font-weight: bold } /* Punctuation */ + .ch { color: #8f5902; font-style: italic } /* Comment.Hashbang */ + .cm { color: #8f5902; font-style: italic } /* Comment.Multiline */ + .cp { color: #8f5902; font-style: italic } /* Comment.Preproc */ + .cpf { color: #8f5902; font-style: italic } /* Comment.PreprocFile */ + .c1 { color: #8f5902; font-style: italic } /* Comment.Single */ + .cs { color: #8f5902; font-style: italic } /* Comment.Special */ + .gd { color: #a40000 } /* Generic.Deleted */ + .ge { color: #000000; font-style: italic } /* Generic.Emph */ + .gr { color: #ef2929 } /* Generic.Error */ + .gh { color: #000080; font-weight: bold } /* Generic.Heading */ + .gi { color: #00A000 } /* Generic.Inserted */ + .go { color: #000000; font-style: italic } /* Generic.Output */ + .gp { color: #8f5902 } /* Generic.Prompt */ + .gs { color: #000000; font-weight: bold } /* Generic.Strong */ + .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ + .gt { color: #a40000; font-weight: bold } /* Generic.Traceback */ + .kc { color: #204a87; font-weight: bold } /* Keyword.Constant */ + .kd { color: #204a87; font-weight: bold } /* Keyword.Declaration */ + .kn { color: #204a87; font-weight: bold } /* Keyword.Namespace */ + .kp { color: #204a87; font-weight: bold } /* Keyword.Pseudo */ + .kr { color: #204a87; font-weight: bold } /* Keyword.Reserved */ + .kt { color: #204a87; font-weight: bold } /* Keyword.Type */ + .ld { color: #000000 } /* Literal.Date */ + .m { color: #0000cf; font-weight: bold } /* Literal.Number */ + .s { color: #4e9a06 } /* Literal.String */ + .na { color: #c4a000 } /* Name.Attribute */ + .nb { color: #204a87 } /* Name.Builtin */ + .nc { color: #000000 } /* Name.Class */ + .no { color: #000000 } /* Name.Constant */ + .nd { color: #5c35cc; font-weight: bold } /* Name.Decorator */ + .ni { color: #ce5c00 } /* Name.Entity */ + .ne { color: #cc0000; font-weight: bold } /* Name.Exception */ + .nf { color: #000000 } /* Name.Function */ + .nl { color: #f57900 } /* Name.Label */ + .nn { color: #000000 } /* Name.Namespace */ + .nx { color: #000000 } /* Name.Other */ + .py { color: #000000 } /* Name.Property */ + .nt { color: #204a87; font-weight: bold } /* Name.Tag */ + .nv { color: #000000 } /* Name.Variable */ + .ow { color: #204a87; font-weight: bold } /* Operator.Word */ + .w { color: #f8f8f8; text-decoration: underline } /* Text.Whitespace */ + .mb { color: #0000cf; font-weight: bold } /* Literal.Number.Bin */ + .mf { color: #0000cf; font-weight: bold } /* Literal.Number.Float */ + .mh { color: #0000cf; font-weight: bold } /* Literal.Number.Hex */ + .mi { color: #0000cf; font-weight: bold } /* Literal.Number.Integer */ + .mo { color: #0000cf; font-weight: bold } /* Literal.Number.Oct */ + .sa { color: #4e9a06 } /* Literal.String.Affix */ + .sb { color: #4e9a06 } /* Literal.String.Backtick */ + .sc { color: #4e9a06 } /* Literal.String.Char */ + .dl { color: #4e9a06 } /* Literal.String.Delimiter */ + .sd { color: #8f5902; font-style: italic } /* Literal.String.Doc */ + .s2 { color: #4e9a06 } /* Literal.String.Double */ + .se { color: #4e9a06 } /* Literal.String.Escape */ + .sh { color: #4e9a06 } /* Literal.String.Heredoc */ + .si { color: #4e9a06 } /* Literal.String.Interpol */ + .sx { color: #4e9a06 } /* Literal.String.Other */ + .sr { color: #4e9a06 } /* Literal.String.Regex */ + .s1 { color: #4e9a06 } /* Literal.String.Single */ + .ss { color: #4e9a06 } /* Literal.String.Symbol */ + .bp { color: #3465a4 } /* Name.Builtin.Pseudo */ + .fm { color: #000000 } /* Name.Function.Magic */ + .vc { color: #000000 } /* Name.Variable.Class */ + .vg { color: #000000 } /* Name.Variable.Global */ + .vi { color: #000000 } /* Name.Variable.Instance */ + .vm { color: #000000 } /* Name.Variable.Magic */ + .il { color: #0000cf; font-weight: bold } /* Literal.Number.Integer.Long */ +} diff --git a/src/index.scss b/src/index.scss index 725ddbc..a5f2a2f 100644 --- a/src/index.scss +++ b/src/index.scss @@ -20,6 +20,8 @@ @import 'bootstrap/scss/_popover.scss'; @import 'bootstrap/scss/_card.scss'; +@import './code'; + body { padding-top: $spacer * 4; } @@ -131,6 +133,12 @@ h3.card-title { scroll-margin-top: $spacer * 5; } +pre.highlight { + display: block; + padding: $spacer; + border-radius: $border-radius; +} + .footer { margin-top: $spacer; background: $body-tertiary-bg;