framework/less/forum/PostStream.less
Sami Mazouz af89b23f67
CSS Code Housekeeping (#3026)
* refactor: Avatar classes refactor
* refactor: Badge classes refactor
* chore: Remove commented dead code
* chore: Remove SignUpModal dead CSS code
Flarum seem to have had some kind of user display in the sign up modal 
on successful sign up, which no longer exists.

https://github.com/flarum/core/blob/v0.1.0-beta/js/forum/src/components/SignUpModal.js#L111
* chore: Deprecate unneeded vendor mixins
* chore: Normalize property values format
Co-authored-by: David Wheatley <hi@davwheat.dev>
* chore: Remove @-webkit-keyframes
* chore: Combine animation properties
* chore: Avoid `all` for transition
* chore: translate3d is no longer necessary for hardware acceleration
* fix: Lost cursor pointer to normalize update
* chore: Use CSS variables for more things
* chore: Remove unecessary overspecification
Co-authored-by: David Wheatley <hi@davwheat.dev>
2021-08-21 19:34:07 +01:00

79 lines
1.2 KiB
Plaintext

// ------------------------------------
// Stream
.PostStream {
@media @tablet-up {
margin-top: 10px;
}
}
.PostStream-item {
&:not(:last-child) {
border-bottom: 1px solid @control-bg;
@media @phone {
margin: 0 -15px;
padding: 0 15px;
}
}
}
@keyframes blink {
0% {opacity: 0.5}
50% {opacity: 1}
100% {opacity: 0.5}
}
.LoadingPost {
animation: blink 1s linear infinite;
}
.fakeText {
display: inline-block;
vertical-align: middle;
background: @control-bg;
height: 12px;
width: 100%;
margin-bottom: 20px;
border-radius: @border-radius;
.Post-header & {
height: 16px;
width: 150px;
@media @phone {
margin-bottom: 0;
}
}
}
.PostStream-timeGap {
text-transform: uppercase;
font-weight: bold;
color: @muted-color;
padding: 20px 20px 20px @avatar-column-width;
font-size: 12px;
@media @phone {
margin: 0 -15px;
padding: 20px 15px;
}
}
@keyframes pulsate {
0% {transform: scale(1)}
50% {transform: scale(1.02)}
100% {transform: scale(1)}
}
.pulsate {
animation: pulsate 1s ease-in-out infinite;
}
.flash {
animation: pulsate 0.2s ease-in-out;
}
@keyframes fadeIn {
0% {opacity: 0}
100% {opacity: 1}
}
.fadeIn {
animation: fadeIn 0.4s ease-in-out;
}