tyler.durden/dashy
1
0
Fork 0
mirror of https://github.com/Lissy93/dashy.git synced 2025-07-24 06:05:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

💄 Collapsible sections fill available space

Browse Source
This commit is contained in:
Alicia Sykes 2022-01-22 20:46:03 +00:00
parent 25bc577fb1
commit c3b6d2b0e0
2 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/LinkItems/Collapsable.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div <div
:class="`collapsable ${rowColSpanClass} ${collapseClass}`" :class="`collapsable ${rowColSpanClass} ${collapseClass} ${!cutToHeight ? 'full-height' : ''}`"
:style="`${color ? 'background: '+color : ''}; ${sanitizeCustomStyles(customStyles)};`" :style="`${color ? 'background: '+color : ''}; ${sanitizeCustomStyles(customStyles)};`"
> >
<input <input
@ -43,6 +43,7 @@ export default {
rows: Number, // Set section vertical row span / height rows: Number, // Set section vertical row span / height
color: String, // Optional color override color: String, // Optional color override
customStyles: String, // Optional custom stylings customStyles: String, // Optional custom stylings
cutToHeight: Boolean, // To set section height with content height
}, },
components: { components: {
Icon, Icon,
@ -252,5 +253,16 @@ export default {
right: 0.5rem; right: 0.5rem;
top: 0.5rem; top: 0.5rem;
} }
// Makes sections fill available space
&.is-open.full-height {
height: -webkit-fill-available;
display: flex;
flex-direction: column;
align-items: normal;
.collapsible-content {
height: -webkit-fill-available;
width: 100%;
}
}
} }
</style> </style>

1
src/components/LinkItems/Section.vue
View File

@ -8,6 +8,7 @@
:rows="displayData.rows" :rows="displayData.rows"
:color="displayData.color" :color="displayData.color"
:customStyles="displayData.customStyles" :customStyles="displayData.customStyles"
:cutToHeight="displayData.cutToHeight"
@openEditSection="openEditSection" @openEditSection="openEditSection"
@openContextMenu="openContextMenu" @openContextMenu="openContextMenu"
> >