oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

enhance(client): use container queries if available to improve perf

Browse source
This commit is contained in:
syuilo 2022-12-26 08:40:13 +09:00
parent af649b0480
commit c95da27019
20 changed files with 420 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

68
packages/client/src/components/MkNoteDetailed.vue
View file

@ -444,6 +444,8 @@ if (appearNote.replyId) {
> .main {
> .body {
container-type: inline-size;
> .cw {
cursor: default;
display: block;
@ -601,6 +603,72 @@ if (appearNote.replyId) {
}
}
@container (max-width: 500px) {
.lxwezrsl {
font-size: 0.9em;
}
}
@container (max-width: 450px) {
.lxwezrsl {
> .renote {
padding: 8px 16px 0 16px;
}
> .article {
padding: 16px;
> .header {
> .avatar {
width: 50px;
height: 50px;
}
}
}
}
}
@container (max-width: 350px) {
.lxwezrsl {
> .article {
> .main {
> .footer {
> .button {
&:not(:last-child) {
margin-right: 18px;
}
}
}
}
}
}
}
@container (max-width: 300px) {
.lxwezrsl {
font-size: 0.825em;
> .article {
> .header {
> .avatar {
width: 50px;
height: 50px;
}
}
> .main {
> .footer {
> .button {
&:not(:last-child) {
margin-right: 12px;
}
}
}
}
}
}
}
.muted {
padding: 8px;
text-align: center;