Transforms for CSS and Views in MVC

Question

I have an MVC application which I am deploying out to a staging server using Team City. I have created a Web.Staging.config transform to handle the different database connection, certificates and service calls.

On this staging server I have had a request to have the title of the Index view to read "TEST SYSTEM" and to have a different colour scheme to signify, at a glance that the user is on the test system.

So far I have handled this by changing the view on the file system in notepad, and swapping the bootstrap.css file to one with a different theme however every time I do a new commit/deploy these changes are wiped and its becoming tiresome.

Is there anyway to handle CSS/view changes per server by using a similar transform system as employed to handle the web.config

Answer 1

There's not really an easy way to transform CSS files like that, but what you could do is have your master CSS file link in your config file, so your view would be something like:

<link href='@ConfigurationManager.AppSettings["MainCSS"]'>

Then your web.Debug (and other transformations) could point to the correct path:

<add key="MainCSS" value="/Content/Site.css" />

And your web.Staging config could point to another:

<add key="MainCSS" value="/Content/Staging/Site.css" />

You can also apply the above logic for your Index view:

public ActionResult Index()
{
    string viewName = ConfigurationManager.AppSettings["MainView"];
    return View(viewName);
}

Then have in your web.Debug (and others):

<add key="MainView" value="Index" />

And in your web.Staging:

<add key="MainView" value="IndexStaging" />