Jump to content
CMSTOOLS.ru - форум поддержки и развития CMS
Обновление форума - Google аккаунт

Модуль Тема светлая и тёмная

Tisend
 Share

Recommended Posts

Tisend Enthusiast

Tisend

Posted
Posted (edited)

В бд в таблицу _users - добавляем  theme int(11)

Заходим в mod добавляем код 

case "theme":
	include ENGINE_DIR.'/modules/theme.php';
break;

В самом файле theme.php добавляем код 

<?php

if(!defined('MOZG'))
	die('Hacking attempt!');

if($ajax == 'yes')
	NoAjaxQuery();

if($logged){
	$act = $_GET['act'];
	$user_id = $user_info['user_id'];
	$id = intval($_GET['id']);

	switch($act){
		case "theme_user_0":
		NoAjaxQuery();
			if($user_id){			
				$row = $db->super_query("SELECT user_id FROM `".PREFIX."_users` WHERE user_id = '".$id."'");
				if($row['user_id'] == $user_id OR $row['user_id'] == $user_id){
					$db->query("UPDATE `".PREFIX."_users` SET theme = 0 WHERE user_id = '".$id."'");
					mozg_clear_cache_file('user_'.$id.'/profile_'.$id);
					mozg_clear_cache();
				}
			}
			die();
		break;
		
		case "theme_user_1":
			NoAjaxQuery();					
			if($user_id){			
				$row = $db->super_query("SELECT user_id FROM `".PREFIX."_users` WHERE user_id = '".$id."'");
				if($row['user_id'] == $user_id OR $row['user_id'] == $user_id){
					$db->query("UPDATE `".PREFIX."_users` SET theme = 1 WHERE user_id = '".$id."'");
					mozg_clear_cache_file('user_'.$id.'/profile_'.$id);
					mozg_clear_cache();
				}
			}
			die();
		break;

		default:
	}
	
	$tpl->clear();
	$db->free();
	
} else {
	$user_speedbar = $lang['no_infooo'];
	msgbox('', $lang['not_logged'], 'info');
}

Теперь заходим в profile.js добавляем код 

var theme = {
	theme_user_0: function(id){
		$.post('/index.php?go=theme&act=theme_user_0&id='+id);	
	},
	
	theme_user_1: function(id){
		$.post('/index.php?go=theme&act=theme_user_1&id='+id);	
	},
}

Теперь идём в index.php ищем код $tpl->load_template('main.tpl'); и внизу добавляем 

	$theme_my = $db->super_query("SELECT theme FROM `".PREFIX."_users` WHERE user_id = '{$user_id}'");	
	if($theme_my['theme']){ 
		$tpl->set('{theme}', '
			<a href="/" onClick="theme.theme_user_0({user_id});">
				<div class="Ser_cLick">
					<i class="Winn_priod">
						<svg fill="#009da0" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" class="feather feather-bulb"><path d="M12,6A6,6 0 0,1 18,12C18,14.22 16.79,16.16 15,17.2V19A1,1 0 0,1 14,20H10A1,1 0 0,1 9,19V17.2C7.21,16.16 6,14.22 6,12A6,6 0 0,1 12,6M14,21V22A1,1 0 0,1 13,23H11A1,1 0 0,1 10,22V21H14M20,11H23V13H20V11M1,11H4V13H1V11M13,1V4H11V1H13M4.92,3.5L7.05,5.64L5.63,7.05L3.5,4.93L4.92,3.5M16.95,5.63L19.07,3.5L20.5,4.93L18.37,7.05L16.95,5.63Z"></path></svg>
					</i> 
					<name class="Ser_cLick1"> Включить свет</name>
				</div>
			</a>');
	}else{
		$tpl->set('{theme}', '
			<a href="/" onClick="theme.theme_user_1({user_id});">
				<div class="Ser_cLick">
					<i class="Winn_priod">
						<svg fill="#009da0" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg" class="feather feather-bulb"><path d="M12,6A6,6 0 0,1 18,12C18,14.22 16.79,16.16 15,17.2V19A1,1 0 0,1 14,20H10A1,1 0 0,1 9,19V17.2C7.21,16.16 6,14.22 6,12A6,6 0 0,1 12,6M14,21V22A1,1 0 0,1 13,23H11A1,1 0 0,1 10,22V21H14M20,11H23V13H20V11M1,11H4V13H1V11M13,1V4H11V1H13M4.92,3.5L7.05,5.64L5.63,7.05L3.5,4.93L4.92,3.5M16.95,5.63L19.07,3.5L20.5,4.93L18.37,7.05L16.95,5.63Z"></path></svg>
					</i> 
					<name class="Ser_cLick1"> Отключить свет</name>
				</div>
			</a>'); 
	}
	
	$theme_style = $db->super_query("SELECT theme FROM `".PREFIX."_users` WHERE user_id = '{$user_id}'");	
	if($theme_style['theme']){ 
		$tpl->set('{theme_style}', 'theme/black');
	}else{
		$tpl->set('{theme_style}', 'style'); 
	}

Дальше идём в шаблон main.tpl ищем код style.css свой заменяем его на 

	<link rel="stylesheet" type="text/css" href="/css/{theme_style}.css">

дальше вставляем в шапку этот код {theme}

затем создаём папку, и style - пример css/theme/black.css

свои style меняем на чёрный в black.css файл

Если где-то что-то не понятно сообщайте 

 

В итоге у вас должно получиться так

image.png.2c09e36eecc5ae13f978872904dfc7ee.png

image.png.929424d8014814162bd80d925193faf0.png

Edited by Tisend
  • Like 1
Link to comment
Share on other sites
KirKMS Proficient

KirKMS

Posted
Posted

Слишком много ненужного кода 

profile js 

var design = {
	add: function(id){
		$.post('/index.php?go=editprofile&act=change_color', {id: id}, function(d) {
			
	    location.reload(true)

		});
	}
}

 

main.tpl в моём случае у меня другой дизайн 

<a href="/" onclick="design.add({design_id}); return false" class="account-item">
    <div class="media">
        <div class="icon-wrap">
            {icon_design}
        </div>
        <div class="media-content">
            <h3>Сменить дизайн</h3>
            <small>{text_small}</small>
        </div>
    </div>
</a>

editprofile.php 

		case "change_color":
		NoAjaxQuery();
		   $id_design = intval($_POST['id']);
		       if($id_design == 1){$users_design = 2;}else if($id_design == 2 ){$users_design = 1;}
		           $db->query("UPDATE `".PREFIX."_users` SET user_design = '{$users_design}' WHERE user_id = '{$user_info['user_id']}'");
		    echo 'ok';
			die();
		break;

 

В mySql  таблица users новое поле user_design int 1

И index.php в моём случае так. Так как  сборка моя 

	$users_row = $db->super_query("SELECT user_photo,user_name,user_lastname,user_design FROM `".PREFIX."_users` WHERE user_id = '{$user_info['user_id']}'");
	
	if($users_row['user_design'] == 1){
		$tpl->set('{design_id}', 1);
		$tpl->set('{core}', 'core');
		$tpl->set('{di_4199}', 'di_4199');
		$tpl->set('{text_small}', 'Включить тёмную тему.');
		$tpl->set('{icon_design}', '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>');

	}elseif($users_row['user_design'] == 2){
		$tpl->set('{design_id}', 2);
		$tpl->set('{core}', 'core_black');
		$tpl->set('{di_4199}', 'di_4199_black');
		$tpl->set('{text_small}', 'Включить светлую тему.');
		$tpl->set('{icon_design}', '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>');

	}

 

ну и выводим в main.tpl всё из index.php 

Но можно сделать ещё проще и с меньшим кодом.

Например: https://github.com/nickdeny/darkmode-js

Живое демо : https://nickdeny.github.io/darkmode-js/

Скачать: darkmode-js-master.zip

  • Upvote 2
Link to comment
Share on other sites
Tisend Enthusiast

Tisend

Posted
  • Author
Posted
4 часа назад, KirKMS сказал:

Слишком много ненужного кода 

profile js 

var design = {
	add: function(id){
		$.post('/index.php?go=editprofile&act=change_color', {id: id}, function(d) {
			
	    location.reload(true)

		});
	}
}

 

main.tpl в моём случае у меня другой дизайн 

<a href="/" onclick="design.add({design_id}); return false" class="account-item">
    <div class="media">
        <div class="icon-wrap">
            {icon_design}
        </div>
        <div class="media-content">
            <h3>Сменить дизайн</h3>
            <small>{text_small}</small>
        </div>
    </div>
</a>

editprofile.php 

		case "change_color":
		NoAjaxQuery();
		   $id_design = intval($_POST['id']);
		       if($id_design == 1){$users_design = 2;}else if($id_design == 2 ){$users_design = 1;}
		           $db->query("UPDATE `".PREFIX."_users` SET user_design = '{$users_design}' WHERE user_id = '{$user_info['user_id']}'");
		    echo 'ok';
			die();
		break;

 

В mySql  таблица users новое поле user_design int 1

И index.php в моём случае так. Так как  сборка моя 

	$users_row = $db->super_query("SELECT user_photo,user_name,user_lastname,user_design FROM `".PREFIX."_users` WHERE user_id = '{$user_info['user_id']}'");
	
	if($users_row['user_design'] == 1){
		$tpl->set('{design_id}', 1);
		$tpl->set('{core}', 'core');
		$tpl->set('{di_4199}', 'di_4199');
		$tpl->set('{text_small}', 'Включить тёмную тему.');
		$tpl->set('{icon_design}', '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-moon"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>');

	}elseif($users_row['user_design'] == 2){
		$tpl->set('{design_id}', 2);
		$tpl->set('{core}', 'core_black');
		$tpl->set('{di_4199}', 'di_4199_black');
		$tpl->set('{text_small}', 'Включить светлую тему.');
		$tpl->set('{icon_design}', '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-sun"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>');

	}

 

ну и выводим в main.tpl всё из index.php 

Но можно сделать ещё проще и с меньшим кодом.

Например: https://github.com/nickdeny/darkmode-js

Живое демо : https://nickdeny.github.io/darkmode-js/

Скачать: darkmode-js-master.zip  0   9 кБ

Я сделал так чтобы работала а много кода или мало это вам решать 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
 Share
Go to topic listing
×
×
  • Create New...