Fade out/in CSS feature of first post

Contribute UX
2

I’m going to try to answer my own topic :). I found these css definitions which seem to go over the relevant fades in Discourse

background-fade-highlight{0%{background-color:#d4ecfc}100%{background-color:transparent}}

.modal-backdrop.fade{opacity:0}.modal-backdrop,.modal-backdrop.fade.in{-webkit-animation:fade .3s;animation:fade .3s;opacity:.9;filter:alpha(opacity=90)}

@keyframes fade{from{opacity:0}to{opacity:0.9}}@-webkit-keyframes fade{from{opacity:0}to{opacity:0.9}}

@keyframes slidein{from{transform:translateY(-20%)}to{transform:translateY(0)}}@-webkit-keyframes slidein{from{-webkit-transform:translateY(-20%)}to{-webkit-transform:translateY(0)}}

 .discourse-tag{-webkit-animation:fadein .7s;animation:fadein .7s}

 .topic-body.highlighted{animation:background-fade-highlight 2.5s ease-out}
 .topic-list>tbody>tr.highlighted{animation:background-fade-highlight 2.5s ease-out}
 .topic-list button.bulk-select{padding:0;background:transparent}

.timeline-container.timeline-fullscreen.show{max-height:700px;transition:max-height 0.4s ease-out}

.read-state.read{opacity:0;transition:opacity ease-out 1s}

.timeline-container.timeline-fullscreen{max-height:0;transition:max-height 0.3s ease-in;

#reply-control{transition:height 0.4s ease;width:100%;z-index:999;height:0;background-color:#e6e6e6;bottom:0;font-size:1em;position:fixed}

#reply-control.edit-title .contents .wmd-controls{transition:top 0.3s ease;top:100px}

.timeline-container.timeline-fullscreen .topic-timeline .timeline-footer-controls ul.dropdown-menu .title{padding-left:0}.timeline-container .topic-timeline{margin-left:3em;width:150px;transition:opacity 0.2s ease-in}

.timeline-container .topic-timeline .timeline-footer-controls{margin-top:1em;line-height:2.5em;transition:opacity 0.2s ease-in}

.timeline-container .topic-timeline .timeline-padding{transition:height 0.15s ease-out;cursor:pointer}

.modal.in{-webkit-animation:fade .25s;animation:fade .25s}.modal-body{overflow-y:auto;max-height:400px;padding:15px}.modal-footer .btn+.btn{margin-left:5px;margin-bottom:0}.modal-footer .btn.right{float:right}

.discourse-no-touch .topic-body .actions .fade-out{opacity:0.7;transition:opacity 0.7s ease-in-out}

.discourse-touch .topic-body .actions .fade-out{opacity:1}

.topic-body:hover .actions .fade-out,.topic-body .selected .actions .fade-out{opacity:1}

@-webkit-keyframes fadein{from{opacity:0}to{opacity:1}}@keyframes fadein{from{opacity:0}to{opacity:1}}

.extra-info-wrapper .badge-wrapper,.extra-info-wrapper i,.extra-info-wrapper .topic-link{-webkit-animation:fadein .7s;animation:fadein .7s}
1 лайк