7x31
/
ChatGPT-Next-Web
mirror of https://github.com/Yidadaa/ChatGPT-Next-Web.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update styling for Home component and globals to adjust for collapsed sidebar width

This commit is contained in:
dakai 2023-04-02 10:50:54 +08:00
parent c0b4c466f6
commit fdc899cd7f
3 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/components/home.module.scss
View File

@ -168,7 +168,14 @@
.chat-list { .chat-list {
} }
.chat-item-collapse { .chat-item-collapse {
padding: 4px 11px; //make content center
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
position: relative;
padding-top: 4px;
padding-bottom: 4px;
background-color: var(--white); background-color: var(--white);
border-radius: 10px; border-radius: 10px;
margin-bottom: 10px; margin-bottom: 10px;

2
app/components/home.tsx
View File

@ -815,7 +815,7 @@ export function Home() {
className={ className={
sidebarCollapse sidebarCollapse
? styles["window-content-collapse"] ? styles["window-content-collapse"]
: styles["window-content-collapse"] : styles["window-content"]
} }
> >
{openSettings ? ( {openSettings ? (

4
app/styles/globals.scss
View File

@ -50,8 +50,8 @@
--window-width: 90vw; --window-width: 90vw;
--window-height: 90vh; --window-height: 90vh;
--sidebar-width: 380px; --sidebar-width: 300px;
--sidebar-collapse-width: 8vh; --sidebar-collapse-width: 75px;
--window-content-width: calc(100% - var(--sidebar-width)); --window-content-width: calc(100% - var(--sidebar-width));
--window-content-width-collapse: calc(100% - var(--sidebar-collapse-width)); --window-content-width-collapse: calc(100% - var(--sidebar-collapse-width));
--message-max-width: 90%; --message-max-width: 90%;