phares3757/vscode-kanbn
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add create task button to column headers

Browse Source
This commit is contained in:
Gordon
2021-03-31 00:45:53 +01:00
parent 154a325369
commit aafdf128a3
8 changed files with 28988 additions and 3577 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
ext-src/KanbnBoardPanel.ts
View File

@ -73,7 +73,8 @@ export default class KanbnBoardPanel {
// Restrict the webview to only loading content from allowed paths // Restrict the webview to only loading content from allowed paths
localResourceRoots: [ localResourceRoots: [
vscode.Uri.file(path.join(this._extensionPath, 'build')), vscode.Uri.file(path.join(this._extensionPath, 'build')),
vscode.Uri.file(path.join(this._workspacePath, '.kanbn')) vscode.Uri.file(path.join(this._workspacePath, '.kanbn')),
vscode.Uri.file(path.join(this._extensionPath, 'node_modules', 'vscode-codicons', 'dist'))
] ]
}); });
@ -151,6 +152,9 @@ export default class KanbnBoardPanel {
const customStyleUri = vscode.Uri const customStyleUri = vscode.Uri
.file(path.join(this._workspacePath, '.kanbn', 'board.css')) .file(path.join(this._workspacePath, '.kanbn', 'board.css'))
.with({ scheme: 'vscode-resource' }); .with({ scheme: 'vscode-resource' });
const codiconsUri = vscode.Uri
.file(path.join(this._extensionPath, 'node_modules', 'vscode-codicons', 'dist', 'codicon.css'))
.with({ scheme: 'vscode-resource' });
// Use a nonce to whitelist which scripts can be run // Use a nonce to whitelist which scripts can be run
const nonce = getNonce(); const nonce = getNonce();
@ -164,7 +168,8 @@ export default class KanbnBoardPanel {
<title>Kanbn Board</title> <title>Kanbn Board</title>
<link rel="stylesheet" type="text/css" href="${styleUri}"> <link rel="stylesheet" type="text/css" href="${styleUri}">
<link rel="stylesheet" type="text/css" href="${customStyleUri}"> <link rel="stylesheet" type="text/css" href="${customStyleUri}">
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}';style-src vscode-resource: 'unsafe-inline' http: https: data:;"> <link rel="stylesheet" type="text/css" href="${codiconsUri}">
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; img-src vscode-resource: https:; script-src 'nonce-${nonce}'; font-src vscode-resource:; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
<base href="${vscode.Uri.file(path.join(this._extensionPath, 'build')).with({ scheme: 'vscode-resource' })}/"> <base href="${vscode.Uri.file(path.join(this._extensionPath, 'build')).with({ scheme: 'vscode-resource' })}/">
</head> </head>
<body> <body>

2
ext-src/KanbnTaskPanel.ts Normal file
View File

@ -0,0 +1,2 @@
import * as path from 'path';
import * as vscode from 'vscode';

25375
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
package.json
View File

@ -29,7 +29,8 @@
"react-beautiful-dnd": "12.2.0", "react-beautiful-dnd": "12.2.0",
"react-dom": "^16.3.2", "react-dom": "^16.3.2",
"terser": "3.14.1", "terser": "3.14.1",
"vscode": "^1.1.37" "vscode": "^1.1.37",
"vscode-codicons": "^0.0.15"
}, },
"scripts": { "scripts": {
"vscode:prepublish": "./scripts/build-non-split.js && tsc -p tsconfig.extension.json", "vscode:prepublish": "./scripts/build-non-split.js && tsc -p tsconfig.extension.json",

13
src/Board.tsx
View File

@ -84,12 +84,15 @@ const Board = ({ columns, startedColumns, completedColumns }: {
<h2 className="kanbn-column-name"> <h2 className="kanbn-column-name">
{columnName} {columnName}
<span className="kanbn-column-count">{column.length || ''}</span> <span className="kanbn-column-count">{column.length || ''}</span>
<button
type="button"
className="kanbn-create-task-button"
onClick={e => null}
title={`Create task in ${columnName}`}
>
<i className="codicon codicon-add"></i>
</button>
</h2> </h2>
{/*
// TODO codicons https://github.com/microsoft/vscode-extension-samples/tree/main/webview-codicons-sample
// TODO 'Add task' button next to each column header
// TODO show count next to header
*/}
<div> <div>
<Droppable droppableId={columnName} key={columnName}> <Droppable droppableId={columnName} key={columnName}>
{(provided, snapshot) => { {(provided, snapshot) => {

2
src/Task.tsx
View File

@ -25,7 +25,7 @@ const Task = ({ task, index }: { task: KanbnTask, index: number }) => {
> >
<button <button
type="button" type="button"
onClick={e => null} // TODO open task editor modal when clicked onClick={e => null} // TODO open task editor webview panel when clicked
title={task.id} title={task.id}
> >
{task.name} {task.name}

21
src/index.css
View File

@ -13,11 +13,11 @@
*/ */
body { body {
margin: 0; margin: 0;
padding: 1em; padding: 1em;
font-family: sans-serif; font-family: sans-serif;
background-color: var(--vscode-editor-background); background-color: var(--vscode-editor-background);
color: var(--vscode-foreground); color: var(--vscode-foreground);
} }
.kanbn-header-name { .kanbn-header-name {
@ -37,6 +37,14 @@ body {
padding-left: 8px; padding-left: 8px;
} }
.kanbn-create-task-button {
float: right;
}
.kanbn-create-task-button .codicon {
font-size: 14px;
}
.kanbn-column:first-child .kanbn-column-name { .kanbn-column:first-child .kanbn-column-name {
padding-left: 0; padding-left: 0;
} }
@ -86,8 +94,7 @@ body {
color: var(--vscode-editor-foreground); color: var(--vscode-editor-foreground);
} }
.kanbn-task button:focus, .kanbn-task button:focus, .kanbn-task button:hover {
.kanbn-task button:hover {
border: none; border: none;
outline: none; outline: none;
text-decoration: underline; text-decoration: underline;

7140
yarn.lock
View File

File diff suppressed because it is too large Load Diff