// // Thread Posts // -------------------------------------------------- // Posts list // //== .posts-list { .post-fragment { float: left; position: relative; bottom: @line-height-computed * 1.9; } .post { .user-avatar { img { border-radius: @border-radius-base; } } .media-body { padding-left: @line-height-computed / 2; .panel-default { position: relative; &:after, &:before { right: 100%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; } &:after { border-color: transparent; border-right-color: @post-panel-bg; border-width: @font-size-small - 2; top: @line-height-computed / 2; margin-top: (@font-size-small * -1) + @font-size-small; } &:before { border-color: transparent; border-right-color: @post-panel-border; border-width: @font-size-small; top: @line-height-computed / 2 - 1; margin-top: (@font-size-small * -1) + @font-size-small - 1px; } } } &.focus { .media-body { .panel-default { background: @post-active-panel-bg; border-color: @post-active-panel-border; &:after { border-right-color: @post-active-panel-bg; } &:before { border-right-color: @post-active-panel-border; } } } } } } // Post panel // //== .posts-list { .panel { background: @post-panel-bg; border-color: @post-panel-border; } } // Post header // //== .posts-list { .panel { .panel-heading { background: none; border-bottom: none; margin-bottom: @line-height-computed * -0.5; color: @text-muted; .user-name { color: @state-default; font-weight: bold; } a.user-name { &:link, &:visited { color: @state-hover; } &:hover { color: @state-hover; text-decoration: text-underline; } &:active, &:focus { color: @state-clicked; text-decoration: text-underline; } } .separator { margin-left: @font-size-base / 3; margin-right: @font-size-base / 3; } .post-date { &:link, &:visited { color: @state-default; } &:hover, &:focus { color: @state-hover; text-decoration: underline; } &:active { color: @state-clicked; text-decoration: underline; } } .label { position: relative; bottom: 2px; } .post-check { float: right; margin: 0px; margin-left: @line-height-computed / 2; color: @text-muted; font-size: 20px; text-decoration: none; line-height: 19px; cursor: pointer; &.active { color: @brand-success; } input { position: absolute; top: -9999px; left: -9999px; } } } } } // Post alert // //== .posts-list { .panel { .alert { border: none; border-radius: 0px; margin-top: @line-height-computed / 2; margin-bottom: 0; font-size: @font-size-base + 2px; text-align: center; &.alert-default { background-color: @alert-default-bg; color: @alert-default-text; } .user-avatar { &, &:link, &:active, &:hover { text-decoration: none; } img { height: 20px; position: relative; bottom: 2px; } } } } } // Post body // //== .posts-list { .panel { .panel-body { .corrupted-message { margin: 0px; } .hidden-message { margin: (@line-height-computed * .25) 0px; img { height: 32px; position: relative; bottom: 2px; } a, strong { font-weight: normal; } } } } } // Post footer // //== .posts-list { .panel { .panel-footer { background: none; border-top: none; margin-top: @line-height-computed * -1.25; } } }