Padding & alignment improvements

This commit is contained in:
Freeplay 2023-01-28 16:10:45 -05:00
parent 7ec5edc65e
commit 04b701f084
3 changed files with 19 additions and 14 deletions

View file

@ -351,7 +351,7 @@ function readPromo() {
.line::before { .line::before {
content: ""; content: "";
display: block; display: block;
margin-bottom: -15px; margin-bottom: -10px;
width: 2px; width: 2px;
background-color: var(--accentDarken); background-color: var(--accentDarken);
margin-inline: auto; margin-inline: auto;
@ -442,7 +442,7 @@ function readPromo() {
} }
& + .article { & + .article {
padding-top: 10px; padding-top: 10px !important;
} }
} }

View file

@ -336,7 +336,6 @@ if (appearNote.replyId) {
&:hover > .article > .main > .footer > .button { &:hover > .article > .main > .footer > .button {
opacity: 1; opacity: 1;
} }
> .reply-to { > .reply-to {
margin-bottom: -16px; margin-bottom: -16px;
} }
@ -344,9 +343,6 @@ if (appearNote.replyId) {
> .reply-to-more { > .reply-to-more {
// opacity: 0.7; // opacity: 0.7;
cursor: pointer; cursor: pointer;
&:first-child {
padding-top: 30px;
}
@media (pointer: coarse) { @media (pointer: coarse) {
cursor: default; cursor: default;

View file

@ -89,7 +89,6 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
flex: 1; flex: 1;
min-width: 0; min-width: 0;
cursor: pointer; cursor: pointer;
@media (pointer: coarse) { @media (pointer: coarse) {
cursor: default; cursor: default;
} }
@ -131,10 +130,11 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
padding: 10px 0 0 16px; padding: 10px 0 0 16px;
} }
&.reply-to:first-child { &.reply-to, &.reply-to-more {
padding-bottom: 0;
&:first-child {
padding-top: 30px; padding-top: 30px;
} }
&.reply-to, &.reply-to-more {
.avatar-container { .avatar-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -153,18 +153,27 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
&::before { &::before {
content: ""; content: "";
display: block; display: block;
margin-bottom: -30px;
width: 2px; width: 2px;
background-color: var(--accentDarken); background-color: var(--accentDarken);
margin-inline: auto; margin-inline: auto;
.note > & {
margin-bottom: -16px;
} }
} }
} }
} }
> .main > .body {
padding-bottom: 16px;
}
}
&.max-width_450px { &.max-width_450px {
padding: 14px 16px !important; padding: 14px 16px;
&.reply-to, &.reply-to-more {
padding-top: 14px !important;
padding-bottom: 0 !important;
margin-bottom: 0 !important; margin-bottom: 0 !important;
}
> .main > .avatar-container { > .main > .avatar-container {
margin-right: 10px; margin-right: 10px;
} }