بسم الله الرحمن الرحيم
المظهر العادي و الداكن لنسخة ModernBB
المظهر العادي هو شكل الاستايل من غير تغيير اما المظهر الداكن يجعل الاستايل مظلم ,
معاينة الكود :
https://i.servimg.com/u/f30/20/35/61/89/feewr610.gif
تركيب الكود :
اول شيء اذهب الى لوحة الادارة > عناصر إضافية > إدارة أكواد Javascript
الكود:
(function() {
// 3 = modernbb
var version = 3; // forum version
window.fa_theme_color = {
version : version,
// elements the selector is attached to
attachTo : [
'.نوار2000', // سبحان الله
'.نوار2000', // اللهم صل وسلم على محمد
'.نوار2000', // وفوق كل ذي علم عليم
'.نوار2000' // لا تنسى ذكرا الله
][version],
selected : my_getcookie('fa_theme_color') || 'اختيار', // selected theme
// color palettes
palette : {
'☼ العادي' : '',
'☾ الداكن' : [],
},
// change the current theme
change : function(color, select) {
var head = $('head'),
style = document.getElementById('fa_theme_style');
my_setcookie('fa_theme_color', color, true); // update selected theme
// remove old styles
if (style) {
head[0].removeChild(style);
}
// Random / Normal Themes
if (!/Select a theme|Rainbow/.test(color) && fa_theme_color.palette[color]) {
fa_theme_color.selected = color == '☾ الداكن' ? fa_theme_color.palette['☾ الداكن'][Math.floor(Math.random() * fa_theme_color.palette['☾ الداكن'].length)] : color;
fa_theme_color.selector.style.backgroundColor = fa_theme_color.palette[fa_theme_color.selected][1];
fa_theme_color.selector.style.borderColor = fa_theme_color.palette[fa_theme_color.selected][2];
head.append('<style type="text/css" id="fa_theme_style">' + fa_theme_color.css() + '</style>');
} else if (color == 'Rainbow') { // Rainbow theme
if (fa_theme_color.stop) {
fa_theme_color.selected = color;
fa_theme_color.selector.style.backgroundColor = fa_theme_color.palette[select][1];
fa_theme_color.selector.style.borderColor = fa_theme_color.palette[select][2];
head.append('<style type="text/css" id="fa_theme_style">' + fa_theme_color.css(select) + '</style>');
} else {
fa_theme_color.rainbow();
}
} else { // No theme
fa_theme_color.selector.style.backgroundColor = '#999';
fa_theme_color.selector.style.borderColor = '#888';
}
// delete rainbow assets if it's not selected
if (color != 'Rainbow' && fa_theme_color.stop) {
if (!fa_theme_color.transition_all) {
head[0].removeChild(document.getElementById('fa_rainbow_smoothness'));
}
window.clearInterval(fa_theme_color.interval);
delete fa_theme_color.index;
delete fa_theme_color.stop;
}
},
// get and return the theme CSS per version
css : function(select) {
var palette = fa_theme_color.palette[select || fa_theme_color.selected],
all = '::-webkit-scrollbar-track { background:#DDD; }'+
'::-webkit-scrollbar-button:horizontal:increment { background-position:-51px 0 }'+
'::-webkit-scrollbar-thumb:active, ::-webkit-scrollbar-button:active { background-color:' + palette[3] + ' !important; }';
switch (fa_theme_color.version) {
case 3 : // invision
return'#wrap, body, html, h1.page-title, #cp-main .panel {
color: #d4d0d0!important;
background: #000!important;
' + palette[3] + '!important; }'+
'#tabs ul a span, .fa_like_div, #picture_legend, .fa_dislike_list, .fa_like_list, .forumbg table.table1, .mod-news-footer, .is-sticky#headerbar-top, #privmsgs-menu, .block-footer, .module-footer, .chatbox_row_1, #chatbox_header {
background-color: #2c353b!important;
color:#d4d0d0!important; }'+
'ul.forums, .block, dt label, .module, fieldset.polls dt, p.author, dl.faq dt, dd label, label, #cp-main .panel + h1, #cp-main h1, .panel, table.table1 td, .mod-news, .row1, .row2, .row3, li.row:hover {
background-color: #1f1f1f!important;
color: #d4d0d0!important; }'+
'a:link, a {
color:#fff!important; }'+
'li.row, .pagination span strong {
border-color: #444!important; }'+
'.postbody .content, .content, .postprofile {
color: #fff!important; }'+
'#comments_scroll_div:after {
box-shadow: 0 0 18px 9px #fff0 inset!important; }'+
'body.chatbox {
background-color: #101010;
background-image: none;
margin-top: 0!important; }'+
'.navbar a:hover {
background-color: #607d8b;
}'+
'.block .h3, .h3, h3 {
color: #d4d0d0!important; }'+
'select {
background-color: #fbfbfbe0;
color: black;
}'+
'#profile-tab-field-profil dl dt, #profile-tab-field-profil dl dt span, #ucp fieldset dl dt label, #ucp fieldset dt, #ucp fieldset dt span,.postprofile .label span, .postprofile .label {
color: #fff!important;
font-weight: bold;
}'+
'span.label {
color: #131107;
display: inline-block;
margin: 2px;
background: aliceblue;
}'+
'dl.codebox {
background-color: rgb(96 125 139 / 31%);
border-color: #607d8b;
}'+
'.quick-nav-topics a, .inputbox, input[type="text"] {
color: #0e0e0e;
background-color: #ffffffc2;
}'+
all;
default : // unknown
return ''+
all;
}
},
// get and return the transition CSS per version
// helps make the transition in colors smooth
applyTransitionRules : function() {
switch (fa_theme_color.version) {
default : // unknown
return '';
}
},
// setup the rainbow assets
rainbow : function() {
if (!fa_theme_color.transition_all) {
$('head').append('<style type="text/css" id="fa_rainbow_smoothness">' + fa_theme_color.applyTransitionRules() + '</style>');
}
fa_theme_color.index = 0;
fa_theme_color.stop = fa_theme_color.palette['☾ الداكن'].length;
fa_theme_color.change('Rainbow', fa_theme_color.palette['☾ الداكن'][fa_theme_color.index]);
fa_theme_color.interval = window.setInterval(function() {
if (++fa_theme_color.index >= fa_theme_color.stop) {
fa_theme_color.index = 0;
}
fa_theme_color.change('Rainbow', fa_theme_color.palette['☾ الداكن'][fa_theme_color.index]);
}, fa_theme_color.transition + fa_theme_color.delay);
}
};
var htmlStr = '', i;
// put together the theme options and random array
for (i in fa_theme_color.palette) {
if (typeof fa_theme_color.palette[i] != 'undefined') {
if (!/Random theme|Select a theme|Rainbow/.test(i)) {
fa_theme_color.palette['☾ الداكن'][fa_theme_color.palette['☾ الداكن'].length] = i;
}
htmlStr += '<option value="' + i + '" ' + ( fa_theme_color.selected == i ? 'selected="true"' : '' ) + ' style="background-color:' + (/Random theme|Select a theme|Rainbow/.test(i) ? '#FFF;color:#000;' : fa_theme_color.palette[i][2]) + '">' + i + '</option>';
}
}
// create the theme selector
fa_theme_color.selector = $('<select id="نوار20000" />').html(htmlStr).change(function() {
fa_theme_color.change(this.value);
})[0];
fa_theme_color.change(fa_theme_color.selected); // apply the selected theme
// add the theme selector to the document
$(function() {
$(fa_theme_color.attachTo).after([fa_theme_color.selector, $('<div class="clear" />')[0]]);
});
// basic styles for the theme selector
document.write('<style type="text/css">نوار20000 {margin:3px;}' + ( fa_theme_color.transition_all ? fa_theme_color.applyTransitionRules() : '' ) + '</style>');
}());
ثاني شيء اذهب الى التومبيلات والقوالب > قالب overall_footer_begin وابحث عن الكود التالي
الكود:
<div class="statistics">
ثم ضع الكود التالي فوقه مباشرة
الكود:
<style>
select#نوار20000 {
background: #27424e!important;
border: solid #9e9e9e 1px!important;
border-radius: 11px!important;
color: #f0ffff!important;
float: right;
margin-left: 5px;
}
.نوار2000 {
margin: 7px 15px 5px 6px;
float: right;
}
.اليل-و-النهار {
width: max-content;
margin-right: 3px;
background-color: #4a6471;
color: #FFF;
font-size: 1.3rem;
padding: 7px;
}
</style>
<div class="اليل-و-النهار">
<div class="نوار2000">المظهر</div>
</div>
ويمكن للمدير من خلال الجفا ان يغير كما يريد من درجة الالوان في المظهر الداكن
و يمكنه ان يغير اي شيء لا يعجبه من المظهر الداكن من كود الجفا,
ملاحظة...
هذا الكود مناسب لنسخة ModernBB فقط ولا يعمل مع الاستايلات المحولة والتي لا تعمل مع القوالب الرسمية
منقول
بالتوفيق للجميع
والسلام ختام
