Nin is a theme for twister-html
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

310 lines
5.0 KiB

/************* POST BOARD *************/
9 years ago
// vars for postboard
$avatar-width : 48px
.postboard
9 years ago
width: 100%
9 years ago
padding: 20px
h2
display: none
.postboard-posts
position: relative
z-index: 1
clear: both
.postboard-news
display: none
.post
background: $bloc-background-color
position: relative
margin-bottom: 1px
+transition-property(margin)
+transition-duration(.4s)
+transition-timing-function(ease-out)
.post, .original.post, .post.open
position: relative
.module.open
9 years ago
.post
color: darken($defaut-font-color, 15%)
.post:hover
9 years ago
color: darken($defaut-font-color, 15%)
.post-data
9 years ago
padding: $space
.post.open
9 years ago
.original, .related
margin-bottom: 1px
.postboard-posts > .post
9 years ago
&.open
margin-top: $space
margin-bottom: $space
&:after
content: ""
position: absolute
right: 0
top: 0
width: 0
height: 100%
transition: all .2s linear
&.open:after
width: 5px
.post:hover
9 years ago
cursor: pointer
.open
9 years ago
background: none!important
9 years ago
@extend .box-shadow
9 years ago
.post-photo
margin: 0
display: inline-block
float: left
vertical-align: middle
width: $avatar-width
height: $avatar-width
overflow: hidden
img
width: 100%
height: 100%
//+border-radius(50%)
.post-info-name
9 years ago
font-weight: 600
color: inherit
text-decoration: none
display: inline-block
float: left
margin-left: 10px
.post-info-name:hover
9 years ago
text-decoration: none
color: black
.post-info-tag
9 years ago
font-size: 12px
opacity: .6
margin-top: 4px
display: inline-block
.post-info-time
9 years ago
position: absolute
font-size: 11px
line-height: 14px
text-decoration: none
top: 11px
right: 11px
color: lighten($dark-grey,30%)
&:hover
color: lighten($dark-grey,5%)
.post-text
9 years ago
margin: 0 0 0 ($avatar-width +10)
word-wrap: break-word
min-height: $avatar-width
padding: 0
samp
9 years ago
background: #eee
9 years ago
font-size: .9rem
line-height: .9rem
display: inline-block
padding: 5px 8px
+border-radius(2px)
color: #333
font-weight: 500
font-family: monospace
.post-context
9 years ago
font-size: 11px
line-height: 11px
margin: 0 0 1em 0
color: lighten($dark-grey,30%)
span
@extend .icon-twistagain
@extend .extend-icon
&:before
display: block
float: left
background: $main-color-color
text-align: center
padding: 1px 2px 2px 2px
line-height: 9px
font-size: 9px
+border-radius(3px)
color: white
margin-right: .4em
.mini-screen-name
9 years ago
font-size: 13px
color: $dark-grey
.post-retransmited-icon
9 years ago
display: none
.post-interactions
9 years ago
margin: 10px 0 3px 0
text-align: right
height: 12px
line-height: 12px
span
color: lighten($dark-grey,30%)
cursor: pointer
font-size: 12px
line-height: 12px
.post-expand
9 years ago
color: lighten($dark-grey,30%)
cursor: pointer
font-size: 12px
position: absolute
left: 10px
bottom: 10px
&:hover
color: lighten($dark-grey,5%)
.post-reply, .post-propagate, .post-favorite
@extend .extend-icon
padding-left: 10px
display: none
&:hover
color: lighten($dark-grey,5%)
.post-reply
9 years ago
@extend .icon-comment
.post-propagate
9 years ago
@extend .icon-twistagain
.post-favorite
9 years ago
display: none!important
@extend .icon-star
9 years ago
.post
.show-more
display: inline-block
float: right
font-size: 12px
color: lighten($dark-grey,30%)
@extend .extend-icon
@extend .icon-chat
&:hover
color: lighten($dark-grey,5%)
.expanded-content.show-pic
9 years ago
display: block
.expanded-post
9 years ago
.post-expand, .post-reply, .post-propagate, .post-favorite
color: lighten($dark-grey,30%)
&:hover
color: lighten($dark-grey,5%)
.related .post-expand
9 years ago
display: none
margin: 0
.post:hover, .original.open .post-interactions, .post:hover .original .post-interactions, .related.post:hover
9 years ago
.post-reply, .post-propagate, .post-favorite
display: inline-block
.open .related
9 years ago
.post-reply, .post-propagate, .post-favorite
display: none!important
&:hover
.post-reply, .post-propagate/*, .post-favorite*/
display: inline-block!important
.expanded-content
9 years ago
display: none
padding: 5px 5px 0 5px
@extend .clear-fix
.image-preview
9 years ago
width: 100%
display: block
margin: auto
.preview-container
9 years ago
max-height: 500px
width: 100%
text-align: center
overflow-y: auto
background: black
.post-stats
9 years ago
float: left
li
display: inline-block
&.stat-count
font-weight: 700
font-size: 11px
float: left
line-height: 20px
color: llighten($dark-grey,30%)
span:last-child
padding-right: 5px
a
position: relative
text-decoration: none
display: inline-block
width: 20px
height: 20px
margin: 0 1px 0 0
img
width: 20px
height: 20px
.user-name-tooltip
9 years ago
display: none
position: absolute
background: lighten($main-color-dark,3%)
font-size: 12px
white-space: nowrap
padding: 3px 5px
color: #fff
top: -42px
left: 0px
&:after
content: ""
position: absolute
width: 0
left: 4px
bottom: -5px
border-top: solid 5px lighten($main-color-dark,3%)
border-left: solid 5px transparent
border-right: solid 5px transparent
.post-stats a:hover .user-name-tooltip
9 years ago
display: inline-block
.post-replies .sub-replies
9 years ago
border-left: solid 3px $main-color-color
margin-left: 1px