mirror of
https://github.com/discourse/discourse.git
synced 2024-12-11 23:13:48 +08:00
3c4bfb6a9f
1. Restore the left margin on both (which reflects the right margin of the scroll bar space) 2. Fix the center alignment of scroll-to-bottom icon 3. Fix the spacing of the `-` character between a date label and "last visit" label 4. Fix the incorrect display the border on date label when at the bottom of viewport
110 lines
2.3 KiB
SCSS
110 lines
2.3 KiB
SCSS
.chat-message-separator {
|
|
@include unselectable;
|
|
display: flex;
|
|
|
|
&-new {
|
|
display: flex;
|
|
justify-content: center;
|
|
padding: 20px 0 20px 1em;
|
|
position: relative;
|
|
|
|
.chat-message-separator__text-container {
|
|
text-align: center;
|
|
position: absolute;
|
|
height: 40px;
|
|
box-sizing: border-box;
|
|
z-index: 1;
|
|
top: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.chat-message-separator__text {
|
|
color: var(--danger-medium);
|
|
background-color: var(--secondary);
|
|
padding: 0.25rem 0.5rem;
|
|
font-size: var(--font-down-1);
|
|
}
|
|
}
|
|
|
|
.chat-message-separator__line-container {
|
|
width: 100%;
|
|
}
|
|
|
|
.chat-message-separator__line {
|
|
border-top: 1px solid var(--danger-medium);
|
|
}
|
|
}
|
|
|
|
&-date {
|
|
box-sizing: border-box;
|
|
position: absolute;
|
|
width: 100%;
|
|
z-index: 2;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: center;
|
|
padding-left: 1rem;
|
|
pointer-events: none;
|
|
|
|
&.with-last-visit {
|
|
& + .chat-message-separator__line-container {
|
|
.chat-message-separator__line {
|
|
border-color: var(--danger-medium);
|
|
}
|
|
}
|
|
}
|
|
|
|
.chat-message-separator__text-container {
|
|
padding-top: 7px;
|
|
position: sticky;
|
|
top: -1px;
|
|
|
|
&.is-pinned,
|
|
&.is-force-pinned {
|
|
.chat-message-separator__text {
|
|
border: 1px solid var(--secondary-high);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.chat-message-separator__last-visit {
|
|
display: none;
|
|
}
|
|
}
|
|
}
|
|
|
|
.chat-message-separator__last-visit {
|
|
display: flex;
|
|
}
|
|
|
|
.chat-message-separator__last-visit-separator {
|
|
margin: 0 0.25rem;
|
|
}
|
|
|
|
.chat-message-separator__text {
|
|
@include unselectable;
|
|
background-color: var(--secondary);
|
|
border: 1px solid transparent;
|
|
color: var(--secondary-low);
|
|
font-size: var(--font-down-1);
|
|
padding: 0.25rem 0.5rem;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
}
|
|
|
|
& + .chat-message-separator__line-container {
|
|
padding: 20px 0 20px 1em;
|
|
box-sizing: border-box;
|
|
|
|
.chat-message-separator__line {
|
|
border-top: 1px solid var(--secondary-high);
|
|
left: 0;
|
|
margin: 0 0 -1px;
|
|
position: relative;
|
|
right: 0;
|
|
top: -1px;
|
|
}
|
|
}
|
|
}
|
|
}
|