Search code examples
cssoracle-apex

Oracle Apex: size of Right side column


I'm using APEX 23.1 with Redwood Light Theme. I need to increase the width of the "Actions Column" (Right Side Column) but in the theme roller there isn't option like other themes have. Is there a way to increase this? Theme Roller from other themes, doesn't have this option in Redwood

I tried some Inline CSS but it isn't working as it should.

example:

.t-Body-actions {
   width: 540px
}

:not(.u-RTL) .t-PageBody.js-rightCollapsed .t-Body-actions {
   transform: translate3d(540px, 0, 0)!important
}

:not(.u-RTL) ​.t-PageBody.js-rightExpanded.t-PageBody--hideLeft .t-Body-main {
    margin-right: 540px!important
}

:not(.u-RTL) .t-PageBody.js-rightExpanded.t-PageBody--hideLeft .t-Body-title {
   right: 540px;
}

Solution

  • I'm assuming you are talking about the page template "Right Side Column". Inspect the actions column with browser dev tools and you'll see that the "width" attribute is set by a css variable "--ut-body-actions-width". css variables are a common pattern in APEX since version 22.1.

    enter image description here

    This information can then be used to customize the page, by setting some css in the "Page attributes > CSS > Inline".

    For example:

    :root {   
      --ut-body-actions-width: 540px;
    }