56 feat create detail page markup 2

public/mockServiceWorker.js

@@ -2,7 +2,7 @@
 /* tslint:disable */
 
 /**
- * Mock Service Worker (2.0.12).
+ * Mock Service Worker (2.0.13).
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
  * - Please do NOT serve this file on production.

src/components/Detail/BottomFixedBtn/BottomFixedBtn.module.scss

@@ -7,7 +7,7 @@
 
   width: 100%;
   max-width: 45rem;
-  z-index: 5;
+  z-index: 3;
 
   &__wrapper {
     display: flex;

src/components/Detail/BottomFixedBtn/BottomFixedBtn.tsx

@@ -1,13 +1,16 @@
 import styles from "./BottomFixedBtn.module.scss";
 
-function BottomFixedBtn() {
+import { BottomFixedBtnProps } from "@/types/detail";
+
+function BottomFixedBtn({ onOpen }: BottomFixedBtnProps) {
   return (
     <div className={styles.container}>
       <div
         className={styles.container__wrapper}
         style={{
           backgroundColor: "#2388FF",
         }}
+        onClick={onOpen}
       >
         <span>이 장소 후보로 등록하기</span>
       </div>

src/components/Detail/BottomFixedBtn/RegistrationSlide/RegistrationListItem/RegistrationListItem.module.scss

@@ -0,0 +1,39 @@
+@use "@/sass" as *;
+
+.container {
+  @include typography(subTitle);
+  color: $neutral900;
+
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 16px;
+
+  border: 1px solid $neutral200;
+  border-radius: 16px;
+
+  cursor: pointer;
+
+  svg {
+    color: $neutral300;
+  }
+
+  &__isSelected {
+    @include typography(captionSmall);
+    color: $neutral400;
+  }
+}
+
+.selected {
+  background-color: $primary100;
+  svg {
+    color: $primary300;
+  }
+}
+
+.isSelectedProps {
+  background-color: $neutral200;
+  color: $neutral400;
+
+  cursor: auto;
+}