Page 1 of 1

Form tabs view modification

Posted: Thu Jan 10, 2019 10:46 am
by Janusz
Is if possible to modify the form tabs like: hight, color fonts,..etc ?

https://drive.google.com/open?id=1z0El- ... mcs-H3eLc1

Re: Form tabs view modification

Posted: Thu Jan 10, 2019 2:18 pm
by kev1n
Font family, type size, colors, and other styles can be controlled with CSS for each kind of element.

https://www.w3schools.com/css/css_intro.asp

Then place the CSS under SETUP -> HEADER between the <style> </style> tags:

That's one of my styles. Other elements are styled too (not just the tabs). Customise it as you like:

Code: Select all

 .nuTabHolder {
     background-color: #f4f4f4;
     overflow: hidden;
     border-width: 1px 0px 0px 0px;
     background-color: #fafafa;
     background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
     background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
     background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
     background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
     background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
     background-repeat: repeat-x;
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
}
 .nuTabSelected {
     background-color: white;
}
.nuSection{
     font-family: "Segoe UI", Helvetica, "Helvetica Neue", Arial, sans-serif;
}
 body {
     padding: 0px;
     margin: 0px;
     font-family: "Segoe UI", Helvetica, "Helvetica Neue", Arial, sans-serif;
}
 .nuCalendarColor {
     background-color : #9ed7df;
}
 .nuSubformScrollDiv {
     background-color: #f9f9f9;
}
 .nuSubform {
     background-color: white;
}
 .nuEditBody {
     background-color: #fafafa;
}
 .nuBrowseBody {
     background-color: white;
}
 .nuBrowseTable {
     border-color: #ecf0f5;
}
 .nuSelectBrowse {
     background-color: #D6EAF8 !important;
     border-color: #D6EAF8 !important;
}
 .nuBrowseTitle {
     background-color: #eef2f3;
     height: 54px;
     border-bottom-color: #D6DBDF;
}
 .nuReadonly {
     background: #F0F0F0;
     border: 1px solid rgba(0, 0, 0, 0.05);
     cursor: not-allowed;
}
 .nuCalculator {
     background-color: #F0F0F0;
}
 .nuLookupCode {
     background-color: #dbedfd;
}
 .nuBreadcrumbHolder {
     padding: 20px 0px 5px 0px;
}
 .nuButton {
     border-radius: 4px;
     background-color: #2a8bcc;
}
 .nuActionButton {
     border-radius: 4px;
}
 .nuCellEven{
     background-color: #f5f9fa;
}
 .nuCellOdd{
     background-color: white;
}

Re: Form tabs view modification

Posted: Sat Jan 12, 2019 9:34 am
by Janusz
Thanks - works fine.