drawio-nextcloud icon indicating copy to clipboard operation
drawio-nextcloud copied to clipboard

Feature: avoid scroll bar and show full screen

Open arnowelzel opened this issue 2 months ago • 1 comments

I use CustomCSS to change some UI elements in my Nextcloud instance. One thing I also added, is using a fix to avoid a scrollbar in the Draw.io application frame and to use Draw.io fullscreen - similar to the Nextcloud text editor, PDF viewer or Nextcloud Office. The CSS rules for this are as following:

/* Draw.io: Fix view so it won't show an additional scroll bar */

.app-drawio > #app-content {
  overflow:hidden;
}

/* Draw.io: Fill screen without header */

#content.app-drawio {
  margin: 0;
  height: 100%;
  padding-block-end: 0 !important;
  z-index: 2147483647;
}

I am not sure, if this can be integrated to the app itself. But this would be an easy improvement without using a modal application frame.

For Nextcloud 31, the height needs to be different (this is not needed for Nextcloud 32, there you can just use 100%):

height: calc(var(--header-height) + 100%)

arnowelzel avatar Oct 04 '25 19:10 arnowelzel

At least with Nextcloud 32 the integration is displayed not very nice "out of the box" when using public share links - it does not even fill the content area of Nextcloud:

Image

Using my Custom CSS rules, this also works much better, since then Draw.io will also be full screen without any frame around it:

Image

arnowelzel avatar Oct 25 '25 10:10 arnowelzel