diff --git a/layouts/scripts/dist/index.min.js b/layouts/scripts/dist/index.min.js
index 1598b89..0cc308c 100644
--- a/layouts/scripts/dist/index.min.js
+++ b/layouts/scripts/dist/index.min.js
@@ -87,7 +87,7 @@ var U=t.exports,B=$.exports;function V(e){for(var t="https://reactjs.org/docs/er
   }
 `,dp=up.div`
   position: relative;
-`,pp={desktop:[1920,1800,1680,1440,1360,1280,1024],tablet:[992,768,600],mobile:[480,414,375,360]},mp={reset:"100%",desktop:pp.desktop[0],tablet:pp.tablet[1],mobile:pp.mobile[2]};function hp({mode:e,active:n,onSelect:r}){const[a,l]=t.exports.useState({open:!0,activeBreakpoint:mp[e]}),o=e=>l(Object.assign({},a,e));t.exports.useEffect((()=>{const e=e=>vp(e)?o({open:!1}):null;return a.open&&document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}}));return F.createElement(dp,{tabIndex:"0",onBlur:async e=>await gp(e)?o({open:!1}):null},F.createElement(cp,{"data-mode":e,"data-active":n,onClick:()=>i()},e),n&&a.open&&pp[e]&&F.createElement(fp,null,pp[e].map((e=>F.createElement("li",null,F.createElement("a",{className:a.activeBreakpoint===e?"active":"",onClick:()=>i(e)},e))))));function i(e=null){if(e)return o({open:!1,activeBreakpoint:e}),void r(e);n?o({open:!0}):(r(a.activeBreakpoint),o({open:!1}))}}async function gp(e){const t=e.currentTarget;return new Promise((e=>{setTimeout((()=>e(!t.contains(document.activeElement))))}))}function vp(e){return"Escape"===e.key}const yp=["reset","desktop","tablet","mobile"];function bp(e={}){e.rootAttributes=e.rootAttributes??{};const n="default",r="100%",[a,l]=t.exports.useState(n),[o,i]=t.exports.useState(r);t.exports.useEffect((()=>{!function(){let e=o;"string"!=typeof e&&(e+="px");u.style.setProperty("--breakpoint",e),u.classList.add("has-breakpoint"),window.postMessage("responsiveUpdate"),window.responsiveState={mode:a,breakpoint:o}}()}),[a,o]);const u=e.rootAttributes.previewFrame;return F.createElement(sp,null,yp.map((e=>F.createElement(hp,{mode:e,active:s(e),onSelect:t=>function(e,t){if("reset"===e)return l(n),void i(r);l(e),i(t)}(e,t)}))));function s(e){return a===e}}function kp(e={}){const[n,r]=t.exports.useState({loading:!1}),a=e=>r(Object.assign({},n,e));return F.createElement("div",null,n.loading&&F.createElement("div",{className:"overlay overlay--loading"},"Loading, Please wait..."),F.createElement("button",{onClick:async function(){if(!confirm("Are you ready to submit the code?"))return;a({loading:!0});try{const e=await fetch("/publish");(await e.json()).success?alert("Your code is successfully sent to project manager! Thank you!"):alert("Can't send your code, please try again or contact project manager.")}catch(e){alert("Something went wrong, please try again or contact project manager.")}a({loading:!1})},disabled:n.loading,className:"btn btn--primary"},"Publish"))}const wp=up.div`
+`,pp={desktop:[1920,1800,1680,1440,1360,1280,1024],tablet:[992,768,600],mobile:[480,414,375,360,320]},mp={reset:"100%",desktop:pp.desktop[0],tablet:pp.tablet[1],mobile:pp.mobile[2]};function hp({mode:e,active:n,onSelect:r}){const[a,l]=t.exports.useState({open:!0,activeBreakpoint:mp[e]}),o=e=>l(Object.assign({},a,e));t.exports.useEffect((()=>{const e=e=>vp(e)?o({open:!1}):null;return a.open&&document.addEventListener("keydown",e),()=>{document.removeEventListener("keydown",e)}}));return F.createElement(dp,{tabIndex:"0",onBlur:async e=>await gp(e)?o({open:!1}):null},F.createElement(cp,{"data-mode":e,"data-active":n,onClick:()=>i()},e),n&&a.open&&pp[e]&&F.createElement(fp,null,pp[e].map((e=>F.createElement("li",null,F.createElement("a",{className:a.activeBreakpoint===e?"active":"",onClick:()=>i(e)},e))))));function i(e=null){if(e)return o({open:!1,activeBreakpoint:e}),void r(e);n?o({open:!0}):(r(a.activeBreakpoint),o({open:!1}))}}async function gp(e){const t=e.currentTarget;return new Promise((e=>{setTimeout((()=>e(!t.contains(document.activeElement))))}))}function vp(e){return"Escape"===e.key}const yp=["reset","desktop","tablet","mobile"];function bp(e={}){e.rootAttributes=e.rootAttributes??{};const n="default",r="100%",[a,l]=t.exports.useState(n),[o,i]=t.exports.useState(r);t.exports.useEffect((()=>{!function(){let e=o;"string"!=typeof e&&(e+="px");u.style.setProperty("--breakpoint",e),u.classList.add("has-breakpoint"),window.postMessage("responsiveUpdate"),window.responsiveState={mode:a,breakpoint:o}}()}),[a,o]);const u=e.rootAttributes.previewFrame;return F.createElement(sp,null,yp.map((e=>F.createElement(hp,{mode:e,active:s(e),onSelect:t=>function(e,t){if("reset"===e)return l(n),void i(r);l(e),i(t)}(e,t)}))));function s(e){return a===e}}function kp(e={}){const[n,r]=t.exports.useState({loading:!1}),a=e=>r(Object.assign({},n,e));return F.createElement("div",null,n.loading&&F.createElement("div",{className:"overlay overlay--loading"},"Loading, Please wait..."),F.createElement("button",{onClick:async function(){if(!confirm("Are you ready to submit the code?"))return;a({loading:!0});try{const e=await fetch("/publish");(await e.json()).success?alert("Your code is successfully sent to project manager! Thank you!"):alert("Can't send your code, please try again or contact project manager.")}catch(e){alert("Something went wrong, please try again or contact project manager.")}a({loading:!1})},disabled:n.loading,className:"btn btn--primary"},"Publish"))}const wp=up.div`
   --sidebarWidth: 360px;
   position: fixed;
   top: 0;
diff --git a/layouts/scripts/toolbar/responsive-button/ResponsiveButton.jsx b/layouts/scripts/toolbar/responsive-button/ResponsiveButton.jsx
index 41425c8..c843f7d 100644
--- a/layouts/scripts/toolbar/responsive-button/ResponsiveButton.jsx
+++ b/layouts/scripts/toolbar/responsive-button/ResponsiveButton.jsx
@@ -4,7 +4,7 @@ import {ButtonStyling, ResponsiveButtonStyle, ResponsiveOptionsDropdown} from ".
 const responsiveOptions = {
   desktop: [1920, 1800, 1680, 1440, 1360, 1280, 1024],
   tablet: [992, 768, 600],
-  mobile: [480, 414, 375, 360],
+  mobile: [480, 414, 375, 360, 320],
 }
 
 const defaultResponsiveOptions = {