feat: new windows and linux sidebar style

This commit is contained in:
kangfenmao 2024-08-14 21:28:44 +08:00
parent 076011b02b
commit d0f5547419
3 changed files with 11 additions and 10 deletions

View File

@ -34,7 +34,7 @@ const NavbarContainer = styled.div`
flex-direction: row;
min-height: var(--navbar-height);
max-height: var(--navbar-height);
margin-left: calc(var(--sidebar-width) * -1);
margin-left: ${isMac ? 'calc(var(--sidebar-width) * -1)' : 0};
padding-left: ${isMac ? 'var(--sidebar-width)' : 0};
border-bottom: 0.5px solid var(--color-border);
background-color: var(--navbar-background);
@ -43,7 +43,7 @@ const NavbarContainer = styled.div`
`
const NavbarLeftContainer = styled.div`
min-width: ${isMac ? 'var(--assistants-width)' : 'calc(var(--sidebar-width) + var(--assistants-width))'};
min-width: var(--assistants-width);
padding: 0 10px;
display: flex;
flex-direction: row;

View File

@ -1,7 +1,9 @@
import { TranslationOutlined } from '@ant-design/icons'
import Logo from '@renderer/assets/images/logo.png'
import { isMac } from '@renderer/config/constant'
import useAvatar from '@renderer/hooks/useAvatar'
import { useRuntime } from '@renderer/hooks/useStore'
import { Avatar } from 'antd'
import { FC } from 'react'
import { Link, useLocation } from 'react-router-dom'
import styled from 'styled-components'
@ -54,22 +56,21 @@ const Container = styled.div`
align-items: center;
padding: 8px 0;
width: var(--sidebar-width);
height: calc(100vh - var(--navbar-height));
height: ${isMac ? 'calc(100vh - var(--navbar-height))' : '100vh'};
-webkit-app-region: drag !important;
border-right: 0.5px solid var(--color-border);
margin-top: var(--navbar-height);
margin-bottom: var(--navbar-height);
margin-top: ${isMac ? 'var(--navbar-height)' : 0};
background-color: var(--sidebar-background);
transition: background-color 0.3s ease;
`
const AvatarImg = styled.img`
border-radius: 50%;
const AvatarImg = styled(Avatar)`
width: 28px;
height: 28px;
background-color: var(--color-background-soft);
margin: 5px 0;
margin-top: 5px;
margin-bottom: ${isMac ? '12px' : '12px'};
margin-top: ${isMac ? '5px' : '2px'};
border: none;
`
const MainMenus = styled.div`
display: flex;

View File

@ -120,7 +120,7 @@ export const NewButton = styled.div`
const ThemeSwitch = styled(Switch)`
-webkit-app-region: none;
margin-right: 8px;
margin-right: 10px;
.icon-theme {
font-size: 14px;
}