[playground] Remove handlebar to resize input
The only use of this is to resize the input tab immediately to be smaller. Instead, a follow on PR will just make the input tab smaller by default.
Sathya Gunasekaran committed
Dec 15, 2022 at 18:38 UTC
c4f16fce5ccfd15ef0626c8fbde408fd6d1296ab
1 file changed
+2
-10
compiler/forget/packages/playground/components/Editor/index.tsx
+2
-10
@@ -33,10 +33,6 @@ export default function Editor() {
33
const [showOutputOnMobile, setShowOutputOnMobile] = useState(false);
34
const { width: windowWidth } = useWindowSize();
35
const isMobile = windowWidth < 640;
36
- const [inputWidthInPct, setInputWidthInPct] = useState(50);
37
- const handleDrag = useDrag(({ delta: [x], xy: [currentPos] }) => {
38
- if (x !== 0) setInputWidthInPct(((currentPos + x) / windowWidth) * 100);
39
- });
36
const [diagnostics, setDiagnostics] = useState<Diagnostic[]>([]);
37
const updateDiagnostics = useCallback(
38
(newDiags: Diagnostic[]) => setDiagnostics(newDiags),
@@ -74,20 +70,16 @@ export default function Editor() {
70
<div className="flex grow">
71
<div
72
style={{
77
- width: isMobile ? "100%" : `${inputWidthInPct}%`,
73
+ width: isMobile ? "100%" : "50%",
74
}}
75
className={clsx("relative sm:min-w-[300px] sm:block", {
76
hidden: showOutputOnMobile,
77
})}
78
>
79
<Input diagnostics={diagnostics} />
84
- <div
85
- {...handleDrag()}
86
- className="absolute w-[5px] top-0 h-full right-[-2px] flex-none hidden transition-opacity duration-300 ease-out opacity-0 hover:opacity-100 bg-gray-300 sm:block cursor-col-resize touch-pan-x z-50"
87
- />
80
</div>
81
<div
90
- style={{ width: isMobile ? "100%" : `${100 - inputWidthInPct}%` }}
82
+ style={{ width: isMobile ? "100%" : `${50}%` }}
83
className={clsx("flex sm:flex sm:min-w-[300px]", {
84
hidden: !showOutputOnMobile,
85
})}