diff --git a/manifest.json b/manifest.json index c4d6577..b103368 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "id": "csv-allinone", "name": "CSV All-in-One", - "version": "0.1.0", + "version": "0.1.1", "minAppVersion": "1.7.7", "description": "all about csv.", "author": "hihangeol", diff --git a/src/csvCreator.ts b/src/csvCreator.ts index 28c1893..398fef3 100644 --- a/src/csvCreator.ts +++ b/src/csvCreator.ts @@ -71,19 +71,25 @@ export default class CsvCreateModal extends Modal { // select type일 때만 options 추가 let optionsInput = defaultTd.createEl('input'); optionsInput.classList.add('coloptions-input'); - optionsInput.style.display = 'none'; + optionsInput.classList.add('colinput-none'); optionsInput.id = 'coloptions'; optionsInput.placeholder = 'options (separated by comma)'; // type가 select일 때만 css로 쿼리해서 보이게 할 것. typeTd.addEventListener('change', () => { if(typeSelect.value === 'select') { - optionsInput.style.display = 'block'; - defaultInput.style.display = 'none'; + optionsInput.classList.remove('colinput-none'); + optionsInput.classList.add('colinput-block'); + + defaultInput.classList.add('colinput-none'); + defaultInput.classList.remove('colinput-block'); } else { - optionsInput.style.display = 'none'; - defaultInput.style.display = 'block'; + optionsInput.classList.add('colinput-none'); + optionsInput.classList.remove('colinput-block'); + + defaultInput.classList.remove('colinput-none'); + defaultInput.classList.add('colinput-block'); } }); } @@ -143,7 +149,7 @@ export default class CsvCreateModal extends Modal { if (columnName && columnType) { columnData[columnName] = { - type: columnType as any, + type: columnType as CSVCellType, default: columnDefault, options: columnType === 'select' @@ -188,11 +194,11 @@ export default class CsvCreateModal extends Modal { let colgroup = columnsTable.createEl('colgroup'); let nameCol = colgroup.createEl('col'); - nameCol.style.width = '25%'; + nameCol.classList.add('colgroup-name'); let typeCol = colgroup.createEl('col'); - typeCol.style.width = '25%'; + typeCol.classList.add('colgroup-type'); let defaultCol = colgroup.createEl('col'); - defaultCol.style.width = '50%'; + defaultCol.classList.add('colgroup-value'); let tHead = columnsTable.createEl('thead'); let tHeadRow = tHead.createEl('tr'); diff --git a/src/styles/csvCreator.css b/src/styles/csvCreator.css index 8d72be2..ce3317e 100644 --- a/src/styles/csvCreator.css +++ b/src/styles/csvCreator.css @@ -54,6 +54,16 @@ hr { border-bottom: 1px solid #777; } +.colgroup-name { + width: 25%; +} +.colgroup-type { + width: 25%; +} +.colgroup-value { + width: 50%; +} + .colname-input { padding: 2px; width: 100%; height: 30px; @@ -92,4 +102,11 @@ hr { font-size: 1rem; font-family: var(--font-monospace); color: var(--text-normal); +} + +.colinput-block { + display: block; +} +.colinput-none { + display: none; } \ No newline at end of file