Backgrounds and background color are held within the common.css %s/mail.css/common.css/ if you are looking to modify the background and tables etc...
This will change text and list box behaviours. I can write in modifying both I suppose with a single css.
-----Original Message----- From: Blob [mailto:blob@xdashcentral.us] Sent: Friday, October 14, 2005 4:01 PM To: macross Subject: Re: CSS Style Change
Cool This is gonna help me out alot :-) I'm gonna be working on a Matrix Theme for this webmail package. Might use Yellow or Orange Font on the text for the GUI with Matrix. which are either #FF5500 or #FFFF00 Now are all of these #s in this .CSS related to Text only?? or are there a few for the backgrounds etc.. which i plan on changing via http code if possible like with the templates and images etc...
Cheers! Jason
On Fri, 14 Oct 2005 15:54:03 -0400, "macross" macross@msyte.com wrote:
Anyone interested in updating their css styles on the fly. I've put this together. It could/should be put in the preferences page I suppose. But I am just mucking around here. Send me change if any are made.
Enter this into roundcubemail/skins/default/mail.css
#stylechange { position: absolute; top: 535px; left: 20px; width: 160px; border: 1px solid #CCCCCC; color: #333333; font-size: 11px; font-weight: bold; }
Enter this into roundcubemail/program/js/common.js
var expDays = 9999; var standardStyle = '2'; var nameOfCookie = 'switchstyle'; var urlToCSSDirectory = 'roundcubemail/skins/default/'; var ScreenCSS_1 = 'mail.css'; var ScreenCSS_2 = 'mail_2.css'; var ScreenCSS_3 = 'mail_3.css'; var ScreenCSS_4 = 'mail_4.css'; var ScreenCSS_5 = 'mail_5.css';
//Let's you change print option CSS //
var PrintCSS_1 = 'mail_1.css'; var PrintCSS_2 = 'mail_2.css'; var PrintCSS_3 = 'mail_3.css'; var PrintCSS_4 = 'mail_4.css'; var PrintCSS_5 = 'mail_5.css';
function switchStyleOfUser(){ var fontSize = GetCookie(nameOfCookie); if (fontSize == null) { fontSize = standardStyle; }
if (fontSize == "1") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + ' ' + ScreenCSS_1 + '" media="screen">'); } if (fontSize == "2") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + ScreenCSS_2 + '" media="screen">'); } if (fontSize == "3") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + ScreenCSS_3 + '" media="screen">'); } if (fontSize == "4") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + ScreenCSS_4 + '" media="screen">'); } if (fontSize == "5") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + ScreenCSS_5 + '" media="screen">'); }
if (fontSize == "1") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + PrintCSS_1 + '" media="print">'); } if (fontSize == "2") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + PrintCSS_2 + '" media="print">'); } if (fontSize == "3") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + PrintCSS_3 + '" media="print">'); } if (fontSize == "4") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + PrintCSS_4 + '" media="print">'); } if (fontSize == "5") { document.write('<link rel="stylesheet" type"text/css" href="' + urlToCSSDirectory + PrintCSS_5 + '" media="print">'); }
var fontSize = ""; return fontSize; }
var exp = new Date(); exp.setTime(exp.getTime() + (expDays*24*60*60*1000)); function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) endstr = document.cookie.length; return unescape(document.cookie.substring(offset, endstr)); } function GetCookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) return getCookieVal (j); i = document.cookie.indexOf(" ", i) + 1; if (i == 0) break; } return null; } function SetCookie (name, value) { var argv = SetCookie.arguments; var argc = SetCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); } function DeleteCookie (name) { var exp = new Date(); exp.setTime (exp.getTime() - 1); var cval = GetCookie (name); document.cookie = name + "=" + cval + "; expires=" + exp.toGMTString(); } function doRefresh(){ location.reload(); } document.write(switchStyleOfUser());
Enter this into roundcubemail/skins/default/templates/mail.html At the bottom just before it includes the taskbar.html
<div id="stylechange"> <input type="radio" name="rcstyl" value="1" onclick="SetCookie(nameOfCookie, this.value, exp); doRefresh();"> style 1<br> <input type="radio" name="rcstyl" value="2" onclick="SetCookie(nameOfCookie, this.value, exp); doRefresh();"> style 2<br> <input type="radio" name="rcstyl" value="3" onclick="SetCookie(nameOfCookie, this.value, exp); doRefresh();"> style 3<br> <input type="radio" name="rcstyl" value="4" onclick="SetCookie(nameOfCookie, this.value, exp); doRefresh();"> style 4<br> <input type="radio" name="rcstyl" value="5" onclick="SetCookie(nameOfCookie, this.value, exp); doRefresh();"> style 5<br> </div>
Copy the mail.css file and modify it to your own liking naming mail_2.css mail_3.css etc etc
Done!