제발 제 코드에 훈수하세요

scss로 틀을 만들어서 중복되는 곳에서 사용하면 되는 부분이었는데 클래스로 모듈을 만들어 버려서 한쪽은 되고 한쪽은 안되어야하는 부분일 때도 둘 다 동시에 되게 됐습니다.

//module
@mixin module{
	.className{
		...//들어갈 내용
		@content
	}
}

@import './module'

#one{
...
}

@import './module'
#two{
...
}

<div class="className" id="one"></div> 
<div class="className" id="two"></div>

위와 같은 상황에서 className의 display를 이벤트에 따라 none 또는 block으로 보여지고 안보여지고를 만드는 기능이었습니다.

하지만 클래스를 다른 아이디에 같이 놓음으로서 중복이 될 수 있기때문에 능지 수쥰이 되어버렸습니다.

해결한 방법은 각각 css를 따로 주는 것이었는데 동시에 주면서 각 이벤트에 따라 따로 작동하도록 하려면 어떻게 해야할까요?

클래스로 정의하지 말고 @mixin 안에 그냥 코드로 module화 한다면 이벤트에 상관없이 따로 작동할 수 있습니다.

//module
@mixin module{
		...//들어갈 내용
		@content
}

@import './module'

@include module{
	#one{
	...
	}
}

@import './module'

@include module{
	#two{
	...
	}
}

<div class="className" id="one"></div> 
<div class="className" id="two"></div>

• 좀 황당했던 사건

디자인대로 페이지를 만들고 있었는데 완성된 것이 떡하니 있었던 것

왜 만든 것인지 뭔가 꼬였거나 아니면 두개 업체에 동시에 발주한 것?

오늘 이슈가 많아서 정리하느라 시간을 다 보냈습니다.

완성된 것과 비교하면서 자신감이 많이 떨어졌습니다. 저번과 마찬가지로 열등감을 느낀 것 같습니다.