styles: add todo

zhenyuWang · Aug 5, 2023 · 079f4ab · 079f4ab
1 parent 9f89488
commit 079f4ab
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/src/components/Todo/Add.tsx b/src/components/Todo/Add.tsx
@@ -41,10 +41,10 @@ function AddTodo({
 
   function addTodo() {
     if (!title) {
-      return setErrorText('title is required')
+      return setErrorText('title is required!')
     }
     if (!content) {
-      return setErrorText('content is required')
+      return setErrorText('content is required!')
     }
     onAddTodo({
       id: Date.now(),
@@ -62,20 +62,22 @@ function AddTodo({
           <div className="flex flex-align-center">
             <div className="label font-size-20">title:</div>
             <input
-              className="font-size-20"
+              className="font-size-18"
               type="text"
               ref={inputTitleRef}
               value={title}
               onInput={onTitleInput}
+              placeholder="Please enter title"
             />
           </div>
           <div className="flex flex-align-center m-t-10">
             <div className="label font-size-20">content:</div>
             <input
-              className="font-size-20"
+              className="font-size-18"
               type="text"
               value={content}
               onInput={onContentInput}
+              placeholder="Please enter content"
             />
           </div>
           {errorText && (

diff --git a/src/index.scss b/src/index.scss
@@ -26,6 +26,9 @@ body {
   text-align: center;
 }
 
+.font-size-18 {
+  font-size: 18px;
+}
 .font-size-20 {
   font-size: 20px;
 }