SOLVED CSS Override to Anacron basic.css
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
Feeling Xtra stupid this morning. I'm trying to change the default panel color in an Anacron RokSprocket grid layout.Server Details (Linux/Windows, Hosting service, etc) Linux magma 3.13.0-36-generic #63-Ubuntu SMP PHP version 5.5.9-1ubuntu4.4 Platform (name and version) Joomla! 3.3.6 Stable Template/Extension (name and version) Anacron Link to the Issue Not available
The code in basic.css is: .sprocket-grids-b-item.panel-color {background: #151515;}
I want to change it to {background: #41a4dd;}
The viewed source code is:
<div class="sprocket-grids-b" data-grids="931">
<ul class="sprocket-grids-b-container sprocket-grids-b-columns-4" data-grids-items="" style="transform-style: preserve-3d; backface-visibility: hidden; opacity: 1; height: 319px;">
<li data-grids-item="" style="opacity: 1; transform: scale(1) rotate(0deg); position: absolute; top: 0px; left: 0%;">
<div class="sprocket-grids-b-item panel-color" data-grids-content="">
I put the following style: .sprocket-grids-b ul.sprocket-grids-b-item li.data-grids-item .sprocket-grids-b-item.panel-color {
background: #454545;} in a custom.css in the directory with the basic.css file. Permissions and ownership are 644 33:33
This is just the last of many iterations.
Any help would be greatly appreciated.
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13482
- Web Designer/Developer
-
Could you please post a URL to your site (this can be done in the secure area tab if you prefer) so we can look for you. Without a link to page where the problem is on your site it is quite hard for us to provide the best solution due to so many variables. We try to provide file names and line numbers for code changes and if changes have already been made then our advice may be incorrect.
Please do a screengrab of your problem and annotate to make it clear. roksprocket Id?
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
Hi Mark,
I put the IP and credentials in the secure tab.
In general, I need to be able to customise the css for Gallery, Sprocket, etc.
It's unclear to me whether the best approach is to add css overrides to a "custom.css" file that goes into a specific directory, such as /var/www/html/modules/mod_rokgallery/templates/grid/light
Or, since Gantry is in use, "... create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME>is the name of the template e.g. rt_fracture).
If the later, does the new css file need to be added to a list somewhere? I saw several links to a 4 year old article that specified the index.php file, but that seems to be out of date.
Thanks,
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13482
- Web Designer/Developer
-
I just get connection timeouts on your IP.
This is how to create a custom CSS compatible with Gantry 4...
Simply create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME> is the name of the template as seen in template manager e.g. rt_fracture). GANTRY4 will automatically load this CSS file. If you wish, you can also have browser specific files by appending, for example, "-ie9" making the filename "<TEMPLATENAME>-custom-ie9.css"
That file will be automatically picked up - no need to do anything other than create the file.
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13482
- Web Designer/Developer
-
please turn off rokbooster and clear server cache.
Please would you post your URL, superuser id and pswd in the secure tab of your post and i'll have a look for you.
Regards, Mark. - Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
This message contains only secure information that is visible to Kamel Shaath, moderators and administrators
-
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
Mark,
I think I've got the <template-name>-custom.css naming and location and the css override (putting the applicable id in front of the classes).
Remaining issue would be the extra horizontal spacing between the grids in the right column.
Thanks again for your patience and help.
-
-
-
- Kamel Shaath
- Sr. Rocketeer
- Posts: 111
- Thanks: 0
-
-
-
- MrT
- Preeminent Rocketeer
- Posts: 101084
- Thanks: 13482
- Web Designer/Developer
-
I think you are misunderstanding how grids works = it it not meant to be like a checker boards with even heights to every item. Rather it is more like a magazine column layout the next content being added to the shortest column once the row if filled. If you look at the demo that shows the same
http://demo.rockettheme.com/joomla-extensions/roksprocket/
Regards, Mark. - Last Edit: 10 years 1 month ago by MrT.
- Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.
-
Time to create page: 0.045 seconds