Skip to content

Commit

Permalink
Merge pull request #259 from SejongPeer/test
Browse files Browse the repository at this point in the history 
add: 혼밥탈출 글씨 수정
  • Loading branch information
@AhnRian
AhnRian authored May 11, 2024
2 parents 597c65e + 7ae336d commit 44bbb0f
Show file tree
Hide file tree
Showing 18 changed files with 478 additions and 351 deletions.
Binary file modified src/Assets/image/ChineseFood.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/Assets/image/JapaneseFood.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/Assets/image/KoreanFood.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/Assets/image/honbobStartLogo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/Assets/image/honbobWaitingImg.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified src/Assets/image/westernFood.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 4 additions & 2 deletions src/Pages/Honbob/Matching/CSS/H_Btn2.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@
background-color: white;
color: #333333;
padding-bottom: 1vh;
line-height: 152px;
}

.clicked {
Expand All @@ -26,6 +27,7 @@
margin: 6px;
border-radius: 40px;
cursor: pointer;
border: 3px solid #FF4B4B;
border: 3px solid #ff4b4b;
padding-bottom: 1vh;
}
line-height: 152px;
}
8 changes: 4 additions & 4 deletions src/Pages/Honbob/Matching/CSS/H_Container.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ html {
}

.title {
margin: 30px 0px 40px 0px;
margin: 1vh 0px 1vh 0px;
font-size: 20px;
font-weight: bold;
text-align: center;
Expand Down Expand Up @@ -67,7 +67,7 @@ html {
width: 30vh;
height: 30vh;
}

/* 모바일 */
@media (max-height: 670px) {
.container {
flex-shrink: 0;
Expand All @@ -77,7 +77,7 @@ html {
align-items: center;
position: relative;
margin-top: 70px;
overflow-y: scroll;
overflow-y: hidden;
}

.titlebox {
Expand All @@ -90,7 +90,7 @@ html {
}

.title {
margin: 20px 0px 30px 0px;
margin: 1vh 0px 1vh 0px;
font-size: 20px;
font-weight: bold;
}
Expand Down
143 changes: 89 additions & 54 deletions src/Pages/Honbob/Matching/CSS/H_Menu.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,14 +4,17 @@
flex-direction: row;
/* 수직으로 아이템을 배치합니다. */
flex-wrap: wrap;
justify-content: center;
justify-content: space-around;
align-items: center;
height: 50vh;
gap: 2%;
}

.menuBox {
margin-bottom: 1vh;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.imgBox {
Expand All @@ -20,60 +23,15 @@
margin-bottom: 1vh;
}

.item-0 {
background-image: url('../../../../Assets/image/KoreanFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
}

.item-1 {
background-image: url('../../../../Assets/image/westernFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
}

.item-2 {
background-image: url('../../../../Assets/image/ChineseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
}

.item-3 {
background-image: url('../../../../Assets/image/JapaneseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
}

.menuBtn {
font-size: 1.2rem;
font-weight: bold;
width: 45%;
aspect-ratio: 1;
margin-bottom: 1vh;
border-radius: 40px;
/* border: 1px solid #e5e5e5; */
cursor: pointer;
background-color: white;
color: #333333;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}

/* 데스크탑 */
@media (min-width: 768px) {
@media (min-width: 670px) {
.menuBtn {
font-size: 1.1rem;
font-size: 0.8em;
font-weight: bold;
width: 45%;
aspect-ratio: 1;
padding-top: 20px;
border-radius: 40px;
border-radius: 36px;
/* border: 1px solid #e5e5e5; */
cursor: pointer;
background-color: white;
Expand All @@ -98,18 +56,56 @@
background-color: white;
color: #333333;
}
.item-0 {
background-image: url('../../../../Assets/image/KoreanFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/2;
}

.item-1 {
background-image: url('../../../../Assets/image/westernFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/2;
}

.item-2 {
background-image: url('../../../../Assets/image/ChineseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 80%;
aspect-ratio: 1/1;
margin-bottom: 20%;
/* aspect-ratio:; */
}

.item-3 {
background-image: url('../../../../Assets/image/JapaneseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 80%;
aspect-ratio: 1/1;
margin-bottom: 20%;
}
}

/* 모바일 */
@media (max-width: 768px) {
@media (max-width: 670px) {
.menuBtn {
font-size: 16px;
font-weight: bold;
width: 48%;
aspect-ratio: 1;
width: 45%;
aspect-ratio: 1/1;
margin-bottom: 1vh;
padding-top: 20px;
border-radius: 40px;
border-radius: 36px;
/* border: 1px solid #e5e5e5; */
cursor: pointer;
background-color: white;
Expand All @@ -119,6 +115,7 @@
align-items: center;
justify-content: center;
padding-bottom: 2vh;
box-sizing: border-box;
}

.item {
Expand All @@ -134,4 +131,42 @@
background-color: white;
color: #333333;
}
.item-0 {
background-image: url('../../../../Assets/image/KoreanFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/2;
}

.item-1 {
background-image: url('../../../../Assets/image/westernFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/2;
}

.item-2 {
background-image: url('../../../../Assets/image/ChineseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/1;
margin-bottom: 20%;
/* aspect-ratio:; */
}

.item-3 {
background-image: url('../../../../Assets/image/JapaneseFood.png');
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
width: 100%;
aspect-ratio: 1/1;
margin-bottom: 20%;
}
}
20 changes: 10 additions & 10 deletions src/Pages/Honbob/Matching/JS/H_Gender.js
View file
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
import { useState } from "react";
import con from "../CSS/H_Container.module.css";
import btn2 from "../CSS/H_Btn2.module.css";
import { useState } from 'react';
import con from '../CSS/H_Container.module.css';
import btn2 from '../CSS/H_Btn2.module.css';

const H_Gender = (props) => {
const H_Gender = props => {
const [isSameClicked, setIsSameClicked] = useState(false);
const [isDontCareClicked, setIsDontCareClicked] = useState(false);

const clickSameBtnHandler = () => {
setIsSameClicked(true);
setIsDontCareClicked(false);
const choiceGender = "SAME";
props.setChoiceGenderKorean("동성");
const choiceGender = 'SAME';
props.setChoiceGenderKorean('동성');
props.sendChoiceGenderData(choiceGender);
};

const clickDontCareBtnHandler = () => {
setIsSameClicked(false);
setIsDontCareClicked(true);
const choiceGender = "NO_MATTER";
props.setChoiceGenderKorean("상관없음");
const choiceGender = 'NO_MATTER';
props.setChoiceGenderKorean('이성');
props.sendChoiceGenderData(choiceGender);
};

Expand All @@ -29,7 +29,7 @@ const H_Gender = (props) => {

return (
<div className={con.container}>
<p className={con.title}>원하는 밥짝꿍 성별을 선택해주세요!</p>
<p className={con.title}>원하는 축제짝꿍 성별을 선택해주세요!</p>
<div>
<button className={clickSameBtnColor} onClick={clickSameBtnHandler}>
동성
Expand All @@ -38,7 +38,7 @@ const H_Gender = (props) => {
className={clickDontCareBtnColor}
onClick={clickDontCareBtnHandler}
>
상관없음
이성
</button>
</div>
<div className={con.fightImg}></div>
Expand Down
Loading

0 comments on commit 44bbb0f

Please sign in to comment.