Fakultas Ilmu Komputer UI
Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
Functional Programming
Diskuy-Frontend
Commits
ae8b4fdd
Commit
ae8b4fdd
authored
Feb 23, 2021
by
Jonathan Chandra
Browse files
fix responsive styling
parent
1ae585b2
Changes
12
Hide whitespace changes
Inline
Side-by-side
src/components/thread/Pagination.jsx
View file @
ae8b4fdd
...
...
@@ -21,7 +21,7 @@ export default function Pagination(props) {
onChange
=
{
handlePageChange
}
itemClass
=
"page-item"
linkClass
=
"page-link"
hideNavigation
=
{
false
}
hideNavigation
=
"
false
"
/>
</
div
>
);
...
...
src/components/thread/Post.jsx
View file @
ae8b4fdd
...
...
@@ -106,29 +106,30 @@ export default function Post(props) {
</
div
>
</
div
>
<
div
id
=
"headerButton"
>
<
div
className
=
"buttonContainer"
>
{
content
.
user_id
==
AuthService
.
getCurrentUserId
()
&&
(
<
div
>
{
checkType
==
'
threads
'
&&
(
<
Button
type
=
"button"
text
=
"Edit"
color
=
"none-green"
url
=
{
`thread/edit/
${
content
.
id
}
`
}
/>
)
}
<
button
type
=
"button"
className
=
"deleteButton"
onClick
=
{
()
=>
deletePost
(
user
.
username
)
}
>
Delete
</
button
>
</
div
>
<
div
id
=
"headerButton"
>
<
div
className
=
"buttonContainer"
>
<
div
>
{
checkType
==
'
threads
'
&&
(
<
Button
type
=
"button"
text
=
"Edit"
color
=
"none-green"
url
=
{
`thread/edit/
${
content
.
id
}
`
}
/>
)
}
<
button
type
=
"button"
className
=
"deleteButton"
onClick
=
{
()
=>
deletePost
(
user
.
username
)
}
>
Delete
</
button
>
</
div
>
</
div
>
</
div
>
)
}
</
div
>
</
div
>
</
div
>
<
div
id
=
"postContent"
>
{
props
.
type
==
'
thread
'
&&
<
h1
id
=
"judul"
>
{
content
.
title
}
</
h1
>
}
...
...
src/styles/profile/Profile.css
View file @
ae8b4fdd
...
...
@@ -75,4 +75,20 @@
p
{
font-size
:
14px
;
}
.sub_header_my_threads
{
flex-wrap
:
wrap
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.sub_header_my_threads
{
flex-wrap
:
wrap
;
justify-content
:
center
;
flex-direction
:
column
;
}
.my_threads_section
p
{
text-align
:
center
;
}
}
\ No newline at end of file
src/styles/thread/Form.css
View file @
ae8b4fdd
...
...
@@ -66,7 +66,7 @@ label {
}
.topic
{
w
idth
:
400px
;
max-
idth
:
400px
;
font-family
:
"DM Sans"
;
height
:
45px
;
padding
:
12px
16px
;
...
...
@@ -152,19 +152,23 @@ textarea:focus, input:focus, select:focus{
}
.title
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
}
.topic
{
min-width
:
248px
;
max-width
:
303px
;
}
.body
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
}
.username
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
}
.buttonContainer
{
...
...
@@ -172,3 +176,9 @@ textarea:focus, input:focus, select:focus{
justify-content
:
center
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.header
{
text-align
:
center
;
}
}
src/styles/thread/ListThreads.css
View file @
ae8b4fdd
...
...
@@ -23,8 +23,10 @@
.tab
h3
{
font-family
:
"DM Sans"
;
font-size
:
1
.125rem
;
font-size
:
1
8px
;
color
:
#000000
;
margin-right
:
24px
;
margin-top
:
4px
;
opacity
:
0.5
;
}
...
...
@@ -112,4 +114,24 @@
font-weight
:
bold
;
opacity
:
1
!important
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.sub_header_list_threads
{
flex-wrap
:
wrap
;
justify-content
:
center
;
flex-direction
:
column
;
justify-content
:
center
;
}
.tab
h3
{
font-size
:
16px
;
margin-right
:
28px
;
margin-left
:
28px
;
margin-top
:
4px
;
}
.recentThreads
p
,
.topThreads
p
{
text-align
:
center
;
}
}
\ No newline at end of file
src/styles/thread/Post.css
View file @
ae8b4fdd
...
...
@@ -121,7 +121,8 @@ button:focus {
@media
only
screen
and
(
min-device-width
:
320px
)
and
(
max-device-width
:
480px
)
{
#post
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
margin-bottom
:
20px
;
}
...
...
src/styles/thread/PreviewThread.css
View file @
ae8b4fdd
...
...
@@ -48,19 +48,13 @@ p {
@media
only
screen
and
(
min-device-width
:
320px
)
and
(
max-device-width
:
480px
)
{
#threadCard
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
margin-bottom
:
20px
;
padding
:
16px
;
}
#topic
{
background
:
#DE6600
;
color
:
#ffffff
;
padding
:
4px
;
border-radius
:
4px
;
width
:
max-content
;
margin
:
24px
0px
0px
0px
;
border-radius
:
4px
;
font-size
:
14px
;
}
...
...
@@ -69,15 +63,6 @@ p {
margin-left
:
20px
;
}
.fa-thumbs-up
{
height
:
16px
;
color
:
#DE6600
;
}
p
{
color
:
#000000
;
}
#judul
{
font-size
:
24px
;
color
:
#000000
;
...
...
@@ -90,4 +75,8 @@ p {
#threadCardContent
p
{
margin-bottom
:
0px
;
}
#threadCardContent
p
{
text-align
:
left
;
}
}
\ No newline at end of file
src/styles/thread/Thread.css
View file @
ae8b4fdd
...
...
@@ -80,8 +80,8 @@ textarea:focus {
}
.noCommentLabel
p
{
font-size
:
16px
!important
;
margin-bottom
:
0px
!important
;
font-size
:
16px
;
margin-bottom
:
0px
;
}
.commentFormContainer
{
...
...
@@ -108,7 +108,8 @@ textarea:focus {
}
.commentBox
{
min-width
:
303px
;
min-width
:
248px
;
max-width
:
303px
;
height
:
120px
;
font-size
:
14px
;
}
...
...
@@ -127,10 +128,4 @@ textarea:focus {
margin-bottom
:
0px
;
text-align
:
center
;
}
}
@media
only
screen
and
(
min-device-width
:
1920px
)
{
.commentBox
{
min-width
:
1759px
;
}
}
\ No newline at end of file
src/styles/topic/Topic.css
View file @
ae8b4fdd
...
...
@@ -65,4 +65,15 @@
margin-left
:
36px
;
margin-right
:
36px
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.deleteTopicButton
{
margin-left
:
0px
;
margin-top
:
18px
;
}
.header
h1
{
margin-bottom
:
36px
;
}
}
\ No newline at end of file
src/styles/topic/TopicList.css
View file @
ae8b4fdd
...
...
@@ -78,4 +78,16 @@
align-items
:
center
;
margin-bottom
:
24px
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.headerTopic
{
display
:
flex
;
flex-direction
:
column
;
align-items
:
center
;
}
.headerTopic
h1
{
margin-bottom
:
36px
;
}
}
\ No newline at end of file
src/styles/utility/Button.css
View file @
ae8b4fdd
...
...
@@ -28,4 +28,10 @@
.button
{
font-size
:
16px
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.button
{
margin-top
:
12px
}
}
\ No newline at end of file
src/styles/utility/Navbar.css
View file @
ae8b4fdd
...
...
@@ -15,7 +15,7 @@
}
.form-control
{
width
:
320px
;
min-
width
:
320px
;
margin-right
:
0px
!important
;
border-radius
:
0.25rem
0rem
0rem
0.25rem
;
border-color
:
#FEA02F
;
...
...
@@ -51,14 +51,22 @@
@media
only
screen
and
(
min-device-width
:
320px
)
and
(
max-device-width
:
480px
)
{
.form-control
{
width
:
300px
;
min-width
:
180px
;
max-width
:
300px
;
margin-right
:
0px
!important
;
border-radius
:
0.25rem
0rem
0rem
0.25rem
;
border-color
:
#FEA02F
;
}
#logoDiskuy
svg
{
width
:
120px
;
height
:
29.46px
;
}
}
@media
only
screen
and
(
max-device-width
:
320px
)
{
.form-control
{
min-width
:
180px
;
max-width
:
240px
;
}
}
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new 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