Files
astuto/app/javascript/stylesheets/components/Post.scss

143 lines
2.1 KiB
SCSS
Raw Normal View History

.pageContainer {
@extend
.d-flex,
.justify-content-between,
.align-items-start;
2019-09-30 16:54:37 +02:00
flex-direction: row;
2019-09-30 16:54:37 +02:00
@include media-breakpoint-down(sm) {
flex-direction: column;
.postAndCommentsContainer { width: 100%; }
}
.sidebar {
2019-10-01 19:15:03 +02:00
.postUpdateListContainer {
@extend .sidebarCard;
.postUpdateList {
@extend .w-100;
max-height: 250px;
overflow-y: scroll;
.postUpdateListItem {
@extend
.d-flex,
.flex-column,
.p-2,
.my-1;
.postUpdateListItemHeader {
@extend .d-flex;
span {
@extend
.ml-2;
font-weight: 600;
vertical-align: middle;
}
}
.postUpdateListItemBody {
@extend .m-0;
font-size: 15px;
}
}
}
}
2019-09-30 18:10:51 +02:00
.likeListContainer {
2019-09-30 16:54:37 +02:00
@extend .sidebarCard;
2019-09-30 18:10:51 +02:00
.likeList {
@extend .w-100;
max-height: 170px;
overflow-y: scroll;
.likeListItem {
@extend
.p-2,
.my-1;
.likeListItemName {
@extend .ml-2;
}
}
}
2019-09-30 16:54:37 +02:00
}
}
.postAndCommentsContainer {
@extend
.card,
.flex-grow-1,
2020-01-05 11:25:38 +01:00
.p-3,
.mb-3;
2019-09-21 12:54:57 +02:00
.postInfo {
@extend .d-flex;
span {
@extend .mr-2;
}
}
2019-09-25 11:50:23 +02:00
.postHeader {
@extend
.d-flex;
a {
@extend
.ml-1;
line-height: 1em;
}
}
2019-09-21 12:54:57 +02:00
.postSettings {
@extend
.d-flex,
.justify-content-between;
.selectPicker {
@extend
.custom-select,
.mx-2;
}
}
.postDescription {
@extend
.my-3;
2019-09-27 11:40:33 +02:00
color: $astuto-black;
}
}
}
@media (prefers-color-scheme: dark) {
.postDescription {
color: white !important;
}
.badgeLight {
color: white;
}
.postAndCommentsContainer .postSettings .selectPicker {
background-color: #282828 !important;
color: white !important;
}
.postAndCommentsContainer .postHeader a {
color: white;
}
}