Hi Zac
It is possible with override the current css if you really want to. Try something like this
This will looks like the default Discourse Light theme. Probably the best option is remove the archetype-private_message
class from body
with js. That keeps the custom theme style.
COMMON
.archetype-private_message {
.topic-avatar,
.topic-body {
border-top: 1px solid var(--primary-low);
}
.topic-body {
.cooked {
box-sizing: unset;
border: none;
margin-top: 0;
margin-left: 0;
padding: 1em 11px 0.25em 11px;
border-radius: 0;
}
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
.cooked {
animation: none;
}
}
}
.post-menu-area {
margin-top: 0;
}
.small-action-desc.timegap {
flex-wrap: wrap;
flex: 1 1 100%;
align-items: center;
padding: 1em 0;
text-transform: uppercase;
font-weight: bold;
font-size: var(--font-down-1);
color: var(--primary-medium);
}
.current-user-post,
.current-user-post:not(.moderator) {
.topic-body {
.cooked {
background: none;
border: none;
}
&.highlighted {
animation: background-fade-highlight 2.5s ease-out;
.cooked {
animation: none;
}
}
}
}
.topic-map {
border: 1px solid var(--primary-low);
border-top: none;
border-radius: 0;
padding: 0;
section {
border-top: 1px solid var(--primary-low)
}
.map:first-of-type .buttons .btn {
border: 0;
border-left: 1px solid var(--primary-low);
border-top: 1px solid transparent;
border-radius: 0;
}
.participants .user {
border: 1px solid var(--primary-low);
border-radius: 0.25em;
padding: 0;
background: none;
}
}
}
DESKTOP
.archetype-private_message {
.topic-map {
margin: 20px 0 20px 11px;
}
}
MOBILE
.archetype-private_message {
.topic-post {
margin: 0;
article {
border-top: 1px solid var(--primary-low);
}
}
.topic-body,
.topic-avatar {
border-top: none;
}
.topic-body {
flex: unset;
}
.boxed .contents {
padding: 10px 0 0 0;
}
.topic-map {
margin: 0;
}
}