diff --git a/CHANGELOG.md b/CHANGELOG.md index 3797212..af0c8b6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## 5.9.2 + +- Minor UI improvments for small sidebar widths. + ## 5.9.1 - Improve problem name parser to handle numbers. diff --git a/package.json b/package.json index a07a268..fe27d1e 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,7 @@ "license": "GPL-3.0-or-later", "icon": "icon.png", "publisher": "DivyanshuAgrawal", - "version": "5.9.1", + "version": "5.9.2", "engines": { "vscode": "^1.52.0" }, diff --git a/src/companion.ts b/src/companion.ts index 5b86a82..5c39b25 100644 --- a/src/companion.ts +++ b/src/companion.ts @@ -128,7 +128,7 @@ export const setupCompanionServer = () => { server.listen(config.port); server.on('error', (err) => { vscode.window.showErrorMessage( - `CPH server encountered an error: "${err.message}" , companion may not work.`, + `Are multiple VSCode windows open? CPH will work on the first opened window. CPH server encountered an error: "${err.message}" , companion may not work.`, ); }); console.log('Companion server listening on port', config.port); diff --git a/src/utilsPure.ts b/src/utilsPure.ts index 1199d05..a8a1759 100644 --- a/src/utilsPure.ts +++ b/src/utilsPure.ts @@ -1,3 +1,6 @@ +// Pure javascript utilities, that don't use VS Code API. +// They can still use VS Code type definitions. + export const words_in_text = function (text: string) { const regex = /[\p{L}-]+|[0-9]+/gu; return text.match(regex); diff --git a/src/webview/frontend/App.tsx b/src/webview/frontend/App.tsx index a5b6093..8500152 100644 --- a/src/webview/frontend/App.tsx +++ b/src/webview/frontend/App.tsx @@ -295,7 +295,7 @@ function Judge(props: { <span className="icon"> <i className="codicon codicon-cloud-upload"></i> </span>{' '} - Submit to Codeforces + Submit </button> ); } else if (url.hostname == 'open.kattis.com') { @@ -357,17 +357,20 @@ function Judge(props: { </div> <div className="results">{views}</div> <div className="margin-10"> - <button - className="btn btn-green" - onClick={newCase} - title="Create a new empty testcase" - > - <span className="icon"> - <i className="codicon codicon-add"></i> - </span>{' '} - New Testcase - </button> - {renderSubmitButton()} + <div className="row"> + <button + className="btn btn-green" + onClick={newCase} + title="Create a new empty testcase" + > + <span className="icon"> + <i className="codicon codicon-add"></i> + </span>{' '} + New Testcase + </button> + {renderSubmitButton()} + </div> + <br /> <span onClick={toggleOnlineJudgeEnv}> <input type="checkbox" checked={onlineJudgeEnv} /> @@ -378,55 +381,60 @@ function Judge(props: { </div> <div className="actions"> - <button - className="btn" - onClick={runAll} - title="Run all testcases again" - > - <span className="icon"> - <i className="codicon codicon-debug-restart"></i> - </span>{' '} - Run All - </button> - <button - className="btn btn-green" - onClick={newCase} - title="Create a new empty testcase" - > - <span className="icon"> - <i className="codicon codicon-add"></i> - </span>{' '} - New - </button> - <button - className="btn btn-orange" - onClick={stop} - title="Kill all running testcases" - > - <span className="icon"> - <i className="codicon codicon-circle-slash"></i> - </span>{' '} - Stop - </button> - <a - className="btn" - title="Help" - href="https://github.com/agrawal-d/cph/blob/main/docs/user-guide.md" - > - <span className="icon"> - <i className="codicon codicon-question"></i> - </span>{' '} - </a> - <button - className="btn btn-red right" - onClick={deleteTcs} - title="Delete all testcases and close results window" - > - <span className="icon"> - <i className="codicon codicon-trash"></i> - </span>{' '} - Delete - </button> + <div className="row"> + <button + className="btn" + onClick={runAll} + title="Run all testcases again" + > + <span className="icon"> + <i className="codicon codicon-debug-restart"></i> + </span>{' '} + Run All + </button> + <button + className="btn btn-green" + onClick={newCase} + title="Create a new empty testcase" + > + <span className="icon"> + <i className="codicon codicon-add"></i> + </span>{' '} + New + </button> + </div> + <div className="row"> + <button + className="btn btn-orange" + onClick={stop} + title="Kill all running testcases" + > + <span className="icon"> + <i className="codicon codicon-circle-slash"></i> + </span>{' '} + Stop + </button> + <a + className="btn" + title="Help" + href="https://github.com/agrawal-d/cph/blob/main/docs/user-guide.md" + > + <span className="icon"> + <i className="codicon codicon-question"></i> + </span>{' '} + Help + </a> + <button + className="btn btn-red right" + onClick={deleteTcs} + title="Delete all testcases and close results window" + > + <span className="icon"> + <i className="codicon codicon-trash"></i> + </span>{' '} + Delete + </button> + </div> </div> {waitingForSubmit && ( diff --git a/src/webview/frontend/app.css b/src/webview/frontend/app.css index 5bdaeca..9287f18 100644 --- a/src/webview/frontend/app.css +++ b/src/webview/frontend/app.css @@ -37,7 +37,7 @@ body { left: 0px; width: 100%; padding: 15px; - background: var(--vscode-sideBar-background); + background: var(--vscode-menu-background); box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.3); } .case { @@ -80,7 +80,7 @@ a[href]:hover { pre, textarea { background: var(--input-background); - font-family: 'Courier New', Courier, Consolas, 'Ubuntu Mono', monospace; + font-family: Consolas, 'Ubuntu Mono', monospace; width: 100%; display: block; background: rgba(0, 0, 0, 0.2); @@ -97,7 +97,7 @@ textarea { pre, code { - font-family: 'Courier New', Courier, Consolas, 'Ubuntu Mono', monospace; + font-family: Consolas, 'Ubuntu Mono', monospace; } .clearfix { @@ -394,7 +394,21 @@ body.vscode-light .case-number { display: none; } +.row { + display: inline; +} + @media only screen and (max-width: 365px) { + .actions { + border-top: 1px solid rgba(0, 0, 0, 0.5); + } + + .row { + display: grid; + grid-auto-columns: 1fr; + grid-auto-flow: column; + } + .size-warning { display: block; }