4b6b231fc8
Navigation is always right below the image, and comments are always at the very bottom, to minimize scrolling for common actions.
178 lines
3.8 KiB
Stylus
178 lines
3.8 KiB
Stylus
@import colors
|
|
|
|
.post-view
|
|
width: 100%
|
|
display: flex !important
|
|
flex-direction: row
|
|
|
|
>.sidebar
|
|
margin-right: 1em
|
|
min-width: 21em
|
|
max-width: 21em
|
|
line-height: 160%
|
|
|
|
a:active
|
|
border: 0
|
|
outline: 0
|
|
|
|
>.sidebar>nav.buttons, >.content nav.buttons
|
|
margin-top: 0
|
|
display: flex
|
|
flex-wrap: wrap
|
|
article
|
|
flex: 1 0 33%
|
|
a
|
|
display: inline-block
|
|
width: 100%
|
|
padding: 0.3em 0
|
|
text-align: center
|
|
vertical-align: middle
|
|
transition: background 0.2s linear, box-shadow 0.2s linear
|
|
&:not(.inactive):hover
|
|
background: lighten($main-color, 90%)
|
|
i
|
|
font-size: 140%
|
|
text-align: center
|
|
@media (max-width: 800px)
|
|
margin-top: 0.6em
|
|
margin-bottom: 0.6em
|
|
|
|
>.content
|
|
width: 100%
|
|
|
|
.post-container
|
|
margin-bottom: 0.6em
|
|
|
|
.post-content
|
|
margin: 0
|
|
|
|
.after-mobile-controls
|
|
width: 100%
|
|
|
|
.darktheme .post-view
|
|
>.sidebar, >.content
|
|
nav.buttons
|
|
article
|
|
a:not(.inactive):hover
|
|
background: unset
|
|
box-shadow: inset 0 0 0 0.3em $main-color
|
|
|
|
@media (max-width: 800px)
|
|
.post-view
|
|
flex-wrap: wrap
|
|
>.after-mobile-controls
|
|
order: 3
|
|
>.sidebar
|
|
order: 2
|
|
min-width: 100%
|
|
max-width: 0
|
|
margin-right: 0
|
|
>.content
|
|
order: 1
|
|
|
|
|
|
.post-view .readonly-sidebar
|
|
.details
|
|
i
|
|
margin-right: 0.6em
|
|
display: inline-block
|
|
width: 1em
|
|
text-align: center
|
|
|
|
.safety-safe
|
|
color: $safety-safe
|
|
.safety-sketchy
|
|
color: $safety-sketchy
|
|
.safety-unsafe
|
|
color: $safety-unsafe
|
|
|
|
.upload-info
|
|
.thumbnail
|
|
width: 1em
|
|
height: 1em
|
|
margin: -0.1em 0.6em 0 0
|
|
|
|
.zoom
|
|
margin-top: 1em
|
|
a
|
|
display: inline-block
|
|
.active
|
|
text-decoration: underline
|
|
|
|
.social
|
|
margin-top: 1em
|
|
.score-container
|
|
float: left
|
|
margin-right: 3em
|
|
.downvote i
|
|
text-align: right
|
|
i
|
|
text-align: left
|
|
margin: 0
|
|
.value
|
|
text-align: center
|
|
display: inline-block
|
|
width: 2em
|
|
|
|
.relations
|
|
margin-top: 2em
|
|
h1
|
|
margin-bottom: 0.5em
|
|
.thumbnail
|
|
width: 4em
|
|
height: 3em
|
|
li
|
|
margin: 0 0.3em 0.3em 0
|
|
display: inline-block
|
|
|
|
.tags
|
|
margin-top: 2em
|
|
h1
|
|
margin-bottom: 0.5em
|
|
|
|
.post-view .edit-sidebar
|
|
.expander-content
|
|
section:not(:last-child)
|
|
margin-bottom: 1em
|
|
|
|
.safety
|
|
&>label
|
|
width: 100%
|
|
.radio-wrapper
|
|
display: flex
|
|
flex-wrap: wrap
|
|
.radio-wrapper label
|
|
flex-grow: 1
|
|
display: inline-block
|
|
|
|
.management
|
|
ul
|
|
list-style-type: none
|
|
margin: 0
|
|
padding: 0
|
|
li
|
|
margin: 0
|
|
padding: 0
|
|
|
|
.post-source
|
|
textarea
|
|
white-space: pre
|
|
overflow-wrap: normal
|
|
overflow-x: scroll
|
|
|
|
form
|
|
width: auto
|
|
|
|
label:not(.file-dropper)
|
|
margin-bottom: 0.3em
|
|
display: block
|
|
|
|
input[type=submit],
|
|
input[type=button],
|
|
button
|
|
width: 100%
|
|
&:focus
|
|
border: 2px solid $text-color !important
|
|
|
|
.messages
|
|
margin-top: 1em
|