Merge pull request #8 from PaulZhemanov/editable_titles

Editable titles
PaulZhemanov · Oct 1, 2023 · 5f1c65d · 5f1c65d
2 parents dc9c2c9 + 5bef79e
commit 5f1c65d
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 4 deletions.
diff --git a/src/components/EditableTitle.tsx b/src/components/EditableTitle.tsx
@@ -14,6 +14,8 @@ interface IProps {
 const Root = styled.div`
   display: flex;
   flex-direction: column;
+  width: 165px;
+  height: 27px;
 `
 const StyledInput = styled.input<IProps>`
   border: none;
@@ -60,12 +62,14 @@ const EditableTitle: React.FC<IProps> = ({
   }
 
   const handleTitleFix = () => {
-    setEditing(false)
+    if (title.trim() !== "") {
+      setEditing(false)
+    }
   }
 
   const handleTitleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
     if (event.key === "Enter" || event.key === "Escape") {
-      setEditing(false)
+      handleTitleFix()
     }
   }
 

diff --git a/src/components/Text.ts b/src/components/Text.ts
@@ -4,4 +4,5 @@ export const Text = styled.div`
     font-family: Open Sans;
     font-style: normal;
     line-height: normal;
+    
 `
diff --git a/src/components/Todolist.tsx b/src/components/Todolist.tsx
@@ -66,12 +66,12 @@ const TodoList: React.FC<IProps> = () => {
           color="#d71919"
           fontSize="28px"
           fontWeight="600"
-          opacity="0.3"
+          opacity="0.7"
           showUnderline={true}
         />
         <Bin className="remove-todolist-button" />
       </HeaderContainer>
-      <SizedBox height={10} />
+      <SizedBox height={20} />
       <TasksContainer>
         <Task />
         <Task />