theluyuan/RWKV-Runner
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improve styles

Browse Source
This commit is contained in:
josc146 2023-11-20 20:16:55 +08:00
parent bbcc6b07b6
commit cd7a9896dc
5 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/ConfigSelector.tsx
View File

@ -4,7 +4,7 @@ import { Dropdown, Option } from '@fluentui/react-components';
import commonStore from '../stores/commonStore';
export const ConfigSelector: FC<{ size?: 'small' | 'medium' | 'large' }> = observer(({ size }) => {
return <Dropdown size={size} style={{ minWidth: 0 }} listbox={{ style: { minWidth: 0 } }}
return <Dropdown size={size} style={{ minWidth: 0 }} listbox={{ style: { minWidth: 'fit-content' } }}
value={commonStore.getCurrentModelConfig().name}
selectedOptions={[commonStore.currentModelConfigIndex.toString()]}
onOptionSelect={(_, data) => {

4
frontend/src/pages/Completion.tsx
View File

@ -29,8 +29,10 @@ const CompletionPanel: FC = observer(() => {
};
useEffect(() => {
if (inputRef.current)
if (inputRef.current) {
inputRef.current.style.height = '100%';
inputRef.current.style.maxHeight = '100%';
}
scrollToBottom();
}, []);

4
frontend/src/pages/Composition.tsx
View File

@ -82,8 +82,10 @@ const CompositionPanel: FC = observer(() => {
};
useEffect(() => {
if (inputRef.current)
if (inputRef.current) {
inputRef.current.style.height = '100%';
inputRef.current.style.maxHeight = '100%';
}
scrollToBottom();
if (playerRef.current && visualizerRef.current) {

3
frontend/src/pages/PresetsManager/MessagesEditor.tsx
View File

@ -108,7 +108,8 @@ const MessagesEditor: FC = observer(() => {
style={{ borderTopRightRadius: 0, borderBottomRightRadius: 0 }}>
<ReOrderDotsVertical20Regular />
</Card>
<Dropdown style={{ minWidth: 0, borderRadius: 0 }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: 0, borderRadius: 0 }}
listbox={{ style: { minWidth: 'fit-content' } }}
value={t(item.role)!}
selectedOptions={[item.role]}
onOptionSelect={(_, data) => {

10
frontend/src/pages/Settings.tsx
View File

@ -23,7 +23,7 @@ export const GeneralSettings: FC = observer(() => {
return <div className="flex flex-col gap-2">
<Labeled label={t('Language')} flex spaceBetween content={
<Dropdown style={{ minWidth: 0 }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: 0 }} listbox={{ style: { minWidth: 'fit-content' } }}
value={Languages[commonStore.settings.language]}
selectedOptions={[commonStore.settings.language]}
onOptionSelect={(_, data) => {
@ -43,7 +43,7 @@ export const GeneralSettings: FC = observer(() => {
{
commonStore.platform === 'windows' &&
<Labeled label={t('DPI Scaling')} flex spaceBetween content={
<Dropdown style={{ minWidth: 0 }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: 0 }} listbox={{ style: { minWidth: 'fit-content' } }}
value={commonStore.settings.dpiScaling + '%'}
selectedOptions={[commonStore.settings.dpiScaling.toString()]}
onOptionSelect={(_, data) => {
@ -89,7 +89,7 @@ export const AdvancedGeneralSettings: FC = observer(() => {
apiUrl: data.value
});
}} />
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 'fit-content' } }}
value="..." selectedOptions={[]} expandIcon={null}
onOptionSelect={(_, data) => {
commonStore.setSettings({
@ -140,7 +140,7 @@ export const AdvancedGeneralSettings: FC = observer(() => {
apiChatModelName: data.value
});
}} />
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 'fit-content' } }}
value="..." selectedOptions={[]} expandIcon={null}
onOptionSelect={(_, data) => {
if (data.optionValue) {
@ -168,7 +168,7 @@ export const AdvancedGeneralSettings: FC = observer(() => {
apiCompletionModelName: data.value
});
}} />
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 0 } }}
<Dropdown style={{ minWidth: '33px' }} listbox={{ style: { minWidth: 'fit-content', minHeight: 0 } }}
value="..." selectedOptions={[]} expandIcon={null}
onOptionSelect={(_, data) => {
if (data.optionValue) {