style fixes

This commit is contained in:
Andrew Pareles 2025-01-13 16:54:24 -08:00
parent 00fc9964e5
commit accff821f8
4 changed files with 16 additions and 41 deletions

View file

@ -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 => {

View file

@ -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)

View file

@ -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) {

View file

@ -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),