Skip to content

Commit

Permalink
Merge pull request #12 from minnji-kim/main
Browse files Browse the repository at this point in the history 
Creat 0주차 김민지
  • Loading branch information
@lee-nakyung
lee-nakyung authored Apr 8, 2024
2 parents 59d82ac + fca5008 commit 7790c9f
Show file tree
Hide file tree
Showing 7 changed files with 310 additions and 0 deletions.
92 changes: 92 additions & 0 deletions Week0/김민지/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>자기소개 페이지 </title>
</head>
<body>
<div id="top" >
<img src="portfolio.png" alt="">
<div id="contents" >
<span>ABOUT</span>
<span>HOBBY</span>
<span>CONTACT</span>
</div>
</div>

<div id="introduce" >
<p>
안녕하세요!<br>
제 이름은 김민지입니다.<br>
소통하는 개발자가 되고 싶어요.
</p>
</div>

<div id="main">
<div>
<div class="menu" > ABOUT</div>
<div id= "profil">
<img src="profil.JPG" alt="">
<p id="name">김민지</p>
<div id="phone">
<svg id="phone" xmlns="http://www.w3.org/2000/svg" width="40" height="41" viewBox="0 0 40 41" fill="none">
<path d="M33.9843 27.0556C33.7436 28.9307 32.8452 30.6518 31.4569 31.8975C30.0686 33.1432 28.2854 33.8284 26.4403 33.825C15.7212 33.825 7.00001 24.8859 7.00001 13.8988C6.9967 12.0076 7.66515 10.1798 8.8805 8.75686C10.0959 7.33389 11.775 6.41305 13.6043 6.16632C14.0669 6.10842 14.5354 6.20543 14.9398 6.44285C15.3441 6.68027 15.6628 7.04537 15.8481 7.48366L18.6993 14.0081V14.0247C18.8412 14.3602 18.8998 14.7265 18.8699 15.0909C18.8399 15.4552 18.7224 15.8063 18.5279 16.1128C18.5036 16.1502 18.4779 16.1848 18.4509 16.2194L15.6402 19.6345C16.6513 21.7406 18.8006 23.9242 20.8823 24.9634L24.1683 22.0976C24.2005 22.0698 24.2343 22.0439 24.2695 22.0201C24.5683 21.8159 24.912 21.6912 25.2696 21.6574C25.6271 21.6235 25.9873 21.6816 26.3175 21.8264L26.335 21.8347L32.695 24.7558C33.1234 24.9451 33.4804 25.2714 33.7128 25.6859C33.9452 26.1005 34.0405 26.581 33.9843 27.0556Z" fill="#BFC4D8"/>
</svg>
<p> 010 3843 0863</p>
</div>
<div id="mail">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40" fill="none">
<path d="M32.9231 9H7.07692C6.79131 9 6.51739 9.11589 6.31542 9.32218C6.11346 9.52847 6 9.80826 6 10.1V28.8C6 29.3835 6.22692 29.9431 6.63085 30.3556C7.03477 30.7682 7.58261 31 8.15385 31H31.8462C32.4174 31 32.9652 30.7682 33.3692 30.3556C33.7731 29.9431 34 29.3835 34 28.8V10.1C34 9.80826 33.8865 9.52847 33.6846 9.32218C33.4826 9.11589 33.2087 9 32.9231 9ZM31.8462 28.8H8.15385V12.6011L19.2717 23.0112C19.4704 23.1975 19.7303 23.3009 20 23.3009C20.2697 23.3009 20.5296 23.1975 20.7283 23.0112L31.8462 12.6011V28.8Z" fill="#BFC4D8"/>
</svg>
<p> [email protected]</p>
</div>
<div id="map">
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="41" viewBox="0 0 40 41" fill="none">
<path d="M20 5.125C16.8185 5.12863 13.7684 6.40256 11.5187 8.6673C9.26905 10.932 8.00361 14.0027 8 17.2055C8 27.5425 18.9091 35.3495 19.3741 35.6763C19.5575 35.8056 19.776 35.875 20 35.875C20.224 35.875 20.4425 35.8056 20.6259 35.6763C21.0909 35.3495 32 27.5425 32 17.2055C31.9964 14.0027 30.731 10.932 28.4813 8.6673C26.2316 6.40256 23.1815 5.12863 20 5.125ZM20 12.8126C20.863 12.8126 21.7067 13.0702 22.4243 13.5529C23.1419 14.0356 23.7012 14.7217 24.0315 15.5244C24.3617 16.3271 24.4482 17.2104 24.2798 18.0625C24.1114 18.9146 23.6958 19.6974 23.0856 20.3117C22.4753 20.9261 21.6978 21.3445 20.8513 21.514C20.0048 21.6835 19.1275 21.5965 18.3301 21.264C17.5328 20.9315 16.8513 20.3685 16.3718 19.646C15.8923 18.9236 15.6364 18.0743 15.6364 17.2055C15.6364 16.0404 16.0961 14.9231 16.9144 14.0992C17.7328 13.2754 18.8427 12.8126 20 12.8126Z" fill="#BFC4D8"/>
</svg>
<p> 서울특별시 강서구 등촌로 113 </p>
</div>
</div>
<div id="details">
<div id="edu">
<p> EDUCATION</p>
<span> 한성대 컴퓨터공학부 <br> 2021.03 - 2025.02</span>
</div>

<div id="skill">
<p> SKILLS</p>
<span> C/C++ <br> Swift <br> Java </span>
</div>

<div id="work"> <p> WORK</p>
<span>프론트엔드 개발자</span>
</div>

<div id="activity"> <p> ACTIVITIES</p>
<span>멋쟁이사자처럼 12기</span>
</div>
</div>

<div class="menu"> HOBBY </div>
<div id="hobbies">
<div id="hobby1", class="hobby">
<div class="hname"> 배구 경기 보기</div>
<img src="volleyball.jpeg" alt="">
</div>
<div id="hobby2", class="hobby">
<div class="hname"> 여행가기</div>
<img src="travel.jpeg" alt="">
</div>
<div id="hobby3", class="hobby">
<div class="hname"> 영화보기</div>
<img src="movie.jpeg" alt="">
</div>
</div>
</div>
</div>

</body>
</html>
Binary file added Week0/김민지/movie.jpeg
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 added Week0/김민지/portfolio.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 added Week0/김민지/profil.JPG
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
218 changes: 218 additions & 0 deletions Week0/김민지/style.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,218 @@

#top{
display: grid;
grid-template-columns: repeat(2, 1fr);
justify-content: center;
align-items: center;
background: #FFF;
}
#top img{
width: 340px;
height: 62.785px;
align-items: center;
justify-self: center;
}
#contents{
display: inline-flex;
align-items: center;
justify-self: center;
gap: 32px;
}
#contents span{
display: flex;
padding: 12px 24px;
justify-content: center;
align-items: center;
gap: 10px;
}
#introduce{
width: 100%;
height: 610px;
flex-shrink: 0;
border: 1px solid #000;
background: #4A86FF;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
position: relative;
}
#introduce p{
width: 100%;
height: 365px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #FFF;
text-align: center;
font-family: Inter;
font-size: 50px;
font-style: normal;
font-weight: 500;
line-height: 70px;
}

.menu{
color: #4A86FF;
text-align: center;
font-family: Inter;
font-size: 50px;
font-style: normal;
font-weight: 800;
line-height: 150px;
}
#profil{
display: flex;
width: 380px;
height: 500px;
position: absolute;
left: 250px;
border-radius: 16px;
border: 1px solid #EBEDF8;
background: #FFF;
}
#profil img{
position: absolute;
left: 25%;
top: 10%;
width: 196px;
height: 202px;
border-radius: 50%;
}
#main {
width: 100%;
height: 1787px;
flex-shrink: 0;
background: #F3F5FF;
border: 1px solid #FFF;
}
#name {
width: 111px;
height: 48.608px;
flex-shrink: 0;
color: #4A86FF;
position: absolute;
left: 8rem;
bottom: 10rem;
text-align: center;
font-family: Inter;
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: 4rem;
}
#phone {
position: absolute;
left: 10%;
top: 60%;
}
#phone p{
width: 119px;
height: 20px;
position: absolute;
left: 3rem;
color: #484A64;
font-family: Inter;
font-style: normal;
font-weight: 500;
line-height: normal;
}
#mail {
position: absolute;
left: 10%;
top: 70%;
}
#mail p{
width: 195px;
height: 19px;
position: absolute;
left: 3rem;
top: 0rem;
color: #484A64;
font-family: Inter;
font-style: normal;
font-weight: 500;
line-height: normal;
}
#map {
position: absolute;
left: 10%;
top: 80%;
}
#map p{
width: 244px;
height: 55px;
position: absolute;
left: 3rem;
top: 0rem;
color: #484A64;
font-family: Inter;
font-style: normal;
font-weight: 500;
line-height: normal;
}
#details {
margin-left: 700px;
display: grid;
grid-template-columns: repeat(2,50%);
grid-template-rows: repeat(2,300px);
}
#details p{
color: #000;
font-family: Inter;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: normal;
vertical-align: top;
height: 40px;
}
#details span{
color: #626682;
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 150%;
height: 200px;
width: 200px;
vertical-align: top;
}
.hobby{
width: 380px;
height: 380px;
border-radius: 16px;
margin-top: 80px;
margin-right: 30px;
border: 1px soid #EBEDF8;
background-color: #FFF;
display: inline-block;
}
.hname{
color: #FFF;
text-align: center;
font-family: Inter;
font-size: 32px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-align: center;
}
.hobby img{
margin-top: 25px;
margin-left: 50px;
width: 280px;
height: 250px;
}
.hobby div{
display: flex;
width: 380px;
height: 81px;
border-radius: 16px 16px 0px 0px;
background: #4A86FF;
justify-content: center;
align-items: center;
}
#hobbies{
display: flex;
justify-content: center;
align-items: center;
}
Binary file added Week0/김민지/travel.jpeg
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 added Week0/김민지/volleyball.jpeg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 7790c9f

Please sign in to comment.