Commit 7ed828cd authored by 우지원's avatar 우지원
Browse files

Merge remote-tracking branch 'origin/seoyeon2' into jiweon827

parents 757c125a 1d245ee3
......@@ -16,7 +16,7 @@ const RoomSingle = () => {
style={{ width: "37px", height: "37px" }}
/>
</div>
<div className="text-truncate mx-3 mt-2" style={{ width: "250px" }} title="데계 재미있는 수학과 데계데계데계 재미있는 수학과">
<div className="mx-3 mt-2" style={{ width: "250px", overflow:'scroll', whiteSpace:'nowrap' }}>
데계 재미있는 수학과 데계데계데계 재미있는 수학과</div>
<div className="ms-auto mt-2"> 15/34 </div>
</div>
......@@ -32,8 +32,24 @@ const RoomSingle = () => {
style={{ width: "37px", height: "37px" }}
/>
</div>
<marquee className="text-overflow-auto white-space-nowrap mx-3 mt-2" style={{ width: "250px" }} title="데계 재미있는 수학과 데계데계데계 재미있는 수학과">
데계 재미있는 수학과 데계데계데계 재미있는 수학과</marquee>
<div className="mx-3 mt-2" style={{ width: "250px", overflow:'scroll', whiteSpace:'nowrap' }}>
데계 재미있는 수학과 데계데계데계 재미있는 수학과</div>
<div className="ms-auto mt-2"> 15/34 </div>
</div>
<div
className="d-flex mx-4 my-2 p-2"
style={{ backgroundColor: "#C4C4C4" }}
>
<div style={{ width: "37px", height: "37px" }}>
<img
src="BORA.png"
className="rounded-circle"
style={{ width: "37px", height: "37px" }}
/>
</div>
<div className="mx-3 mt-2" style={{ width: "250px", overflow:'scroll', whiteSpace:'nowrap' }}>
데계 재미있는 수학과 데계데계데계 재미있는 수학과</div>
<div className="ms-auto mt-2"> 15/34 </div>
</div>
</Link >
......
import ChannelSingle from "./ChannelSingle";
import { Link } from "react-router-dom";
import ChannelSingle from './ChannelSingle'
import { Link } from 'react-router-dom'
import backward from '../../backward.png'
const ChannelList = () => {
return (
......@@ -9,23 +10,16 @@ const ChannelList = () => {
<Link to="/user">
<button
type="button"
className="m-2 rounded"
style={{
height: "30px",
fontWeight: "bold",
backgroundColor: "#E8B7FF",
color: "black",
border: "1px #f4c1f2",
}}
className="btn"
>
돌아가기
<img src={backward} width="25" height="25" />
</button>
</Link>
</div>
<div className="col-4 d-flex justify-content-center">
<Link to="/user">
<img src="/BORA.png" style={{ width: "160px" }} />
<img src="/BORA.png" style={{ width: '160px' }} />
</Link>
</div>
......@@ -38,20 +32,33 @@ const ChannelList = () => {
aria-controls="hamburger"
aria-expanded="false"
aria-label="Toggle navigation"
style={{ border: "#f4c1f2", }}
style={{ border: '#f4c1f2' }}
>
<span className="navbar-toggler-icon"></span>
</button>
</div>
</nav>
<div className="offcanvas offcanvas-start" tabindex="-1" id="hamburger" aria-labelledby="hamburgerLabel">
<div
className="offcanvas offcanvas-start"
tabindex="-1"
id="hamburger"
aria-labelledby="hamburgerLabel"
>
<div className="offcanvas-header">
<h5 className="offcanvas-title" id="offcanvasExampleLabel">음성 채널 목록</h5>
<button type="button" className="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
<h5 className="col-5 offcanvas-title" id="offcanvasExampleLabel">
음성 채널 목록
</h5>
<h6 className="mt-2"> #ASV2AE985 </h6>
<button
type="button"
className="btn-close text-reset"
data-bs-dismiss="offcanvas"
aria-label="Close"
></button>
</div>
<div className="overflow-auto" style={{ height: "610px" }}>
<div className="overflow-auto" style={{ height: '610px' }}>
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#ab9aba" }}>
<img className="col-auto mt-2" src="/fullSpeaker.png" width="25px" height="25px" />
......@@ -75,7 +82,7 @@ const ChannelList = () => {
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#ab9aba" }}>
<img className="col-auto mt-2" src="/emptySpeaker.png" width="25px" height="25px" />
<h5 className="col mt-2">공지1</h5>
<h5 className="col mt-2">일반</h5>
</div>
<div className="mx-5">
<ChannelSingle />
......@@ -85,7 +92,7 @@ const ChannelList = () => {
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#ab9aba" }}>
<img className="col-auto mt-2" src="/emptySpeaker.png" width="25px" height="25px" />
<h5 className="col mt-2">공지2</h5>
<h5 className="col mt-2">공지</h5>
</div>
<div className="mx-5">
<ChannelSingle />
......@@ -101,20 +108,31 @@ const ChannelList = () => {
data-bs-toggle="modal"
data-bs-target="#exitRoom"
style={{
height: "30px",
fontWeight: "bold",
backgroundColor: "#FF0000",
color: "black",
border: "1px #f4c1f2",
height: '30px',
fontWeight: 'bold',
backgroundColor: '#FF0000',
color: 'black',
border: '1px #f4c1f2',
}}
>
퇴장
</button>
<div className="modal fade" id="exitRoom" tabindex="-1" aria-labelledby="exitRoomLabel" aria-hidden="true">
<div
className="modal fade"
id="exitRoom"
tabindex="-1"
aria-labelledby="exitRoomLabel"
aria-hidden="true"
>
<div className="modal-dialog">
<div className="modal-content">
<div className="modal-header">
<button type="button" className="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<button
type="button"
className="btn-close"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div className="modal-body d-flex justify-content-center">
이방에서 퇴장하시겠습니까?
......@@ -122,9 +140,17 @@ const ChannelList = () => {
<div className="row mb-3">
<div className="d-flex justify-content-evenly">
{/* <Link to="/user"> */}
<button type="submit" className="col-2 p-1 btn btn-primary"></button>
<button type="submit" className="col-2 p-1 btn btn-primary">
</button>
{/* </Link> */}
<button type="submit" className="col-2 p-1 btn btn-primary" data-bs-dismiss="modal">아니요</button>
<button
type="submit"
className="col-2 p-1 btn btn-primary"
data-bs-dismiss="modal"
>
아니요
</button>
</div>
</div>
</div>
......@@ -132,10 +158,8 @@ const ChannelList = () => {
</div>
</div>
</div>
</div>
)
}
</div >
);
};
export default ChannelList;
export default ChannelList
......@@ -24,13 +24,8 @@ const Controller = () => {
<div className="row">
<div
className="col d-flex justify-content-center"
style={{ backgroundColor: '#C4C4C4', position: 'absolute', bottom: 0 }}
style={{ backgroundColor: '#C4C4C4', position: 'absolute', bottom: 0, width: '414px' }}
>
{/* <div className="col d-flex justify-content-center">
<button type="button" className="btn">
<img src={mic_btn} width="45" height="40" />
</button>
</div> */}
{mic ? <div className="col d-flex justify-content-center">
<button type="button" className="btn" onClick={micOn}>
<img src={micoff_btn} width="45" height="40" />
......
client/src/micoffbtn.png

28.2 KB | W: | H:

client/src/micoffbtn.png

28.6 KB | W: | H:

client/src/micoffbtn.png
client/src/micoffbtn.png
client/src/micoffbtn.png
client/src/micoffbtn.png
  • 2-up
  • Swipe
  • Onion skin
client/src/speakerbtn.png

20 KB | W: | H:

client/src/speakerbtn.png

26.9 KB | W: | H:

client/src/speakerbtn.png
client/src/speakerbtn.png
client/src/speakerbtn.png
client/src/speakerbtn.png
  • 2-up
  • Swipe
  • Onion skin
client/src/videooffbtn.png

1.98 KB | W: | H:

client/src/videooffbtn.png

10.2 KB | W: | H:

client/src/videooffbtn.png
client/src/videooffbtn.png
client/src/videooffbtn.png
client/src/videooffbtn.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment