I'm trying to create a custom layout template. I'm following these guide lines:
http://www-10.lotus.com/ldd/portalwiki.nsf/dx/Page_Builder-Creating_Custom_Page_Layouts_WP7_
When I upload, the layout.html is found and used by the server. The problem is that the new classes I've added to the layout.css does not come in to effect. When I inspect the page source, the divs have my classes, but the classes are not added to any css-file. I've searched through them all (from view source of the rendered page).
(I have restarted the server, emptied the temp dirs on server, reloaded in browser with empty cache)
Any ideas?!
Just adding a class name to an element does not in any way create that class in any css entry. You will have to manually add that class to the css along with any rules for styling you are wishing to have in place.
Related
I was trying to test some changes to my NavMenu component by creating a new one (With a different name) and adding the changes there but I soon noticed that my CSS wasn't loading properly anymore.
From the console I noticed that the new file wasn't referencing {Assembly}.styles.css
The same issue persists when I simply rename the NavMenu component.
A search on the whole solution for NavMenu didn't yield any results outside of the MainLayout which is where it is being used.
The NavMenu CSS is Nested under NavMenu.razor and has the same name NavMenu.razor.css, at least in Dotnet 6.0 and I think that CSS file nesting is valid from Dotnet 5.0. Which is called CSS isolation.
Styles in this isolated file are applied only to the file it is nested. So by creating a new razor page, you need to attach a new CSS file if you want to use styles from an isolated CSS.
(Doc from Microsoft aspnet about css-isolation)
https://learn.microsoft.com/en-us/aspnet/core/blazor/components/css-isolation?view=aspnetcore-6.0#enable-css-isolation
The way it works now, Meteor automatically finds CSS files in the client directory and renders it without having to call it in the HTML's header tag.
However, how would I be able (if it's even remotely possible) to associate one particular CSS file or files to just one HTML page?
I recently purchased a theme for one section of my website that I didn't want to bother creating myself, since I hate doing UI for my main page myself. But when I place the CSS files of this template with the ones I have for the other template I use, one template's CSS files overwrite the other, so everything ends up looking like a huge jumbled mess.
I hope I'm being clear with my question. Is there a way to get around this?
So, if there's not a way to keep the file from being included in meteor, you could add a class to the body tag of the page you want the styles to appear in, then prepend that class to the beginning of the styles in your new stylesheet, ex: .yourBodyClass#stylehseetID, .yourBodyClass.stylesheetClass
if you put your stylesheet in the public folder, it will be treated as a static file, but then it should go in the header which is rendered by Meteor, and since Meteor is a single page app (SPA), it only has one header for the whole application.
If you need specific styles for a page, you can use some prefix for your css classes. That's probably the easiest.
I am new to Joomla and I am trying to learn things as I go forward. In Firefox when I do inspect element on my site, I can find the CSS tag that I need to change in order to get the result I want, but I cant locate the file that I have to make the change in.
For instance right now my menu is shifted to the left and I did inspect element and I found
#topmenu_holder {
float: left;
}
if I change that float to right, then my issue is fixed.
I Just don't know how to find that file to make that change.
The css you're referring to is typically found in the Template that you are using, but which specific file depends on the template you're using - they're all located within the \templates\ folder of your Joomla site.
Additionally, if you look around in the Firefox Inspection area, you'll probably see reference to the file it's contained in as shown in the attached image.
Have you found the place where you can edit your file in joomla - extensions - template manager - then edit template from there. Dont look at the style option but the other one (template) you can edit all files there including css files.
There should be an option the overide the file. You should look to do this as joomla can overwrite existing file when updating. For now though this should get you started.
Can't style my menu css,i tried to change in master-ccda(my site www.blobus.on.kg)It helps for 5 minutes than changed back.Please help me to find place where i can change it.
You use a rocketheme/gantry template. Your website has compression/caching enabled for the css. This is enabled either by the template settings or another compression/caching system plugin. Therefore what you get as a final css file, is a dynamically generated compressed css file. Any edits you are doing on this file are getting lost, as soon as the system will generate a new final master.css file.
You need to disable these functions while you are building your website. Doing so will stop the compression of all the css files into one and you will see what rules and from which files your menu and other elements/sections of your website inherit their styles.
In addition keep in mind that it is best to avoid making changes on the core files of your template/extensions.
Gantry templates allow you to create a custom css file where you can put your own css overrides.
The custom css file need to be place inside the css folder of your template and usually needs to have a name of this convention: rt_templatename-custom.css.
as you all know, ASP.NET includes each CSS stylesheet in the App_Themes's Theme folder inside the page. No discussion.
But now, I'm facing a little problem having lots of CSS files in a theme and willing to use a static content domain. I would like to load all the static content of my website from the static domain (not only CSS, but also icons, images, etc.), but let's now pay attention only to CSS.
My question is
Is it possible to override the behaviour of Page class, and for each CSS file found in Theme's folder, rewrite the <link> tag with the correct URL of the static content domain? I have nothing preventing me to deploy files into http://static.domain.com/App_Themes/Theme path, so at least adding a prefix to the tag is fine.
Thank you in advance.
Yes, you can. You can have a custom base page class write the CSS files it finds in the folder. Though, I'm not sure you can override the default behavior of the themes feature, so the easiest way is to move the CSS files outside of the default themes. Then, you can use the System.IO objects to read the directory, access the file, and generate the link.
HTH.
An alternate method is to write an http module. Have the module inspect the html being sent back to the client.
If it detects a style sheet reference, change the location that the style sheet is pulling from.
This works for the other items as well, such as images etc.