From e654d9bd24af873e3d2504a8beb2847c3bd862ee Mon Sep 17 00:00:00 2001 From: Thomas Bruederli <thomas@roundcube.net> Date: Thu, 31 Jan 2013 09:08:57 -0500 Subject: [PATCH] Better indentation styles for mailbox list --- skins/larry/mail.css | 76 ++++++++++++++++++++++++++++--------- 1 files changed, 57 insertions(+), 19 deletions(-) diff --git a/skins/larry/mail.css b/skins/larry/mail.css index 898e4e9..c993708 100644 --- a/skins/larry/mail.css +++ b/skins/larry/mail.css @@ -156,7 +156,7 @@ background-position: 6px 3px; } -#mailboxlist li.mailbox.unread a { +#mailboxlist li.mailbox.unread > a { padding-right: 36px; } @@ -224,6 +224,17 @@ color: #017cb4; } +#mailboxlist li.mailbox div.treetoggle { + top: 13px; + left: 19px; +} + +#mailboxlist li.mailbox ul li:last-child { + border-bottom: 0; +} + +/* nested mailboxes */ + #mailboxlist li.mailbox ul { list-style: none; margin: 0; @@ -231,32 +242,59 @@ border-top: 1px solid #bbd3da; } -#mailboxlist li.mailbox ul li { - padding-left: 26px; -} - #mailboxlist li.mailbox ul li a { - background-position: 6px -93px; + padding-left: 52px; /* 36 + 1 x 16 */ + background-position: 22px -93px; /* 6 + 1 x 16 */ } - #mailboxlist li.mailbox ul li.selected > a { - background-position: 6px -117px; + background-position: 22px -117px; } - -#mailboxlist li.mailbox ul li:last-child { - border-bottom: 0; -} - -#mailboxlist li.mailbox div.treetoggle { - top: 13px; - left: 19px; -} - #mailboxlist li.mailbox ul li div.treetoggle { - left: 43px; + left: 33px; top: 14px; } +#mailboxlist li.mailbox ul ul li.mailbox a { + padding-left: 68px; /* 2x */ + background-position: 38px -93px; +} +#mailboxlist li.mailbox ul ul li.selected > a { + background-position: 38px -117px; +} +#mailboxlist li.mailbox ul ul li div.treetoggle { + left: 48px; +} + +#mailboxlist li.mailbox ul ul ul li.mailbox a { + padding-left: 84px; /* 3x */ + background-position: 54px -93px; +} +#mailboxlist li.mailbox ul ul ul li.selected > a { + background-position: 54px -117px; +} +#mailboxlist li.mailbox ul ul ul li div.treetoggle { + left: 64px; +} + +#mailboxlist li.mailbox ul ul ul ul li.mailbox a { + padding-left: 100px; /* 4x */ + background-position: 70px -93px; +} +#mailboxlist li.mailbox ul ul ul ul li.selected > a { + background-position: 70px -117px; +} +#mailboxlist li.mailbox ul ul ul ul li div.treetoggle { + left: 80px; +} + +/* indent folders on levels > 4 */ +#mailboxlist li.mailbox ul ul ul ul ul li { + padding-left: 16px; +} +#mailboxlist li.mailbox ul ul ul ul ul li div.treetoggle { + left: 96px; +} + #mailboxlist li.mailbox .unreadcount { position: absolute; top: 3px; -- Gitblit v1.9.1