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

fix post teaser width in mobile view

Browse Source
This commit is contained in:
ogerly 2023-02-09 16:00:05 +01:00
parent 77af12adc2
commit 55106dbe69
3 changed files with 18 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
webapp/components/HeaderMenu/HeaderMenu.vue
View File

@ -105,7 +105,8 @@
<div v-else class="mobil-header-box">
<!-- logo, hamburger-->
<ds-flex style="align-items: center">
<ds-flex-item :width="{ base: LOGOS.LOGO_HEADER_WIDTH }" style="margin-right: 20px">
<ds-flex-item :width="{ base: LOGOS.LOGO_HEADER_WIDTH }" style="margin-right: 20px" >
<div @click="toggleMobileMenu ? toggleMobileMenuView() : ''">
<a
v-if="LOGOS.LOGO_HEADER_CLICK.externalLink"
:href="LOGOS.LOGO_HEADER_CLICK.externalLink.url"
@ -120,6 +121,7 @@
>
<logo logoType="header" />
</nuxt-link>
</div>
</ds-flex-item>
<!-- mobile hamburger menu -->

2
webapp/components/MasonryGrid/MasonryGrid.vue
View File

@ -29,7 +29,7 @@ export default {
<style lang="scss">
/* dirty fix to override broken styleguide inline-styles */
.ds-grid {
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)) !important;
gap: 16px !important;
grid-auto-rows: 20px;
}

15
webapp/pages/index.vue
View File

@ -297,21 +297,6 @@ export default {
</script>
<style lang="scss">
.masonry-grid {
display: grid;
grid-gap: 10px;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-auto-rows: 20px;
}
.grid-item {
grid-row-end: span 2;
&--full-width {
grid-column: 1 / -1;
}
}
.hide-filter {
display: none;
}