42917806e9
removed unnecessary components, combined where necessary added each component to a folder, added individual css style modules optimized some component rendering flows removed functional components in favor of pure components linted and formatted all of the files
118 lines
2.0 KiB
SCSS
118 lines
2.0 KiB
SCSS
.status {
|
|
padding: 8px 10px;
|
|
padding-left: 68px;
|
|
position: relative;
|
|
min-height: 54px;
|
|
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
|
cursor: default;
|
|
|
|
@supports (-ms-overflow-style: -ms-autohiding-scrollbar) {
|
|
// Add margin to avoid Edge auto-hiding scrollbar appearing over content.
|
|
// On Edge 16 this is 16px and Edge <=15 it's 12px, so aim for 16px.
|
|
padding-right: 26px; // 10px + 16px
|
|
}
|
|
|
|
@keyframes fade {
|
|
0% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
opacity: 1;
|
|
animation: fade 150ms linear;
|
|
|
|
.video-player {
|
|
margin-top: 8px;
|
|
}
|
|
|
|
&.status-direct:not(.read) {
|
|
background: lighten($ui-base-color, 8%);
|
|
border-bottom-color: lighten($ui-base-color, 12%);
|
|
}
|
|
|
|
&.light {
|
|
.status__relative-time {
|
|
color: $light-text-color;
|
|
}
|
|
|
|
.status__display-name {
|
|
color: $inverted-text-color;
|
|
}
|
|
|
|
.display-name {
|
|
strong {
|
|
color: $inverted-text-color;
|
|
}
|
|
|
|
span {
|
|
color: $light-text-color;
|
|
}
|
|
}
|
|
|
|
.status__content {
|
|
color: $inverted-text-color;
|
|
|
|
a {
|
|
color: $highlight-text-color;
|
|
}
|
|
|
|
a.status__content__spoiler-link {
|
|
color: $primary-text-color;
|
|
background: $ui-primary-color;
|
|
|
|
&:hover {
|
|
background: lighten($ui-primary-color, 8%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&__meta {
|
|
font-size: 14px;
|
|
color: $gab-secondary-text;
|
|
|
|
a {
|
|
color: $gab-brand-default;
|
|
font-weight: bold;
|
|
text-decoration: none;
|
|
|
|
&:hover {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@media screen and (min-width:630px) {
|
|
.status {
|
|
padding: 15px 15px 15px 78px;
|
|
min-height: 50px;
|
|
|
|
&__avatar {
|
|
left: 15px;
|
|
top: 17px;
|
|
}
|
|
|
|
&__content {
|
|
padding-top: 5px;
|
|
}
|
|
|
|
&__prepend {
|
|
margin-left: 78px;
|
|
padding-top: 15px;
|
|
}
|
|
|
|
&__prepend-icon-wrapper {
|
|
left: -32px;
|
|
}
|
|
|
|
.media-gallery,
|
|
.video-player {
|
|
margin-top: 10px;
|
|
}
|
|
}
|
|
} |