diff --git a/public/sdkMethods/login.js b/public/sdkMethods/login.js
index 8a65573..abcc1c2 100644
--- a/public/sdkMethods/login.js
+++ b/public/sdkMethods/login.js
@@ -11,21 +11,21 @@ document.addEventListener('DOMContentLoaded', async () => {
         locale: document.querySelector('#locale'),
     }
 
+    const preferPopup = elements.usePopup.checked;
+    const state = generateState(preferPopup);
+
+    const getAcrValues = () => {
+        const checkedAcr = elements.acrValues;
+        const acrs = [];
+        for (let acr of checkedAcr) {
+            acrs.push(acr.value);
+        }
+        return acrs.join(' ');
+    };
+
     elements.loginButton.addEventListener('click', (event) => {
         event.preventDefault();
 
-        const preferPopup = elements.usePopup.checked;
-        const state = generateState(preferPopup);
-
-        const getAcrValues = () => {
-            const checkedAcr = elements.acrValues;
-            const acrs = [];
-            for (let acr of checkedAcr) {
-                acrs.push(acr.value);
-            }
-            return acrs.join(' ');
-        };
-
         const popup = window.identity.login({
             state,
             scope: 'openid profile',
@@ -71,10 +71,8 @@ document.addEventListener('DOMContentLoaded', async () => {
             showResults(err)
         }
     }
-
     document.querySelector('#update-login-sso').addEventListener('click', updateIsLoggedInToSso)
 
-
     async function updateIsLoggedInToSdk() {
         try {
             const response = await fetch('/isloggedin', {credentials: 'include'});
@@ -89,7 +87,6 @@ document.addEventListener('DOMContentLoaded', async () => {
             showResults(`Error: ` + JSON.stringify(error, undefined, 2))
         }
     }
-
     document.querySelector('#update-sdk-login').addEventListener('click', updateIsLoggedInToSdk)
 
     //fetch user on load
@@ -133,4 +130,24 @@ document.addEventListener('DOMContentLoaded', async () => {
     }
     document.querySelector('#introspect-token').addEventListener('click', introspectToken)
 
+    //Simplified login
+    const triggerSimplifiedLogin = ()=>{
+        try{
+            window.identity.showSimplifiedLoginWidget({
+                state,
+                scope: 'openid profile',
+                acrValues: getAcrValues(),
+                preferPopup,
+                newFlow: elements.startNewFlow.checked,
+                loginHint: elements.preferedEmail.value,
+                oneStepLogin: elements.oneStepLogin.checked,
+                locale: elements.locale.value,
+            });
+        }catch (error){
+            showResults("Error: " + error)
+        }
+
+    }
+    document.querySelector('#simplified-login').addEventListener('click', triggerSimplifiedLogin)
+
 })
diff --git a/public/utils.js b/public/utils.js
index 9ca6e49..1c92da4 100644
--- a/public/utils.js
+++ b/public/utils.js
@@ -1,4 +1,4 @@
-const showResults = (results)=>{
+const showResults = (results) => {
     document.querySelector('#main-wrapper').classList.add('md:mr-96')
     document.querySelector('#results').classList.remove('hidden')
 
@@ -6,16 +6,16 @@ const showResults = (results)=>{
     document.querySelector('#result-data-input').value = JSON.stringify(results, undefined, 2)
 }
 
-window.showResults=showResults;
+window.showResults = showResults;
 
-const hideResults = ()=>{
+const hideResults = () => {
     document.querySelector('#main-wrapper').classList.remove('md:mr-96')
     document.querySelector('#results').classList.add('hidden')
 }
 
-window.hideResults=hideResults;
+window.hideResults = hideResults;
 
-const generateState = (preferPopup = false) =>{
+const generateState = (preferPopup = false) => {
     const char = () => Math.floor((Math.random() * (122 - 97)) + 97);
     const stateObj = {
         id: Array.from({length: 20}, () => String.fromCharCode(char())).join(''),
diff --git a/server/views/layouts/main.hbs b/server/views/layouts/main.hbs
index 9a7e487..7f4a137 100644
--- a/server/views/layouts/main.hbs
+++ b/server/views/layouts/main.hbs
@@ -38,8 +38,8 @@
 <noscript>You need to enable JavaScript to run this app.</noscript>
 <div id="root">
     {{> nav }}
-    <div class="md:ml-64  bg-blueGray-50 md:mr-96" id="main-wrapper">
-        <div class="bg-pink-600 p-4 md:px-8 h-screen">
+    <div class="md:ml-64 bg-blueGray-50 md:mr-96" id="main-wrapper">
+        <div class="bg-pink-600 p-4 md:px-8 md:h-screen">
             <div class="bg-white shadow-lg rounded">
 
             {{{body}}}
diff --git a/server/views/partials/methods/clearCachedAccessResult.hbs b/server/views/partials/methods/clearCachedAccessResult.hbs
index 0bfa716..d3f821a 100644
--- a/server/views/partials/methods/clearCachedAccessResult.hbs
+++ b/server/views/partials/methods/clearCachedAccessResult.hbs
@@ -9,7 +9,7 @@
 
     <pre>
         <code class="language-javascript">
-const identity = new Monetization({...})
+const monetization = new Monetization({...})
 - monetization.clearCachedAccessResult(productIds, userId);
         </code>
     </pre>
diff --git a/server/views/partials/methods/hasAccess.hbs b/server/views/partials/methods/hasAccess.hbs
index 75b29e0..e5ed96a 100644
--- a/server/views/partials/methods/hasAccess.hbs
+++ b/server/views/partials/methods/hasAccess.hbs
@@ -9,7 +9,7 @@
 
     <pre>
         <code class="language-javascript">
-const identity = new Monetization({...})
+const monetization = new Monetization({...})
 - monetization.hasAccess(productIds, userId);
         </code>
     </pre>
diff --git a/server/views/partials/methods/login.hbs b/server/views/partials/methods/login.hbs
index 2b743fe..6456e23 100644
--- a/server/views/partials/methods/login.hbs
+++ b/server/views/partials/methods/login.hbs
@@ -157,7 +157,7 @@
     </div>
 
     <div class="px-4">
-        <div class="inline-flex rounded-md shadow-sm mb-4" role="group">
+        <div class="inline-flex rounded-md shadow-sm mb-4 flex-col xl:flex-row" role="group">
             <button type="button"
                     class="inline-flex items-center px-4 py-2 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-s-lg hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-2 focus:ring-blue-700 focus:text-blue-700 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:text-white dark:hover:bg-gray-700 dark:focus:ring-blue-500 dark:focus:text-white"
                     id="login-button">
@@ -182,11 +182,11 @@
             </button>
 
             <button
-                id="introspect-token"
+                id="simplified-login"
                 type="button"
                 class="inline-flex items-center px-4 py-2 text-sm font-medium text-gray-900 bg-white border-t border-b border-l border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-2 focus:ring-blue-700 focus:text-blue-700 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:text-white dark:hover:bg-gray-700 dark:focus:ring-blue-500 dark:focus:text-white">
                 <i class="fa-solid fa-handshake-simple mr-2"></i>
-                Simplified login(TODO)
+                Simplified login
             </button>
 
             <button
diff --git a/server/views/partials/results.hbs b/server/views/partials/results.hbs
index fa1d745..993e168 100644
--- a/server/views/partials/results.hbs
+++ b/server/views/partials/results.hbs
@@ -1,4 +1,4 @@
-<div class="fixed top-0 right-0 w-96 p-4 hidden" id="results">
+<div class="md:fixed md:top-0 md:right-0 md:w-96 p-4 hidden" id="results">
     <h2 class="font-bold">
         Results
     </h2>