New Theme - Autumn

New Theme - Autumn

by Patrick Malley -
Number of replies: 38
autumnI spent my Sunday doing something I've wanted to do for a while - I developed a 3-column, fluid-width Moodle theme that I can actually stand to look at!

Ever since creating my first theme last year, I have wanted to make a theme that I could share (I couldn't share the last one in lieu of the fact that the background images were purchased from Joomlashack).

I developed this theme on my 1.7.1 installation. Nevertheless, I think that the standard theme I started from was 1.8. You will have to tell me how well that works out for you!

I will upload this to the themes repository soon (my wife wants me to run some errands first!).

Until then, feel free to:
Enjoy smile
Average of ratings: -
In reply to Patrick Malley

Re: New Theme - Autumn

by Mauno Korpelainen -

Looks nice!

In IE7 header has some problem and looking at source code there is

.generalbox {
border-top: 1px solid e1d2bd;
margin: 15px auto;
}

(should be #e1d2bd)

Firefox 2 has no problems (as far as I could see)

Attachment head.jpg
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Patrick Malley -
Thanks Mauno,

$%^!@# IE7!!! I have yet to test in IE7 actually - my Dell took a dump last week and I have yet to install Windows on my Intel Mac (reluctant to do so actually!)

I'll look into it. That looks pretty bad. If someone can help me out with a diagnosis, I would appreciate it.

Thanks for picking up the missing "#" - I have fixed it in both my demo theme and my .zip file (linked above).
In reply to Patrick Malley

Re: New Theme - Autumn

by Mauno Korpelainen -

Well, I have some bad news from 1.8 too: tab system was changed and there are some other changes (in quiz for example). Attached "tabs" of my profile. I guess we need to make different versions of themes for moodle 1.8.

But the good news are: it looks still brilliant in moodle 1.8 too...smile

Attachment help.gif
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Mauno Korpelainen -

More good news:

changing $THEME->standardsheets = true; in theme config.php made your theme 1.8 compatible (you may create own tabs later if you like)

That "missing background" is in some of if home {...} header classes of header.html (on the home page only)...

In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Mauno Korpelainen -

The problem is that background of header-home itself is not defined.

Adding
#header-home {
background: #2d2d2d url(pix/topbg.gif) repeat-x top left;
}
to styles_color.css is not however the best possible solution...but it works.
(There is no white border around fall_leaves.jpg)

Attachment line.jpg
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Patrick Malley -
I think I fixed it a different way (altering the header.html structure so that the background wraps around .headermain & .headermenu) - I thought of this solution while running errands!

Nevertheless, I don't have IE7 to know whether it worked! Could someone please confirm that the header appears correct in IE7.

I have made appropriate changes in both my demo site and .zip file.
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Patrick Malley -
Thanks again, Mauno -

For now, I'll leave $THEME->standardsheets = false; in my .zip file.

If anyone plans to use the theme in 1.8, they can set that to true.

As soon as I upgrade my server (which will be later today??), I will look at those tabs so we can leave the standardsheets out of it.

Perhaps with my next theme, I will build off of the standardsheets, rather than modifying them entirely.

I worry about the weight of loading two complete sets of CSS (both autumn & standard).
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Eduardo Cerda -
tengo el sgte error:

Advertencia: No se reconoce la regla at o error al leer regla at '@page'.
Archivo de origen: http://misitio.cl/moodle/course/view.php?id=2
Línea: 1124

Advertencia: No se reconoce la regla at o error al leer regla at '@font-face'.
Archivo de origen: http://misitio.cl/moodle/course/view.php?id=2
Línea: 1996


en internet explorer no abre el curso y sale un mensaje de error "Operacion anulada: no se pudo abrir blablablabla"

In reply to Patrick Malley

Re: New Theme - Autumn

by Patrick Malley -
Autumn can now be found in the Themes repository.
In reply to Patrick Malley

Re: New Theme - Autumn

by Patrick Malley -
by Harald Lohmann - Thursday, April 5 2007, 08:33 AM

Hi Patrick,
I like your theme and have it installed on all my three moodles. Thanks for your good job. There is one thing I'd like to mention: as soon as I want to look at my users' list the font_size is obviously too big, the information scrolls to the right.
Is there anything I can do to change that?

I have installed 1.7.2+ and I use firefox.

Thanks,
Harald


Harald -

I hope that you don't mind that I answer your question here. This is a much better-suited place for discussions than the the Themes Repository

I guess that I didn't see this as a problem on my 17" MacBook Pro - I simply widened the browser window! Looking at it now, I guess a width of 1150px is a little much to be necessary to avoid the break!

For a smaller font-size in all tables, include the following code at the end of your styles_color.css file:

.generaltable {
font-size:0.8em;
}


This will get the max-width necessary to prevent breaks down to about 1000px (still not that great).

Rather than going any smaller than that, here's another idea: getting rid of the blocks on the "Browse a list of users" page will afford you around 250px. Being without the admin block on this page (or any other admin page that the table breaks your screen resolution) won't harm your navigation that much (it will be like working with Moodle pre-1.7!).

Or, you could get a bigger monitor! smile
Attachment Picture_1.png
In reply to Patrick Malley

Re: New Theme - Autumn

by Russ Swanson -
Hi!
Love the theme, but had a weird glitch: tried to move the blocks, but the arrows disappear 2 seconds later after an unexpected screen redraw. On Mac using latest firefox. Any ideas why?
Thanks for a cool theme!
In reply to Russ Swanson

Re: New Theme - Autumn

by Patrick Malley -
Russ - I appreciate the kind words. I'm glad you like the theme.

More information will be necessary - since I don't experience the issue, I suspect you are trying to use this on an installation of Moodle other than 1.7 - in which this theme was built for?

In reply to Patrick Malley

Re: New Theme - Autumn

by Stephen Plume -
A really nice theme which appears to also work on v1.6.X

Is it possible to mod the code so it doesn't display the image on the front page?

I would like to disable it until I can get a suitable image of our school.

Also there was no link to the footer file when I deployed the theme...should I just add that myself?

Many thanks

Stephen
In reply to Stephen Plume

Re: New Theme - Autumn

by Patrick Malley -
To get rid of the image on the front page:

  1. Open styles_color.css and comment out (/*put these around code*/):

    #header-home .headerimg1 {
    background: url(pix/fall_leaves.jpg) repeat-x bottom left;
  2. Open styles_layout.css and replace:

    #header-home {
    height:265px;
    }


    with:

    #header-home {
    height:112px;
    }

What link are you talking about - the Theme Credits link? Or some other?
In reply to Patrick Malley

Re: New Theme - Autumn

by Mike Reilly -

Hiya Patrick -

Awesome stuff.  I'm lazy in my request here:  I like your layout of news in the middle, courses on the left.  Where in Moodle can I arrange that?

Thanks in advance for any help you can offer.

Mike

In reply to Mike Reilly

Re: New Theme - Autumn

by Patrick Malley -
Mike - the layout of the front page middle column is defined through the site admin menu. In 1.8, I believe it is a top-level folder called "Front Page."

The "courses on left" is nothing more than the "Courses" block, which I have placed in the left column.

I'm glad you like this theme.

Good day.
Attachment Picture_1.png
In reply to Patrick Malley

Re: New Theme - Autumn

by Kenneth Newquist -
We've been trying out the Autumn theme, and so far we're really enjoying it -- it's a very clean, very refined looking theme. That said, we have run into a few formatting issues as we've been digging deeper into the theme and Moodle 1.8.

We're running Moodle 1.8.0 upgraded from Moodle 1.7.1. All of the formatting issues I mention below exist within Firefox 2.0.x on the Mac and Windows XP, Safari 2.0.4 on the Mac and Internet Explorer 6/7 on Windows. I haven't delved deeply into the CSS on any of these yet, but I will tomorrow and post some suggested fixes of my own.

Thanks again for creating this great theme -- we think it's got a lot of potential!

#1: Drop Navigation is Bulleted on Forum, Glossary, Deep-Tier pages

The drop navigation, along with the directional arrow and statistics icon, appear as a bulleted list on certain deeper tier pages, such as the Forum and Glossary. This can be clunky, particularly with larger lists, and I think what's supposed to happen is that these list elements should appear side-by-side, rather than on top of one another.

Example: Forum
http://ww2.lafayette.edu/~newquisk/screenshots/autumn_forum_bullets.jpg

Example: Glossary
http://ww2.lafayette.edu/~newquisk/screenshots/autumn_glossary_bullets.jpg

#2: "Edit Course" Form Fields Misaligned


When you open a course for editing, the field names are aligned to the right, and the fields themselves are usually bumped to the next line, appearing directly under the field name. This runs counter to the convention in other themes, and I think it makes the course more difficult to edit.

Example: Edit Course
http://ww2.lafayette.edu/~newquisk/screenshots/autumn_edit_course_example.jpg

#3: "Add Blocks" Block Formatting on Home Page

The formatting for the "Add Block" block on the home page is off; the text "Add a Block" appears underneath its graphical bullet.

Example: Add Blocks
http://ww2.lafayette.edu/~newquisk/screenshots/autumn_add_blocks.jpg

#4: Course Lists Do Not Differentiate between Active/Hidden courses

When looking at a course list, there is no different in coloring between active and hidden courses; the normal convention is for hidden courses to be grayed out. In my example, the courses ITS101.01, ITS101.02 & 1TS101.04 are all "hidden" courses.

Example: ITS Courses
http://ww2.lafayette.edu/~newquisk/screenshots/autumn_course_list.jpg




In reply to Kenneth Newquist

Re: New Theme - Autumn

by Patrick Malley -
I can currently only promise this theme as 1.7.1 material - which is the istallation that the theme was created on.

With that said, Mauno points out above:

changing $THEME->standardsheets = true; in theme config.php made your theme 1.8 compatible


I have tried this on my test server, which is running 1.8 now, and it appears to be working just fine without any irregularities. You may want to check it out and compare what is different between my installation and yours.

I plan to rework the Autumn theme first thing this summer (when the academic year is over and I am free from my teaching responsibilities), but have no time to do so any sooner.

Good luck.
In reply to Patrick Malley

Re: New Theme - Autumn

by Kenneth Newquist -
Thanks -- I'll try changing $THEME->standardsheets and see what effect it has. Our production server is running 1.7.1, so we're talking apples to apples.
In reply to Kenneth Newquist

Re: New Theme - Autumn

by Kenneth Newquist -
I made that change, and it fixed the first two issues beautifully. The last two remain:

#3: "Add Blocks" Block Formatting on Home Page
#4: Course Lists Do Not Differentiate between Active/Hidden courses

#4 is a simple CSS tweak. I'm guessing #3 is probably the same; I'll post my thoughts on both later today.


In reply to Kenneth Newquist

Re: New Theme - Autumn

by Patrick Malley -
#3 - known problem that I ignore smile:

Solution: Add the following to styles_color.css -

.block_adminblock .header {
background: none;
}


#4 - unknown existing problem:

Solution: Change the following in styles_color.css also -

a.dimmed:link,
a.dimmed:visited {
color: #b96d00;
}

to:

a.dimmed:link,
a.dimmed:visited {
color: #9b9b9b;
}


Hope this helps.

Core Autumn theme will be updated to reflect these changes this summer!

Attachment Picture_1.png
In reply to Patrick Malley

Re: New Theme - Autumn

by Mauno Korpelainen -

Hi Patrick,

you could also use this css for Kenneth's #3 :

.block_adminblock .header {
font-family:Georgia, Verdana, Arial, Serif;  padding: 0 0 5px 20px; }

(or something like this - these themes have always some tuning...and they just get better all the time) smile

Attachment patrick.jpg
In reply to Mauno Korpelainen

Re: New Theme - Autumn

by Patrick Malley -
Thanks for finding the more consistent fix for me. I knew there had to be one - I was trying to be helpful and efficient. A lot to do at the end of the year. smile

I will change my code to your suggestion.
In reply to Patrick Malley

Re: New Theme - Autumn

by Gabriela Meirelles -
Hey

I've tried to use the autumn theme with version 1.6.5 and it works mostly fine, except for a message I get at the bottom of every page:

Fatal error: Call to undefined function debugging() in C:\moodle\moodle\theme\autumn\footer.html on line 26

What can I do to fix that?

Cheers

Gabi
In reply to Patrick Malley

Re: New Theme - Autumn

by Clark Moodler -
Hi,
Not sure if this was addressed, but our campus is using autumn, and is primarily still on IE6 - though I encourage all to use firefox.

Nevertheless, the default seems to be that the breadcrumbs in IE6 appear almost invisible because they are a dark orange or something instead of white, like in Firefox.

What's the fix to this?
(Also, we're on Moodlerooms, so I don't think I can do the fix a theme code myself, is there an update or something available?

thanks,
clark

In reply to Clark Moodler

Re: New Theme - Autumn

by Patrick Malley -
I've seen this problem as well.

The fix to the problem would probably be something like:

.breadcrumb a:link,
.breadcrumb a:visited {
color:#fff;
}

I haven't updated Autumn since June of last year, and probably won't update it again until 1.9 is stable.
In reply to Patrick Malley

Re: New Theme - Autumn

by Ben Christopher -
Hi there,

the autumn image does not seem to be there see screenshot below.
any ideas?
Thanks
Ben

Attachment Clipboard01.jpg
In reply to Ben Christopher

Re: New Theme - Autumn

by Patrick Malley -
I don't understand.

The image is called via CSS in styles_autumn.css.

The image file is located at /pix/fall_leaves.jpg

I have checked the download and everything seems to be there.

And, I have checked my demo on 1.9.1 and everything appears.

Perhaps try reinstalling your theme.
In reply to Patrick Malley

Autumn - another bug

by Clark Moodler -
Hi there,

Moodlerooms just updated Autumn (I'm on 1.8.2+ with them) to fix the bug with open/closed courses not being differentiated.

Anyway, now, all text in web page resources under Autumn theme are CENTERED.

Whereas, if I change the theme to something else, the text is not centered.

autumn:

autumn - everything centered

non-autumn, same page:
non-autumn

any ideas for a fix on this? I'd like to use this, but faculty would have to go into every single web page resource and reformat...

Thanks,
clark
Attachment autumn-everythingcentered.png
In reply to Clark Moodler

Re: Autumn - another bug

by Patrick Malley -
Delete lines 345 - 347 from styles.css. Specifically, this is the code causing the trouble (that should be completely deleted):

.boxaligncenter {
text-align: center !important;
}
In reply to Patrick Malley

Re: Autumn - another bug

by Anton K -

Hi all.

I have a standard 1.9.4 Moodle, and I have applied this theme (and what a great theme it is too!!).

When I view my Moodle using IE7, the centre column will not auto-fill the space available, which varies depending on screen resolution and size. When I view the same Moodle site with Chrome, Opera, Firefox, it displays fine (and very nicely!!).

Has any IE user had the same issue?

We are a PC school and use IE, so changing browser is not an option. For us, this must display corectly using IE.

Here is the IE display (note spacing of centre column, and white space on right):

..... and the Opera / Firefox etc display

I have tried removing HTML from the centre column, in case it was something there, but no, still displays the same.

Any tips / suggestions woule be greatly appreciated.