diff --git a/app/components/home.module.scss b/app/components/home.module.scss
index b836d2bec..0654b552d 100644
--- a/app/components/home.module.scss
+++ b/app/components/home.module.scss
@@ -41,7 +41,7 @@
   top: 0;
   width: var(--sidebar-width);
   box-sizing: border-box;
-  padding: 20px;
+  padding: 15px;
   background-color: var(--second);
   display: flex;
   flex-direction: column;
@@ -99,18 +99,18 @@
   height: 100%;
   display: flex;
   flex-direction: column;
+  min-width: 320px;
 }
 
 .mobile {
   display: none;
 }
 
-@media only screen and (max-width: 600px) {
+@media only screen and (max-width: 800px) {
   .container {
     min-height: unset;
     min-width: unset;
     max-height: unset;
-    min-width: unset;
     border: 0;
     border-radius: 0;
   }
@@ -219,7 +219,7 @@
   justify-content: space-between;
   color: rgb(166, 166, 166);
   font-size: 12px;
-  margin-top: 8px;
+  //margin-top: 8px;
   animation: slide-in ease 0.3s;
 }
 
@@ -338,3 +338,13 @@
 .rtl-screen {
   direction: rtl;
 }
+
+.custom-sidebar-clear-button {
+  background-color: transparent !important;
+  display: flex;
+  align-items: flex-end;
+
+  border-radius: 0;
+  padding: 0;
+  height: 20px;
+}
diff --git a/app/components/sidebar.tsx b/app/components/sidebar.tsx
index 07cebe45a..12fcf190a 100644
--- a/app/components/sidebar.tsx
+++ b/app/components/sidebar.tsx
@@ -231,6 +231,7 @@ export function SideBar(props: { className?: string }) {
             </Link>
           </div>
         </div>
+
         <div>
           <IconButton
             icon={<AddIcon />}
@@ -247,6 +248,16 @@ export function SideBar(props: { className?: string }) {
           />
         </div>
       </div>
+      <IconButton
+        text={Locale.Settings.Danger.Clear.Title}
+        onClick={async () => {
+          if (await showConfirm(Locale.Settings.Danger.Clear.Confirm)) {
+            chatStore.clearAllData();
+          }
+        }}
+        type="danger"
+        className={styles["custom-sidebar-clear-button"]}
+      />
 
       <div
         className={styles["sidebar-drag"]}
diff --git a/app/styles/globals.scss b/app/styles/globals.scss
index 611e77a23..c9dc0b8d5 100644
--- a/app/styles/globals.scss
+++ b/app/styles/globals.scss
@@ -67,7 +67,7 @@
   --full-height: 100%;
 }
 
-@media only screen and (max-width: 600px) {
+@media only screen and (max-width: 800px) {
   :root {
     --window-width: 100vw;
     --window-height: var(--full-height);
@@ -389,4 +389,4 @@ pre {
        url('https://cos.xiaosi.cc/fonts/noto-sans/noto-sans-regular.woff') format('woff'), /* Modern Browsers */
        url('https://cos.xiaosi.cc/fonts/noto-sans/noto-sans-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('https://cos.xiaosi.cc/fonts/noto-sans/noto-sans-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
-}
\ No newline at end of file
+}