natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add reply connectors, a

This commit is contained in:
Freeplay 2023-02-19 20:12:01 -05:00
parent 66c3ac0654
commit e32bab700d
2 changed files with 37 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/client/src/components/MkNoteFooter.vue
View File

@ -126,7 +126,6 @@ function blur() {
.footer {
display: flex;
flex-wrap: wrap;
// margin-top: .4em;
pointer-events: none; // Allow clicking anything w/out pointer-events: all; to open post
> .button {

46
packages/client/src/components/MkNoteSub.vue
View File

@ -65,10 +65,11 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
<style lang="scss" scoped>
.wrpstxzv {
padding: 16px 32px;
--divider: rgba(255,255,255,0.5); // for now
&.children {
padding: 10px 0 0 var(--avatarSize);
padding: 10px 0 0 var(--indent);
padding-left: var(--indent) !important;
font-size: 1em;
cursor: auto;
@ -127,8 +128,10 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
}
}
&.reply :deep(.footer) {
font-size: .9em;
}
> .reply, > .more {
// border-left: solid 0.5px var(--divider);
margin-top: 10px;
&.single {
padding: 0 !important;
@ -144,13 +147,14 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
&:first-child {
padding-top: 30px;
}
> .main > .body {
padding-bottom: 16px;
.line::before {
margin-bottom: -16px;
}
}
// Reply Lines
&.reply, &.reply-to, &.reply-to-more {
--indent: var(--avatarSize);
> .main {
> .avatar-container {
display: flex;
@ -172,15 +176,15 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
&::before {
content: "";
display: block;
width: 2px;
background-color: var(--divider);
background-color: white; // FOr now
border-left: 2px solid var(--divider);
margin-inline: auto;
.note > & {
margin-bottom: -16px;
}
}
}
&.single, &.singleStart {
> .main > .avatar-container > .line::before {
margin-bottom: -10px;
}
}
.reply:last-child, &.reply:not(.children) { // Hide line in last reply of thread
> .main:last-child > .avatar-container > .line {
@ -194,11 +198,33 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
top: 0;
left: 0;
bottom: 0;
&::before {
margin-top: -10px;
}
}
&:not(.single):not(.singleStart) > .main > .avatar-container > .line {
display: none;
}
}
// Reply line connectors
.reply.children:not(.single) {
position: relative;
> .line {
position: absolute;
left: 0;
&::after {
content: "";
position: absolute;
border-left: 2px solid var(--divider);
border-bottom: 2px solid var(--divider);
margin-left: calc(var(--avatarSize) / 2 - 1px);
margin-top: -20px;
width: calc(var(--indent) / 3);
height: calc((var(--avatarSize) / 2) + 20px);
border-bottom-left-radius: calc(var(--indent) / 3);
}
}
}
&.max-width_450px {
padding: 14px 16px;