Skip to main content
Announcements
Qlik Connect 2024! Seize endless possibilities! LEARN MORE
cancel
Showing results for 
Search instead for 
Did you mean: 
jmcy2408
Contributor III
Contributor III

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

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? 

Qlik Theme - Table Titles.png

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

Labels (3)
0 Replies