New theme Moodle 2.0

New theme Moodle 2.0

by Will Cunningham -
Number of replies: 41
I guess you can call it a theme. I didn't make that many changes.

I took the formal white theme and changed the colors and the logo to something that I liked.

I have included the .psd files so you can change the text if you like.
I also included instuctions in the readme to show you how.
The .psd's make it too large to attach
You can download it here.
Here is a screenshot: Let me know what you think.
screen
Average of ratings: -
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Joseph Rézeau -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators
Hi Will,
Thanks for your effort to contribute to the collection of Moodle Themes. Why not make it available in the Moodle themes database?
Also I feel that the name you chose for your theme may be confusing for Moodle users, as people may think this theme is especially made for the Moodle 2.0 version (which has still not been released). I would certainly advise changing for a less confusing name.wink
Joseph
In reply to Joseph Rézeau

Re: New theme Moodle 2.0

by Will Cunningham -
Very good point. For those that are wondering the 2.0 is in reference to Web 2.0.
I will change the name to something else.

I run moodle 1.5.3 because my hosting company won't update mysq, so that is what version I built this theme on.


In reply to Will Cunningham

Re: New theme Moodle 2.0

by Will Cunningham -
I added it to the database and changed the name to Formal Blue. I hope someone can find a use for it.

I would love to see it in use so let me know.
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Nicolas Sicard -
Nice work ! I like it. How do you get those big icons on the main page ? I'm relatively new to Moodle and I can't find any parameter to display such icons.

I'm going to set up a Moodle portal in my school based on version 1.7 in a few weeks. I would love to use Formal Blue but it's not yet compatible. Do you plan to work on it ? I should be able to help you some time.

cheers

nicolas.
In reply to Nicolas Sicard

Re: New theme Moodle 2.0

by Will Cunningham -
The icons are just part of a label, a type of resource.

I would work on a version for 1.7 but I can't test in that environment. My provider will not upgrade mysql so I am stuck with 1.5.3

In reply to Will Cunningham

Re: New theme Moodle 2.0

by Nicolas Sicard -
Did you try complete Moodle installation packages for Windows (XAMPP) or Mac (MAMP) ? I've installed the Mac package on my laptop to try themes or modules before installing them on our server.
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Lane Lester -
I would work on a version for 1.7 but I can't test in that environment.

I just loaded it in my new 1.7 install, and it looks OK except for the calendar. The right side of the days extends too far, so that Sat is outside the border.

I wish that developers would create their headers without text so that the individual site's title would be displayed without having to involve Photoshop. Yeah, so I'm lazy. smile

Lane
In reply to Lane Lester

Re: New theme Moodle 2.0

by Joseph Rézeau -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators
Hi Lane,
You do not mention which platform nor which browser you are using.sad Anyway, for me Formal Blue does not work under Windows XP with FireFox 2, but it works OK with MS Internet Explorer 7, except for the calendar which looks as shown on attached screenshot. Is this the problem you are talking about?
Joseph
Attachment image-0000.jpg
In reply to Joseph Rézeau

Re: New theme Moodle 2.0

by Lane Lester -
You do not mention which platform nor which browser you are using.

The problem I'm seeing is in Win XP and IE 7, shown here. Strangely, it works fine in Linux/Firefox2.

Lane
Attachment captured.jpg
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Joseph Rézeau -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators

Hi Will,

Just tried your new Formal blue theme downloaded from the Moodle themes database. Most files dated Nov. 17th, 2006 with Windows XP.

  • Formal blue works OK with Moodle 1.6 and 1.7 in MS Internet Explorer 7.
  • It does not work with either versions of Moodle in FireFox 2.

See attached screenshots.

Also it seems to be missing the following icons:

  • pix/i/return.gif
  • pix/i/questions.gif
  • pix/i/stats.gif
  • pix/mod/data/icon.gif
  • pix/a/r_previous.gif
  • pix/a/r_next.gif

Hope you can remedy these glitches,

ATB

Joseph

Attachment image-0000.jpg
In reply to Joseph Rézeau

Re: New theme Moodle 2.0

by Will Cunningham -
As soon as my hosting company upgrades my server I will be more than happy to fix these issues. I am not a good enough coder to do it without being able to test it. I work with trial and error mainly.

If someone else wants to take a crack at fixing the issues in 1.6 and 1.7 in Firefox I would appreciate it.
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Mauno Korpelainen -

Here you have, Will,  a Firefox 2 repair attached. I added some padding and margin, height and width to extra.css and  added extra.css to config.php

All those changes are not necessary so you can just compare fw_layout.css and extra.css and include the changes you need. I tested this with moodle 1.6 and 1.7 and it was working ok with my Firefox 2

Copy files extra.css and config.php to your Formal_Blue theme-folder and that's it.

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Nicolas Sicard -
Nice, thanks !

I've tried it on Moodle 1.7 (MAMP/Firefox 2 MacOS X). It seems to work well except I can't have the theme small icons (always formal_white ones) even after cleaning the browser cache. I had to copy gif files into the mail pix directory. I think some small icons (questions.gif etc...) are still missing also.


nicolas
In reply to Nicolas Sicard

Re: New theme Moodle 2.0

by Mauno Korpelainen -

As you and Joseph earlier said they are missing. I think Will can add them (or everyone can copy those icons to pix folder from some other theme). I just added the extra.css to make this theme work in Firefox.

Mauno

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Nicolas Sicard -
In fact, I can see the files in the theme directory (not talking about the ones missing), but they do not display.

Nicolas.
In reply to Nicolas Sicard

Re: New theme Moodle 2.0

by Mauno Korpelainen -

OK. Here is a repaired config.php attached

I checked the code and it was corrupted, now it looks really nice. I will send the missing pix later.

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Mauno Korpelainen -

Hi again!

I tried to upload the whole theme here but because of a max upload error I uploaded it here 

I included all 1.7. images too. Could you Will check that everything is as you wanted it to be...

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Joseph Rézeau -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers Picture of Translators
Hello,
Thanks for your improvements to the Formal Blue theme. It is now working OK in Firefox 2.0 on Windows XP. However there are still 2 problems.
  1. There is a slight misalignment of the breadcrumb in Moodle 1.6.3 (as seen on the screenshot, the breadcrumb is too low. There is no such problem in Moodle 1.7.
  2. I personally find it really hard to read the breadcrumb text where the text color is blue or black on blue background. The only text I can see well is the combination of white on blue background. This maybe because (like a large proportion of the male population) I am partially color-blind, but I would be curious to know what others think.
All the best,
Joseph
Attachment image000.jpg
In reply to Joseph Rézeau

Re: New theme Moodle 2.0

by Will Cunningham -
Thanks Mauno I really appreciate the help. I have looked over your version and it looks good on my machine. I am running 1.5.3 and it all seems to be the way I imagined. I changed the version in the downloads to your version.

If you are having problems still I will do what I can but my hands are tied with the server issues.
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Mauno Korpelainen -

I made those small changes that Joseph noticed. The "final package" is here.

I think it is time for me too to make some other things for a while...

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Bruno Cunha -
Nice job with the theme.
Btw, how can i put those icons in the middle of the front page as shown in the imagem in the first post?

Thx
In reply to Bruno Cunha

Re: New theme Moodle 2.0

by Mauno Korpelainen -
You must include a topic section. You find it from Site settings (moodle 1.6) or  Front Page settings (moodle 1.7). Then go to first page, turn editing on and edit that section.
In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Bruno Cunha -
I did go to site administration/Apereance/Frontapage and checked the "Include a topic section numsections "
The rest I really don't understant how to do it



Attachment pic1.JPG
In reply to Bruno Cunha

Re: New theme Moodle 2.0

by Will Cunningham -
What I did to make it look that way as find the icons/images that I liked. On the front page I included the "label" resource and made a table that included the icons/images.
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Ji Ming -

Can you please tell me where the color control for the fonts in chat are located? Which css file. I think it should be somewhere like .chat-message.

James

In reply to Ji Ming

Re: New theme Moodle 2.0

by Mauno Korpelainen -

If some feature is not in theme css then it is in some of standard theme stylesheets. You may add new css tags to any theme (or just copy from standard theme css and change them)

Look at http://moodle.org/mod/forum/discuss.php?d=26507 for the chat text color.

In reply to Mauno Korpelainen

Re: New theme Moodle 2.0

by Ji Ming -

I've look in the following "standard theme" css files:

styles_color.css, style_fonts.css, style_layout.css, styles_moz.css

I couldn't find the ".chat.message.text" as listed in your link

----------

chat-message .text {
  color: #FF0000;
}

---------

I'll recheck the Moodle 2.0 theme again.

In reply to Will Cunningham

Re: New theme Moodle 2.0

by Dave Stacey -
We're using an adapted version of this theme over at http://www.olchfa.org.uk.

We had a problem with people viewing on a monitor with a higher res than 1024x768 as they'd see a blue block at the top right of the header.

To fix this we took created added the attached graphic into the pix folder and changed the code in font_color.css from:

#header-home, #header {
  background-color: #6B77AB;
  border-color:#C6BDA8;
}

To

#header-home {
  background: url(pix/bg.jpg);
    border-color:#F7F6F1;
}

#header {
  background-color: #6B77AB;
  border-color:#C6BDA8;
}

Seems to be working fine in browser checks so far, so I thought I'd share it here!
Attachment bg.jpg
In reply to Dave Stacey

Re: New theme Moodle 2.0

by Mr. Shortcut -
Formal blue look great!
Please support me to have something look like:
How can I have login block as the first post? and How can I have main menu that include couse categories and then when user choose one category, it will show courses in the middle like table of icons?

Thanks,
In reply to Dave Stacey

Re: New theme Moodle 2.0

by Brian Schmidt -
I've applied these changes on my test setup and they look great!

I'm having another issue now, though -- the placement of the login line and dropdown box.

In IE 6, these appear in the line where the breadcrumbs would be. In Firefox 2.0, it's up in the top right-hand corner. (I haven't tested IE 7 to see how it comes out there.) [see image]

Anyone have any ideas?
Attachment browsers.jpg
In reply to Brian Schmidt

Re: New theme Moodle 2.0

by Brian Schmidt -
I figured out what the issue was. It seems it's not actually the browser, but the resolution/size. The logo.jpg is too big and pushes it down to the next line.
In reply to Brian Schmidt

Re: New theme Moodle 2.0

by Will Cunningham -
Has anyone adapted this to 1.8 yet?
In reply to Will Cunningham

Re: New theme Moodle 2.0

by Brian Schmidt -
So far, it seems to be working fine on a test installation of 1.8 that I have. I haven't gotten the chance to check it out in every place yet, but no real issues on my end at the moment other than a few missing icons. This is using the latest version that Mauno had posted in December.
In reply to Brian Schmidt

Re: New theme Moodle 2.0

by Lowell Thomson -

Cool Theme!

Silly question here...sorry...Moodle newbie...

I found some information about how to "install" some of the modules and blocks...but how do I "install" this theme?  Do I need to replace files with the ones you have in your download?

I went through the read-me and didn't get enough help.  (Could be my lack of knowledge...not a lack of information...)

Any help would be greatly appreciated!

Thanks.

Lowell

In reply to Will Cunningham

Re: New theme Moodle 2.0

by Luis de Vasconcelos -

I've got it working on Moodle 1.8.3+ and it looks quite good. However, I've noticed that there are a few "invalid" or "corrupt" files in the archive:

icon.gif file in the \pix\mod\assignment\;
icon.gif file in the \pix\mod\chat\ folder;
tf.gif in the \pix\mod\quiz\pix\ folder;

I can't open these in my image viewer - it gives me "can't determine type" errors. The file sizes for these images are 0kb, which isn't right...

Has anybody got working copies of these images?

In reply to Will Cunningham

Float username and language over header image.

by Steve Bullock -
Awesome theme, have adapted it and am using it for my VLE in London at vwhtc.net. Am trying to get the login info and language box in the top right to float over the logo, but my CSS skills are lacking. I know I've got to set float: and z-level: for it but can't quite get it right. Can anyone help?

Cheers
Steve