Cant scroll horizontal on resource view

[kstan79]

as below example i define multiple resources, it shrink down the column so tiny and cause the event cant render well.

I'm tried to change css to set min-width.

.ec-resource{
    @apply !min-w-32
}

so far column width expand but cause issue like it cant render calendar well. I tried multiple way and no luck, result either:

1. some resource draw outside calendar boundary (teacher8 & unknown outside calendar)
2. or i freeze body width 100vw and no overflow-x scrollable will cause below

is there anyway can render calendar nicely when render near 40 resources?

[kstan79]

i manage to solve by manually set 'ec' width at runtime:

const colwidth = 8 //rem
const calResources = getResources()
const totalwidth = calResources.length * colwidth + 3 //+3rem require for times column
      if(document.getElementById('ec')!== undefined){
        document.getElementById('ec').style.width = totalwidth+'rem'
      }

however, I not think it is a good and permanent solution (maybe different browser will have different issue), so far any more "official" way?

[vkurko]

Please take a look at this comment. The official solution to this issue will be Resource Timeline view, which is currently in development.