Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
messenger
Commits
308d5b7f
Commit
308d5b7f
authored
Jan 27, 2021
by
Soo Hyun Kim
Browse files
0127 전체css완
parent
6a147e31
Changes
7
Show whitespace changes
Inline
Side-by-side
client/src/Components/Chat.js
View file @
308d5b7f
...
@@ -126,7 +126,7 @@ function Chat(props) {
...
@@ -126,7 +126,7 @@ function Chat(props) {
return
(
return
(
<
div
id
=
"
chat
"
style
=
{{
display
:
"
flex
"
,
flexDirection
:
"
column
"
,
borderStyle
:
"
solid
"
,
borderRadius
:
"
5px
"
,
borderColor
:
"
#4A5D7E
"
,
backgroundColor
:
"
#FFFFFF
"
,
padding
:
'
15px
'
,
width
:
"
100%
"
,
height
:
"
580px
"
,
position
:
"
relative
"
}}
>
<
div
id
=
"
chat
"
style
=
{{
display
:
"
flex
"
,
flexDirection
:
"
column
"
,
borderStyle
:
"
solid
"
,
borderRadius
:
"
5px
"
,
borderColor
:
"
#4A5D7E
"
,
backgroundColor
:
"
#FFFFFF
"
,
padding
:
'
15px
'
,
width
:
"
100%
"
,
height
:
"
90vh
"
,
position
:
"
relative
"
}}
>
<
div
id
=
"
chat-head
"
style
=
{{
display
:
"
flex
"
,
flexDirection
:
"
row
"
,
justifyContent
:
"
space-between
"
,
alignItems
:
"
center
"
,
width
:
"
100%
"
,
height
:
"
80px
"
}}
>
<
div
id
=
"
chat-head
"
style
=
{{
display
:
"
flex
"
,
flexDirection
:
"
row
"
,
justifyContent
:
"
space-between
"
,
alignItems
:
"
center
"
,
width
:
"
100%
"
,
height
:
"
80px
"
}}
>
<
a
href
=
"
#;
"
onClick
=
{
handleClick
}
style
=
{{
margin
:
"
0px 0px 0px 15px
"
}}
><
BsCaretLeftFill
size
=
"
20
"
color
=
"
#333333
"
/><
/a
>
<
a
href
=
"
#;
"
onClick
=
{
handleClick
}
style
=
{{
margin
:
"
0px 0px 0px 15px
"
}}
><
BsCaretLeftFill
size
=
"
20
"
color
=
"
#333333
"
/><
/a
>
<
div
style
=
{{
justifyContent
:
"
center
"
}}
>
<
div
style
=
{{
justifyContent
:
"
center
"
}}
>
...
@@ -142,7 +142,7 @@ function Chat(props) {
...
@@ -142,7 +142,7 @@ function Chat(props) {
<
a
href
=
"
#;
"
onClick
=
{()
=>
setExit
(
!
exit
)}
><
BsX
size
=
"
1em
"
color
=
"
#F2D788
"
/><
/a
>
<
a
href
=
"
#;
"
onClick
=
{()
=>
setExit
(
!
exit
)}
><
BsX
size
=
"
1em
"
color
=
"
#F2D788
"
/><
/a
>
<
/div
>
<
/div
>
:
null
}
:
null
}
<
div
id
=
"
chat-body
"
style
=
{{
overflow
:
'
auto
'
,
padding
:
'
15px
'
,
width
:
"
100%
"
,
height
:
"
400px
"
,
margin
:
"
1%
"
,
background
:
''
}}
>
<
div
id
=
"
chat-body
"
style
=
{{
overflow
:
'
auto
'
,
padding
:
'
15px
'
,
width
:
"
100%
"
,
height
:
"
75%
"
,
margin
:
"
1%
"
,
background
:
''
}}
>
{
chat
.
map
((
value
,
index
)
=>
{
{
chat
.
map
((
value
,
index
)
=>
{
if
(
!
(
value
.
msg
===
''
))
{
if
(
!
(
value
.
msg
===
''
))
{
if
(
value
.
sender
===
"
system
"
)
{
if
(
value
.
sender
===
"
system
"
)
{
...
...
client/src/Components/ClosedList.js
View file @
308d5b7f
...
@@ -16,7 +16,8 @@ function ClosedList(props) {
...
@@ -16,7 +16,8 @@ function ClosedList(props) {
}
}
return
(
return
(
<
div
>
<
div
style
=
{{
height
:
"
80vh
"
}}
>
<
div
style
=
{{
overflow
:
'
auto
'
,
height
:
"
100%
"
}}
>
{
props
.
closedlist
.
map
((
item
,
index
)
=>
{
props
.
closedlist
.
map
((
item
,
index
)
=>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
value
=
{
item
.
roomName
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
value
=
{
item
.
roomName
}
>
...
@@ -27,6 +28,7 @@ function ClosedList(props) {
...
@@ -27,6 +28,7 @@ function ClosedList(props) {
)
)
}
}
<
/div
>
<
/div
>
<
/div
>
)
)
}
}
...
...
client/src/Components/Menu.js
View file @
308d5b7f
import
React
,
{
useState
}
from
'
react
'
import
React
from
'
react
'
import
{
Navbar
,
Nav
}
from
'
react-bootstrap
'
;
import
{
Nav
}
from
'
react-bootstrap
'
;
import
{
handleLogout
}
from
'
../utils/auth
'
;
import
{
handleLogout
}
from
'
../utils/auth
'
;
import
styled
from
'
styled-components
'
;
import
{
BsPeopleCircle
}
from
"
react-icons/bs
"
;
import
{
BsPeopleCircle
}
from
"
react-icons/bs
"
;
import
{
AiOutlineLogout
}
from
"
react-icons/ai
"
;
import
{
AiOutlineLogout
}
from
"
react-icons/ai
"
;
import
"
../menu.css
"
;
function
Menu
()
{
function
Menu
(
props
)
{
const
[
showIcon
,
setShowIcon
]
=
useState
(
false
);
const
name
=
sessionStorage
.
getItem
(
'
name
'
);
const
name
=
sessionStorage
.
getItem
(
'
name
'
);
console
.
log
(
'
showIcon
'
,
showIcon
)
return
(
return
(
<
MenuDiv
setShowIcon
=
{
setShowIcon
}
>
<
div
className
=
"
container-fluid
"
style
=
{{
display
:
"
flex
"
,
flexDirection
:
"
row
"
,
backgroundColor
:
"
#61477a
"
,
heigth
:
"
100%
"
,
position
:
"
relative
"
}}
>
<
Navbar
style
=
{{
backgroundColor
:
"
#61477a
"
,
heigth
:
"
100%
"
}}
variant
=
"
dark
"
>
<
p
className
=
"
navbar-brand
"
href
=
"
/home
"
style
=
{{
color
:
'
white
'
,
alignItems
:
"
center
"
}}
>
YDK
Messenger
<
/p
>
<
div
className
=
"
container-fluid
"
>
<
Navbar
.
Brand
className
=
"
navbar-brand
"
href
=
"
/home
"
>
YDK
Messenger
<
/Navbar.Brand
>
{
name
?
{
name
?
<>
<>
<
Nav
className
=
"
nav navbar-nav mr-auto
"
style
=
{{
color
:
'
white
'
}}
>
<
div
className
=
"
nav navbar-nav mr-auto
"
style
=
{{
color
:
'
white
'
,
display
:
"
flex
"
,
flexDirection
:
"
row
"
,
alignItems
:
"
center
"
}}
>
<
Nav
.
Item
className
=
"
mt-2 mr-4
"
>
{
name
}
님
환영합니다
<
/Nav.Item
>
<
p
className
=
"
mt-2 mr-4
"
>
{
name
}
님
환영합니다
<
/p
>
{
showIcon
?
<
div
className
=
"
showText
"
>
<
a
href
=
"
/profile
"
><
BsPeopleCircle
size
=
"
15
"
color
=
"
#FFFFFF
"
/><
/a
>
<
a
href
=
"
/profile
"
style
=
{{
color
:
"
#FFFFFF
"
,
marginRight
:
"
15px
"
}}
>
{
'
Profile
'
}
<
/a
>
:
<
Nav
.
Link
href
=
"
/profile
"
>
Profile
<
/Nav.Link>
}
<
a
onClick
=
{()
=>
handleLogout
()}
href
=
"
/login
"
style
=
{{
color
:
"
#FFFFFF
"
}}
>
{
'
logout
'
}
<
/a
>
{
showIcon
?
<
/div
>
<
a
href
=
"
/login
"
onClick
=
{()
=>
handleLogout
()}
><
AiOutlineLogout
size
=
"
15
"
color
=
"
#FFFFFF
"
/><
/a
>
<
div
className
=
"
showIcon
"
>
:
<
Nav
.
Link
onClick
=
{()
=>
handleLogout
()}
href
=
"
/login
"
>
logout
<
/Nav.Link>
}
<
a
href
=
"
/profile
"
style
=
{{
marginRight
:
"
15px
"
}}
><
BsPeopleCircle
size
=
"
25
"
color
=
"
#FFFFFF
"
/><
/a
>
<
/Nav
>
<
a
href
=
"
/login
"
onClick
=
{()
=>
handleLogout
()}
><
AiOutlineLogout
size
=
"
25
"
color
=
"
#FFFFFF
"
/><
/a
>
<
/div
>
<
/div
>
<
/
>
<
/
>
:
<>
:
<>
<
Nav
className
=
"
nav navbar-nav
"
>
<
Nav
className
=
"
nav navbar-nav
"
>
...
@@ -35,16 +33,7 @@ function Menu() {
...
@@ -35,16 +33,7 @@ function Menu() {
<
/Nav
>
<
/Nav
>
<
/>
}
<
/>
}
<
/div
>
<
/div
>
<
/Navbar
>
<
/MenuDiv
>
)
)
}
}
const
MenuDiv
=
styled
.
div
`
@media (max-width: 500px) {
display: 'none';
}
`
export
default
Menu
export
default
Menu
client/src/Components/OpenList.js
View file @
308d5b7f
...
@@ -17,7 +17,7 @@ function OpenList(props) {
...
@@ -17,7 +17,7 @@ function OpenList(props) {
}
}
return
(
return
(
<
div
>
<
div
style
=
{{
overflow
:
'
auto
'
,
height
:
"
80vh
"
}}
>
{
props
.
openlist
.
map
((
item
,
index
)
=>
{
props
.
openlist
.
map
((
item
,
index
)
=>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
key
=
{
index
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
>
<
ListGroup
.
Item
action
onClick
=
{
enterChatRoomCH
}
name
=
{
item
.
roomId
}
>
...
...
client/src/Pages/HomePage.js
View file @
308d5b7f
...
@@ -170,9 +170,9 @@ function Home() {
...
@@ -170,9 +170,9 @@ function Home() {
},
[])
},
[])
return
(
return
(
<
div
style
=
{{
weight
:
"
100vw
"
,
height
:
"
100vh
"
,
backgroundColor
:
"
#4A5D7E
"
}}
>
<
div
style
=
{{
weight
:
"
100vw
"
,
height
:
"
100vh
"
,
backgroundColor
:
""
}}
>
<
Menu
style
=
{{
weight
:
"
100%
"
,
height
:
"
10%
"
}}
/
>
<
Menu
style
=
{{
weight
:
"
100%
"
,
height
:
"
10%
"
}}
/
>
<
Row
className
=
"
mr-0
"
style
=
{{
weight
:
"
100%
"
,
height
:
"
80%
"
}}
>
<
Row
className
=
"
mr-0
"
style
=
{{
weight
:
"
100%
"
,
height
:
"
80%
"
}}
>
<
Col
className
=
"
list
"
md
=
{
5
}
>
<
Col
className
=
"
list
"
md
=
{
5
}
>
<
Sdiv
chat
=
{
chat
}
>
<
Sdiv
chat
=
{
chat
}
>
<
Tabs
defaultActiveKey
=
"
closed
"
id
=
"
uncontrolled-tab-example
"
>
<
Tabs
defaultActiveKey
=
"
closed
"
id
=
"
uncontrolled-tab-example
"
>
...
...
client/src/Pages/ProfilePage.js
View file @
308d5b7f
import
React
,
{
useState
,
useEffect
}
from
'
react
'
import
React
,
{
useState
,
useEffect
}
from
'
react
'
import
Menu
from
'
../Components/Menu
'
;
import
Menu
from
'
../Components/Menu
'
;
import
styled
from
'
styled-components
'
;
import
{
Image
,
Button
,
Container
,
Form
,
Row
,
Col
}
from
'
react-bootstrap
'
;
import
{
Image
,
Button
,
Container
,
Form
,
Row
,
Col
}
from
'
react-bootstrap
'
;
import
{
BrowserRouter
as
Link
}
from
'
react-router-dom
'
;
import
{
BrowserRouter
as
Link
}
from
'
react-router-dom
'
;
import
axios
from
'
axios
'
import
axios
from
'
axios
'
...
...
client/src/menu.css
0 → 100644
View file @
308d5b7f
.showText
{
display
:
flex
;
flex-direction
:
row
;
margin-right
:
5px
;
margin-left
:
5px
;
position
:
absolute
;
right
:
0
;
}
.showIcon
{
display
:
none
;
}
@media
screen
and
(
max-width
:
768px
)
{
.showText
{
display
:
none
;
}
.showIcon
{
display
:
flex
;
flex-direction
:
row
;
margin-right
:
5px
;
margin-left
:
5px
;
position
:
absolute
;
right
:
0
;
}
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment