mirror of
https://github.com/voideditor/void
synced 2026-05-24 09:58:23 +00:00
style fixes
This commit is contained in:
parent
00fc9964e5
commit
accff821f8
4 changed files with 16 additions and 41 deletions
|
|
@ -378,6 +378,7 @@ class InlineDiffsService extends Disposable implements IInlineDiffsService {
|
|||
}
|
||||
},
|
||||
onChangeHeight(height) {
|
||||
if (height === 0) return // the viewZone sets this height to the container if it's out of view, ignore it
|
||||
viewZone.heightInPx = height
|
||||
// re-render with this new height
|
||||
editor.changeViewZones(accessor => {
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@ export const QuickEditChat = ({
|
|||
|
||||
const keybindingString = accessor.get('IKeybindingService').lookupKeybinding(VOID_CTRL_K_ACTION_ID)?.getLabel()
|
||||
|
||||
return <div ref={sizerRef} className='py-2 w-full max-w-xl'>
|
||||
return <div ref={sizerRef} style={{ maxWidth: 500 }} className='py-2 pl-4 w-full'>
|
||||
<form
|
||||
// copied from SidebarChat.tsx
|
||||
className={`
|
||||
|
|
@ -92,27 +92,17 @@ export const QuickEditChat = ({
|
|||
|
||||
{/* // this div is used to position the input box properly */}
|
||||
<div
|
||||
className={`w-full z-[999] relative
|
||||
@@[&_textarea]:!void-bg-transparent
|
||||
@@[&_textarea]:!void-outline-none
|
||||
@@[&_textarea]:!void-text-vscode-input-fg
|
||||
@@[&_div.monaco-inputbox]:!void-border-none
|
||||
@@[&_div.monaco-inputbox]:!void-outline-none`}
|
||||
className={`w-full z-[999] relative`}
|
||||
>
|
||||
<div className='flex flex-row items-center justify-between items-end gap-1'>
|
||||
|
||||
{/* input */}
|
||||
<div // copied from SidebarChat.tsx
|
||||
className={`w-full
|
||||
@@[&_textarea]:!void-bg-transparent
|
||||
@@[&_textarea]:!void-outline-none
|
||||
@@[&_textarea]:!void-text-vscode-input-fg
|
||||
@@[&_div.monaco-inputbox]:!void-outline-none
|
||||
`}
|
||||
className={`w-full`}
|
||||
>
|
||||
{/* text input */}
|
||||
<VoidInputBox2
|
||||
|
||||
className='px-1'
|
||||
initValue={initText}
|
||||
|
||||
ref={useCallback((r: HTMLTextAreaElement | null) => {
|
||||
|
|
@ -129,7 +119,8 @@ export const QuickEditChat = ({
|
|||
|
||||
fnsRef={textAreaFnsRef}
|
||||
|
||||
placeholder={`${keybindingString} to select`}
|
||||
placeholder={`Enter instructions...`}
|
||||
// ${keybindingString} to select.
|
||||
|
||||
onChangeText={useCallback((newStr: string) => {
|
||||
setInstructionsAreEmpty(!newStr)
|
||||
|
|
|
|||
|
|
@ -177,8 +177,8 @@ export const ButtonSubmit = ({ className, disabled, ...props }: ButtonProps & Re
|
|||
|
||||
return <button
|
||||
type='button'
|
||||
className={`rounded-full flex-shrink-0 flex-grow-0 cursor-pointer flex items-center justify-center
|
||||
${disabled ? 'bg-vscode-disabled-fg' : 'bg-white'}
|
||||
className={`rounded-full flex-shrink-0 flex-grow-0 flex items-center justify-center
|
||||
${disabled ? 'bg-vscode-disabled-fg cursor-default' : 'bg-white cursor-pointer'}
|
||||
${className}
|
||||
`}
|
||||
{...props}
|
||||
|
|
@ -304,7 +304,7 @@ export const SelectedFiles = (
|
|||
select-none
|
||||
bg-void-bg-3 hover:brightness-95
|
||||
text-void-fg-1 text-xs text-nowrap
|
||||
border rounded-xs ${isClearHovered ? 'border-void-border-1' : 'border-void-border-2'}
|
||||
border rounded-xs ${isClearHovered ? 'border-void-border-1' : 'border-void-border-2'} hover:border-void-border-1
|
||||
transition-all duration-150`}
|
||||
onClick={() => {
|
||||
// open the file if it is a file
|
||||
|
|
@ -712,30 +712,12 @@ export const SidebarChat = () => {
|
|||
</>
|
||||
|
||||
{/* middle row */}
|
||||
<div
|
||||
className={
|
||||
// // hack to overwrite vscode styles (generated with this code):
|
||||
// `bg-transparent outline-none text-vscode-input-fg min-h-[81px] max-h-[500px]`
|
||||
// .split(' ')
|
||||
// .map(style => `@@[&_textarea]:!void-${style}`) // apply styles to ancestor textarea elements
|
||||
// .join(' ') +
|
||||
// ` outline-none border-none`
|
||||
// .split(' ')
|
||||
// .map(style => `@@[&_div.monaco-inputbox]:!void-${style}`)
|
||||
// .join(' ');
|
||||
`
|
||||
@@[&_textarea]:!void-outline-none
|
||||
@@[&_textarea]:!void-min-h-[81px]
|
||||
@@[&_textarea]:!void-max-h-[500px]
|
||||
@@[&_div.monaco-inputbox]:!void-border-none
|
||||
@@[&_div.monaco-inputbox]:!void-outline-none
|
||||
`
|
||||
}
|
||||
>
|
||||
<div>
|
||||
|
||||
{/* text input */}
|
||||
<VoidInputBox2
|
||||
placeholder={`${keybindingString} to select`}
|
||||
className='min-h-[81px]'
|
||||
placeholder={`${keybindingString} to select. Enter instructions...`}
|
||||
onChangeText={useCallback((newStr: string) => { setInstructionsAreEmpty(!newStr) }, [setInstructionsAreEmpty])}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' && !e.shiftKey) {
|
||||
|
|
|
|||
|
|
@ -54,11 +54,12 @@ type InputBox2Props = {
|
|||
placeholder: string;
|
||||
multiline: boolean;
|
||||
fnsRef?: { current: null | TextAreaFns };
|
||||
className?: string;
|
||||
onChangeText?: (value: string) => void;
|
||||
onKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
|
||||
onChangeHeight?: (newHeight: number) => void;
|
||||
}
|
||||
export const VoidInputBox2 = forwardRef<HTMLTextAreaElement, InputBox2Props>(function X({ initValue, placeholder, multiline, fnsRef, onKeyDown, onChangeText }, ref) {
|
||||
export const VoidInputBox2 = forwardRef<HTMLTextAreaElement, InputBox2Props>(function X({ initValue, placeholder, multiline, fnsRef, className, onKeyDown, onChangeText }, ref) {
|
||||
|
||||
// mirrors whatever is in ref
|
||||
const textAreaRef = useRef<HTMLTextAreaElement | null>(null)
|
||||
|
|
@ -114,7 +115,7 @@ export const VoidInputBox2 = forwardRef<HTMLTextAreaElement, InputBox2Props>(fun
|
|||
|
||||
disabled={!isEnabled}
|
||||
|
||||
className="w-full resize-none max-h-[500px] overflow-y-auto"
|
||||
className={`w-full resize-none overflow-y-auto ${className}`}
|
||||
style={{
|
||||
// defaultInputBoxStyles
|
||||
background: asCssVariable(inputBackground),
|
||||
|
|
|
|||
Loading…
Reference in a new issue