Serenity is a fluid-width, 3-column theme with clean, uniform lines.
One unique "feature" of this theme is that I have pulled the login block from its normal position on the page and stuck it in the header. If you don't use the login block, you'll never know that does this is there. If you hate it, let me know and I'll tell you how to get rid of it!
Oh, and I threw Mauno's pix in there as well! Be sure to tell him what you think!
Tomorrow, I'll make sure this gets put into the database. Until then, here are the particulars:
Download: http://newschoollearning.com/free-themes
Demo: http://moodle.newschoollearning.com/?&theme=serenity
I really like parking the login block in the header. It may not be Moodle standard but that's a place where a student can logout so why not put the login there as well? How difficult was it to do that?
I'm interested in having the "You are logged in as..." text appear in the header on the front page for this theme - it appears on every other page. I apologise, I'm still learning CSS, but can you please point me in the right direction?
Thanks a lot,
Michael
I have deleted it from header.html. You will need to put it back in.
This can be done quite easily by copying line 29 of header.html and pasting it below line 24.
For reference, line 24 reads:
<div class="headermenu"><?php echo $menu ?></div>
This may cause problems with the absolute placement of the login block. Let me know if you have any trouble. I'll help you through it.
Would you be willing to have some of these in the core? I think it is about time we started adding some more advanced themes to the standard download.
Julian
I would love to contribute to the core. I was thinking about picking up the Kubrick idea where David Scotson left off and making it a little more user-friendly. I think that might be something attractive to add. What do you think?
For themes to get added to the core however they certainly need to be 100%. Can't release a dodgy theme to the community.
My only question with Kubrick is in regards to ownership. Obviously David's work pulled from the original Kubrick wordpress theme. Can this be done? Was that theme GPL? Who wrote the original wordpresss theme so a credit can be given?
I think we need to get those answers first. After that, I would be more than happy to work with you on this to see if we can make it a reality for perhaps a 1.9 inclusion.
Julian
I'll update you by the end of the week on what I find.
Great work on the theme! Is the version of moodle you are running 1.9? Or may be you introduced your wrapper for the curvy page corners via divs in the header and footer?
--Stuart.
Are you referring to Solstice? If so, then yes. The curvy page corners were added using the following divs at the bottom of header.html:
I then closed them at the start of the footer.
The curvy corners elsewhere in this theme are simply CSS backgrounds that I've tied to existing divs.
Thanks,
Stuart.
dear sir,
i really like the style of serenity,but i have a problem:some font-sizes are too small.can you help me
#content {
padding-top:4px;
font-size: 0.9em;
}
Change that font-size to something larger (like 1em) to increase the font size of the entire theme.
There are also a few more specific font-size declarations in that document that you may want to search for and increase also.
Hi Patrick,
Congratulations on the theme it looks great. Could you tell me where I can turn off the image repeater on the header image, i have removed the repeat-x and added a different banner image. Also where is moodle written in the header as i cannot seem to find it.
Thanks
Michael
Hi!
It looks like styles_serenity.css is not part of Moodle 2.0. Is there a way to do the same thing in Moodle 2.0 (increase font sizes)?
I'm just beginning to work with 2.0, and I very much like the Serenity theme!
Robert
This thread is for the 1.9 version of Serenity and the code here does not apply to 2.0.
I might be able to help if you tell me specifically what font-sizes you're trying to increase.
Thanks Patrick!
Using the Moodle 2.0 Serenity CSS code, I have been able to modify almost all of the fonts, with one exception. Underneath the "Available Courses" heading, the individual courses are listed in blue. Is there any way to increase these individual course titles, without having any effect on other areas?
I very much appreciate your time!
Robert Maynord
Robert,
I think this is the css code you need to change the element you are wanting to change...
#region-main div.region-content ul.unlist li div.coursebox div.info h3.name a:link {color: #ff0000;}
You will also need to turn Designer Mode ON in Settings menu to be able to see the changes you make...
Site Administration > Appearance > Themes > Theme Setting I think it's the 2nd Check Box from the top of that page.
Hope this helps?
Mary
Thanks Mary! I added this line to core.css. and tested it to see if it changed the font color. Alas, no luck. I tried different color numbers such as 000000.
Was core.css in the serenity/style folder the correct place to add the line?
By the way, I did have Designer Mode turned on...
Sorry Robert, I misunderstood your request, I thought you were talking about the link color. You want to alter font-size in the h3 which should be easy enough.
Yes, the core.css is the main css file for that theme in Moodle 2.0. If you add this line to the end of core.css in moodle/theme/serenity/styles/core.css
#region-main div.region-content ul.unlist li div.coursebox div.info h3 { font-size: 85%;}
I think that should fix it.
If you have PURGED the Cache in Moodle, and deleted your browsers cache, and you are still having problems, it is always worth testing to see if your css file is correct. You can do this HERE by uploading your core.css to the W3C CSS Validator.
Mary
Mary,
That worked perfectly! Right on the button.
Thanks for your help!!!
Robert maynord
Hi folks, sorry I'm late.
A question: we are considering using this theme for Moodle 2.2; what we need is to replace the Moodle logo at the bottom with our own logo + editing the link to point to the desired URL.
Can some kind soul tell me how, in just as many words as needed? I have access to the file system and can edit any file(s) using the code editor (built into the cPanel).
Thanx muchly in advance!
We love the Serenity theme we are trying to remove the dash next to the Topic 1- title.
Where in the code is that located I have looked every where and it seems i find everything else but that?
Any direction would be a great help. thank you
That title is set in the Language files.
You can check this as an Admin if you go to Languages edit settings
http://docs.moodle.org/22/en/Language_customization
or if you have access to the files on the server you can open moodle/lang/en/moodle.php and scroll down to about line 1600 or so and you should see this...
$string['topicoutline'] = 'Topic outline';
unless someone changed it at some point and in that case it will look like this...
$string['topicoutline'] = 'Topic outline -';
Mary
Hi all,
I cloned the serenity theme and customized it (changed the fonts, colors etc) using serenity as a parent theme. I am trying to remove the course title from the header. What file should I edit to remove it? I am on Moodle 2.2.
Thank you for all your help. Deepti
Hi,
If you take a look at the original copy in moodle/theme/serenity/layout/frontpage.php
In the line that is highlighted on the page you will see the <h1></h1> tags between which is some php code that you can remove.
<?php echo $PAGE->heading ?>
This is true of the general.php too.
Hope this helps?
Mary