2023-07-14 23:34:40 -04:00
<!doctype html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > Sesame 2FA< / title >
< style > [ x-cloak ] { display : none } < / style >
< script src = "https://unpkg.com/alpinejs" defer > < / script >
< script src = "https://cdn.tailwindcss.com" > < / script >
< link rel = "icon" type = "image/x-icon" href = "/src/img/icon.png" >
2023-07-15 07:43:59 -04:00
< meta property = "og:title" content = "Sesame 2FA" / >
< meta property = "og:type" content = "website" / >
< meta property = "og:url" content = "https://sesame.dws.rip/features.html" / >
< meta property = "og:image" content = "https://sesame.dws.rip/src/img/icon.png" / >
< meta property = "og:description" content = "Take control of your 2-factor keys with full OTP spec compliance, Google Authenticator import, manual key creation, and JSON export." / >
2023-07-14 23:34:40 -04:00
< / head >
< body class = "flex items-start justify-center h-full bg-gray-50" >
< div class = "flex items-center justify-center w-full max-w-full" >
< section class = "w-full px-6 pb-12 antialiased bg-white" >
< div class = "mx-auto max-w-7xl" >
< nav class = "relative z-50 h-24 select-none" x-data = "{ showMenu: false }" >
< div class = "container relative flex flex-wrap items-center justify-between h-24 mx-auto overflow-hidden font-medium border-b border-gray-200 md:overflow-visible lg:justify-center sm:px-4 md:px-2 lg:px-0" >
< div class = "flex items-center justify-start w-1/4 h-full pr-4" >
< a href = "/index.html" class = "flex items-center py-4 space-x-2 font-extrabold text-gray-900 md:py-0" >
< span class = "flex items-center justify-center w-8 h-8 text-white rounded-full" >
< img src = "/src/img/icon.png" alt = "Icon" >
< / span >
< span > Sesame 2FA< / span >
< / a >
< / div >
< div class = "top-0 left-0 items-start hidden w-full h-full p-4 text-sm bg-gray-900 bg-opacity-50 md:items-center md:w-3/4 md:absolute lg:text-base md:bg-transparent md:p-0 md:relative md:flex" :class = "{'flex fixed': showMenu, 'hidden': !showMenu }" >
< div class = "flex-col w-full h-auto overflow-hidden bg-white rounded-lg md:bg-transparent md:overflow-visible md:rounded-none md:relative md:flex md:flex-row" >
< a href = "#_" class = "inline-flex items-center block w-auto h-16 px-6 text-xl font-black leading-none text-gray-900 md:hidden" >
< / a >
< div class = "flex flex-col items-start justify-center w-full space-x-6 text-center lg:space-x-8 md:w-2/3 md:mt-0 md:flex-row md:items-center" >
< a href = "/index.html" class = "inline-block w-full py-2 mx-0 font-medium text-left text-gray-700 md:w-auto md:px-0 md:mx-2 hover:text-black lg:mx-3 md:text-center" > Home< / a >
< a href = "/features.html" class = "inline-block w-full py-2 mx-0 ml-6 font-medium text-left text-black md:ml-0 md:w-auto md:px-0 md:mx-2 lg:mx-3 md:text-center" > Features< / a >
< a href = "/about.html" class = "inline-block w-full py-2 mx-0 font-medium text-left text-gray-700 md:w-auto md:px-0 md:mx-2 hover:text-black lg:mx-3 md:text-center" > About< / a >
< a href = "/contact.html" class = "inline-block w-full py-2 mx-0 font-medium text-left text-gray-700 md:w-auto md:px-0 md:mx-2 hover:text-black lg:mx-3 md:text-center" > Contact< / a >
< / div >
< / div >
< / div >
< div @ click = "showMenu = !showMenu" class = "absolute right-0 flex flex-col items-center items-end justify-center w-10 h-10 bg-white rounded-full cursor-pointer md:hidden hover:bg-gray-100" >
< svg class = "w-6 h-6 text-gray-700" x-show = "!showMenu" fill = "none" stroke-linecap = "round" stroke-linejoin = "round" stroke-width = "2" viewBox = "0 0 24 24" stroke = "currentColor" > < path d = "M4 6h16M4 12h16M4 18h16" > < / path > < / svg >
< svg class = "w-6 h-6 text-gray-700" x-show = "showMenu" fill = "none" stroke = "currentColor" viewBox = "0 0 24 24" xmlns = "http://www.w3.org/2000/svg" style = "display: none;" > < path stroke-linecap = "round" stroke-linejoin = "round" stroke-width = "2" d = "M6 18L18 6M6 6l12 12" > < / path > < / svg >
< / div >
< / div >
< / nav >
<!-- Main Hero Content -->
< section class = "w-full bg-white pt-7 pb-7 md:pt-20 md:pb-24" >
< div class = "box-border flex flex-col items-center content-center px-8 mx-auto leading-6 text-black border-0 border-gray-300 border-solid md:flex-row max-w-7xl lg:px-16" >
<!-- Image -->
< div class = "box-border relative w-full max-w-md px-4 mt-5 mb-4 -ml-5 text-center bg-no-repeat bg-contain border-solid md:ml-0 md:mt-0 md:max-w-none lg:mb-0 md:w-1/2 xl:pl-10" >
< img src = "/src/img/details.png" class = "p-2 pl-6 pr-5 xl:pl-16 xl:pr-20 " / >
< / div >
<!-- Content -->
< div class = "box-border order-first w-full text-black border-solid md:w-1/2 md:pl-10 md:order-none" >
< h2 class = "m-0 text-xl font-semibold leading-tight border-0 border-gray-300 lg:text-3xl md:text-2xl" >
Own Your Keys
< / h2 >
< p class = "pt-4 pb-8 m-0 leading-7 text-gray-700 border-0 border-gray-300 sm:pr-12 xl:pr-32 lg:text-lg" >
Sesame gives you access to the details of your keys, letting you stay in control.
< / p >
< ul class = "p-0 m-0 leading-6 border-0 border-gray-300" >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > View the key's algorithm, type, and protected secret.
< / li >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > Customize the key's name and color.
< / li >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > Auto-generated QR code for quick sharing or transfer.
< / li >
< / ul >
< / div >
<!-- End Content -->
< / div >
< div class = "box-border flex flex-col items-center content-center px-8 mx-auto mt-2 leading-6 text-black border-0 border-gray-300 border-solid md:mt-20 xl:mt-0 md:flex-row max-w-7xl lg:px-16" >
<!-- Content -->
< div class = "box-border w-full text-black border-solid md:w-1/2 md:pl-6 xl:pl-32" >
< h2 class = "m-0 text-xl font-semibold leading-tight border-0 border-gray-300 lg:text-3xl md:text-2xl" >
Go Beyond QR Codes
< / h2 >
< p class = "pt-4 pb-8 m-0 leading-7 text-gray-700 border-0 border-gray-300 sm:pr-10 lg:text-lg" >
Counter based? More than 6 digits? Not SHA1? No QR Code? No problem for Sesame.
< / p >
< ul class = "p-0 m-0 leading-6 border-0 border-gray-300" >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > Full compliance to the OTP spec means all OTP keys are supported.
< / li >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > Create keys manually without a QR code.
< / li >
< li class = "box-border relative py-1 pl-0 text-left text-gray-500 border-solid" >
< span class = "inline-flex items-center justify-center w-6 h-6 mr-2 text-white bg-blue-300 rounded-full" data-primary = "blue-400" > < span class = "text-sm font-bold" > ✓< / span > < / span > Import from Google Authenticator via QR code export.
< / li >
< / ul >
< / div >
<!-- End Content -->
<!-- Image -->
< div class = "box-border relative w-full max-w-md px-4 mt-10 mb-4 text-center bg-no-repeat bg-contain border-solid md:mt-0 md:max-w-none lg:mb-0 md:w-1/2" >
< img src = "/src/img/new_key.png" class = "pl-4 sm:pr-10 xl:pl-10 lg:pr-32" / >
< / div >
< / div >
< / section >
<!-- End Main Hero Content -->
< footer >
< section class = "text-gray-700 bg-white body-font" { ! ! $ attributes ? ? ' ' ! ! } >
< div class = "container flex flex-col items-center px-8 py-8 mx-auto max-w-7xl sm:flex-row" >
< a href = "#_" class = "text-xl font-black leading-none text-gray-900 select-none logo" > Sesame 2FA< span class = "text-indigo-600" > < / span > < / a >
< p class = "mt-4 text-sm text-gray-500 sm:ml-4 sm:pl-4 sm:border-l sm:border-gray-200 sm:mt-0" > © 2023 DWS © - 2023 Tanishq Dubey ©
< / p >
< span class = "inline-flex justify-center mt-4 space-x-5 sm:ml-auto sm:mt-0 sm:justify-start" >
< / span >
< / div >
< / section >
< / footer >
< / div >
< / section >
< / div >
< / body >
< / html >
