Mercurial Hosting > nabble
view src/nabble/view/naml/change_appearance.naml @ 16:2e504670a010
google fonts https
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Thu, 03 Oct 2019 22:14:53 -0600 |
parents | 7ecd1a4ef557 |
children |
line wrap: on
line source
<macro name="change_appearance" requires="servlet"> <n.if.not.visitor.can_edit.root_node> <then> <n.login.><t>Only authorized users can proceed in this area.</t></n.login.> </then> </n.if.not.visitor.can_edit.root_node> <n.nabble_html> <do> <n.embedding_redirection_js/> <n.change_appearance_body/> </do> <output> <![CDATA[<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">]]> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title>Change appearance of <n.root_node.subject/></title> <link rel="stylesheet" href="/nabble.css?v=[n.css_version/]" type="text/css" /> <n.change_appearance_stylesheet/> <n.nabble_javascript_libraries/> <script type="text/javascript" src="/util/jscolor/jscolor.js"></script> <script type="text/javascript"> jscolor.dir = '/images/jscolor/'; </script> <n.change_appearance_js/> <n.html_head_content/> </head> <body> <n.html_body_content/> </body> </html> </output> </n.nabble_html> </macro> <macro name="change_appearance_stylesheet"> <style type="text/css"> body { margin:0; padding:0; overflow:hidden; } #change-appearance { padding:.8em; font: normal 1em 'Open Sans', Verdana, sans-serif; color: #EEE; text-shadow: 1px 1px 0 #000; background: url('gradients/v30_DDDDDD88_CCCCCC00') #000 repeat-x; } #preview-frame { position:absolute; width:100%; } span.change-appearance-group { background: url("gradients/v30_FFFFFF65_DDDDDD00") repeat-x scroll 0 0 #222222; font-weight:bold; padding: .2em .4em; border-color: #333 #555 #888; border-width:2px; border-style: solid; margin-right:.7em; cursor: pointer; white-space:nowrap; } div.change-appearance-group-panel { background-color: #000; border: 2px solid #888; width:30em; padding:.5em; margin-top:.3em; position:absolute; z-index:1000; display:none; } .weak-color { color: #bbb; } td.label-column { white-space:nowrap; font-weight:bold; } div.sub-section-title { font-size:80%; margin:.3em 0 .1em; padding:.2em .3em; border-bottom:1px solid #777; } span.option-button { background:#444; padding:.2em .4em; color:#dd0; margin:0 .3em .3em 0; white-space:nowrap; cursor:pointer; } div.dropdown-box { width:20em; padding: .3em; background:#000; border:2px solid #777; display:none; -moz-box-shadow: 2px 2px 10px #FFFFFF; -webkit-box-shadow: 2px 2px 10px #FFFFFF; box-shadow: 2px 2px 10px #FFFFFF; } .section-title { font-weight:bold; color: #dd0; } .small-description { font-size:80%; padding:.3em 0; color:#ddd; } table { border-spacing:0; width:100%; } table td { padding:0; } .error-message { color:red; font-weight:bold; display:none; } .error-field { border: 3px solid red; } a:link { color:#78F; } a:visited { color:#76D; } a.close-link { font-size:200%; position:absolute; right:10px; top:0; text-decoration:none; color:white; } div.color-scheme-row { clear:both; cursor:pointer; margin-bottom:.2em; } div.color-scheme { width:8px; float:right; font-size:80%; margin-top:2px; } </style> </macro> <macro name="change_appearance_js"> <script type="text/javascript"> window.isChangeAppearance = true; /* see dropdown.naml */ var selectedFont = '#ADE'; function layout() { var $frm = $('#preview-frame'); var $w = $(window); var $tbar = $('#change-appearance'); $frm.height($w.height()-$tbar.height()-30); $frm.css('top', $tbar.height()+20); }; function closeFrame() { location = '/'; }; function hideOpenMenus() { $('span.change-appearance-group').next().slideUp('fast'); }; var font_list = []; var color_list = []; var preferences_list = []; var css_list = []; function addField(list, id, initial, def, type) { list.push({ 'id': id, 'initial': initial, 'default': def, 'type': type }); }; <![CDATA[ function setFieldValues0(list, source) { for (var i=0; i < list.length; i++) { var o = list[i]; var value = o[source]; if (o.type == 'checkbox') checkboxValue('#'+o.id, value); else if (o.type == 'radio') $('#'+o.id+value).attr('checked', true); else if (o.type == 'color') { var input = document.getElementById(o.id); if (input.color) input.color.fromString(value); else $(input).val(value); } else $('#'+o.id).val(value); } }; ]]> function setFieldValues() { addField(font_list, 'font-size', '<n.javascript_string_encode.naml_configuration.get_value name="fontSize" default="84"/>', '84'); addField(font_list, 'main-font', '<n.javascript_string_encode.naml_configuration.get_value name="mainFontFamily" default=""/>', ''); addField(font_list, 'title-font', '<n.javascript_string_encode.naml_configuration.get_value name="titleFontFamily" default=""/>', ''); setFieldValues0(font_list, 'initial'); addField(color_list, 'bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="bgColor" default="FFFFFF"/>', 'FFFFFF', 'color'); addField(color_list, 'light-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="lightBgColor" default="F2F2F2"/>', 'F2F2F2', 'color'); addField(color_list, 'shaded-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="shadedBgColor" default="EEEEEE"/>', 'EEEEEE', 'color'); addField(color_list, 'dark-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="darkBgColor" default="DDDDDD"/>', 'DDDDDD', 'color'); addField(color_list, 'highlight-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="highlightBgColor" default="FFFF99"/>', 'FFFF99', 'color'); addField(color_list, 'text-color', '<n.javascript_string_encode.naml_configuration.get_value name="textColor" default="000000"/>', '000000', 'color'); addField(color_list, 'text-weak-color', '<n.javascript_string_encode.naml_configuration.get_value name="textWeakColor" default="666666"/>', '666666', 'color'); addField(color_list, 'title-color', '<n.javascript_string_encode.naml_configuration.get_value name="titleColor" default="333333"/>', '333333', 'color'); addField(color_list, 'link-color', '<n.javascript_string_encode.naml_configuration.get_value name="linkColor" default="0000EE"/>', '0000EE', 'color'); addField(color_list, 'link-visited-color', '<n.javascript_string_encode.naml_configuration.get_value name="linkVisitedColor" default="551A8B"/>', '551A8B', 'color'); addField(color_list, 'input-text-color', '<n.javascript_string_encode.naml_configuration.get_value name="inputTextColor" default="000000"/>', '000000', 'color'); addField(color_list, 'input-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="inputBgColor" default="FFFFFF"/>', 'FFFFFF', 'color'); addField(color_list, 'light-border-color', '<n.javascript_string_encode.naml_configuration.get_value name="lightBorderColor" default="EEEEEE"/>', 'EEEEEE', 'color'); addField(color_list, 'medium-border-color', '<n.javascript_string_encode.naml_configuration.get_value name="mediumBorderColor" default="CCCCCC"/>', 'CCCCCC', 'color'); addField(color_list, 'dark-border-color', '<n.javascript_string_encode.naml_configuration.get_value name="darkBorderColor" default="666666"/>', '666666', 'color'); addField(color_list, 'info-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="infoBgColor" default="FFFFCC"/>', 'FFFFCC', 'color'); addField(color_list, 'info-text-color', '<n.javascript_string_encode.naml_configuration.get_value name="infoTextColor" default="000000"/>', '000000', 'color'); addField(color_list, 'error-bg-color', '<n.javascript_string_encode.naml_configuration.get_value name="errorBgColor" default="FFFFCC"/>', 'FFFFCC', 'color'); addField(color_list, 'error-text-color', '<n.javascript_string_encode.naml_configuration.get_value name="errorTextColor" default="000000"/>', '000000', 'color'); setFieldValues0(color_list, 'initial'); addField(preferences_list, 'show-search-box', '<n.javascript_string_encode.naml_configuration.get_value name="showSearchBox" default="true"/>', 'true', 'checkbox'); addField(preferences_list, 'search-box-alignment', '<n.javascript_string_encode.naml_configuration.get_value name="searchBoxAlignment" default="right"/>', 'right'); addField(preferences_list, 'show-app-title', '<n.javascript_string_encode.naml_configuration.get_value name="showAppTitle" default="true"/>', 'true', 'checkbox'); addField(preferences_list, 'app-title-alignment', '<n.javascript_string_encode.naml_configuration.get_value name="appTitleAlignment" default="center"/>', 'center'); addField(preferences_list, 'app-description-alignment', '<n.javascript_string_encode.naml_configuration.get_value name="appDescriptionAlignment" default="center"/>', 'center'); addField(preferences_list, 'page-layout', '<n.javascript_string_encode.naml_configuration.get_value name="pageLayout" default="wide"/>', 'wide'); addField(preferences_list, 'forum-topics-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="forumTopicsPerPage" default="35"/>', '35'); addField(preferences_list, 'blog-topics-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="blogTopicsPerPage" default="10"/>', '10'); addField(preferences_list, 'news-topics-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="newsTopicsPerPage" default="25"/>', '25'); addField(preferences_list, 'gallery-topics-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="galleryTopicsPerPage" default="16"/>', '16'); addField(preferences_list, 'mixed-topics-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="mixedTopicsPerPage" default="6"/>', '6'); addField(preferences_list, 'classic-posts-per-page', '<n.javascript_string_encode.naml_configuration.get_value name="classicPostsPerPage" default="20"/>', '20'); addField(preferences_list, 'picture-size-classic', '<n.javascript_string_encode.naml_configuration.get_value name="pictureSizeClassic" default="big"/>', 'big'); addField(preferences_list, 'forum-format-', '<n.javascript_string_encode.naml_configuration.get_value name="forumFormat" default="standard"/>', 'standard', 'radio'); setFieldValues0(preferences_list, 'initial'); addField(css_list, 'custom-css', '<n.javascript_string_encode.naml_configuration.get_value name="customCss" default=""/>', ''); setFieldValues0(css_list, 'initial'); }; function confirmRestore() { return confirm('Do you really want to restore the default values and lose your changes?'); }; function restoreFontDefaults() { if (confirmRestore()) { setFieldValues0(font_list, 'default'); applyFont(); } }; function applyFont() { try { clearValidation(); validateRange('#font-size', 70, 140); } catch(err) { showErrorMessage('font'); return; } var fontSize = $('#font-size').val(); var mainFont = $('#main-font').val(); var titleFont = $('#title-font').val(); var params = {}; params['macro'] = 'save_font_config'; params['fontSize'] = fontSize; params['mainFontFamily'] = mainFont; params['titleFontFamily'] = titleFont; apply(params); }; function checkboxValue(selector, value) { if (value) $(selector).attr('checked', true); else $(selector).removeAttr('checked'); }; function restoreColorDefaults() { if (confirmRestore()) { setFieldValues0(color_list, 'default'); applyColor(); } }; function applyColor() { var params = {}; params['macro'] = 'save_color_config'; params['bgColor'] = $('#bg-color').val(); params['lightBgColor'] = $('#light-bg-color').val(); params['shadedBgColor'] = $('#shaded-bg-color').val(); params['darkBgColor'] = $('#dark-bg-color').val(); params['highlightBgColor'] = $('#highlight-bg-color').val(); params['textColor'] = $('#text-color').val(); params['textWeakColor'] = $('#text-weak-color').val(); params['titleColor'] = $('#title-color').val(); params['linkColor'] = $('#link-color').val(); params['linkVisitedColor'] = $('#link-visited-color').val(); params['inputTextColor'] = $('#input-text-color').val(); params['inputBgColor'] = $('#input-bg-color').val(); params['lightBorderColor'] = $('#light-border-color').val(); params['mediumBorderColor'] = $('#medium-border-color').val(); params['darkBorderColor'] = $('#dark-border-color').val(); params['infoBgColor'] = $('#info-bg-color').val(); params['infoTextColor'] = $('#info-text-color').val(); params['errorBgColor'] = $('#error-bg-color').val(); params['errorTextColor'] = $('#error-text-color').val(); apply(params); }; function applyPreferences() { try { clearValidation(); validateRange('#forum-topics-per-page', 1, 100); validateRange('#blog-topics-per-page', 1, 100); validateRange('#gallery-topics-per-page', 1, 100); validateRange('#news-topics-per-page', 1, 100); validateRange('#classic-posts-per-page', 1, 100); validateMixedCsv('#mixed-topics-per-page', 1, 20); } catch(err) { showErrorMessage('preferences'); return; } var showSearchBox = $('#show-search-box').is(':checked'); var searchBoxAlignment = $('#search-box-alignment').val(); var showAppTitle = $('#show-app-title').is(':checked'); var appTitleAlignment = $('#app-title-alignment').val(); var appDescriptionAlignment = $('#app-description-alignment').val(); var pageLayout = $('#page-layout').val(); var forumTopicsPerPage = $('#forum-topics-per-page').val(); var blogTopicsPerPage = $('#blog-topics-per-page').val(); var galleryTopicsPerPage = $('#gallery-topics-per-page').val(); var newsTopicsPerPage = $('#news-topics-per-page').val(); var mixedTopicsPerPage = $('#mixed-topics-per-page').val(); var pictureSizeClassic = $('#picture-size-classic').val(); var classicPostsPerPage = $('#classic-posts-per-page').val(); var forumFormat = $('#forum-format-standard').is(':checked')?'standard':'topics'; var params = {}; params['macro'] = 'save_preferences_config'; params['showSearchBox'] = showSearchBox; params['searchBoxAlignment'] = searchBoxAlignment; params['showAppTitle'] = showAppTitle; params['appTitleAlignment'] = appTitleAlignment; params['appDescriptionAlignment'] = appDescriptionAlignment; params['pageLayout'] = pageLayout; params['forumTopicsPerPage'] = forumTopicsPerPage; params['blogTopicsPerPage'] = blogTopicsPerPage; params['galleryTopicsPerPage'] = galleryTopicsPerPage; params['newsTopicsPerPage'] = newsTopicsPerPage; params['mixedTopicsPerPage'] = mixedTopicsPerPage; params['pictureSizeClassic'] = pictureSizeClassic; params['classicPostsPerPage'] = classicPostsPerPage; params['forumFormat'] = forumFormat; apply(params); }; function restorePreferencesDefaults() { if (confirmRestore()) { setFieldValues0(preferences_list, 'default'); updateUI(); applyPreferences(); } }; function applyCss() { var customCss = $('#custom-css').val(); var params = {}; params['macro'] = 'save_css_config'; params['customCss'] = customCss; apply(params); }; function restoreCssDefaults() { if (confirmRestore()) { setFieldValues0(css_list, 'default'); applyCss(); } }; function apply(params) { hideOpenMenus(); window.preview.notice('<t>Loading...</t>'); $('.error-message').hide(); clearValidation(); $.post("/template/NamlServlet.jtp", params, function(data) { window.preview.location = '/'; } ); }; function showErrorMessage(group) { $('#error-message-'+group).show(); }; function clearValidation() { $('.error-field').removeClass('error-field'); }; function updateUI() { checkboxEnable('#show-search-box', '#search-box-alignment'); checkboxEnable('#show-app-title', '#app-title-alignment'); }; function checkboxEnable(checkbox, control) { var checked = $(checkbox).is(':checked'); var $control = $(control); if (checked) $control.removeAttr('disabled'); else $control.attr('disabled', true); }; function setEventHandlers() { $('#show-search-box').change(updateUI); $('#show-app-title').change(updateUI); }; $(document).ready(function() { layout(); $(window).resize(layout); setEventHandlers(); setFieldValues(); updateUI(); var $groups = $('span.change-appearance-group'); $groups.hover(function(){ $(this).css('color', selectedFont); }, function(){ $(this).css('color', 'inherit'); } ); $groups.click(function(e){ e.stopPropagation(); var $panel = $(this).next(); var isVisible = $panel.css('display') != 'none'; hideOpenMenus(); if (!isVisible) $panel.css('left', $(this).offset().left).slideDown('fast'); }); $(document).click(function(e) { var $t = $(e.target); if ($t.parents().hasClass('jscolor')) return; if ($t.parents().hasClass('change-appearance-group-panel')) return; hideOpenMenus(); }); }); <![CDATA[ function validateRange(id,from,to) { var $f = $(id); var v = $f.val(); if (!isInteger(v) || parseInt(v) < from || parseInt(v) > to) { $f.addClass('error-field').focus(); throw new Error(); } }; function validateMixedCsv(id,from,to) { var $f = $(id); var v = $f.val(); var parts = v.split(','); for (var i=0; i<parts.length; i++) { var v = parts[i]; if (!isInteger(v) || parseInt(v) < from || parseInt(v) > to) { $f.addClass('error-field').focus(); throw new Error(); } } }; function isInteger(s) { return (s.toString().search(/^-?[0-9]+$/) == 0); } var schemes = []; function addColorScheme(name, values) { var index = schemes.length; schemes.push({ name: name, values: values }); var h = '<div id="scheme'+index+'" class="color-scheme-row">'; h += '<b>'+name+'</b>'; for (var i=values.length-1;i>=0;i--) { h += '<div class="color-scheme" style="background:#'+values[i]+'"> </div>'; } h += '</div>'; $('#color-schemes-panel').append(h); var $scheme = $(Nabble.get('scheme'+index)); $scheme.click(function() { loadColorScheme(name); }); $scheme.hover(function() { $(this).css('background-color', '#777'); }, function() { $(this).css('background-color', 'transparent'); }); } function loadColorScheme(name) { for (var i=0;i<schemes.length;i++) { if (schemes[i].name == name) { var values = schemes[i].values; Nabble.get('bg-color').color.fromString(values[0]); Nabble.get('light-bg-color').color.fromString(values[1]); Nabble.get('shaded-bg-color').color.fromString(values[2]); Nabble.get('dark-bg-color').color.fromString(values[3]); Nabble.get('highlight-bg-color').color.fromString(values[4]); Nabble.get('text-color').color.fromString(values[5]); Nabble.get('text-weak-color').color.fromString(values[6]); Nabble.get('title-color').color.fromString(values[7]); Nabble.get('link-color').color.fromString(values[8]); Nabble.get('link-visited-color').color.fromString(values[9]); Nabble.get('input-text-color').color.fromString(values[10]); Nabble.get('input-bg-color').color.fromString(values[11]); Nabble.get('light-border-color').color.fromString(values[12]); Nabble.get('medium-border-color').color.fromString(values[13]); Nabble.get('dark-border-color').color.fromString(values[14]); Nabble.get('info-bg-color').color.fromString(values[15]); Nabble.get('info-text-color').color.fromString(values[16]); Nabble.get('error-bg-color').color.fromString(values[17]); Nabble.get('error-text-color').color.fromString(values[18]); return; } } }; ]]> $(document).ready(function() { addColorScheme("<t>Default</t>", ["FFFFFF", "F2F2F2", "EEEEEE", "DDDDDD", "FFFF99", "000000", "666666", "333333", "0000EE", "551A8B", "000000", "FFFFFF", "EEEEEE", "CCCCCC", "666666", "FFFFCC", "000000", "FFFFCC", "000000"]); addColorScheme("Desert 1", ["faf9f5", "f6f3ed", "efebe0", "e7dcc1", "ffff66", "454d4b", "807379", "4057ae", "4057ae", "4089AE", "000000", "FFFFFF", "EBE7DA", "E0DBCA", "D4CFBC", "FFFFCC", "000000", "FFFFCC", "000000"]); addColorScheme("Desert 2", ["F2F1ED", "E7E4DE", "D9D5C8", "D9CCAC", "FFFF66", "323836", "665C61", "465FBC", "014885", "2F6480", "000000", "FFFFFF", "C9C6B8", "B8B2A1", "A19B89", "FAFAC6", "000000", "FAFAC6", "000000"]); addColorScheme("Darkness", ["000000", "191919", "333333", "666666", "545500", "FFFFFF", "CCCCCC", "EEEEEE", "FFCC66", "FFFFCC", "FFFFFF", "332D25", "333333", "666666", "CCCCCC", "631900", "FFFFFF", "631900", "FFFFFF"]); addColorScheme("Moonlight", ["0F1528", "151C33", "1A2237", "21366E", "001C72", "9DAAD9", "CCCCCC", "EEEEEE", "75ADF5", "C4C3DF", "FFFFFF", "1E354D", "263A52", "3A536B", "4E5D7D", "1A2237", "FFFFFF", "4A0D0D", "FFFFFF"]); addColorScheme("Moonlight 2", ["1E2E40", "24374D", "2E4863", "365373", "7A6F33", "E3F0FF", "83ADDE", "B8B85C", "AEE0F2", "8AD1C1", "000000", "334A5E", "2D445E", "3C5A7D", "466A94", "59591D", "000000", "4A2125", "000000"]); addColorScheme("Jungle", ["2D3D1E", "3C4A2F", "000000", "OE24OC", "787D2F", "D6E6D4", "B1B888", "C9C42E", "64C447", "8EB85D", "000000", "0B3811", "0C1F09", "19360D", "154511", "544E14", "FFFFFF", "4D2020", "FFFFFF"]); addColorScheme("Princess", ["EDDCFF", "DACAE8", "FFEDF2", "DEC1E3", "C1B8FF", "000000", "26233B", "363BD1", "5A236B", "4E3170", "000000", "F0D3F0", "F3E0F6", "BBA3C4", "947696", "ABB1EB", "000000", "B2DFDF", "000000"]); addColorScheme("Autumn", ["FFFDF3", "FAF3DC", "F5ECD3", "E8DDC2", "FFD996", "0D0D0D", "998262", "71180C", "8B2113", "85610F", "000000", "FFFFFF", "F7E5AE", "EDDBA7", "DBCB9B", "F1E27D", "000000", "963330", "FFFFFF"]); addColorScheme("Dark Gray", ["3D3D3D", "333333", "191919", "000000", "545500", "FFFFFF", "CCCCCC", "EEEEEE", "FFCC66", "FFFFCC", "EEEEEE", "222222", "333333", "666666", "CCCCCC", "631900", "FFFFFF", "631900", "FFFFFF"]); }); </script> </macro> <macro name="change_appearance_body"> <div id="change-appearance"> <n.add_group name="Font" contents="[n.font_editor_panel/]" apply_call="applyFont()" restore_defaults_call="restoreFontDefaults()" width="25em"/> <n.add_group name="Color" contents="[n.color_editor_panel/]" apply_call="applyColor()" restore_defaults_call="restoreColorDefaults()" width="25em"/> <n.add_group name="Preferences" contents="[n.preferences_editor_panel/]" apply_call="applyPreferences()" restore_defaults_call="restorePreferencesDefaults()" width="30em"/> <n.add_group name="CSS" contents="[n.css_editor_panel/]" apply_call="applyCss()" restore_defaults_call="restoreCssDefaults()" width="30em"/> <button style="padding:0;margin-top:-.1em" onclick="closeFrame()"><t>Close</t></button> </div> <iframe id="preview-frame" name="preview" src="/" allowTransparency="false" border="0"/> </macro> <macro name="add_group" parameters="name, contents, apply_call, restore_defaults_call, width"> <span class="change-appearance-group rounded"> <n.name/> </span> <div class="change-appearance-group-panel drop-shadow" style="width:[n.width/]"> <a class="close-link" href="javascript:void(0)" onclick="hideOpenMenus()">×</a> <n.contents/> <div style="text-align:right;padding-top:.5em"> <span id="error-message-[n.to_lower_case.name/]" class="error-message">Please fix error(s) above.</span> <button class="toolbar action-button" onclick="[n.restore_defaults_call/]">Restore Defaults</button> <button class="toolbar action-button" onclick="[n.apply_call/]"> <img src="/images/success.png" style="vertical-align:middle"/> Apply </button> </div> </div> </macro> <macro name="font_editor_panel"> <table> <tr> <td class="label-column">Font Size:</td> <td><input type="text" size="3" maxlength="3" id="font-size" name="font-size" />%</td> </tr> <tr> <td></td> <td><div class="small-description" style="margin-bottom:1em">Value between 70 and 140% (default is 84%)</div></td> </tr> <tr> <td class="label-column">Main Font:</td> <td> <input type="text" size="20" maxlength="20" id="main-font" name="font" /> <button id="main-dropdown" class="toolbar" style="font-size:80%;vertical-align:middle"><b>Choose Font</b></button> <n.font_selector_panel id="main-font-selector" input_id="main-font"/> <n.custom_dropdown clickable_id="main-dropdown" panel_id="main-font-selector"/> </td> </tr> <tr> <td></td> <td><div class="small-description" style="margin-bottom:1em">Leave blank for default font.</div></td> </tr> <tr> <td class="label-column">Title Font:</td> <td> <input type="text" size="20" maxlength="20" id="title-font" name="font" /> <button id="title-dropdown" class="toolbar" style="font-size:80%;vertical-align:middle"><b>Choose Font</b></button> <n.font_selector_panel id="title-font-selector" input_id="title-font"/> <n.custom_dropdown clickable_id="title-dropdown" panel_id="title-font-selector"/> </td> </tr> <tr> <td></td> <td><div class="small-description">Leave blank for default font.</div></td> </tr> </table> </macro> <macro name="font_selector_panel" parameters="id, input_id"> <div id="[n.id/]" class="dropdown-box"> <div class="sub-section-title">Basic Fonts</div> <div style="padding:0 .5em;line-height:1.8em"> <n.basic_font_option input_id="[n.input_id/]" font="Sans-serif"/> <n.basic_font_option input_id="[n.input_id/]" font="Tahoma"/> <n.basic_font_option input_id="[n.input_id/]" font="Arial"/> <n.basic_font_option input_id="[n.input_id/]" font="Times"/> <n.basic_font_option input_id="[n.input_id/]" font="Courier New"/> <n.basic_font_option input_id="[n.input_id/]" font="Garamond"/> <n.basic_font_option input_id="[n.input_id/]" font="Georgia"/> <n.basic_font_option input_id="[n.input_id/]" font="Trebuchet MS"/> <n.basic_font_option input_id="[n.input_id/]" font="Verdana"/> </div> <div class="sub-section-title"> Google Web Fonts </div> <div style="padding:0 .5em;line-height:1.8em"> <n.google_font_option input_id="[n.input_id/]" font="Short Stack"/> <n.google_font_option input_id="[n.input_id/]" font="Open Sans"/> <n.google_font_option input_id="[n.input_id/]" font="Alice"/> <n.google_font_option input_id="[n.input_id/]" font="Questrial"/> <n.google_font_option input_id="[n.input_id/]" font="Rokkitt"/> <n.google_font_option input_id="[n.input_id/]" font="Varela Round"/> <n.google_font_option input_id="[n.input_id/]" font="Days One"/> <n.google_font_option input_id="[n.input_id/]" font="Copse"/> <n.google_font_option input_id="[n.input_id/]" font="Quattrocento"/> <n.google_font_option input_id="[n.input_id/]" font="Comfortaa"/> <n.google_font_option input_id="[n.input_id/]" font="Play"/> <n.google_font_option input_id="[n.input_id/]" font="Delius Swash Caps"/> <n.google_font_option input_id="[n.input_id/]" font="Lobster"/> <n.google_font_option input_id="[n.input_id/]" font="Kelly Slab"/> </div> <div class="small-description"> You can use any Google Web Font available (<a href="http://www.google.com/webfonts" target="_blank" rel="nofollow">view fonts</a>). Just type the name of the font with the prefix "GWF=" (for example, try "GWF=Marvel"). </div> </div> </macro> <macro name="preferences_editor_panel"> <table> <tr> <td><input type="checkbox" id="show-search-box"/></td> <td class="label-column"><label for="show-search-box">Show search box</label></td> <td> <select id="search-box-alignment"> <option value="left">Left</option> <option value="center">Center</option> <option value="right">Right</option> </select> </td> <td colspan="2"></td> </tr> <tr> <td><input type="checkbox" id="show-app-title"/></td> <td class="label-column"><label for="show-app-title">Show app title</label></td> <td> <select id="app-title-alignment"> <option value="left">Left</option> <option value="center">Center</option> <option value="right">Right</option> </select> </td> <td colspan="2"></td> </tr> <tr> <td></td> <td class="label-column">Description alignment</td> <td> <select id="app-description-alignment"> <option value="left">Left</option> <option value="center">Center</option> <option value="right">Right</option> </select> </td> <td colspan="2"></td> </tr> <tr> <td></td> <td class="label-column">Page layout</td> <td> <select id="page-layout"> <option value="wide">Wide</option> <option value="narrow">Narrow</option> </select> </td> <td colspan="2"></td> </tr> <tr> <td colspan="5"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td colspan="5" class="section-title"> Topics per page </td> </tr> <tr> <td></td> <td class="label-column">Forum</td> <td><input type="text" id="forum-topics-per-page" size="3"/></td> <td class="label-column">Blog</td> <td><input type="text" id="blog-topics-per-page" size="3"/></td> </tr> <tr> <td></td> <td class="label-column">Gallery</td> <td><input type="text" id="gallery-topics-per-page" size="3"/></td> <td class="label-column">Newspaper</td> <td><input type="text" id="news-topics-per-page" size="3"/></td> </tr> <tr> <td></td> <td class="label-column">Mixed</td> <td colspan="3"> <input type="text" id="mixed-topics-per-page" size="10"/> <a href="[n.help.mixed_lengths.url/]" target="_blank">help article</a> </td> </tr> <tr> <td colspan="5"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td colspan="5" class="section-title"> Classic topic page </td> </tr> <tr> <td></td> <td class="label-column">Picture size</td> <td colspan="3"> <select id="picture-size-classic"> <option value="big">Big</option> <option value="small">Small</option> </select> </td> </tr> <tr> <td></td> <td class="label-column">Posts per page</td> <td colspan="3"> <input type="text" id="classic-posts-per-page" size="3"/> </td> </tr> <tr> <td colspan="5"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td colspan="5" class="section-title"> Forum Format </td> </tr> <tr> <td style="vertical-align:top"><input type="radio" id="forum-format-topics" name="forum-format"/></td> <td colspan="4"> <label for="forum-format-topics"><b>Topics</b></label> <div class="small-description"> By selecting this format, your forum will show topics from all sub-forums in a flat list. This means you can browse topics without having to visit sub-forums. This format is only useful when you have sub-forums. </div> </td> </tr> <tr> <td style="vertical-align:top"><input type="radio" id="forum-format-standard" name="forum-format"/></td> <td colspan="4"> <label for="forum-format-standard"><b>Standard</b></label> <div class="small-description"> This format shows the list of topics on your forum front page. If you create a child forum, it will appear as a folder on top of the topics. Your forum may have multi-level sub-forums, but you only see topics and forums that are 1-level below your current forum. </div> </td> </tr> </table> </macro> <macro name="color_editor_panel"> <div style="margin-bottom:.4em"> <button id="color-schemes-button" class="toolbar" style="font-size:80%;vertical-align:middle"> <img src="/images/colors.png" width="12" height="12" style="vertical-align:middle"/> <b>Color Schemes</b> </button> <div id="color-schemes-panel" class="dropdown-box"></div> <n.custom_dropdown clickable_id="color-schemes-button" panel_id="color-schemes-panel"/> </div> <table> <tr> <td class="label-column">Background</td> <td><input class="color" id="bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Light Background</td> <td><input class="color" id="light-bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Shaded Background</td> <td><input class="color" id="shaded-bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Dark Background</td> <td><input class="color" id="dark-bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Highlight Background</td> <td><input class="color" id="highlight-bg-color" size="6"/></td> </tr> <tr> <td colspan="2"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td class="label-column">Text</td> <td><input class="color" id="text-color" size="6"/></td> </tr> <tr> <td class="label-column">Text (Weak Color)</td> <td><input class="color" id="text-weak-color" size="6"/></td> </tr> <tr> <td class="label-column">Title</td> <td><input class="color" id="title-color" size="6"/></td> </tr> <tr> <td class="label-column">Link</td> <td><input class="color" id="link-color" size="6"/></td> </tr> <tr> <td class="label-column">Link Visited</td> <td><input class="color" id="link-visited-color" size="6"/></td> </tr> <tr> <td colspan="2"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td class="label-column">Input Text</td> <td><input class="color" id="input-text-color" size="6"/></td> </tr> <tr> <td class="label-column">Input Background</td> <td><input class="color" id="input-bg-color" size="6"/></td> </tr> <tr> <td colspan="2"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td class="label-column">Light Border</td> <td><input class="color" id="light-border-color" size="6"/></td> </tr> <tr> <td class="label-column">Medium Border</td> <td><input class="color" id="medium-border-color" size="6"/></td> </tr> <tr> <td class="label-column">Dark Border</td> <td><input class="color" id="dark-border-color" size="6"/></td> </tr> <tr> <td colspan="2"> <hr color="#555" style="margin:0 0 .3em"/> </td> </tr> <tr> <td class="label-column">Info Message Background</td> <td><input class="color" id="info-bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Info Message Text</td> <td><input class="color" id="info-text-color" size="6"/></td> </tr> <tr> <td class="label-column">Error Message Background</td> <td><input class="color" id="error-bg-color" size="6"/></td> </tr> <tr> <td class="label-column">Error Message Text</td> <td><input class="color" id="error-text-color" size="6"/></td> </tr> </table> </macro> <macro name="css_editor_panel"> <div style="margin:.2em .2em .4em;font-weight:bold"> Enter your custom Cascading Stylesheet (CSS) code: </div> <textarea id="custom-css" style="width:98%;height:20em"></textarea> </macro> <macro name="basic_font_option" parameters="input_id,font"> <span class="rounded option-button" onclick="$('#[n.input_id/]').val('[n.font/]')" style="font-family:'[n.font/]'" ><n.font/></span> </macro> <macro name="google_font_option" parameters="input_id,font"> <n.put_in_head.> <link href="https://fonts.googleapis.com/css?family=[n.encode_url.encode_text.font/]" rel="stylesheet" type="text/css"/> </n.put_in_head.> <span class="rounded option-button" onclick="$('#[n.input_id/]').val('GWF=[n.font/]')" style="font-family:'[n.font/]'" ><n.font/></span> </macro> <macro name="save_font_config" requires="servlet"> <n.if.visitor.can_edit.root_node> <then> <n.naml_configuration.> <n.set> <name>fontSize</name> <value><n.font_size_value/></value> <default>84</default> <naml> <n.tweak_for_stylesheets.> body, input, button, textarea, select { font-size: <n.font_size_value/>%; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>titleFontFamily</name> <value><n.title_font_value/></value> <default></default> <naml> <n.tweak_for_font_family. selector=".second-font, h1, h2, h3, h4, h5, h6"> <n.title_font_value/> </n.tweak_for_font_family.> </naml> </n.set> <n.set> <name>mainFontFamily</name> <value><n.main_font_value/></value> <default></default> <naml> <n.tweak_for_font_family. selector="body, input, button, textarea, select"> <n.main_font_value/> </n.tweak_for_font_family.> </naml> </n.set> <n.apply/> </n.naml_configuration.> </then> </n.if.visitor.can_edit.root_node> </macro> <macro name="save_color_config" requires="servlet"> <n.if.visitor.can_edit.root_node> <then> <n.naml_configuration.> <n.set_color_tweak name="bgColor" value="[n.bg_color_value/]" default="FFFFFF" selector="html,#nabble,.nabble .no-bg-color" property="background-color" macro="bg_color"/> <n.set_color_tweak name="lightBgColor" value="[n.light_bg_color_value/]" default="F2F2F2" selector=".nabble .light-bg-color" property="background-color" macro="light_bg_color"/> <n.set_color_tweak name="shadedBgColor" value="[n.shaded_bg_color_value/]" default="EEEEEE" selector=".nabble .shaded-bg-color" property="background-color" macro="shaded_bg_color"/> <n.set_color_tweak name="darkBgColor" value="[n.dark_bg_color_value/]" default="DDDDDD" selector=".nabble .dark-bg-color" property="background-color" macro="dark_bg_color"/> <n.set_color_tweak name="highlightBgColor" value="[n.highlight_bg_color_value/]" default="FFFF99" selector=".nabble .highlight" property="background-color" macro="highlight_bg_color"/> <n.set_color_tweak name="textColor" value="[n.text_color_value/]" default="000000" selector=".nabble *" property="color" macro="text_color"/> <n.set_color_tweak name="textWeakColor" value="[n.text_weak_color_value/]" default="666666" selector=".nabble .weak-color" property="color" macro="text_weak_color"/> <n.set_color_tweak name="titleColor" value="[n.title_color_value/]" default="333333" selector=".nabble h1, .nabble h2, .nabble h3, .nabble h4, .nabble h5, .nabble h6" property="color" macro="title_color"/> <n.set_color_tweak name="linkColor" value="[n.link_color_value/]" default="0000EE" selector=".nabble a:link, .nabble a.not-visited-link" property="color" macro="link_color"/> <n.set_color_tweak name="linkVisitedColor" value="[n.link_visited_color_value/]" default="551A8B" selector=".nabble a:visited, .nabble a.visited-link" property="color" macro="link_visited_color"/> <n.set_color_tweak name="inputTextColor" value="[n.input_text_color_value/]" default="000000" selector=".nabble select, .nabble input, .nabble textarea" property="color" macro="input_text_color"/> <n.set_color_tweak name="inputBgColor" value="[n.input_bg_color_value/]" default="FFFFFF" selector=".nabble select, .nabble input, .nabble textarea" property="background-color" macro="input_bg_color"/> <n.set_color_tweak name="lightBorderColor" value="[n.light_border_color_value/]" default="EEEEEE" selector=".nabble .light-border-color" property="border-color" macro="light_border_color"/> <n.set_color_tweak name="mediumBorderColor" value="[n.medium_border_color_value/]" default="CCCCCC" selector=".nabble .medium-border-color" property="border-color" macro="medium_border_color"/> <n.set_color_tweak name="darkBorderColor" value="[n.dark_border_color_value/]" default="666666" selector=".nabble .dark-border-color" property="border-color" macro="dark_border_color"/> <n.set_color_tweak name="infoBgColor" value="[n.info_bg_color_value/]" default="FFFFCC" selector=".nabble .info-message, .nabble .info-message *" property="background-color" macro="info_bg_color"/> <n.set_color_tweak name="infoTextColor" value="[n.info_text_color_value/]" default="000000" selector=".nabble .info-message, .nabble .info-message *" property="color" macro="info_text_color"/> <n.set_color_tweak name="errorBgColor" value="[n.error_bg_color_value/]" default="FFFFCC" selector=".nabble .error-message, .nabble .error-message *" property="background-color" macro="error_bg_color"/> <n.set_color_tweak name="errorTextColor" value="[n.error_text_color_value/]" default="000000" selector=".nabble .error-message, .nabble .error-message *" property="color" macro="error_text_color"/> <n.apply/> </n.naml_configuration.> </then> </n.if.visitor.can_edit.root_node> </macro> <macro name="set_color_tweak" parameters="name, value, default, selector, property, macro" requires="naml_configuration"> <n.set> <name><n.name/></name> <value><n.value/></value> <default><n.default/></default> <naml> <![CDATA[ <override_macro name="]]><n.macro/><![CDATA["> ]]><n.value/><![CDATA[ </override_macro> <override_macro name="site_style" unindent="true"> <n.overridden/>]]> <n.selector/> { <n.property/>: #<n.value/>; } <![CDATA[ </override_macro> ]]> </naml> </n.set> </macro> <macro name="save_preferences_config" requires="servlet"> <n.if.visitor.can_edit.root_node> <then> <n.naml_configuration.> <n.set> <name>showSearchBox</name> <value><n.show_search_box_value/></value> <default>true</default> <naml> <n.tweak_for_stylesheets.> #search-box { display: none; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>searchBoxAlignment</name> <value><n.search_box_alignment_value/></value> <default>right</default> <naml> <n.tweak_for_stylesheets.> #search-box { text-align: <n.search_box_alignment_value/>; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>showAppTitle</name> <value><n.show_app_title_value/></value> <default>true</default> <naml> <n.tweak_for_stylesheets.> #forum-title { display: none; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>appTitleAlignment</name> <value><n.app_title_alignment_value/></value> <default>center</default> <naml> <n.tweak_for_stylesheets.> #forum-title { float: <n.app_title_alignment_value/>; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>appDescriptionAlignment</name> <value><n.app_description_alignment_value/></value> <default>center</default> <naml> <n.tweak_for_stylesheets.> #description-box { text-align: <n.app_description_alignment_value/>; } </n.tweak_for_stylesheets.> </naml> </n.set> <n.set> <name>pageLayout</name> <value><n.page_layout_value/></value> <default>wide</default> <naml> <![CDATA[ <override_macro name="apply_app_namespace" dot_parameter="do"> <n.narrow_app_namespace.do /> </override_macro> <override_macro name="apply_workgroup_app_namespace" dot_parameter="do"> <n.workgroup_narrow_app_namespace.do /> </override_macro> ]]> </naml> </n.set> <n.set> <name>pictureSizeClassic</name> <value><n.picture_size_classic_value/></value> <default>big</default> <naml> <![CDATA[ <override_macro name="has_small_avatar"> true </override_macro> ]]> </naml> </n.set> <n.set> <name>classicPostsPerPage</name> <value><n.classic_posts_per_page_value/></value> <default>20</default> <naml> <![CDATA[ <override_macro name="classic_rows_per_page"> ]]><n.classic_posts_per_page_value/><![CDATA[ </override_macro> ]]> </naml> </n.set> <n.set> <name>forumFormat</name> <value><n.forum_format_value/></value> <default>standard</default> <naml> <![CDATA[ <override_macro name="call_view_forum"> <n.call_view_topics/> </override_macro> ]]> </naml> </n.set> <n.set_tweak_for_simple_value name="forumTopicsPerPage" value="[n.forum_topics_per_page_value/]" default="35" macro="forum_topics_per_page" /> <n.set_tweak_for_simple_value name="blogTopicsPerPage" value="[n.blog_topics_per_page_value/]" default="10" macro="blog_topics_per_page" /> <n.set_tweak_for_simple_value name="galleryTopicsPerPage" value="[n.gallery_topics_per_page_value/]" default="16" macro="gallery_topics_per_page" /> <n.set_tweak_for_simple_value name="newsTopicsPerPage" value="[n.news_topics_per_page_value/]" default="25" macro="news_topics_per_page" /> <n.apply/> <n.set_tweak_for_simple_value name="mixedTopicsPerPage" value="[n.mixed_topics_per_page_value/]" default="6" macro="mixed_topics_per_page" /> <n.apply/> </n.naml_configuration.> </then> </n.if.visitor.can_edit.root_node> </macro> <macro name="save_css_config" requires="servlet"> <n.if.visitor.can_edit.root_node> <then> <n.naml_configuration.> <n.set> <name>customCss</name> <value><n.custom_css_value/></value> <default></default> <naml> <n.tweak_for_stylesheets.> <n.custom_css_value/> </n.tweak_for_stylesheets.> </naml> </n.set> <n.apply/> </n.naml_configuration.> </then> </n.if.visitor.can_edit.root_node> </macro> <macro name="set_tweak_for_simple_value" parameters="name, value, default, macro" requires="naml_configuration"> <n.set> <name><n.name/></name> <value><n.value/></value> <default><n.default/></default> <naml> <![CDATA[ <override_macro name="]]><n.macro/><![CDATA["> ]]><n.value/><![CDATA[ </override_macro> ]]> </naml> </n.set> </macro> <macro name="tweak_for_stylesheets" dot_parameter="code"> <![CDATA[ <override_macro name="site_style"> <n.overridden/> ]]> <n.compress.code/> <![CDATA[ </override_macro> ]]> </macro> <macro name="tweak_for_font_family" dot_parameter="font" parameters="selector"> <![CDATA[ <override_macro name="nabble_stylesheets" unindent="true"> <n.overridden/> ]]> <n.google_font_link.font/> <style type="text/css"> <n.selector/> { font-family: '<n.remove_gwf_prefix.font/>'; } </style> <![CDATA[ </override_macro> ]]> </macro> <macro name="google_font_link" dot_parameter="font"> <n.if.starts_with text="[n.font/]" prefix="GWF="> <then> <n.set_var. name="font_name"> <n.encode_url.encode_text.substring text="[n.font/]" begin="4"/> </n.set_var.> <![CDATA[ <link href='https://fonts.googleapis.com/css?family=]]><n.var name='font_name'/><![CDATA[' rel='stylesheet' type='text/css'/> ]]> </then> </n.if.starts_with> </macro> <macro name="remove_gwf_prefix" dot_parameter="font"> <n.if.starts_with text="[n.font/]" prefix="GWF="> <then.substring text="[n.font/]" begin="4"/> <else.font/> </n.if.starts_with> </macro> <macro name="font_size_value"> <n.get_parameter name="fontSize"/> </macro> <macro name="main_font_value"> <n.get_parameter name="mainFontFamily"/> </macro> <macro name="title_font_value"> <n.get_parameter name="titleFontFamily"/> </macro> <macro name="show_search_box_value"> <n.get_parameter name="showSearchBox"/> </macro> <macro name="search_box_alignment_value"> <n.get_parameter name="searchBoxAlignment"/> </macro> <macro name="show_app_title_value"> <n.get_parameter name="showAppTitle"/> </macro> <macro name="app_title_alignment_value"> <n.get_parameter name="appTitleAlignment"/> </macro> <macro name="app_description_alignment_value"> <n.get_parameter name="appDescriptionAlignment"/> </macro> <macro name="picture_size_classic_value"> <n.get_parameter name="pictureSizeClassic"/> </macro> <macro name="classic_posts_per_page_value"> <n.get_parameter name="classicPostsPerPage"/> </macro> <macro name="forum_format_value"> <n.get_parameter name="forumFormat"/> </macro> <macro name="forum_topics_per_page_value"> <n.get_parameter name="forumTopicsPerPage"/> </macro> <macro name="blog_topics_per_page_value"> <n.get_parameter name="blogTopicsPerPage"/> </macro> <macro name="gallery_topics_per_page_value"> <n.get_parameter name="galleryTopicsPerPage"/> </macro> <macro name="news_topics_per_page_value"> <n.get_parameter name="newsTopicsPerPage"/> </macro> <macro name="mixed_topics_per_page_value"> <n.get_parameter name="mixedTopicsPerPage"/> </macro> <macro name="custom_css_value"> <n.get_parameter name="customCss"/> </macro> <macro name="page_layout_value"> <n.get_parameter name="pageLayout"/> </macro> <macro name="bg_color_value"> <n.get_parameter name="bgColor"/> </macro> <macro name="light_bg_color_value"> <n.get_parameter name="lightBgColor"/> </macro> <macro name="shaded_bg_color_value"> <n.get_parameter name="shadedBgColor"/> </macro> <macro name="dark_bg_color_value"> <n.get_parameter name="darkBgColor"/> </macro> <macro name="highlight_bg_color_value"> <n.get_parameter name="highlightBgColor"/> </macro> <macro name="text_color_value"> <n.get_parameter name="textColor"/> </macro> <macro name="text_weak_color_value"> <n.get_parameter name="textWeakColor"/> </macro> <macro name="title_color_value"> <n.get_parameter name="titleColor"/> </macro> <macro name="link_color_value"> <n.get_parameter name="linkColor"/> </macro> <macro name="link_visited_color_value"> <n.get_parameter name="linkVisitedColor"/> </macro> <macro name="input_text_color_value"> <n.get_parameter name="inputTextColor"/> </macro> <macro name="input_bg_color_value"> <n.get_parameter name="inputBgColor"/> </macro> <macro name="light_border_color_value"> <n.get_parameter name="lightBorderColor"/> </macro> <macro name="medium_border_color_value"> <n.get_parameter name="mediumBorderColor"/> </macro> <macro name="dark_border_color_value"> <n.get_parameter name="darkBorderColor"/> </macro> <macro name="info_bg_color_value"> <n.get_parameter name="infoBgColor"/> </macro> <macro name="info_text_color_value"> <n.get_parameter name="infoTextColor"/> </macro> <macro name="error_bg_color_value"> <n.get_parameter name="errorBgColor"/> </macro> <macro name="error_text_color_value"> <n.get_parameter name="errorTextColor"/> </macro> <macro name="chance_appearance_configurations"> fontSize, mainFontFamily, titleFontFamily, bgColor, lightBgColor, shadedBgColor, darkBgColor, highlightBgColor, textColor, textWeakColor, titleColor, linkColor, linkVisitedColor, inputTextColor, inputBgColor, lightBorderColor, mediumBorderColor, darkBorderColor, infoBgColor, infoTextColor, errorBgColor, errorTextColor, showSearchBox, searchBoxAlignment, showAppTitle, appTitleAlignment, appDescriptionAlignment, pageLayout, forumTopicsPerPage, blogTopicsPerPage, newsTopicsPerPage, galleryTopicsPerPage, mixedTopicsPerPage, classicPostsPerPage, pictureSizeClassic, forumFormat, customCss </macro> Macros below define the default colors of Nabble and should be used by custom designs. Color configurations override these macros to change the colors of custom designs. <macro name="bg_color">FFFFFF</macro> <macro name="light_bg_color">F2F2F2</macro> <macro name="shaded_bg_color">EEEEEE</macro> <macro name="dark_bg_color">DDDDDD</macro> <macro name="highlight_bg_color">FFFF99</macro> <macro name="text_color">000000</macro> <macro name="text_weak_color">666666</macro> <macro name="title_color">333333</macro> <macro name="link_color">0000EE</macro> <macro name="link_visited_color">551A8B</macro> <macro name="input_text_color">000000</macro> <macro name="input_bg_color">FFFFFF</macro> <macro name="light_border_color">EEEEEE</macro> <macro name="medium_border_color">CCCCCC</macro> <macro name="dark_border_color">666666</macro> <macro name="info_bg_color">FFFFCC</macro> <macro name="info_text_color">000000</macro> <macro name="error_bg_color">FFFFCC</macro> <macro name="error_text_color">000000</macro>