From 50eed7d0fa059658e2cb3d439e23a17c2cd59be9 Mon Sep 17 00:00:00 2001 From: Gordon Date: Sat, 10 Apr 2021 02:11:13 +0100 Subject: [PATCH] Update styles --- package-lock.json | 23 ++--------------------- package.json | 4 +--- src/Board.tsx | 2 +- src/index.css | 42 ++++++++++++++---------------------------- 4 files changed, 18 insertions(+), 53 deletions(-) diff --git a/package-lock.json b/package-lock.json index 56f03fa..967e93d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1488,7 +1488,8 @@ "@types/dateformat": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/dateformat/-/dateformat-3.0.1.tgz", - "integrity": "sha512-KlPPdikagvL6ELjWsljbyDIPzNCeliYkqRpI+zea99vBBbCIA5JNshZAwQKTON139c87y9qvTFVgkFd14rtS4g==" + "integrity": "sha512-KlPPdikagvL6ELjWsljbyDIPzNCeliYkqRpI+zea99vBBbCIA5JNshZAwQKTON139c87y9qvTFVgkFd14rtS4g==", + "dev": true }, "@types/git-user-name": { "version": "2.0.0", @@ -1559,26 +1560,6 @@ "integrity": "sha512-1HcDas8SEj4z1Wc696tH56G8OlRaH/sqZOynNNB+HF0WOeXPaxTtbYzJY2oEfiUxjSKjhCKr+MvR7dCHcEelug==", "dev": true }, - "@types/react": { - "version": "16.14.5", - "resolved": "https://registry.npmjs.org/@types/react/-/react-16.14.5.tgz", - "integrity": "sha512-YRRv9DNZhaVTVRh9Wmmit7Y0UFhEVqXqCSw3uazRWMxa2x85hWQZ5BN24i7GXZbaclaLXEcodEeIHsjBA8eAMw==", - "dev": true, - "requires": { - "@types/prop-types": "*", - "@types/scheduler": "*", - "csstype": "^3.0.2" - } - }, - "@types/react-dom": { - "version": "16.9.12", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-16.9.12.tgz", - "integrity": "sha512-i7NPZZpPte3jtVOoW+eLB7G/jsX5OM6GqQnH+lC0nq0rqwlK0x8WcMEvYDgFWqWhWMlTltTimzdMax6wYfZssA==", - "dev": true, - "requires": { - "@types/react": "^16" - } - }, "@types/react-redux": { "version": "7.1.16", "resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.16.tgz", diff --git a/package.json b/package.json index dafa27f..4412ad2 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,6 @@ }, "dependencies": { "@basementuniverse/kanbn": "^0.2.4", - "@types/dateformat": "^3.0.1", "dateformat": "^4.5.1", "formik": "^2.2.6", "git-user-name": "^2.0.0", @@ -52,12 +51,11 @@ "eject": "react-scripts eject" }, "devDependencies": { + "@types/dateformat": "^3.0.1", "@types/git-user-name": "^2.0.0", "@types/jest": "^23.3.14", "@types/lodash": "^4.14.168", "@types/node": "^10.17.56", - "@types/react": "^16.14.5", - "@types/react-dom": "^16.9.12", "@types/uuid": "^8.3.0", "react-scripts": "^2.1.8", "rewire": "^4.0.1", diff --git a/src/Board.tsx b/src/Board.tsx index 56e4675..1b5f6b0 100644 --- a/src/Board.tsx +++ b/src/Board.tsx @@ -213,7 +213,7 @@ const Board = ({ name, description, columns, hiddenColumns, startedColumns, comp -
+
{(provided, snapshot) => { return ( diff --git a/src/index.css b/src/index.css index 1bca578..b343d37 100644 --- a/src/index.css +++ b/src/index.css @@ -61,6 +61,7 @@ body { .kanbn-board { display: flex; + align-items: stretch; } .kanbn-column { @@ -117,63 +118,52 @@ body { margin-left: 8px; } +.kanbn-column-task-list-container { + height: calc(100% - 44px); +} + .kanbn-column-task-list { margin: 0 8px; border-left: 4px var(--vscode-activityBar-inactiveForeground) solid; min-height: 46px; + height: 100%; + transition: border-color .5s ease-in-out; } .kanbn-column-task-list.drag-over { - border-color: var(--vscode-activityBar-foreground); + border-color: var(--vscode-activityBar-foreground) !important; } .kanbn-column-backlog .kanbn-column-task-list { border-color: #36d; } -.kanbn-column-backlog .kanbn-column-task-list.drag-over { - border-color: #69f; -} - .kanbn-column-in-progress .kanbn-column-task-list { border-color: #194; } -.kanbn-column-in-progress .kanbn-column-task-list.drag-over { - border-color: #3c7; -} - .kanbn-column-todo .kanbn-column-task-list { border-color: #eb1; } -.kanbn-column-todo .kanbn-column-task-list.drag-over { - border-color: #fe5; -} - .kanbn-column-done .kanbn-column-task-list { border-color: #e83; } -.kanbn-column-done .kanbn-column-task-list.drag-over { - border-color: #fa4; -} - .kanbn-task { position: relative; overflow: hidden; - padding: 4px; + padding: 4px 4px 8px 4px; margin: 8px; min-height: 30px; - border: 1px var(--vscode-activityBar-inactiveForeground) solid; - border-radius: 2px; + border-left: 4px var(--vscode-activityBar-inactiveForeground) solid; + background-color: var(--vscode-input-background); color: var(--vscode-editor-foreground); transition: background-color .5s ease-in-out; } .kanbn-task.drag { - background-color: var(--vscode-activityBar-inactiveForeground); - border-color: var(--vscode-activityBar-activeBackground); + background-color: var(--vscode-button-hoverBackground); } .kanbn-task-name { @@ -213,6 +203,7 @@ body { .kanbn-task-tag { display: inline-block; background-color: var(--vscode-activityBar-inactiveForeground); + color: #333; color: var(--vscode-editor-background); font-size: 0.8em; font-weight: bold; @@ -223,32 +214,26 @@ body { .kanbn-task-tag-nothing { background-color: #6bf; - color: #333; } .kanbn-task-tag-tiny { background-color: #36d; - color: #333; } .kanbn-task-tag-small { background-color: #194; - color: #333; } .kanbn-task-tag-medium { background-color: #eb1; - color: #333; } .kanbn-task-tag-large { background-color: #e83; - color: #333; } .kanbn-task-tag-huge { background-color: #f42; - color: #333; } .kanbn-task-overdue { @@ -262,6 +247,7 @@ body { height: 6px; background-color: #3c7; opacity: 0.7; + transition: width .5s ease-in-out; } .kanbn-task-editor-title {