Fix cutoff content for history prompt list / code diff viewer (#916)

richard-to · web-flow · commit da6901379783 · 2024-09-01T07:45:29.000-07:00
I noticed that the Angular dialog sets a 65vh. But our code is using 80vh. So I set it to 65vh to match. One consideration though is whether this 65vh changes dynamically or not. I did try adjusting viewport sizes in Chrome dev tools and it seemed like it stayed at 65vh but not sure. Closes #908
diff --git a/mesop/web/src/editor_toolbar/editor_toolbar.ts b/mesop/web/src/editor_toolbar/editor_toolbar.ts
@@ -414,7 +414,7 @@ class EditorPromptResponseDialog {
         display: flex;
         flex-direction: column;
         gap: 12px;
-        max-height: 80vh;
+        max-height: 65vh;
         overflow-y: auto;
       }
       .prompt-item {
@@ -429,7 +429,7 @@ class EditorPromptResponseDialog {
       }
       .code-display {
         flex: 1;
-        max-height: 80vh;
+        max-height: 65vh;
         overflow-y: auto;
       }
       .save-interaction-button {

Original file line number	Diff line number	Diff line change
`@@ -414,7 +414,7 @@ class EditorPromptResponseDialog {`
`414`	`414`	`display: flex;`
`415`	`415`	`flex-direction: column;`
`416`	`416`	`gap: 12px;`
`417`		`- max-height: 80vh;`
	`417`	`+ max-height: 65vh;`
`418`	`418`	`overflow-y: auto;`
`419`	`419`	`}`
`420`	`420`	`.prompt-item {`
`@@ -429,7 +429,7 @@ class EditorPromptResponseDialog {`
`429`	`429`	`}`
`430`	`430`	`.code-display {`
`431`	`431`	`flex: 1;`
`432`		`- max-height: 80vh;`
	`432`	`+ max-height: 65vh;`
`433`	`433`	`overflow-y: auto;`
`434`	`434`	`}`
`435`	`435`	`.save-interaction-button {`