Commit d0c68e25 authored by 이재연's avatar 이재연
Browse files

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

parents a2b5f222 c81b3fdc
import backward from "../../backward.png"; import backward from '../../backward.png'
import ChannelSingle from "./ChannelSingle"; import ChannelSingle from './ChannelSingle'
const LeftHamberger = () => { const LeftHamberger = () => {
return ( function roomIdCopy() {
<div> const t = document.querySelector('#roomId').innerText;
<div> console.log(t)
<button navigator.clipboard.writeText(t);
className="navbar-toggler" document.execCommand('copy');
type="button" }
data-bs-toggle="offcanvas" return (
data-bs-target="#left-hamburger" <div>
aria-controls="left-hamburger" <div>
aria-expanded="false" <button
aria-label="Toggle navigation" className="navbar-toggler"
style={{ border: "#f4c1f2" }} type="button"
> data-bs-toggle="offcanvas"
<span className="navbar-toggler-icon"></span> data-bs-target="#left-hamburger"
</button> aria-controls="left-hamburger"
</div> aria-expanded="false"
aria-label="Toggle navigation"
<div style={{ border: '#f4c1f2' }}
className="offcanvas offcanvas-start" >
style={{ width: "330px" }} <span className="navbar-toggler-icon"></span>
tabIndex="-1" </button>
id="left-hamburger"
aria-labelledby="hamburgerLabel"
>
<div className="d-flex justify-content-between offcanvas-header">
<p
className="col-6 offcanvas-title"
id="offcanvasExampleLabel"
style={{
fontWeight: "bold",
fontSize: "20px",
width: "200px",
}}
>
/오프라인 사용자
</p>
<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="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">온라인 사용자</h5>
</div> </div>
<ul className="mx-5" style={{ color: "#76D079" }}>
<li>
<p style={{ color: "black" }}>CHERRY</p>
</li>
<li>
<p style={{ color: "black" }}>JAEYEON</p>
</li>
<li>
<p style={{ color: "black" }}>SEOYEON</p>
</li>
<li>
<p style={{ color: "black" }}>JIWEON</p>
</li>
<li>
<p style={{ color: "black" }}>BYOUNGYUN</p>
</li>
</ul>
</div>
<div className="mb-3"> <div
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}> className="offcanvas offcanvas-start"
<h5 className="col mt-2">오프라인 사용자</h5> style={{ width: '330px' }}
tabIndex="-1"
id="left-hamburger"
aria-labelledby="hamburgerLabel"
>
<div className="offcanvas-header">
<p
className="col-6 offcanvas-title"
id="offcanvasExampleLabel"
style={{
fontWeight: 'bold',
fontSize: '15px',
width: '150px',
color: '#000000',
}}
>
/오프라인 사용자
</p>
<h6 className="mt-2" id="roomId" > #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="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">온라인 사용자</h5>
</div>
<ul className="mx-5" style={{ marker: "#2e873a" }}>
<li className="marker: #2e873a" style={{ markerColor: "2px #2e873a" }}>
CHERRY
</li>
<li>
JAEYEON
</li>
<li>
SEOYEON
</li>
<li>
JIWEON
</li>
<li>
BYOUNGYUN
</li>
</ul>
</div>
<div className="mb-3">
<div className="m-3 p-1 row" style={{ backgroundColor: "#E0CEE8" }}>
<h5 className="col mt-2">오프라인 사용자</h5>
</div>
<ul className="mx-5">
<li>
CHERRY
</li>
<li>
JAEYEON
</li>
<li>
SEOYEON
</li>
<li>
JIWEON
</li>
<li>
BYOUNGYUN
</li>
</ul>
</div>
</div>
<div>
<div className="d-flex flex-row-reverse">
<button
type="button"
className="m-3 rounded"
data-bs-toggle="modal"
data-bs-target="#exitRoom"
style={{
height: '30px',
fontWeight: 'bold',
backgroundColor: '#E0CEE8',
color: 'black',
border: '1px #D64D61',
}}
>
초대
</button>
<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>
</div>
<div className="modal-body d-flex justify-content-center">
어떤 방식으로 초대하시겠습니까?
</div>
<div className="row mb-3">
<div className="d-flex justify-content-evenly">
<button
type="submit"
className="col-2 p-1 btn btn-primary"
style={{ width: "120px" }}
>
카카오로 초대
</button>
<button
type="submit"
className="col-2 p-1 btn btn-primary"
data-bs-dismiss="modal"
style={{ width: "120px" }}
onClick={roomIdCopy}
>
Id 복사
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> </div>
<ul className="mx-5"> </div >
<li>CHERRY</li> )
<li>JAEYEON</li> }
<li>SEOYEON</li>
<li>JIWEON</li>
<li>BYOUNGYUN</li>
</ul>
</div>
</div>
</div>
</div>
);
};
export default LeftHamberger; export default LeftHamberger
\ No newline at end of file
...@@ -49,7 +49,6 @@ const RightHamberger = () => { ...@@ -49,7 +49,6 @@ const RightHamberger = () => {
데계데계데계데계데계데계데계데계데계데계 재밌는 수학과 데계데계데계데계데계데계데계데계데계데계 재밌는 수학과
</p> </p>
<h6 className="mt-2" id="roomId" > #ASV2AE985 </h6> <h6 className="mt-2" id="roomId" > #ASV2AE985 </h6>
<button onClick={copyInput} >초대</button>
<button <button
type="button" type="button"
className="btn-close text-reset" className="btn-close text-reset"
......
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