-
Notifications
You must be signed in to change notification settings - Fork 0
Feature(#42): 강의 참여 페이지 채팅 사이드바를 사용자가 확인할 수 있다 (UI 작업) #192
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Feature(#42): 강의 참여 페이지 채팅 사이드바를 사용자가 확인할 수 있다 (UI 작업) #192
Conversation
- 접근성을 위해 input에 label을 연결해야 하는데, 이 label의 텍스트를 디자인을 위해 숨기기만 하기위한 스타일입니다
- 채팅 사이드바 UI 작업 - 채팅 공백시 버튼 비활성화 기능 구현
✅ Deploy Preview for boarlog ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
고생 많으셨습니다👍👍
}; | ||
|
||
interface LogContainerInterface { | ||
type: "question" | "prompt"; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
type: "prompt"는 언제 사용되는 건가요?
className: string; | ||
} | ||
|
||
const QuestionPromptLogContainer = ({ type, className }: LogContainerInterface) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
QuestionPromptLogContainer라는 이름 대신 QuestionContainer는 어떠신가요? 확장성을 고려해서 ChatContainer라는 이름도 좋아보입니다!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM 👍👍 고생 많으셨습니다 :)
|
||
.a11y-hidden { | ||
overflow: hidden; | ||
position: absolute; | ||
clip: rect(0, 0, 0, 0); | ||
clip-path: circle(0); | ||
width: 1px; | ||
height: 1px; | ||
margin: -1px; | ||
border: 0; | ||
padding: 0; | ||
white-space: nowrap; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
신기하네요 :) 관련 내용을 시각적으로는 숨겨놓는 용도군요
@@ -15,7 +16,10 @@ const Participant = () => { | |||
return ( | |||
<> | |||
<Header type="participant" /> | |||
<video className="relative w-[100vw] h-[calc(100vh-6rem)]" autoPlay muted ref={videoRef}></video> | |||
<section className="relative"> | |||
<video className="w-[100vw] h-[calc(100vh-6rem)]" autoPlay muted ref={videoRef}></video> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
여기 5rem으로 수정해주시면 될 것 같습니다.
작업 개요
채팅 사이드바 UI 구현 close #42
작업 사항
고민한 점들(필수 X)
스크린샷(필수 X)
2023-12-04.9.46.15.mov