Mizah/Sharkey
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor(frontend): use css modules

Browse source
This commit is contained in:
syuilo 2023-05-14 10:21:56 +09:00
parent 89a3195dfd
commit 8c97c54cfa
40 changed files with 148 additions and 262 deletions
Download patch file Download diff file Expand all files Collapse all files

16
packages/frontend/src/pages/gallery/index.vue
View file

@ -7,7 +7,7 @@
<MkFoldableSection class="_margin">
<template #header><i class="ti ti-clock"></i>{{ i18n.ts.recentPosts }}</template>
<MkPagination v-slot="{items}" :pagination="recentPostsPagination" :disable-auto-load="true">
<div class="vfpdbgtk">
<div :class="$style.items">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
</div>
</MkPagination>
@ -15,7 +15,7 @@
<MkFoldableSection class="_margin">
<template #header><i class="ti ti-comet"></i>{{ i18n.ts.popularPosts }}</template>
<MkPagination v-slot="{items}" :pagination="popularPostsPagination" :disable-auto-load="true">
<div class="vfpdbgtk">
<div :class="$style.items">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
</div>
</MkPagination>
@ -23,7 +23,7 @@
</div>
<div v-else-if="tab === 'liked'">
<MkPagination v-slot="{items}" :pagination="likedPostsPagination">
<div class="vfpdbgtk">
<div :class="$style.items">
<MkGalleryPostPreview v-for="like in items" :key="like.id" :post="like.post" class="post"/>
</div>
</MkPagination>
@ -31,7 +31,7 @@
<div v-else-if="tab === 'my'">
<MkA to="/gallery/new" class="_link" style="margin: 16px;"><i class="ti ti-plus"></i> {{ i18n.ts.postToGallery }}</MkA>
<MkPagination v-slot="{items}" :pagination="myPostsPagination">
<div class="vfpdbgtk">
<div :class="$style.items">
<MkGalleryPostPreview v-for="post in items" :key="post.id" :post="post" class="post"/>
</div>
</MkPagination>
@ -119,15 +119,11 @@ definePageMetadata({
});
</script>
<style lang="scss" scoped>
.vfpdbgtk {
<style lang="scss" module>
.items {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
grid-gap: 12px;
margin: 0 var(--margin);
> .post {
}
}
</style>