styling upcoming label
This commit is contained in:
parent
917e7ce2f0
commit
b99df46f7c
|
|
@ -20,7 +20,7 @@ function initializeDecorateTopicTitle(api) {
|
|||
if (!topic.event_ends_at) {
|
||||
const upcoming = document.createElement("span");
|
||||
const startLabel = document.createElement("span");
|
||||
upcoming.classList.add("event-date", "event-relative-date");
|
||||
upcoming.classList.add("event-label");
|
||||
startLabel.dataset.starts_at = topic.event_starts_at;
|
||||
upcoming.innerText = I18n.t(
|
||||
"discourse_post_event.topic_title.upcoming"
|
||||
|
|
|
|||
|
|
@ -26,6 +26,31 @@
|
|||
margin-right: 0.25em;
|
||||
}
|
||||
}
|
||||
|
||||
.event-label {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
font-size: $font-down-2;
|
||||
color: var(--primary-low);
|
||||
border: 1px solid var(--primary-medium);
|
||||
background: var(--primary-medium);
|
||||
padding: 0 0.25em;
|
||||
border-radius: 3px;
|
||||
vertical-align: middle;
|
||||
margin-left: 0.25em;
|
||||
|
||||
& + .event-date-container .event-date {
|
||||
margin-left: -2px; // make it flushed with upcoming label
|
||||
padding-left: 5px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
& + .event-date-container .event-date + & {
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header-title {
|
||||
|
|
|
|||
Loading…
Reference in New Issue