I want to define a few colours in one location and use functions to generate tints of these colors and render the generated colors in the CSS files.
I am moving from working on Ruby on Rails to ASP.NET. On my previous RoR project I had a 5-color color scheme set as Ruby variables of RGB arrays. I then used functions in the .css.erb file to generate a range of tints and shades of the color scheme colors throughout the generated .css stylesheet.
What's the cleanest way to do this in ASP.NET MVC 5?
You can easily render CSS with C# code in ASP.Net (either ASP.Net MVC or WebForms or raw ASP.Net) as it is just a file with particular content type.
One option is just render CSS inline on the page if you need just couple overrides.
For ASP.Net MVC to create separate file would be generate text in controller and than return it as Content - Display contents of Text File in MVC3 Razor. You can also make view to render no HTML tags and instead just CSS to be able to use all Razor constructs. Don't forget to add route and you may need to add <modules runAllManagedModulesForAllRequests="true" /> Meaning if using ".css" extension for files.
Note: depending on what you actually want to do using SASS/LESS to use "variables" in CSS may be better. It will not let you to get "colors for current user" scenarios, but allow to statically construct consistent CSS (like "button color must be the same and easy to change once across all of my CSS files").
Related
I have downloaded a Bootstrap template(Complete GUI) from the internet and I want to add functionality to the same template using MVC. So how should I add that template to my MVC project.
I have seen many tutorials but they only tell you how to add a theme not an entire template.
I am using the cardio theme: http://tympanus.net/Freebies/Cardio/
The default MVC project includes a _Layout.cshtml file, which contains the main HTML for your template. Replace that with the HTML in the template you downloaded, making sure to copy the bits of Razor from the old code.
Then you'll need to replace the CSS files with the ones from the downloaded template and it should all work.
This all depends on how well written the template is, but I've done this many times with no problem.
I want to be able to "A" dynamically generate a CSS file - or "B" be able to read a css file and change certain attributes of the CSS classes in C#.
Reason being, I have site that is going to be configured to a user's company, utilizing their colors, logos, text sizes, etc...
The first thought was to dynamically create a CSS file - but I can't find anywhere on the net where anyone shows examples or whatnot. The second thought was to read the css file and change the CSS classes based on a user's login.
Is there a simple way to do either?
Generally this is handled in a few different ways. You could include an additional or different CSS file based on properties of the request (e.g. current site). You could also output HTML that includes different classes based on request properties. A common technique is to add classes to root elements like or when certain conditions are met, and then write CSS to make use of those classes.
For example, if you are using the same code base for multiple sites, on site A you could have <html class="site-a"> and on site B you'd have <html class="site-b">. Then you can override styles based on the site easily.
/* Default to white background */
body {
background: white;
}
/* Use a black background for Site A */
.site-a body {
background: black;
}
/* Use a blue background for Site B */
.site-b body {
background: blue;
}
This is of course a very simple example. In the case of entire sites, separate CSS files makes more architectural sense, as you'd store them along with other site specific files.
I recommend studying more around how applications typically organize their front end presentation layers and files. For example, MVC is a way to separate out parts of an application. Within the context of presentation, you have concepts like templates and themes to encapsulate parts of the UI and turn it into reusable parts.
EDIT: Lost in my answer is that I didn't talk about actually dynamically generating CSS files. This is because dynamically generating CSS files is uncommon and generally not the right solution to a problem. As commentors have pointed out, there are CSS preprocessors like LESS and SASS which are generally targeted at solving some of CSSs internal issues (mostly redundancy). Preprocessors fix problems with CSS and are extremely useful, but aren't used in the way that it sounds like you've asked about. Separate CSS files or CSS files that key off of different classes and IDs are the solution, not dynamically creating a CSS file or block with different property values.
I am working on small project Fast Food Ads in Mvc3 using c# .I want to create page where user can set the layout of page like header , footer and menu bar etc. manually so I think this page its HTML and Css file should be create dynamically. page name and css file will be unique for every user how can i do this?
I don't want to use any CMS...
In principal you can use the Razor engine in MVC3 to process any of your files. You can already do that for your HTML files.
If you want to use Razor to dynamically process (or even create, on the fly) your CSS, have a look at RazorJs. RazorJs allows Razor to pre-process Javascript files before they are included in a view. I have not looked at it's source code, but I imagine it should be straightforward to adapt it to pre-process CSS as well.
I realize this is probably a fundamental thing I should know but I am self-teaching myself C# and asp.net so I am a little lost at this point.
I right now have 2 pages. One is an .aspx (with aspx.cs file included) that is blank and html is generated for it from a Page_Load function in the cs file. The HTML is very simple and it is just an image and some text.
The second file is a shtml file which has lots of things, serverside includes, editable and noneditable areas. I want to put my webapp into this file. My asp.net app uses Response.Write to just write out the html. This does not flow well with this page as all that does is write it at the top of the page which is because it is ran first and generates it at the top.
How can I make it to where I can generate HTML code inside the page, like within a specific DIV so it does not mess up the page. Where would a starting point be in learning how to do that.
I should note that I do not need any interaction from the user. All of this should generate right away.
I think you need to read up on some basic ASP.Net documentation and tutorials. Response.Write is not the correct approach - you need to understand how the ASP.Net page lifecycle works and how WebControls are used to render the html.
ASP.Net tries to abstract away having to create your html manually for the most part.
So if i have understood the questions correctly.
You already have an existing page/application (the shtml file) that you want to extend with some new ASP.NET components by including output from the ASP.NET page in the existing page?
This is as not something that is out of the box "supported" by ASP.NET and you "won't" be able to execute the aspx page using SSI. But you can do the opposite, an ASP.NET page does support SSI. So if you are not using any other scripts in the shtml file this might be a solution.
Otherwise the only common solutions would be either to use an AJAX framework and let it call the ASP.NET from within the existing pages or to use an iframe solution. In both cases the client will be resposible for making the calls to the ASP.NET pages and merging the results.
And then you have a issue with controlling the output from the ASP.NET page?
The Polymorphic Podcast has a good article on Controlling HTML in ASP.NET WebForms .
You can add a Literal control to the page inside the div:
<div>
<asp:Literal ID="litMarkup" runat=server />
</div>
then in your code-behind:
litMarkup.Text = "<strong>Your markup</strong>";
I don't know how well this would work for you, but could you try using an iframe to house the ASP.NET page? This should keep it in the specified region and not overwriting your shtml file. It may be something to think about.
If it is necessary that you generate your HTML output from C# code, and you would use this in more than one place, I think you may be thinking of something like what are called ASP.NET Custom Controls (not to be confused with "User Controls"-- though you probably could put together a solution with those as well, using a Literal control as another person suggested). The MSDN documentation would be a good starting point. In general, though, the writing-out-HTML-yourself-from-code model (like you would with, say, CGI applications), is not the usual ASP.NET model of development, as it largely defeats the point of using ASP.NET at all. You'd mostly want to do this sort of thing if you are writing your own web control, though this might be exactly what you are doing (hard to tell from the description).
What is the best way to transform large bunches of very similar web pages into a newer css-based layout programatically?
I am changing all the contents of an old website into a new css-based layout. Many of the pages are very similar, and I want to be able to automate the process.
What I am currently thinking of doing is to read the pages in using HtmlAgilityPack, and make a method for each group of similar pages that will create the output text.
What do you think is the best way to do this? The pages mostly differ by things like which .jpg file is used for the image, or how many groups of heading-image-text there are on that particular page
EDIT: I cannot use any other file type than .html, as that is all I am authorized to do. Any suggestions?
EDIT2: Ideally, I would also be able to make this be generic enough that I could use it for many different groups of html files by just switching around a few moving parts.
Sounds like you should be re-using code. If you are using strictly HTML, I would consider doing PHP or ASP based webpages instead. That way, you can create Header/Content/Footer/Nav sections, and re-use the same code across all your webpages.
This would make it a lot more sustainable, as you would only need to edit one file in the future.
What about using Server Side Includes (SSI) <#!--#INCLUDE -->
This was you can create different parts of your webpage in different files and just "include" them in any other page you want.
header.html
body.html
footer.html
<html>
<!--#INCLUDE file="header.html" -->
<!--#INCLUDE file="body.html" -->
<!--#INCLUDE file="footer.html" -->
</html>
More info here