misuzu/assets/less/classes/forum/post.less

115 lines
2.7 KiB
Text

.forum__post {
display: flex;
border: 1px solid var(--accent-colour);
box-shadow: 0 1px 2px var(--accent-colour);
background-color: var(--background-colour);
margin: 2px 0;
@media (max-width: @site-mobile-width) {
flex-direction: column;
}
&__content {
display: flex;
flex-direction: column;
flex-grow: 1;
flex-shrink: 1;
word-wrap: break-word;
overflow: hidden;
&__text {
margin: 2px;
line-height: 1.2em;
@media (max-width: @site-mobile-width) {
margin: 4px;
font-size: 1.2em;
line-height: 1.3em;
}
}
&__info {
font-size: .9em;
line-height: 1.7em;
padding: 0 2px;
border-bottom: 1px solid var(--accent-colour);
display: flex;
justify-content: space-between;
&__link {
color: inherit;
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}
}
&__author {
border-right: 1px solid var(--accent-colour);
text-align: center;
flex-grow: 0;
flex-shrink: 0;
min-width: 170px;
display: flex;
flex-direction: column;
align-items: center;
@media (max-width: @site-mobile-width) {
border-right-width: 0;
border: 1px solid var(--accent-colour);
flex-direction: row;
border-bottom-width: 2px;
}
&__joined {
flex-grow: 1;
flex-shrink: 1;
margin: 5px;
max-width: 170px;
@media (max-width: @site-mobile-width) {
display: none;
}
}
&__link {
margin: 15px;
color: inherit;
text-decoration: none;
flex-grow: 0;
flex-shrink: 0;
@media (max-width: @site-mobile-width) {
display: flex;
align-items: center;
margin: 5px;
flex-grow: 1;
}
}
&__avatar {
width: 120px;
height: 120px;
box-shadow: 0 1px 2px var(--accent-colour);
@media (max-width: @site-mobile-width) {
width: 40px;
height: 40px;
margin-right: 5px;
}
}
&__username {
color: var(--user-colour);
font-size: 1.5em;
line-height: 1.7em;
}
&:not(&--deleted) &__username:hover {
text-decoration: underline;
}
}
}