/** * @copyright Copyright (c) 2018 John Molakvoæ * * @author John Molakvoæ * * @license GNU AGPL version 3 or any later version * * This program is free software: you can redistribute it and/or modify * it under the terms of the GNU Affero General Public License as * published by the Free Software Foundation, either version 3 of the * License, or (at your option) any later version. * * This program is distributed in the hope that it will be useful, * but WITHOUT ANY WARRANTY; without even the implied warranty of * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the * GNU Affero General Public License for more details. * * You should have received a copy of the GNU Affero General Public License * along with this program. If not, see . * */ // ensure transition for delete and non-deleted transition state .app-content-list-item { transition: left 200ms; } .app-content-list-item.deleted { z-index: 2; // make sure we hide the undeleted element by sliding over it // and force the background even on hover background-color: var(--color-main-background) !important; .app-content-list-item-icon__avatar { filter: brightness(.8) grayscale(1); } .app-content-list-item-line-one { text-decoration: line-through; } // vuejs animation &.delete-slide-left-enter-active, &.delete-slide-left-leave-active { position: absolute; top: 0; left: 0; width: 100%; } &.delete-slide-left-enter, &.delete-slide-left-leave-to { left: 100%; } } .app-content-list-item-icon { overflow: hidden; &__avatar { position: absolute; top: 0; left: 0; height: inherit; width: inherit; background-size: cover; cursor: pointer; } }