@mixin thread-list-item { display: flex; flex-direction: row; padding: 0.5rem; border-radius: 6px; background-color: var(--d-selected); border: 1px solid transparent; } .chat-thread-list-item { @include thread-list-item; cursor: pointer; .touch & { &:active { background-color: var(--d-hover); border: 1px solid var(--primary-medium); } } .no-touch & { &:hover, &:active { background-color: var(--d-hover); border: 1px solid var(--primary-medium); } } &__main { flex: 1 1 100%; } &__header { display: flex; flex-direction: row; align-items: center; } &__title { flex: 1; font-weight: bold; } &__open-button { display: flex; flex-direction: column; box-sizing: border-box; justify-content: center; color: var(--primary); &:hover, &:visited { color: var(--primary); } } }