Qlik Themes - CSS Styling of Object Title (Straight & Pivot table renders differently)

jmcy2408 — Fri, 25 Mar 2022 18:05:09 GMT

Hi,

We have custom themes on our Qlik Saas tenant built by myself. I'm not wizz at CSS but know some basics and making use of the community has helped me build a theme for our company. When i apply it, the rendering of the Objects Title for a Straight or Pivot table is indented at the left hand side, see below. All other objects the title width and background colour fits the full length of the object and i dont understand why nor can i correct it. Is it the build of those objects within Qlik itself that prevents this or something in my code?

Sample of the CSS

:root { --colour1: #1976D2; --colour2: #F4792C; --image: url(images/logo.png); --white: #FFFFFF; --black: #000000; --grey: #B3B4B2; } /* Sheet*/ .qvt-sheet {background: var(--white) !important;} /* Document border*/ .qv-panel-stage .flex-row {background-color: var(--colour2);} .qv-panel-sheet {border-radius: 3px; margin: 5px;} /*qv-object*/ .qv-object .qv-object-title{background-color: var(--colour1); margin-top: 5px} .qv-object .qv-object-title-text{margin-left:auto; margin-right:auto; color: var(--white);} /* Sheet Titles */ .qv-panel-sheet .sheet-title-container {background: linear-gradient(to right, var(--colour1), var(--white));} .qv-panel-sheet .sheet-title-text {background-image: var(--image); background-repeat: no-repeat; background-size: contain; background-position: right;}

Any ideas?

Thanks

John

topic Qlik Themes - CSS Styling of Object Title (Straight & Pivot table renders differently) in App Development

Qlik Themes - CSS Styling of Object Title (Straight & Pivot table renders differently)