ocelot-Social-Community/Ocelot-Social
1
0
Fork 0
mirror of https://github.com/Ocelot-Social-Community/Ocelot-Social.git synced 2025-12-13 07:46:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #6135 from Ocelot-Social-Community/6009-grouplist-add-second-column

Browse Source 
feat(webapp): show 2 GroupItem per row in GroupList
This commit is contained in:
Hannes Heine 2023-03-15 13:35:01 +01:00 committed by GitHub
commit bc38436b3b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
webapp/components/Group/GroupList.vue
View File

@ -1,9 +1,14 @@
<template> <template>
<div class="group-list"> <ds-flex class="group-list">
<ds-space margin-bottom="small" v-for="group in groups" :key="group.id"> <ds-flex-item
v-for="group in groups"
:key="group.id"
:width="{ base: '98%', sm: '98%', md: '48%' }"
class="group-item"
>
<group-teaser :group="group" /> <group-teaser :group="group" />
</ds-space> </ds-flex-item>
</div> </ds-flex>
</template> </template>
<script> <script>
@ -19,3 +24,8 @@ export default {
}, },
} }
</script> </script>
<style lang="scss" scoped>
.group-item {
margin: 0 1% 2% 1%;
}
</style>

4
webapp/pages/groups.vue
View File

@ -4,7 +4,7 @@
<tab-navigation :tabs="tabOptions" :activeTab="tabActive" @switch-tab="handleTab" /> <tab-navigation :tabs="tabOptions" :activeTab="tabActive" @switch-tab="handleTab" />
</ds-space> </ds-space>
<ds-space margin="large" /> <ds-space margin="large" />
<ds-container> <ds-space>
<!-- create group --> <!-- create group -->
<ds-space centered> <ds-space centered>
<nuxt-link :to="{ name: 'group-create' }"> <nuxt-link :to="{ name: 'group-create' }">
@ -49,7 +49,7 @@
@next="nextResults" @next="nextResults"
/> />
</ds-space> </ds-space>
</ds-container> </ds-space>
</div> </div>
</template> </template>

2
webapp/pages/index.vue
View File

@ -346,7 +346,7 @@ export default {
position: fixed; position: fixed;
z-index: 6; z-index: 6;
margin-top: -35px; margin-top: -35px;
padding: 20px 10px 5px 10px; padding: 20px 10px 20px 10px;
background-color: #f5f4f6; background-color: #f5f4f6;
} }
@media screen and (max-width: 656px) { @media screen and (max-width: 656px) {