27. Форма добавления комментариев
Для добавления комментариев служит форма formaddsay.html.php
Листинг 43. form_addsay.html.php Путь: news/chat/say/ form_addsay.html.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
<title>Добавление</title>
</head>
<!– При нажатии кнопок формы идем на страницу сепарации переменных –>
<form action="/chat/say/separate_action.php" method="post" class="say">
<div>
<label for="saytext" class="say">Введите ваш комментарий:</label>
<textarea id="saytext" name="saytext" rows="5" cols="60" autofocus><?php if (isset($_SESSION['txt'])) {
echo htmlout($_SESSION['txt']);} ?></textarea>
</div>
<br />
<div class="">
<div class="">
<div class="says">
<input type="hidden" name="userid" value="Добавить">
<input type="hidden" name="pageid" value="<?php echo $pageid ?>">
<input type="hidden" name="sayid" value="<?php if (isset($sayid)) {
echo $sayid;
} ?>">
<input type="submit" name="action" value="Добавить">
<input type="submit" name="smileblock" value="Показать смайлы" style="">
<input type="submit" name="smileblock_close" value="Скрыть смайлы" style="">
</div>
<div class="notaddsay" id=""><a href="?">Отмена</a></div>
</div>
<br>
<hr>
<!– Вставляем лист доступных смайлов –>
<div class="smilesetdiv" id="">
<fieldset class="smileset" style="<?php if (isset($_SESSION['smileblock'])) {
echo $_SESSION['smileblock'];
} ?>">
<?php print_smile_set(); ?>
</fieldset>
</div>
</div>
<br />
</form>
</body>
</html>
Это HTML форма состоящая из следующих частей:
• Поле ввода комментариев тип textarea,autofocus.
• Кнопки «Добавить», «Показать смайлы», «Скрыть смайлы» тип input submit.
• Ссылка «Отмена», при нажатии обнуляет все значения в $_GET.
• Блок смайлов, который выводит доступный набор смайлов.
28. Обработка комментариев
Для обработки комментариев служит скрипт makeformaddsay.php
Листинг 44. makeformaddsay.php Путь: news/chat/say/ makeformaddsay.php
<?php
error_reporting(E_ALL);
if(session_id() == '') {session_start();}
unset($_SESSION['txt']);
if (isset($_POST['nosay'])) {
$_GET['addsay'] ='';
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект
exit();
}
/* Проверяем наличие текста в форме */
if (empty($_POST['saytext'])) {
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект
exit();
}
if (isset($_POST['action']) and $_POST['action'] == "Добавить") {
include_once $_SERVER['DOCUMENT_ROOT'].'/chat/dsn.php';
include_once $_SERVER['DOCUMENT_ROOT'] .'/chat/admin/clean.php';
/* Получаем id текущего пользователя */
if(isset($_SESSION['userid'])) {
$userid = $_SESSION['userid'];
}
/* заносим текст в базу */
try {
$sql = 'INSERT INTO say SET
saytext = :saytext,
userid = :userid,
page_id = :page_id,
saydate = :saydate';
$s = $dsn->prepare($sql);
$saytext = html($_POST['saytext']);
$saydate = time();
$page_id = $_POST['page_id'];
$s->bindValue(':saytext',$saytext);
$s->bindValue(':saydate',$saydate);
$s->bindValue(':userid',$userid);
$s->bindValue(':page_id',$page_id);
$s->execute();
}
catch (PDOException $e) {
echo 'makeformaddsay ошибка вставки комментария';
echo 'sdsd'.$page_id;
echo $e->getMessage();
echo $e->getLine();
exit();
}
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект
exit();
}
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект
exit();
Скрипт также выполнен в отдельном файле во избежание проблем с сохранением $_POST в браузере. В нем проверяются данные отправленные из формы formaddsay.html.php «Добавить комментарии» и заносятся в БД.
29. Форма редактирования комментариев
Для редактирования комментариев служит форма form_editsay.html.php
Листинг 45. form_editsay.html.php Путь: news/chat/say/ form_editsay.html.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="<?= $_SERVER['HTTP_ORIGIN'].'/chat/style.css'; ?>"/>
</head>
<body>
<form action="" method="post" class="sayedit">
<div>
<label for="saytext" class="say"><h4>Редактировать комментарий:</h4></label>
<hr>
<textarea id="saytext" name="saytext" rows="6" cols="80" maxlength="100" autofocus><?= $_POST['saytext'];?></textarea>
</div>
<br/>
<div class="">
<div class="says">
<input type="hidden" name="sayid" value="<?= $_POST['textedit'];?>">
<input type="submit" name="sayedit" value="Редактировать">
<input type="submit" name="actionnot" value="Отмена">
</div>
<br><hr>
<div class="smilesetdiv" id="">
<fieldset class="smileset" style="">
<?php print_smile_set();?>
</fieldset>
</div>
</div>
<br/>
</form>
</body>
</html>
Это HTML форма в которой можно отредактировать комментарий. Состоит из:
• Поле редактирования textarea со значением по умолчанию равным $_POST['saytext'].
• Кнопок «Редактировать» и «Отмена».
• Набор для выбора доступных смайлов.
30. Скрипт редактирования комментариев
Для редактирования комментариев служит файл sayedit.php
Листинг 46. sayedit.php Путь: news/chat/say/ sayedit.php
<?php
error_reporting(E_ALL);
if(session_id() == '') {session_start();}
include_once $_SERVER['DOCUMENT_ROOT'] .'/chat/admin/clean.php';
include $_SERVER['DOCUMENT_ROOT'].'/chat/function/print_smile_set.php';
/* Сохраняем переменную идентефикатор поста */
if (isset($_POST['textedit']) and $_POST['textedit'] != ""){
$_SESSION['idsave'] = $_POST['textedit'];
} else {
$_POST['textedit'] = $_SESSION['idsave'];
}
/* Заносим в базу и делаем редирект */
if (isset($_POST['sayedit']) and $_POST['sayedit'] == "Редактировать") {
try {
include_once $_SERVER['DOCUMENT_ROOT'].'/chat/dsn.php';
$sql = 'UPDATE say SET saytext = :saytext WHERE id = :id';
$s = $dsn ->prepare($sql);
$s->bindValue(':saytext', $_POST['saytext']);
$s->bindValue(':id', $_POST['sayid']);
$res = $s->execute();
unset ($_SESSION['idsave']);
header("Location: /");
exit();
}
catch (PDOexeption $e) {
echo $e->getMessage();
echo $e->getLine();
exit('error.html.php');
}
exit();
}
/* Контролируем нажатия кнопок */
if (isset($_POST['actionedit']) and $_POST['actionedit'] == "Редактировать") {
include $_SERVER['DOCUMENT_ROOT'].'/chat/say/form_editsay.html.php';
exit();
}
if (isset($_POST['smile'])) {
$_POST['saytext'] = $_POST['saytext'].$_POST['smile'];
include $_SERVER['DOCUMENT_ROOT'].'/chat/say/form_editsay.html.php';
}
if (isset($_POST['actionnot']) and $_POST['actionnot'] == "Отмена") {
header("Location: /");// Делаем редирект
exit();
}
В этом файле происходит обработка данных переданных из формы form_editsay.html.php. Контролируется нажатие кнопок «Редактировать», «Отмена» и вставки исмайлов. Производится обновление текста комментария и добавление обновленного текста в БД.
31. Создаем массив ответов на комментарии
Для этого используем скрипт list_reply.php
Листинг 47. list_reply.php Путь: news/chat/say/ list_reply.php
<?php
/* Формируем массив ответов на комментарии */
/* SELECT say.id, say.userid, say.saydate, say.saytext, users.login, users.img FROM say INNER JOIN users ON users.`id` = say.userid */
try {
$sql = 'SELECT reply.id, reply.userid, reply.replydate, reply.replyid, reply.replytext, users.login, users.img FROM reply INNER JOIN users ON users.id = reply.userid';
$stm = $dsn->query($sql);
} catch (PDOException $e) {
echo $e->getMessage();
echo $e->getLine();
exit();
}
foreach ($stm as $rows) {
$reply[] = array(
'id' => $rows['id'],
'replytext' => $rows['replytext'],
'userid' => $rows['userid'],
'replyid' => $rows['replyid'],
'img' => $rows['img'],
'login' => $rows['login'],
'replydate' => $rows['replydate'],
'userid' => $rows['userid']
);
}
Выбираем данные из таблицы reply, где id пользователя в таблице users совпадает со значением reply.userid. Т.е. выбираем ответы на комментарии для конкретного пользователя, соответствующие номеру комментария.
32. Обертка вывода ответов на комментарии
Для печати комментариев служит страница print_reply.html.php
Листинг 48. print_reply.html.php Путь: news/chat/say/ print_reply.html.php
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
</head>
<div class="wrap_reply_form" id="">
<?php
if (isset($reply)) {
foreach ($reply as $replylist) :
/* Активация кнопок */
if (userHasRole('admin')) {
$buttonactive = 'submit'; //если админ делаем активными все кнопки
} elseif ($replylist['userid'] == $userid) {
$buttonactive = 'submit'; //делаем активными кнопки для юзера
} else {
$buttonactive = 'hidden'; //отключаем кнопки
}
if ($post_id == $replylist['replyid']) {
$comment = $replylist['replytext'];
echo '<div class="block_reply">'; //делаем общий div для кнопки и ответа
include $_SERVER['DOCUMENT_ROOT'] . '/chat/say/form_reply.html';
include $_SERVER['DOCUMENT_ROOT'] . '/chat/say/reply_delete_button.html';
echo '</div>' . '</br>';
}
endforeach;
}
?>
</div> <!– .wrap_reply_form –>
</html>
В скрипте проверяем какие кнопки доступны для данного пользователя. Доступные выводим. Для ответов возможность редактирования не предусмотрена, поэтому только «Удалить». Эта кнопка доступна только автору ответа и администратору. Затем обрабатываем и печатаем ответ на комментарий, полученный из предыдущего скрипта list_reply.php.
33. Форма ответа на комментарий
Для вывода ответа на комментарий используем файл form_reply.html
Листинг 49. form_reply.html Путь: news/chat/say/ form_reply.html
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
</head>
<div class="reply_form">
<div class="topreply" id="">
<b><?= $replylist['login'] ?></b><span style="float:right;">
<?php $t = $replylist['replydate'];
echo date("d.m.Y", "$t");?>
</span>
</div>
<img src="<?='/chat/admin/users/'.$replylist['img']?>" class="avareply" align="left" />
<?php comment_to_smile($comment); ?>
</div>
Выводит логин пользователя, дату оставления ответа, аватар пользователя, текст ответа. Для span выводящего дату стили указаны непосредственно в файле, но можно присвоить класс при необходимости.
34. Страница ответов на комметарии
Выводим страницу с ответами на комментарии list_reply.html.php
Листинг 50. list_reply.html.php Путь: news/chat/say/ list_reply.html.php
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
</head>
<!– Обертка –>
<div class="wrapsayform" >
<?php
if (!empty($reply)) {
foreach ($reply as $replylist) :
?>
<div class="sayform" id="">
<div class="printcomment" id="">
<?php
if ($post_id == $replylist['replyid']) {
$comment = $replylist['replytext'];
comment_to_smile($comment);
echo '#' . $replylist['id'];
echo '#' . $replylist['replyid'] . $replylist['login'] . $replylist['img'];
/* Активация кнопок */
if (userHasRole('admin')) {
$buttonactive = 'submit'; //если админ делаем активными все кнопки
} elseif ($saylist['userid'] == $userid) {
$buttonactive = 'submit'; //делаем активными кнопки для юзера
} else {
$buttonactive = 'hidden'; //отключаем кнопки
} ?>
</div>
</div>
<div class="blocksayform" id="">
<div class="sayforms">
<form name="sayform" method="post" action="/chat/say/reset.php" class="logout">
<input type="hidden" name="pageid" id="" value=" <?php echo $pageid; ?>" />
<input type="hidden" name="deleteid" id="" value=" <?php echo $replylist['id']; ?>" />
<input type="<?= $buttonactive ?>" name="delete" id="" value="Удалить" />
</form>
</div>
<?php
}
endforeach;
}
?>
</div>
<div class="add_reply" id="">
<?php
if (isset($_SESSION['login'])) {
if (isset($_GET['reply']) and $_GET['reply'] == $post_id) {
include_once $_SERVER['DOCUMENT_ROOT'] . '/say/form_add_reply.html.php';
}
}
?>
</div>
</div>
</html>
На этой странице в цикле foreach – endforeach выводим все ответы на данный комментарий. Показываем кнопку «Удалить». Проверяем необходимость вставки формы для добавления ответа form_add_reply.html.php' на данный комментарий. Необходимость определяется наличием переменной $_GET['reply'].
35. Форма добавления ответов на комментарии
Для добавления ответов на комментарии служит форма form_add_reply.html.php
Листинг 51. form_add_reply.html.php Путь: news/chat/say/ form_add_reply.html.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
</style>
</head>
<form action="/chat//say/separate_action.php" method="post" class="say">
<fieldset class="chatfieldset">
<legend>Ответить на комментарий:</legend>
<textarea class="saytext" name="replytext" rows="5" cols="50" autofocus><?php if(isset($_SESSION['txt'])){
echo htmlout($_SESSION['txt']);}?></textarea>
<br />
<div class="">
<div class="says">
<input type="hidden" name="userid" value="Добавить">
<input type="hidden" name="pageid" value="<?php echo $pageid ?>">
<input type="hidden" name="sayid" value="<?php if(isset($sayid)) {echo $sayid;} ?>">
<input type="hidden" name="deleteid" id="" value=" <?php echo $saylist['id'];?>" />
<input type="hidden" name="postid" id="" value=" <?php htmlout($post_id);?>" />
<input type="submit" name="action" value="Ответить">
<input type="submit" name="smileblock" value="Показать смайлы">
<input type="submit" name="smileblock_close" value="Скрыть смайлы">
</div>
<div class="notaddsay" id=""><a href="?" class="notaddsays">Отмена</a></div>
</div>
</fieldset>
<br>
<hr>
<div class="smilesetdiv">
<fieldset class="smileset" style="<?php if (isset($_SESSION['smileblock'])) {echo $_SESSION['smileblock'];} ?>">
<?php print_smile_set();?>
</fieldset>
</div>
<br />
</form>
</html>
Это HTML форма состоящая из следующих частей:
• Поле ввода комментариев тип textarea,autofocus.
• Кнопки «Добавить», «Показать смайлы», «Скрыть смайлы» тип input submit.
• Ссылка «Отмена», при нажатии обнуляет все значения в $_GET.
• Блок смайлов, который выводит доступный набор смайлов.
36. Обработчик добавления ответов
Для обработки ответов на комментарии служит файл make_reply.php
Листинг 52. make_reply.php Путь: news/chat/say/ make_reply.php
<?php
error_reporting(E_ALL);
if (session_id() == '') {
session_start();
}
unset($_SESSION['txt']);
if (isset($_POST['nosay'])) {
$_GET['reply'] = '';
exit();
}
/* Проверяем наличие текста в форме */
if (empty($_POST['replytext'])) {
header("Location: " . $_SERVER["HTTP_REFERER"]); // Делаем редирект
exit();
}
if (isset($_POST['action']) and $_POST['action'] == "Ответить") {
include_once $_SERVER['DOCUMENT_ROOT'] . '/chat/dsn.php';
include_once $_SERVER['DOCUMENT_ROOT'] . '/chat/admin/clean.php';
/* Получаем id текущего пользователя */
if (isset($_SESSION['userid'])) {
$userid = $_SESSION['userid'];
}
/* заносим текст в базу */
try {
$sql = 'INSERT INTO reply SET
replytext = :replytext,
userid = :userid,
replydate = :replydate,
replyid =:replyid';
$s = $dsn->prepare($sql);
$replytext = html($_POST['replytext']);
$replyid = $_POST['postid'];
$replydate = time();
$s->bindValue(':replytext', $replytext);
$s->bindValue(':replyid', $replyid);
$s->bindValue(':replydate', $replydate);
$s->bindValue(':userid', $userid);
$s->execute();
} catch (PDOException $e) {
echo 'Error adding данного пользователя';
echo $e->getMessage();
echo $e->getLine();
exit();
}
header("Location: " . $_SERVER["HTTP_REFERER"]); // Делаем редирект
exit();
}
header("Location: " . $_SERVER["HTTP_REFERER"]); // Делаем редирект
exit();
Здесь мы проверяем данные переданные формой form_add_reply.html.php, вставляем данные в БД и делаем редирект обратно.
37. Кнопка удаления ответов на комментарии
Для вывода кнопки удаления ответов на комментарии служит файл reply_delete_button.html
Листинг 53. reply_delete_button.html Путь: news/chat/say/ reply_delete_button.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/chat/style.css" />
</head>
<div class="wrapreplyform">
<div class="idreplynum">
<!– печатаем id комментария –>
<span style=""><?php
echo '#'.$saylist['id'].' '.'^'.$replylist['id'];?></span>
</div>
<!– печатаем кнопку удалить –>
<div class="reply_delete_button">
<form name="sayform" method="post" action="/chat/say/reply_delete.php" class="reply_delete_button">
<input type="hidden" name="pageid" id="" value=" <?php echo $pageid;?>" />
<input type="hidden" name="deleteid" id="" value=" <?php echo $replylist['id'];?>" />
<input type="<?= $buttonactive ?>" name="reply_delete" id="" value="Удалить" />
</form>
</div>
<?php if($buttonactive =='hidden'){echo '.';} ?>
<!– печатаем точку и не даем схлопнуться div –>
</div>
Здесь выводим на печать идентификаторы ответа: номер комментария и номер ответа, и кнопку «Удалить».
38. Удаление комментариев
Для удаления служит скрипт reset.php
Листинг 54. reset.php Путь: news/chat/say/ reset.php
<?php
if (isset($_POST['delete']) and $_POST['delete'] == 'Удалить') {
include $_SERVER['DOCUMENT_ROOT'] . '/chat/dsn.php';
try {
$sql = 'DELETE FROM say WHERE id = :id';
$s = $dsn->prepare($sql);
$saylist = $_POST['deleteid'];
$s->bindValue(':id', $saylist);
$s->execute();
} catch (pdoException $e) {
echo $e->getMessage();
echo $e->getLine();
exit();
}
}
header("Location:" . $_SERVER['HTTP_REFERER']);// Делаем редирект обратно
Удаляется запись из таблицы say c номером, совпадающим с номером комментария.
39. Удаление ответов на комментарии
Для удаления ответов на комментарии служит файл reply_delete.php
Листинг 55. reply_delete.php Путь: news/chat/say/ reply_delete.php
<?php
if (isset($_POST['reply_delete']) and $_POST['reply_delete'] == 'Удалить') {
include $_SERVER['DOCUMENT_ROOT'] . '/chat/dsn.php';
try {
$sql = 'DELETE FROM reply WHERE id = :id';
$s = $dsn->prepare($sql);
$del = $_POST['deleteid'];
$s->bindValue(':id', $del);
$s->execute();
} catch (pdoException $e) {
echo $e->getMessage();
echo $e->getLine();
exit();
}
}
header("Location:" . $_SERVER['HTTP_REFERER']);// Делаем редирект обратно
Удаляется запись из таблицы reply c номером, совпадающим с номером ответа.
40. Перенаправление смайлов
Для разделения смайлов служит файл smile_make.php
Листинг 56. smile_make.php Путь: news/chat/say/ smile_make.php
<?php
if(session_id() == '') {session_start();}
/* Проверяем куда пойдет смайл в комментарии или в ответы */
if (isset($_POST['saytext'])) {
$_SESSION['txt'] = $_POST['saytext'].$_POST['smile'];
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект в комментарии
exit();
}
elseif (isset($_POST['replytext'])){
$_SESSION['txt'] = $_POST['replytext'].$_POST['smile'];
header("Location: ".$_SERVER["HTTP_REFERER"]);// Делаем редирект в ответы
exit();
}
Смайлы предусмотрены и в комментариях и в ответах на них, поэтому в данном скрипте отрабатывается место вставки смала: в комментарий или в ответ. Проверка идет при вставке в файл separate_action.php.
41. Стили
CSS
Код отвечающий за отображение выводимых элементов находится в файле style.css
Листинг 57. style.css Путь: news/chat/style.css
/* body */
.chatbody {
background-color: #fef5e4;
max-width: 1366px;
width: auto;
background-image: url(/images/home/bg.jpg);
}
/* form */
.chatform {
margin: 0 auto;
max-width: fit-content;
box-sizing: border-box;
padding: 1.5%;
border-radius: 5px;
background: RGBA(255, 255, 255, 1);
–webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
}
/* Блок авторизации */
.inputbutton {
display: flow-root;
float: none;
}
/* div-ы ссылок */
.ingress {
text-align: right;
float: left;
padding: 0px 10px;
text-transform: uppercase;
}
.ingressout {
padding: 0px 10px;
text-transform: uppercase;
float: none;
text-align: left;
}
.ingressloginout {
padding: 0px 10px;
text-transform: uppercase;
float: none;
text-align: left;
font-family: verdana;
font-size: smaller;
}
.logout {
padding: 0px 10px;
}
/* Ссылки Вход, Регистрация, На главную */
.aingress {
color:-web-link;
}
.aingress:hover {
color: red;
}
/* Вывод комментариев */
.sayavatar {
float: left;
width: 60px;
height: auto;
border: 1px solid lightgray;
border-radius: 10px;
margin-right: 15px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}
.postnumber {
float: left;
margin-right: 50px;
color: brown;
}
.printcomment {
display: flow-root;
padding: 1px 15px 15px 15px;
}
.topprintcomment {
padding: 0 10px;
border-bottom: 1px solid #cacaca;
margin-left: 15px;
}
.reply_button {
float: left;
margin: 10px 20px 0px 10px;
}
.wrappersaybutton {
display: flow-root;
clear: both;
background-color: whitesmoke;
}
.says {
float: left;
padding-right: 10px;
}
.sayright {
display: inline-flex;
float: right;
}
.cabinets {
float: left;
}
.return {
text-align: right;
float: left;
padding: 0px 10px;
margin: 1%;
}
.areturns {
font-family: "Carrois Gothic", sans-serif;
color: #6b5344;
}
.areturns:hover {
color: #f25c05;
}
.adduser {
font-family: "Carrois Gothic", sans-serif;
color: #6b5344;
}
/* панель управления */
/* ссылки */
.apanel {
color: cadetblue;
}
.apreturn {
color: #6b5344;
}
.wrap_apanel {
margin: 0 auto;
width: fit-content;
}
/* Лист пользователей в админ разделе */
/* делаем сетку */
.ourwrapper {
display: flex;
flex-wrap: wrap;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
grid-auto-rows: minmax(150px, auto);
grid-gap: 1em;
}
/* аватарка для админки */
.imgava {
width: 50px;
height: 50px;
padding-top: 5px;
float: left;
padding-right: 20px;
}
/* Страница статистики */
/* Форма статистики и поиска */
.stat {
background: none;
}
.statwrap {
float: none;
display: inline-block;
}
.statone {
float: left;
margin-left: 2%;
width: 30%;
}
.stattwo {
float: left;
width: 30%;
–webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
padding: 10px 15px;
border-radius: 5px;
}
.statthree {
margin-left: 2%;
float: left;
–webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
padding: 10px 15px;
border-radius: 5px;
}
#author {
float: right;
width: 140px;
}
#category {
float: right;
width: 140px;
}
.textsearch {
float: left;
}
.textsearch_button {
float: right;
}
/* Форма пользователя */
.formuser {
background: white;
display: flex;
align-items: center;
justify-content: center;
height: fit-content;
/* Flex Fallback */
margin-left: 5px;
margin-right: 5px;
flex: 1 1 200px;
padding: 4%;
border-radius: 8px;
}
.topuser {
border-bottom: 1px dashed #7e6d4c;
float: none;
}
.login_art {
margin: 0px;
font-weight: bold;
}
h3.vintage {
color: #f25c05;
border-bottom: 1px dashed #7e6d4c;
font-style: italic;
}
.number {
color: brown;
}
/* 2. Административный раздел */
/* 2.1 Подключение нового пользователя form.html.php */
.username {
padding: 2px;
float: none;
}
/* fieldset */
.usernames {
border: 1px solid lightgray;
}
/* поле ввода логина */
.inputs {
float: right;
}
/* заголовок формы */
.formname {
margin: 0;
}
.chatfieldset {
border: 1px solid lightgray;
}
/* заголовок создания админа */
.make_admin {
text-align: center;
color: brown;
}
/* addsay */
.addsayform {
margin: 0 auto;
max-width: fit-content;
box-sizing: border-box;
padding: 1.5%;
border-radius: 5px;
background: RGBA(255, 255, 255, 1);
–webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.45);
}
/* div кнопки добавить комментарии */
.addsay {
float: left;
margin: 0 10px;
}
/* ссылки показать скрыть комментарии */
.aopensays {
color: #6f6f6f;
}
.aopensays:hover {
color: #497270;
}
.aaddsays {
color: #6f6f6f;
}
.aaddsays:hover {
color: #53918e;
}
.areply {
color: #6b5344;
}
.areply:hover {
color: #53918e;
}
.notaddsays {
color: #6b5344;
}
.notaddsays:hover {
color: #f25c05;
}
/* из test */
/*.................Ответы................... */
.block_reply {
margin-left: 3%;
position: relative;
/* background:green; */
}
.wrap_reply_form {
position: relative;
/* background: orange; */
}
.reply_form {
/* border: 1px solid green; */
padding: 1%;
background: white;
float: none;
margin-right: 1%;
display: flow-root;
}
.reply_delete_button {
background: whitesmoke;
margin-right: 1%;
padding: 3px;
border-radius: 4px;
float: right;
}
.avareply {
margin: 3px 10px;
border-right: 1px solid #cacaca;
padding: 0 5px;
width: 40px;
height: auto;
}
.topreply {
padding: 2px 12px;
border-bottom: 1px solid #cacaca;
border-radius: 5px;
}
.wrapsayform {
position: relative;
border: 1px solid lightgray;
border-radius: 4px;
margin: 2% 0;
z-index: 0;
clear: both;
/* background:Градиент */
/* background: linear-gradient(45deg, #3e84bf 25%, transparent 25%, transparent 75%, #292929 75%),
linear-gradient(45deg, #292929 25%, transparent 25%, transparent 75%, #292929 75%) 0.1875em 0.1875em,
radial-gradient(at 50% 0, #484847, #090909);
background-size: 0.375em 0.375em, 0.375em 0.375em, 100% 100%; */
/* В линейку */
/* background-color: #FFFFEF;
background-image:
linear-gradient(90deg, transparent 98px, #ED82AD 98px, #ED82AD 100px, transparent 100px),
linear-gradient(#eee 1px, transparent 0px),
linear-gradient(90deg, #eee 1px, transparent 0px);
background-size:100% 100%, 20px 20px, 20px 20px;
background-position: 0 0, -1px -1px, -1px 1px; */
}
.sayform {
background: white;
margin: 1%;
padding: 0;
border-radius: 5px;
border: 1px solid lightgray;
}
.topprintcomment {
padding: 0 10px;
border-bottom: 1px solid #cacaca;
margin-left: 15px;
}
.wrapreplyform {
display: flow-root;
background: whitesmoke;
margin-right: 1%;
}
.idreplynum {
float: left;
color: brown;
padding: 5px 15px;
}
h3.user {
margin: 0 1em 0 1em;
padding: 0 0 5px 0;
color: cadetblue;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 24px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed cadetblue;
}
h4.user {
margin: 0 1em 0 1em;
padding: 0 0 5px 0;
color: cadetblue;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 24px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed cadetblue;
}
h4.formname {
margin: 0 1em 0 1em;
padding: 0 0 5px 0;
color: cadetblue;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 24px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed cadetblue;
}
h5.user {
margin: 0 1em 0 1em;
padding: 0 0 5px 0;
color: cadetblue;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 24px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed cadetblue;
}
h1.user {
margin: 1em 1em 0.75em 1em;
padding: 0 0 5px 0;
color: #6b5344;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 36px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed #7e6d4c;
}
h2.user {
margin: 1em 1em 0.75em 1em;
padding: 0 0 5px 0;
color: #6b5344;
font-weight: normal;
position: relative;
text-shadow: 0 2px 0 rgba(255, 255, 255, 0.5);
font-size: 36px;
line-height: 40px;
font-family: "Carrois Gothic", sans-serif;
border-bottom: 1px dashed #7e6d4c;
}
.addusers {
margin: 1%;
}
Стили в дальнейшем, можно настроить как угодно.