HomeReports

Help with Reporting

Using CSS in Flow Run Inline Field on Reports Messages in this topic - RSS add reply

Guest


2/5/2019
Guest
Hi,

How can I use CSS on reports that have Flow Run Inline Field? Basically, I am trying to change the text of that field to a button. Is it possible?

Thanks
0 mark as "accepted answer" link reply with quote
kenan@decisions.com
kenan@decisions.com
Administrator
Posts: 251


2/5/2019
kenan@decisions.com
kenan@decisions.com
Administrator
Posts: 251
Hi,

Yes, you can change Flow Run Inline Field to a button by applying CSS. Go to System > Designers > CSS. Select folder view and click on Add at the bottom of the page. Complete form and upload your CSS file. You can find an example CSS file below.

Go to your page designer that has report on it and find your CSS document under style sheets in the Properties panel. Once you select style it will change your report inline text into a button. Please check screenshots for more information.


Example CSS Code


/* blue button style in-report flow links */
td[role="gridcell"] .run-flow-inline-field {
text-decoration: none !important;
color: white !important;
background: #0081C2;
padding: 4px 8px;
border-radius: 3px;
border: solid 1px #0081C2;
}

td[role="gridcell"] .run-flow-inline-field:hover {
color: #0081C2 !important;
background: white;
}









edited by Kenan on 2/5/2019

0 mark as "accepted answer" link reply with quote
tim@decisions.com
tim@decisions.com
Administrator
Posts: 51


14 days ago
tim@decisions.com
tim@decisions.com
Administrator
Posts: 51
Please note that in Decisions Version 7.x the core CSS needed has changed.

As such:

td[role="gridcell"] .run-flow-inline-field:hover {
color: #0081C2 !important;
background: white;
}

Would need to be amended as the parent elements are now Div > Span > A.

The structure of the report can be identified using Control + Shift + I. Then pressing Control + Shift + C. And selecting the element you wish to inspect.

Example CSS used in 7.x targeting any gridcell class that has a run-flow-inline-field class.

.gridcell .run-flow-inline-field{
color: #0081C2 !important;
background: white;
}
0 mark as "accepted answer" link reply with quote


(Ctrl+Enter)




Powered by Jitbit Forum 8.3.8.0 © 2006-2013 Jitbit Software