[svelte]사이드바 컴포넌트

---

<div class="left-section">
	<div class="title">
		<strong>
		all<span>i</span>us <span>stuido</span>    
		</strong>
	</div>
	<p>
		박민규	
	</p>
	<ul>           
		<li>프로젝트</li>
		<li>셀프브랜드</li>
		<li>프로폴리오</li>
		<li>설정</li>
	</ul>
</div>



<style>
	
	.left-section{
		width:300px;
		height:750px;
		border: 1px solid black;
		background-color:#FDFAF3;
		border-radius:5px;
		position:fixed;
		margin-top:20px;
	}
	
	.left-section .title{
		margin-top:15px;     
		
	}
	
	.left-section p {  
		margin-left:10px;
		font-size:18px;
		margin-top:9px;
	}
	
	.left-section span{ 
		color:#1ECCE4;
	}
	
	.left-section strong{
		font-size:30px; 
		padding-left:20px;
	}
	
	ul{
		margin-top:50px;  
		margin-left:-25px;
	}
	
	li{
		list-style: none;
		font-size: 18px;
		font-weight:bold;
		box-sizing:border-box;
		padding: 10px 21px 10px 19px;
		border:2px #FDFAF3 solid;
		border-radius:5px;
		width:260px;
		height:50px;
	}

	li:hover {
  border:2px #3E3C49 solid;
}
</style>

---

왼쪽 사이드바 컴포넌트

▶기능 : 왼쪽 사이드바

프로젝트,셀프브랜드,프로폴리오,설정 페이지로 이동 기능.

▶ 유의사항 :

position:fixed; 로 인하여 왼쪽에 고정이 되어있다.
메인 컴포넌트에 margin-left:320px; 값을 줘야한다. 사이드바 width가 300px; 이기 때문에