mirror of
https://github.com/ChatGPTNextWeb/ChatGPT-Next-Web.git
synced 2025-10-01 23:56:39 +08:00
优化小屏幕使用体验
This commit is contained in:
parent
afa75796d7
commit
3abb503cec
@ -41,7 +41,7 @@
|
|||||||
top: 0;
|
top: 0;
|
||||||
width: var(--sidebar-width);
|
width: var(--sidebar-width);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 20px;
|
padding: 15px;
|
||||||
background-color: var(--second);
|
background-color: var(--second);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@ -99,18 +99,18 @@
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
min-width: 320px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile {
|
.mobile {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 600px) {
|
@media only screen and (max-width: 800px) {
|
||||||
.container {
|
.container {
|
||||||
min-height: unset;
|
min-height: unset;
|
||||||
min-width: unset;
|
min-width: unset;
|
||||||
max-height: unset;
|
max-height: unset;
|
||||||
min-width: unset;
|
|
||||||
border: 0;
|
border: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
}
|
}
|
||||||
@ -219,7 +219,7 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
color: rgb(166, 166, 166);
|
color: rgb(166, 166, 166);
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
margin-top: 8px;
|
//margin-top: 8px;
|
||||||
animation: slide-in ease 0.3s;
|
animation: slide-in ease 0.3s;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -338,3 +338,13 @@
|
|||||||
.rtl-screen {
|
.rtl-screen {
|
||||||
direction: rtl;
|
direction: rtl;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.custom-sidebar-clear-button {
|
||||||
|
background-color: transparent !important;
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
|
||||||
|
border-radius: 0;
|
||||||
|
padding: 0;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
@ -231,6 +231,7 @@ export function SideBar(props: { className?: string }) {
|
|||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<IconButton
|
<IconButton
|
||||||
icon={<AddIcon />}
|
icon={<AddIcon />}
|
||||||
@ -247,6 +248,16 @@ export function SideBar(props: { className?: string }) {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</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
|
<div
|
||||||
className={styles["sidebar-drag"]}
|
className={styles["sidebar-drag"]}
|
||||||
|
@ -67,7 +67,7 @@
|
|||||||
--full-height: 100%;
|
--full-height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 600px) {
|
@media only screen and (max-width: 800px) {
|
||||||
:root {
|
:root {
|
||||||
--window-width: 100vw;
|
--window-width: 100vw;
|
||||||
--window-height: var(--full-height);
|
--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.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.ttf') format('truetype'), /* Safari, Android, iOS */
|
||||||
url('https://cos.xiaosi.cc/fonts/noto-sans/noto-sans-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
|
url('https://cos.xiaosi.cc/fonts/noto-sans/noto-sans-regular.svg#NotoSans') format('svg'); /* Legacy iOS */
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user