Skip to content

Commit

Permalink
fix(find-project): adjust tileSize calculation
Browse files Browse the repository at this point in the history
This fix is to ensure that the calculated tileSize times the columns never exceeds the
available container width, thus avoiding unintended wrapping of the tiles to a new line.
  • Loading branch information
ofr1tz committed Jul 4, 2024
1 parent 7f24767 commit d3ed003
Showing 1 changed file with 9 additions and 2 deletions.
11 changes: 9 additions & 2 deletions src/components/FindProject.vue
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,10 @@ export default defineComponent({
return this.selectedTaskIds.length > 0
},
tileSize() {
const tileSize = Math.min(this.maxTileSize, this.containerWidth / this.columnsPerPage)
const tileSize = Math.min(
this.maxTileSize,
Math.floor(this.containerWidth / this.columnsPerPage) - 1,
)
return tileSize
},
totalColumns() {
Expand Down Expand Up @@ -238,7 +241,11 @@ export default defineComponent({
onResize() {
const container = this.$refs.container.$el as HTMLElement
this.containerWidth = container.clientWidth
const maxTileHeight = this.clamp((window.innerHeight - 300) / this.rowsPerPage, 128, 512)
const maxTileHeight = this.clamp(
Math.floor(window.innerHeight - 300) / this.rowsPerPage,
128,
512,
)
this.maxTileSize = maxTileHeight
this.updatePage()
},
Expand Down

0 comments on commit d3ed003

Please sign in to comment.