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

Change avatar size var to camelCase, more tweaks

This commit is contained in:
Freeplay 2023-01-07 15:53:51 -05:00
parent 9b57916aee
commit 1760424ec1
6 changed files with 15 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/client/src/components/MkMediaList.vue
View File

@ -143,6 +143,8 @@ const previewable = (file: misskey.entities.DriveFile): boolean => {
position: relative; position: relative;
width: 100%; width: 100%;
margin-top: 4px; margin-top: 4px;
border-radius: var(--radius);
overflow: hidden;
&:before { &:before {
content: ''; content: '';

13
packages/client/src/components/MkNote.vue
View File

@ -373,7 +373,7 @@ function readPromo() {
line-height: 28px; line-height: 28px;
} }
> .line { > .line {
width: var(--avatar-size); width: var(--avatarSize);
display: flex; display: flex;
margin-right: 14px; margin-right: 14px;
margin-top: 0; margin-top: 0;
@ -448,7 +448,7 @@ function readPromo() {
} }
> .article { > .article {
padding: 28px 32px 10px; padding: 28px 32px 16px;
cursor: pointer; cursor: pointer;
@media (pointer: coarse) { @media (pointer: coarse) {
@ -461,8 +461,8 @@ function readPromo() {
flex-shrink: 0; flex-shrink: 0;
display: block; display: block;
margin: 0 14px 0 0; margin: 0 14px 0 0;
width: var(--avatar-size); width: var(--avatarSize);
height: var(--avatar-size); height: var(--avatarSize);
position: relative; position: relative;
top: 0; top: 0;
left: 0; left: 0;
@ -627,11 +627,10 @@ function readPromo() {
&.max-width_500px { &.max-width_500px {
font-size: 0.9em; font-size: 0.9em;
// --avatar-size: 50px;
} }
&.max-width_450px { &.max-width_450px {
--avatar-size: 46px; --avatarSize: 46px;
> .note-context { > .note-context {
padding-inline: 16px; padding-inline: 16px;
margin-top: 0; margin-top: 0;
@ -664,7 +663,7 @@ function readPromo() {
} }
&.max-width_300px { &.max-width_300px {
--avatar-size: 40px; --avatarSize: 40px;
> .article { > .article {
> .main { > .main {

4
packages/client/src/components/MkNoteDetailed.vue
View File

@ -414,8 +414,8 @@ if (appearNote.replyId) {
> .avatar { > .avatar {
display: block; display: block;
flex-shrink: 0; flex-shrink: 0;
width: var(--avatar-size); width: var(--avatarSize);
height: var(--avatar-size); height: var(--avatarSize);
} }
> .body { > .body {

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

@ -148,10 +148,10 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
margin-right: 14px; margin-right: 14px;
width: var(--avatar-size); width: var(--avatarSize);
> .avatar { > .avatar {
width: var(--avatar-size); width: var(--avatarSize);
height: var(--avatar-size); height: var(--avatarSize);
margin: 0; margin: 0;
} }
> .line { > .line {

2
packages/client/src/components/MkSubNoteContent.vue
View File

@ -2,7 +2,7 @@
<div class="wrmlmaau" :class="{ collapsed, isLong }"> <div class="wrmlmaau" :class="{ collapsed, isLong }">
<div class="body"> <div class="body">
<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span> <span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
<!-- <MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ph-arrow-bend-up-left-bold ph-lg"></i></MkA> --> <MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ph-arrow-bend-up-left-bold ph-lg"></i></MkA>
<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/> <Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA> <MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
</div> </div>

2
packages/client/src/style.scss
View File

@ -4,7 +4,7 @@
--radius: 12px; --radius: 12px;
--marginFull: 16px; --marginFull: 16px;
--marginHalf: 10px; --marginHalf: 10px;
--avatar-size: 48px; --avatarSize: 48px;
--margin: var(--marginFull); --margin: var(--marginFull);