umich skin

[ABerglund]

We have installed your umich theme on a Roundcube v0.2b system that we are evaluating for possible offer to our users as an alternative to Squirrelmail. Love clean the looks of the theme. But we have discovered an odd bug in how the folder list accepts messages by dragging if the folder list is so long that it needs to be scrolled down prior to dragging. The default theme does not exhibit this behavior. I'd like to discuss this with whoever is the maintainer of the skin, if possible. I can't take a screen shot to show this since I can't capture the drag. any ideas?

[strictlydata]

What a great Skin.
However I have tried it on two computers one with a low screen size.
The Print this message gets pushed onto another line under Reply to sender.

Is there a fix so the button isnt moved?

[ksteinhoff]

We have installed your umich theme on a Roundcube v0.2b system that we are evaluating for possible offer to our users as an alternative to Squirrelmail. Love clean the looks of the theme. But we have discovered an odd bug in how the folder list accepts messages by dragging if the folder list is so long that it needs to be scrolled down prior to dragging. The default theme does not exhibit this behavior. I'd like to discuss this with whoever is the maintainer of the skin, if possible. I can't take a screen shot to show this since I can't capture the drag. any ideas?

What operating systems and browsers do you see this behavior in? Does it always happen or only under certain conditions?

[ksteinhoff]

What a great Skin.
However I have tried it on two computers one with a low screen size.
The Print this message gets pushed onto another line under Reply to sender.

Is there a fix so the button isnt moved?

You could try making the strings in the labels.inc file shorter for the buttons on that row.

(see "program/localization/en_US/labels.inc" or whichever language you're using.)

[ABerglund]

What operating systems and browsers do you see this behavior in? Does it always happen or only under certain conditions?

This is consistent, once it was pointed out to me it does it every time I test it. I have tested using Firefox 3 (both Mac and PC) and Safari. Firefox 3.1 beta (Mac) also does it. Haven't tried IE as we don't use it.

To duplicate, use an account with a number of IMAP folders. If they all fit in your window (no scroll bar shown) it works as normal. Drag a message and the destination folder(s) highlight with yellow under the cursor as expected.

Now shorten the depth of your window so that the folder list shows a scroll bar. Make certain to shorten the window enough so that several folders at the bottom of the list are out of view. If you drag while the scroll bar is at the top (default position) it still works as expected.

Now scroll down in the folder list. Drag a message into the folder list. Note that the yellow highlight is several folders up the list. In fact, the highlighted destination folder is above the cursor by how ever many folders you scrolled down. If you scroll down 3 folders, the highlighted destination is 3 folders above the cursor. If you scroll down 10 folders, the highlighted folder is 10 folders up the list. As you can see, it is easy for the highlighted destination folder to even be off the screen and invisible. Worse, if you release the message, it is moved into the folder that is highlighted, NOT the folder under the cursor. This can cause misplaced messages very easily.

This behavior is not evident in the default skin, where scrolling does not affect the correct function. My guess is that the folder list is not being refreshed in some way after scrolling.

In case you can not duplicate this on your system, I can provide a test account on mine, if necessary. I can be emailed at aberglund (at) lesd.k12.or.us

[ksteinhoff]

This is consistent, once it was pointed out to me it does it every time I test it. I have tested using Firefox 3 (both Mac and PC) and Safari. Firefox 3.1 beta (Mac) also does it. Haven't tried IE as we don't use it.

Thanks for the detailed steps. I can reproduce the problem, and we'll work on a fix.

[pcnyla]

Thanks for all the great answers. There are two edits I'd like to do - one is to edit the toolbar colours; i'v adjusted in css but the icons and link areas apear to have a box arround them? Also, where do I edit the intro text that appears in the preview pane, before an email is selectd? Thanks in advance

[ksteinhoff]

Thanks for all the great answers. There are two edits I'd like to do - one is to edit the toolbar colours; i'v adjusted in css but the icons and link areas apear to have a box arround them?

Is "#messagetoolbar a:hover" in mail.css what you're looking for?

Also, where do I edit the intro text that appears in the preview pane, before an email is selectd? Thanks in advance

The text is in templates/mailhints.html

[pcnyla]

Hi there,

Thanks for your response. In continuing my customisations, I need some assistance on one further point, principally where do I need to look to edit the colour of the wording that displays 'Inbox' and 'Messages 1 to 5 of 5' as showin in the attached image? Ideally I'd like to set this to white. As you'll see, I've made a number of changes to colours, to keep in line with our company branding.Many thanks in advance.

[ksteinhoff]

where do I need to look to edit the colour of the wording that displays 'Inbox'

common.css (line 21)

and 'Messages 1 to 5 of 5' as showin in the attached image

mail.css (line 230)

To figure these things out, I recommend using Firefox with the Firebug extension. Firebug adds an "Inspect Element" option to the contextual menu. When you right-click on an element and choose "Inspect Element," Firebug will show you the element's HTML and the CSS (and will show you the file and line numbers where the CSS is defined).

[ABerglund]

Thanks for the detailed steps. I can reproduce the problem, and we'll work on a fix.

Any update on this issue yet?

[flesicek]

Hello ksteinhoff,

First of all, it is very very nice skin.

is it possible to implement following enhacements into your skin?
1) Add into actions menu following links related to folder management: Compact and Empty
2) When preview panel with html message is longer than window it isn't wraped as it is done in default skin
3) In preferencies move button save out of scrolling section as it is done in default skinn

Which buttons do you use in the skin (I would like to add import or other buttons) and I'm looking for compatible icons.

Thanks a lot

Jozef

[ABerglund]

I was able to find and correct the dragging bug described in post #19 in this thread. The fix is to add 'position:relative;' in two places in the mail.css file. One is in the 'mailboxlist' section (line 440) and the other is the 'mailboxlist li a' section (line 514). Like so:

Code Select Expand

#mailboxlist
{
    position:relative;  /* fix for dragging bug */
    width: 100%;
    height: auto;
    margin: 0px;
    padding: 0px;
    list-style-image: none;
    list-style-type: none;
    overflow: hidden;
    white-space: nowrap;
}

Code Select Expand

#mailboxlist li a
{
  display: block;
  position: relative;  /* fix for dragging bug */
  padding-left: 25px;
  padding-top: 2px;
  padding-bottom: 2px;
  text-decoration: none;
}
This has fixed the problem, and we are now preparing to go into production with it.

I have communicated this with the original developer team, and they will incorporate this into the next release of this skin.

[workservice]

Wow, Now okay, I make the thing work

How did you manage to turn it on?

[uschinator]

Hi,

the first screenshot of this thread is showing different icons for "Drafts", "Inbox" etc. than my configuration does right now. I just get an icon for the Inbox (see attachment). All Other Folders have the blue standard icon for the folders. How can i get the icons work which are saved in "skins\umich\images\icons". I Checked the path and they are in this directory.

the mail.css of the skin looks like that and i think this should be all right as well:

Code Select Expand

#mailboxlist li.inbox
{
  background-image: url(images/icons/folder-inbox.png);
}

#mailboxlist li.draftsrcfolder
{
  background-image: url(images/icons/folder-drafts.png);
}

#mailboxlist li.sentrcfolder
{
  background-image: url(images/icons/folder-sent.png);
}

#mailboxlist li.junkrcfolder
{
  background-image: url(images/icons/folder-junk.png);
}

#mailboxlist li.trashrcfolder
{
  background-image: url(images/icons/folder-trash.png);


I don't understand, why there are shown the blue folder icons instead of the icons which are defined in the mail.css?

Can somebody help?