diff --git a/TODO.md b/TODO.md index f3ca93e..23f5dd3 100644 --- a/TODO.md +++ b/TODO.md @@ -2,10 +2,10 @@ ## TODO -- [ ] Ability to create a project on the projects select page, including if TODO.md is empty. - [ ] Ability to create, move, remove columns. -- [ ] Minimize the number of times the user is asked for access. If possible ask for all the access required at one time. - [ ] Plus button in the columns to add a new item, with text input. +- [ ] Can we make the columns vertically fill the available space? +- [ ] Minimize the number of times the user is asked for access. If possible ask for all the access required at one time. ## In progress @@ -19,4 +19,4 @@ - [x] When moving between columns don't insert an extra newline before, unless moving to an empty column. - [x] Give each column a max width of 450px and have them stretch to fill the area up to that. - [x] Don't put carriage returns between individual TODO list items. As far as possible try to preserve original formatting, just moving individual lines around without disturbing other lines. - +- [x] Ability to create a project on the projects select page, including if TODO.md is empty. diff --git a/index.html b/index.html index 6d4e316..d0b0e2f 100644 --- a/index.html +++ b/index.html @@ -61,6 +61,26 @@ border: .1rem solid var(--shade); } + input[type="text"] { + appearance: none; + box-shadow: none; + box-sizing: inherit; + padding: .5rem .5rem; + width: 100%; + font-size: 1rem; + color: var(--fg); + background-color: var(--bg); + border: .1rem solid var(--fg); + border-radius: var(--radius); + font-family: Helvetica, Arial, sans-serif; + } + + input::placeholder { + color: var(--fg); + font-style: italic; + opacity: 1; + } + h1 { font-size: 2em; } h2 { font-size: 1.5em; } h3 { font-size: 1.17em; } @@ -140,6 +160,7 @@ .card-list { padding: 0.5em; overflow-y: auto; + overflow-x: hidden; flex-grow: 1; display: flex; flex-direction: column; @@ -196,7 +217,6 @@ .drop-indicator { height: 3px; background: var(--fg); - margin: -0.25em 0; border-radius: 2px; opacity: 0; transition: opacity 0.1s; @@ -231,6 +251,18 @@ border-color: var(--fg); } + .new-project-form { + width: 100%; + max-width: 600px; + display: flex; + gap: 0.5em; + margin-top: 1em; + } + + .new-project-form input { + flex-grow: 1; + } + .error { background-color: #782828; padding: 0.5em 1em; @@ -284,6 +316,10 @@