mirror of
https://github.com/discourse/discourse.git
synced 2025-02-25 18:55:32 -06:00
UX: flat design for thread list (#23821)
* UX: thread list flat design * UX: thread list mobile
This commit is contained in:
@@ -1,24 +1,25 @@
|
|||||||
@mixin thread-list-item {
|
@mixin thread-list-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
padding: 0.5rem;
|
padding: 1rem;
|
||||||
|
margin-inline: 0.5rem;
|
||||||
border-radius: var(--d-border-radius);
|
border-radius: var(--d-border-radius);
|
||||||
background-color: var(--primary-very-low);
|
border-bottom: 1px solid var(--primary-low);
|
||||||
border: 1px solid transparent;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat-thread-list-item {
|
.chat-thread-list-item {
|
||||||
@include thread-list-item;
|
@include thread-list-item;
|
||||||
cursor: pointer;
|
|
||||||
margin: 0.75rem;
|
|
||||||
|
|
||||||
& + .chat-thread-list-item {
|
& + .chat-thread-list-item {
|
||||||
margin-top: 0;
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.touch & {
|
.touch & {
|
||||||
&:active {
|
&:active {
|
||||||
background-color: var(--d-hover);
|
background-color: var(--d-hover);
|
||||||
|
padding-inline: 1.5rem;
|
||||||
|
margin-inline: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -26,6 +27,8 @@
|
|||||||
&:hover,
|
&:hover,
|
||||||
&:active {
|
&:active {
|
||||||
background-color: var(--d-hover);
|
background-color: var(--d-hover);
|
||||||
|
padding-inline: 1.5rem;
|
||||||
|
margin-inline: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
.chat-thread-list {
|
.chat-thread-list {
|
||||||
&__items {
|
&__items {
|
||||||
.chat-thread-list-item {
|
.chat-thread-list-item {
|
||||||
margin: 0.5rem;
|
padding: 0.5rem 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__no-threads {
|
&__no-threads {
|
||||||
|
|||||||
Reference in New Issue
Block a user