sim1222/misskey
1
0
Fork 0
mirror of https://github.com/sim1222/misskey.git synced 2025-08-03 23:16:28 +09:00
Code Issues Projects Releases Wiki Activity

refactor(client): use css modules

Browse Source
This commit is contained in:
syuilo
2023-01-15 08:30:29 +09:00
parent c1b6378951
commit d23aa94b41
18 changed files with 182 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/frontend/src/pages/user/index.activity.vue
View File

@ -1,8 +1,9 @@
<template>
<MkContainer>
<template #header><i class="ti ti-chart-line" style="margin-right: 0.5em;"></i>{{ $ts.activity }}</template>
<template #func>
<button class="_button" @click="showMenu">
<template #icon><i class="ti ti-chart-line"></i></template>
<template #header>{{ $ts.activity }}</template>
<template #func="{ buttonStyleClass }">
<button class="_button" :class="buttonStyleClass" @click="showMenu">
<i class="ti ti-dots"></i>
</button>
</template>

49
packages/frontend/src/pages/user/index.photos.vue
View File

@ -1,19 +1,20 @@
<template>
<MkContainer :max-height="300" :foldable="true">
<template #header><i class="ti ti-photo" style="margin-right: 0.5em;"></i>{{ $ts.images }}</template>
<div class="ujigsodd">
<template #icon><i class="ti ti-photo"></i></template>
<template #header>{{ $ts.images }}</template>
<div :class="$style.root">
<MkLoading v-if="fetching"/>
<div v-if="!fetching && images.length > 0" class="stream">
<div v-if="!fetching && images.length > 0" :class="$style.stream">
<MkA
v-for="image in images"
:key="image.note.id + image.file.id"
class="img"
:class="$style.img"
:to="notePage(image.note)"
>
<ImgWithBlurhash :hash="image.file.blurhash" :src="thumbnail(image.file)" :title="image.file.name"/>
</MkA>
</div>
<p v-if="!fetching && images.length == 0" class="empty">{{ $ts.nothing }}</p>
<p v-if="!fetching && images.length == 0" :class="$style.empty">{{ $ts.nothing }}</p>
</div>
</MkContainer>
</template>
@ -73,30 +74,26 @@ onMounted(() => {
});
</script>
<style lang="scss" scoped>
.ujigsodd {
<style lang="scss" module>
.root {
padding: 8px;
}
> .stream {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
grid-gap: 6px;
.stream {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
grid-gap: 6px;
}
> .img {
height: 128px;
border-radius: 6px;
overflow: clip;
}
}
.img {
height: 128px;
border-radius: 6px;
overflow: clip;
}
> .empty {
margin: 0;
padding: 16px;
text-align: center;
> i {
margin-right: 4px;
}
}
.empty {
margin: 0;
padding: 16px;
text-align: center;
}
</style>