Changing color on Tabs

Discussions about Forms Designer for SharePoint 2010.
Post Reply
Mr. Gustavsen
Posts: 4
Joined: Thu Jun 09, 2016

10 Jun 2016

Hi,

New to SPform, and also to CSS J.. Can I change the background color on tabs and outline on fields without changing theme?

Regards Christian

User avatar
Dmitry Kozlov
Site Admin
Posts: 1524
Joined: Thu Jun 07, 2012

12 Jun 2016

Sure, here is a sample. Insert the code below into CSS-editor of Forms Designer:

Code: Select all

.ui-widget-content {
	border-color: #C5C5C5;
}

.ui-widget-header {
	background-image: none;
	background-color: #E9E9E9;
	border-color: #DDDDDD;
}

.ui-widget-header .ui-state-default {
	background-image: none;
	background-color: #F6F6F6;
	border-color: #C5C5C5;
}

.ui-widget-header .ui-state-active {
	background-image: none;
	background-color: #007FFF;
	border-color: #003EFF;
	color: white !important;
}

.ui-widget-header .ui-state-active a {
	color: white !important;
}


.fd_control input[type="text"], 
.fd_control textarea, 
.fd_control select,
#fd_form .ms-dtinput input[type="text"], 
#fd_form .ms-dttimeinput input[type="text"],
#fd_form .ms-inputuserfield,
#fd_form .ms-rtefield, 
#fd_form .ms-rtefield2, 
#fd_form .ms-longfileinput, 
#fd_form .ms-fileinput,
#fd_form .ms-taxonomy-fieldeditor
{
    border-color: #C5C5C5;
}

Mr. Gustavsen
Posts: 4
Joined: Thu Jun 09, 2016

13 Jun 2016

Great, just what i needed.. Thanks.. :-)

wdeffner
Posts: 30
Joined: Thu Sep 22, 2016

25 Oct 2016

Hi, this works fine.

In addition I would like to change the background of the whole area that ist associated with the tab. Is tehre a way without using theme roller?

Thank you!

Wolfgang

YuriyMedvedev
Moderator
Posts: 33
Joined: Wed Sep 21, 2016

25 Oct 2016

Hi!

To change BGC of content in active tab you can use this in CSS:

Code: Select all

 .ui-tabs-panel[aria-hidden='false']{
     background: #9AF !important;
     border-color: #9AF !important;
}

wdeffner
Posts: 30
Joined: Thu Sep 22, 2016

25 Oct 2016

Hi,

I've tried to add this css-code to the css-code above (#1) and tried it without the code from above but the background color of the active tab never changed.

Any idea? I am using Sharepoint 2013, changing the tab-color worked fine.

Thank you!

Wolfgang

YuriyMedvedev
Moderator
Posts: 33
Joined: Wed Sep 21, 2016

26 Oct 2016

Try this one. please:

Code: Select all

.ui-tabs-panel[aria-hidden='false'], .ui-tabs-active{
	background: #9AF !important;
	border-color: #9AF !important; 

wdeffner
Posts: 30
Joined: Thu Sep 22, 2016

03 Nov 2016

Tried this, but without success. Nothing changed. Thank you, Wolfgang

User avatar
Dmitry Kozlov
Site Admin
Posts: 1524
Joined: Thu Jun 07, 2012

03 Nov 2016

Could you drop HTML-source of the form page to support@spform.com?

wdeffner
Posts: 30
Joined: Thu Sep 22, 2016

04 Nov 2016

Hi,

with some help I found this solution. It only works in combination.

Normal 0 21 false false false DE X-NONE X-NONE MicrosoftInternetExplorer4

.ui-tabs-panel {

background-color: #f1f1f1;

}

.ui-tabs-panel.ui-widget-content {

background-color: #f1f1f1;

}


Wolfgang

Post Reply
  • Information
  • Who is online

    Users browsing this forum: No registered users and 3 guests