@@ -22,6 +22,7 @@ import InfoAlert from "../components/InfoAlert";
22
22
import Cookies from "js-cookie" ;
23
23
import router , { useRouter } from "next/router" ;
24
24
import { GetServerSidePropsContext } from "next" ;
25
+ import Head from "next/head" ;
25
26
26
27
interface StyleTag {
27
28
id : number ;
@@ -443,108 +444,114 @@ const HomePage = ({ initialPostData }: HomePageProps) => {
443
444
} ;
444
445
445
446
return (
446
- < div className = "w-full m-auto" >
447
- < div >
448
- < GoogleMapsComponent />
449
- </ div >
450
- < Divider width = "w-full" />
451
- < div className = "mb-5" >
452
- < ImageUpload />
453
- </ div >
454
- < textarea
455
- placeholder = "내용 입력"
456
- className = "textarea textarea-bordered focus:outline-none leading-tight textarea-sm resize-none w-full max-w-2xl py-2 my-5 h-[70px]"
457
- value = { content }
458
- onChange = { handleContentChange }
459
- > </ textarea >
460
- < div className = "mb-4" >
461
- < h2 className = "mr-3 mb-3 font-medium" > 체형 공개</ h2 >
462
- < div className = "flex items-center" >
463
- < label className = "flex items-center" >
464
- < div > 공개</ div >
465
- < input
466
- type = "checkbox"
467
- checked = { privacyHeight }
468
- onChange = { handlePublicCheck }
469
- className = "checkbox checkbox-xs mr-5 ml-1 mt-[1.5px]"
470
- />
471
- </ label >
472
- < label className = "flex items-center" >
473
- < div > 비공개</ div >
474
- < input
475
- type = "checkbox"
476
- checked = { ! privacyHeight }
477
- onChange = { handlePrivateCheck }
478
- className = "checkbox checkbox-xs ml-1 mt-[1.5px]"
479
- />
480
- </ label >
447
+ < >
448
+ < Head >
449
+ < title > #찰칵 - 게시글 작성</ title >
450
+ < meta name = "description" content = "게시글 작성 페이지입니다." />
451
+ </ Head >
452
+ < div className = "w-full m-auto" >
453
+ < div >
454
+ < GoogleMapsComponent />
481
455
</ div >
482
- </ div >
483
- < Divider width = "w-full" />
484
- < div className = "mb-5" >
485
- { dynamicKeywords . map ( ( keyword ) => (
486
- < div key = { keyword } className = "inline-block" >
487
- < div className = "flex m-1 text-blue-400" >
488
- #{ keyword }
489
- < AiOutlineClose
490
- className = "flex items-center text-gray-300 cursor-pointer text-xs mt-[3px]"
491
- onClick = { ( ) => removeDynamicKeyword ( keyword ) }
456
+ < Divider width = "w-full" />
457
+ < div className = "mb-5" >
458
+ < ImageUpload />
459
+ </ div >
460
+ < textarea
461
+ placeholder = "내용 입력"
462
+ className = "textarea textarea-bordered focus:outline-none leading-tight textarea-sm resize-none w-full max-w-2xl py-2 my-5 h-[70px]"
463
+ value = { content }
464
+ onChange = { handleContentChange }
465
+ > </ textarea >
466
+ < div className = "mb-4" >
467
+ < h2 className = "mr-3 mb-3 font-medium" > 체형 공개</ h2 >
468
+ < div className = "flex items-center" >
469
+ < label className = "flex items-center" >
470
+ < div > 공개</ div >
471
+ < input
472
+ type = "checkbox"
473
+ checked = { privacyHeight }
474
+ onChange = { handlePublicCheck }
475
+ className = "checkbox checkbox-xs mr-5 ml-1 mt-[1.5px]"
492
476
/>
493
- </ div >
494
- </ div >
495
- ) ) }
496
- { styleKeywords . map ( ( keyword ) => (
497
- < div key = { keyword } className = "inline-block m-1" >
498
- #{ keyword }
499
- </ div >
500
- ) ) }
501
- { seasonKeywords . map ( ( keyword ) => (
502
- < div key = { keyword } className = "inline-block m-1" >
503
- #{ keyword }
504
- </ div >
505
- ) ) }
506
- { weatherKeywords . map ( ( keyword ) => (
507
- < div key = { keyword } className = "inline-block m-1" >
508
- #{ keyword }
477
+ </ label >
478
+ < label className = "flex items-center" >
479
+ < div > 비공개</ div >
480
+ < input
481
+ type = "checkbox"
482
+ checked = { ! privacyHeight }
483
+ onChange = { handlePrivateCheck }
484
+ className = "checkbox checkbox-xs ml-1 mt-[1.5px]"
485
+ />
486
+ </ label >
509
487
</ div >
510
- ) ) }
511
- </ div >
512
- < div >
513
- < h2 className = "mb-2 font-medium" > Tag</ h2 >
514
- < input
515
- type = "text"
516
- className = "border-b border-gray-200 focus:border-gray-700 transition-colors ease-in duration-100 w-full mb-7 py-2"
517
- placeholder = "키워드를 입력하세요"
518
- value = { dynamicKeywordInput }
519
- onChange = { handleDynamicKeywordChange }
520
- onKeyUp = { handleDynamicKeywordSubmit }
521
- />
522
- < input type = "text" className = "hidden" />
523
- </ div >
524
- < div className = "w-full mb-5" >
525
- < h2 className = "mb-2 font-medium" > Style</ h2 >
488
+ </ div >
489
+ < Divider width = "w-full" />
490
+ < div className = "mb-5" >
491
+ { dynamicKeywords . map ( ( keyword ) => (
492
+ < div key = { keyword } className = "inline-block" >
493
+ < div className = "flex m-1 text-blue-400" >
494
+ #{ keyword }
495
+ < AiOutlineClose
496
+ className = "flex items-center text-gray-300 cursor-pointer text-xs mt-[3px]"
497
+ onClick = { ( ) => removeDynamicKeyword ( keyword ) }
498
+ />
499
+ </ div >
500
+ </ div >
501
+ ) ) }
502
+ { styleKeywords . map ( ( keyword ) => (
503
+ < div key = { keyword } className = "inline-block m-1" >
504
+ #{ keyword }
505
+ </ div >
506
+ ) ) }
507
+ { seasonKeywords . map ( ( keyword ) => (
508
+ < div key = { keyword } className = "inline-block m-1" >
509
+ #{ keyword }
510
+ </ div >
511
+ ) ) }
512
+ { weatherKeywords . map ( ( keyword ) => (
513
+ < div key = { keyword } className = "inline-block m-1" >
514
+ #{ keyword }
515
+ </ div >
516
+ ) ) }
517
+ </ div >
518
+ < div >
519
+ < h2 className = "mb-2 font-medium" > Tag</ h2 >
520
+ < input
521
+ type = "text"
522
+ className = "border-b border-gray-200 focus:border-gray-700 transition-colors ease-in duration-100 w-full mb-7 py-2"
523
+ placeholder = "키워드를 입력하세요"
524
+ value = { dynamicKeywordInput }
525
+ onChange = { handleDynamicKeywordChange }
526
+ onKeyUp = { handleDynamicKeywordSubmit }
527
+ />
528
+ < input type = "text" className = "hidden" />
529
+ </ div >
526
530
< div className = "w-full mb-5" >
527
- < div className = "flex flex-wrap" > { styleKeywordCheckboxes } </ div >
528
- < div className = "flex" > { tpoKeywordCheckboxes } </ div >
531
+ < h2 className = "mb-2 font-medium" > Style</ h2 >
532
+ < div className = "w-full mb-5" >
533
+ < div className = "flex flex-wrap" > { styleKeywordCheckboxes } </ div >
534
+ < div className = "flex" > { tpoKeywordCheckboxes } </ div >
535
+ </ div >
529
536
</ div >
537
+ < div className = "mb-5" >
538
+ < h2 className = "mb-2 font-medium" > Season*</ h2 >
539
+ < div className = "flex " > { seasonKeywordCheckboxes } </ div >
540
+ </ div >
541
+ < div >
542
+ < h2 className = "mb-2 font-medium" > Weather*</ h2 >
543
+ < div className = "flex " > { weatherKeywordCheckboxes } </ div >
544
+ </ div >
545
+ { userouter . query . id
546
+ ? renderButton (
547
+ ( imageIds . length > 0 || uploadedImageUrls . length > 0 ) &&
548
+ seasonKeywords . length > 0 &&
549
+ weatherKeywords . length > 0 ,
550
+ )
551
+ : renderButton ( uploadedImageUrls . length > 0 && seasonKeywords . length > 0 && weatherKeywords . length > 0 ) }
552
+ < InfoAlert />
530
553
</ div >
531
- < div className = "mb-5" >
532
- < h2 className = "mb-2 font-medium" > Season*</ h2 >
533
- < div className = "flex " > { seasonKeywordCheckboxes } </ div >
534
- </ div >
535
- < div >
536
- < h2 className = "mb-2 font-medium" > Weather*</ h2 >
537
- < div className = "flex " > { weatherKeywordCheckboxes } </ div >
538
- </ div >
539
- { userouter . query . id
540
- ? renderButton (
541
- ( imageIds . length > 0 || uploadedImageUrls . length > 0 ) &&
542
- seasonKeywords . length > 0 &&
543
- weatherKeywords . length > 0 ,
544
- )
545
- : renderButton ( uploadedImageUrls . length > 0 && seasonKeywords . length > 0 && weatherKeywords . length > 0 ) }
546
- < InfoAlert />
547
- </ div >
554
+ </ >
548
555
) ;
549
556
} ;
550
557
0 commit comments