This commit is contained in:
Suvodip
2025-02-14 17:12:19 +05:30
parent a1f3f5e086
commit 095a8752f5
9 changed files with 101 additions and 103 deletions

View File

@@ -0,0 +1,143 @@
<?php
require('../.hta_config/env.php');
require('../.hta_header.php');
require('../.hta_admin_header.php');
$current_date_time = date("Y-m-d H:i:s");
if(isset($_POST['title'])){
try {
$db = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); // Set the PDO error mode to exception
$stmt = $db->prepare("INSERT INTO scc24 (date_created, type, title, slug, content) VALUES (:date_created, :type, :title, :slug, :content)");
$stmt->bindParam(':date_created', $current_date_time);
$stmt->bindParam(':type', $_POST['type']);
$stmt->bindParam(':title', $_POST['title']);
$stmt->bindParam(':slug', $_POST['slug']);
$stmt->bindParam(':content', $_POST['content']);
if ($stmt->execute()) {
echo 'New '.$_POST['type'].' created.';
} else {
echo "Error executing statement: " . $stmt->errorInfo()[2]; // need to implement this Err. check specially for new entry to mariaDB
}
}catch (PDOException $e) {
// echo 'errorID:3001: "New Registration Server" busy!';
echo "Error: " . $e->getMessage();
};
}
?>
<div id="createNewPage" >
<h3 style="text-align: center; margin: 10px 0;">Create New Page or Notice</h3>
<form id="createNewPageForm" method="POST" enctype="multipart/form-data">
<label for="type">Select Type</label>
<select name="type" id="type" style="padding: 10px;">
<option value="0">-Select-</option>
<option value="notice">Notice</option>
<option value="tender">Tender</option>
<option value="page">Page</option>
<option value="documents">Documents</option>
<option value="events">Events</option>
</select><br/>
<label for="title">Page Title:</label><br> <input id="title" name="title" type="text">
<label for="slug">Page unique slug:</label><br> <input id="slug" name="slug" type="text">
<label for="editor">Content:</label>
<div style="color: #000;" id="editor"></div>
<div id="markup"></div>
<textarea name="content" id="content" rows="" col="0" class="border-2 border-primary p-2 rounded" style="visibility: hidden; height: 2px;"></textarea>
<!-- <div id="yseditor"></div> -->
<!-- <label for="content">Page Content:</label><br> <textarea id="pageContent" name="content"> </textarea> -->
<!-- <input type="submit" name="createNew" value="Save"> -->
<!-- <input type="hidden" name="content" value="" id="content" > -->
<button type="submit" id="createButton" type="button" >Create New Page</button>
</form>
</div>
<link rel="stylesheet" type="text/css" href="/assets/pell.css">
<script src="/assets/pell.js"></script>
<script>
const pell = window.pell;
const editor = document.getElementById("editor");
const markup = document.getElementById("markup");
let contentTextArea = document.getElementById('content');
pell.init({
element: editor,
onChange: (html) => {
// markup.innerHTML = "HTML Output: <br /><br />";
// markup.innerText += html;
contentTextArea.value = html;
// console.log(html)
}
})
function slugify(text) {
return text.toString().toLowerCase()
.replace(/\s+/g, '-') // Replace spaces with -
.replace(/[^\w\-]+/g, '') // Remove all non-word chars
.replace(/\-\-+/g, '-') // Replace multiple - with single -
.replace(/^-+/, '') // Trim - from start of text
.replace(/-+$/, ''); // Trim - from end of text
}
window.onload = function() {
var inputField = document.getElementById('title');
var slugField = document.getElementById('slug');
inputField.addEventListener('input', function() {
var inputText = inputField.value;
var slugText = slugify(inputText);
slugField.value = slugText;
});
};
</script>
<style>
#createNewPage {
padding: 10px 50px;
margin: 10px auto;
background-color: #ffddcc;
border-radius: 20px;
width: 100%;
max-width: 60%;
}
/* For mobile screens */
@media (max-width: 768px) {
#createNewPage {
max-width: 100%;
width: 100%;
padding: 10px 20px; /* Optional: adjust padding for smaller screens */
}
}
#createNewPage > form > input, select {
width:100%;
/* margin-top:10px; */
margin-bottom:10px;
padding: 10px;
border-radius: 6px;
}
#createNewPage > form > textarea{
width:100%;
margin:10px;
height:200px;
}
#createButton{
background-color: #402517;
color: #FFFFFF;
border-radius: 10px;
padding: 10px;
outline: none;
border: none;
display: flex;
}
.pell-content{
background: #fff;
border-bottom: 1px solid black;
}
</style>
<?php
require('../.hta_footer.php');
?>

View File

@@ -0,0 +1,174 @@
<?php
require('../.hta_config/env.php');
require('../.hta_header.php');
require('../.hta_admin_header.php');
$current_date_time = date("Y-m-d H:i:s");
?>
<style>
#createNewPage {
padding: 10px 50px;
margin: 10px auto;
background-color: #ffddcc;
border-radius: 20px;
width: 100%;
max-width: 60%;
}
/* For mobile screens */
@media (max-width: 768px) {
#createNewPage {
max-width: 100%;
width: 100%;
padding: 10px 20px; /* Optional: adjust padding for smaller screens */
}
}
#createNewPage > form > input, select {
width:100%;
/* margin-top:10px; */
margin-bottom:10px;
padding: 10px;
border-radius: 6px;
}
#createNewPage > form > textarea{
width:100%;
margin:10px;
height:200px;
}
#createButton{
background-color: #402517;
color: #FFFFFF;
border-radius: 10px;
padding: 10px;
outline: none;
border: none;
display: flex;
}
.pell-content{
background: #fff;
border-bottom: 1px solid black;
}
</style>
<link rel="stylesheet" type="text/css" href="/assets/pell.css">
<script src="/assets/pell.js"></script>
<?php
$fileName = $_GET['slug'] . '.html';
$contentType = $_GET['type'];
$getID = $_GET['id'];
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
try {
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("UPDATE scc24 SET `type` = :type, `title` = :title, `slug` = :slug, `content` = :content WHERE `id` = :getID");
$stmt->bindParam(':getID', $getID);
$stmt->bindParam(':type', $_POST['type']);
$stmt->bindParam(':title', $_POST['title']);
$stmt->bindParam(':slug', $_POST['slug']);
$stmt->bindParam(':content', $_POST['content']);
$stmt->execute();
// echo "<script>window.location.href='edit-news-list';</script>";
if ($contentType === 'page') {
$contentFolder = '/';
} elseif ($contentType === 'notice') {
$contentFolder = '/notice/';
} else {
$contentFolder = ''; // Default case, you can adjust this as needed
}
$filePath = $_SERVER['DOCUMENT_ROOT'] . $contentFolder . $fileName;
// echo $filePath;
if (file_exists($filePath)) {
if (unlink($filePath)) {
// echo "File deleted successfully.";
} else {
// echo "Error: Unable to delete the file.";
}
} else {
// echo "File does not exist.";
}
} catch (PDOException $e) {
echo "Err: " . $e->getMessage();
}
}
?>
<?php
try {
$db = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$db->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $db->prepare("SELECT * FROM scc24 WHERE `id` = :id");
$stmt->bindParam(':id', $getID);
$stmt->execute();
$rows = $stmt->fetchAll(PDO::FETCH_ASSOC);
foreach($rows as $row){
echo ' <div id="createNewPage" >
<h3 style="text-align: center; margin: 10px 0;">Edit New Page or Notice</h3>
<form id="createNewPageForm" method="POST" enctype="multipart/form-data">
<label for="type">Select Type</label>';
?>
<select name="type" id="type" style="padding: 10px;">
<?php
// echo $row['type'];
$typeOptions = ['notice', 'tender', 'page', 'documents', 'events'];
foreach($typeOptions as $type){
$selected = ($row['type'] === $type) ? 'selected' : '';
echo '<option value="'.$type.'" '.$selected.'>'.ucfirst($type).'</option>';
}
?>
</select><br/>
<?php
echo '
<label for="title">Page Title:</label><br> <input id="title" name="title" type="text" value="'.$row['title'].'" />
<label for="slug">Page unique slug:</label><br> <input id="slug" name="slug" type="text" value="'.$row['slug'].'" />
<label for="editor">Content:</label>
<div style="color: #000;" id="editor"></div>
<textarea name="content" id="content" rows="" col="0" class="border-2 border-primary p-2 rounded" style="visibility: hidden; height: 10px;"></textarea>
<button type="submit" id="createButton" type="button" > &nbsp; Save &nbsp; </button>
</form>
</div>';
echo '<script>
window.onload = function() {
getTypeValue(); // Call the function on window load
};
const pell = window.pell;
const editor = document.getElementById("editor");
let contentTextArea = document.getElementById(\'content\');
// Initialize pell editor and assign the return value to editorInstance
let editorInstance = pell.init({
element: editor,
onChange: (html) => {
console.log(html);
contentTextArea.value = html;
}
});
// Function to update editor content dynamically
function updateEditorContent(newContent) {
editorInstance.content.innerHTML = newContent;
// Trigger change event to update contentTextArea
contentTextArea.value = newContent;
}
// Example usage:
updateEditorContent(' . json_encode($row['content']) . ');
</script>';
};
// exit();
} catch (PDOException $e) {
echo json_encode(array('success' => false, 'message' => 'Database error: ' . $e->getMessage()));
}
?>
<?php
// echo $fileName;
// echo $contentType;
require('../.hta_footer.php');
?>

View File

@@ -0,0 +1,324 @@
<?php
require('../.hta_config/env.php');
require('../.hta_header.php');
require('../.hta_admin_header.php');
$current_date_time = date("Y-m-d H:i:s");
$home_uri_for_file_link = $_SERVER['HTTP_HOST'];
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_FILES['file']) && $_FILES['file']['error'] === UPLOAD_ERR_OK) {
$target_dir = $_SERVER['DOCUMENT_ROOT'] . "/assets/uploaded-file/"; // Full path to assets folder
$desc_txt = $_POST['desc_txt']; // ALT text
$file_name = $_FILES['file']['name']; // Original file name
$file_tmp = $_FILES['file']['tmp_name']; // Temporary file path
if (file_exists($file_tmp)) {
$mimeType = mime_content_type($file_tmp); // Get the mime type of the file
if (!file_exists($target_dir)) {
mkdir($target_dir, 0777, true); // Create the directory if it doesn't exist
}
$target_file = $target_dir . basename($file_name);
if (move_uploaded_file($file_tmp, $target_file)) {
$file_url = "/assets/uploaded-file/" . basename($file_name); // URL of the uploaded file
try {
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("INSERT INTO scc_files (link, alt, file_name) VALUES (:link, :alt, :file_name)");
$stmt->bindParam(':link', $file_url);
$stmt->bindParam(':alt', $desc_txt);
$stmt->bindParam(':file_name', $file_name);
$stmt->execute();
echo "File uploaded and record saved successfully.";
} catch (PDOException $e) {
echo "Database Error: " . $e->getMessage();
}
} else {
echo "Error: Could not move the uploaded file.";
}
} else {
echo "Error: Uploaded file is missing.";
}
} else {
switch ($_FILES['file']['error']) {
case UPLOAD_ERR_NO_FILE:
echo "No file was uploaded.";
break;
default:
echo "Unknown error occurred during file upload.";
break;
}
}
}
?>
<form method="post" enctype="multipart/form-data">
<div class="upload-container">
<p class="title">Files List & Add New Files</p>
<div class="file-upload-section">
<div class="upload-icon">
<label for="file" class="file-label">
<img src="/assets/upload.svg" alt="Upload" />
<input type="file" name="file" id="file" hidden />
</label>
</div>
<div class="input-section">
<div class="file-details">
<div id="file-name-show-section" class="file-name-section">
<span id="fileName">No file selected</span>
<button type="button" onclick="removeFile()" class="remove-file-btn">&times;</button>
</div>
<label for="desc_txt" class="input-label">ALT Text:</label>
<input type="text" name="desc_txt" id="desc_txt" class="text-input" placeholder="Description (6 words max)" />
</div>
<input type="submit" name="upload_file" id="upload_file" value="Upload" class="submit-btn" />
</div>
</div>
</div>
</form>
<div class="table-container">
<table class="responsive-table">
<thead>
<tr>
<th>ID</th>
<th>File Link</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt = $conn->prepare("SELECT * FROM `scc_files` ORDER BY id DESC ");
$stmt->execute();
$content = $stmt->fetchAll(PDO::FETCH_ASSOC);
foreach($content as $pageData){ ?>
<tr>
<td><?php echo $pageData['id']; ?></td>
<td><?php echo $pageData['link']; ?></td>
<td>
<div class="action-container">
<button onclick="copyToClipboard('<?php echo $pageData['link']; ?>', this)" class="action-btn">Copy</button>
<span class="copied-msg">Copied!</span>
<a href="<?php echo $home_uri_for_file_link . $pageData['link']; ?>" target="_blank" class="action-btn">View</a>
</div>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
<script>
// Copy to Clipboard
function copyToClipboard(text, button) {
var input = document.createElement('textarea');
input.value = text;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
// Show 'Copied!' message and hide the button temporarily
var actionContainer = button.parentNode;
var copiedMsg = actionContainer.querySelector('.copied-msg');
copiedMsg.style.display = 'inline';
button.style.display = 'none';
// Hide the 'Copied!' message after 1 second
setTimeout(function () {
copiedMsg.style.display = 'none';
button.style.display = 'inline';
}, 1000);
}
// Show File Selection
document.getElementById('file').addEventListener('change', function (event) {
const file = event.target.files[0];
const fileNameSection = document.getElementById('file-name-show-section');
const fileNameSpan = document.getElementById('fileName');
if (file) {
fileNameSection.style.display = 'flex';
fileNameSpan.textContent = 'File Selected: ' + file.name;
} else {
fileNameSection.style.display = 'none';
fileNameSpan.textContent = 'No file selected';
}
});
// Remove File
function removeFile() {
const fileInput = document.getElementById('file');
const fileNameSection = document.getElementById('file-name-show-section');
const fileNameSpan = document.getElementById('fileName');
fileInput.value = '';
fileNameSection.style.display = 'none';
fileNameSpan.textContent = 'No file selected';
}
</script>
<style>
/* General Styles */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
}
.upload-container, .table-container {
margin: 20px auto;
width: 90%;
max-width: 800px;
}
.title {
font-size: 24px;
text-align: center;
margin-bottom: 20px;
color: #402517;
}
/* Upload Section */
.file-upload-section {
display: flex;
flex-wrap: wrap;
/* gap: 20px; */
border: 2px dashed #402517;
padding: 20px;
border-radius: 10px;
justify-content: center;
align-items: center;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}
.upload-icon {
text-align: center;
}
.file-label {
background: #402517;
padding: 20px;
border-radius: 50%;
display: inline-block;
cursor: pointer;
transition: transform 0.3s ease;
}
.input-section {
display: flex;
flex-direction: column;
gap: 15px;
width: 100%;
}
.text-input {
border: 2px solid #7a7a7a;
padding: 7px;
border-radius: 5px;
width: 100%;
}
.submit-btn {
background-color: #402517;
color: #fff;
padding: 7px;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
outline: none;
}
.file-name-section {
display: none; /* Initially hidden */
gap: 10px;
align-items: center;
}
.remove-file-btn {
background-color: #402517;
color: #fff;
cursor: pointer;
border: none;
outline: none;
border-radius: 50%;
padding: 0 7px;
}
.remove-file-btn:hover {
background-color: #5c3d27;
}
.copied-msg {
display: none; /* Initially hidden */
background-color: #402517;
color: #fff;
border-radius: 6px;
padding: 6px 12px;
margin-left: 10px;
}
/* Table Section */
.table-container {
overflow-x: auto;
/* margin-top: 20px; */
}
.responsive-table {
width: 100%;
border-collapse: collapse;
margin: 0 auto;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}
.responsive-table th, .responsive-table td {
border: 2px solid #7a7a7a;
padding: 10px;
text-align: center;
}
.responsive-table th {
background-color: #402517;
color: #fff;
}
.action-container {
display: flex;
gap: 10px;
justify-content: center;
}
.action-btn {
background-color: #402517;
color: #fff;
padding: 8px 12px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.3s ease;
outline: none;
border: none;
}
/* Responsive Design */
@media (max-width: 600px) {
.file-upload-section {
flex-direction: column;
}
.responsive-table {
font-size: 14px;
}
.action-btn {
font-size: 12px;
padding: 6px 8px;
}
}
</style>
<?php
require('../.hta_footer.php');
?>

View File

@@ -0,0 +1,86 @@
<?php
require('../.hta_header.php');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PocketBase Login</title>
</head>
<body>
<div class="my-5">
<form id="loginForm" style="display: flex; flex-direction: column; justify-content: center; align-items: center;">
<div style="display: flex; flex-direction: column; max-width: 500px; width: 400px; gap: 10px; background-color: #ffddcc; padding: 30px; border-radius: 10px;">
<h3 style="text-align: center; color: #402517; line-height: 0;">Login</h3>
<hr style="border-top: 2px solid #402517;">
<input type="text" id="userName" placeholder="Username or Email" style="padding: 10px;" />
<input type="password" id="password" placeholder="Password" style="padding: 10px;" />
<button type="submit" style="padding: 10px;">Login</button>
</div>
</form>
</div>
<script type="module">
import PocketBase from 'https://cdn.jsdelivr.net/npm/pocketbase@0.15.0';
const pb = new PocketBase('http://127.0.0.1:8090');
// Handle login form submission
document.getElementById('loginForm').addEventListener('submit', async (e) => {
e.preventDefault(); // Prevent the default form submission
const usernameOrEmail = document.getElementById('userName').value;
const password = document.getElementById('password').value;
try {
// Authenticate user
const authData = await pb.collection('users').authWithPassword(usernameOrEmail, password);
console.log('Authentication successful!');
console.log('Is Auth Valid:', pb.authStore.isValid);
console.log('Auth Token:', pb.authStore.token);
console.log('User ID:', pb.authStore.model.id);
alert('Login successful!');
} catch (error) {
console.error('Login failed:', error);
alert('Login failed. Please check your credentials.');
}
});
</script>
</body>
</html>
<!-- <script> -->
<!-- // after the above you can also access the auth data from the authStore
// // Attach event listener to the form
// document.getElementById('loginForm').addEventListener('submit', function (e) {
// e.preventDefault(); // Prevent the form from reloading the page
// let userData = {
// "identity": document.getElementById('userName').value,
// "password": document.getElementById('password').value
// };
// fetch('http://192.168.1.197:8090/api/collections/users/auth-with-password', {
// method: 'POST',
// headers: {
// 'Content-Type': 'application/json'
// },
// body: JSON.stringify(userData)
// })
// .then(res => res.json())
// .then(data => {
// console.log(data);
// })
// .catch(error => {
// console.error(error);
// });
// }); -->
<!-- </script> -->
<?php
require_once('../.hta_footer.php');
?>

View File

@@ -0,0 +1,120 @@
<?php
require('../.hta_config/env.php');
require('../.hta_header.php');
require('../.hta_admin_header.php');
$conn = new PDO("mysql:host=$mariaServer;dbname=$mariaDb", $mariaUser, $mariaPass);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
// Define the number of results per page
$results_per_page = 30;
// Get the current page number from the URL (default to page 1)
$page = isset($_GET['page']) && is_numeric($_GET['page']) ? (int) $_GET['page'] : 1;
$offset = ($page - 1) * $results_per_page;
// Get total number of records
$total_stmt = $conn->prepare("SELECT COUNT(*) AS total FROM `scc24`");
$total_stmt->execute();
$total_rows = $total_stmt->fetch(PDO::FETCH_ASSOC)['total'];
$total_pages = ceil($total_rows / $results_per_page);
// Fetch paginated records
$stmt = $conn->prepare("SELECT * FROM `scc24` ORDER BY id DESC LIMIT :limit OFFSET :offset");
$stmt->bindValue(':limit', $results_per_page, PDO::PARAM_INT);
$stmt->bindValue(':offset', $offset, PDO::PARAM_INT);
$stmt->execute();
$content = $stmt->fetchAll(PDO::FETCH_ASSOC);
?>
<p style="font-size: 25px; text-align: center; margin-top: 10px;">Page Content List</p>
<div class="table-container">
<table class="responsive-table">
<thead>
<tr>
<th style="border: 2px solid #7a7a7a;">ID</th>
<th style="border: 2px solid #7a7a7a;">Type</th>
<th style="border: 2px solid #7a7a7a;">Title</th>
<th style="border: 2px solid #7a7a7a;">Action</th>
</tr>
</thead>
<tbody>
<?php foreach ($content as $pageData) { ?>
<tr>
<td style="border: 2px solid #7a7a7a;"><?php echo $pageData['id']; ?></td>
<td style="border: 2px solid #7a7a7a;"><?php echo $pageData['type']; ?></td>
<td style="border: 2px solid #7a7a7a;"><?php echo $pageData['title']; ?></td>
<td style="border: 2px solid #7a7a7a;">
<div style="display: flex; flex-direction: row; justify-content: center; color: blue;">
<a href="edit-content.php?id=<?php echo $pageData['id'] . '&slug=' . $pageData['slug'] . '&type=' . $pageData['type']; ?>">Edit</a> &nbsp;
<a target="_blank" href="<?php
if ($pageData['type'] === 'notice') {
echo '/notice/' . $pageData['slug'] . '.html';
} elseif ($pageData['type'] === 'page') {
echo '/' . $pageData['slug'] . '.html';
}
?>">View</a>
</div>
</td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
<!-- Pagination Links -->
<div style="text-align: center; margin-top: 20px; display: flex; flex-direction: row; gap: 20px; justify-content: center;">
<?php if ($page > 1): ?>
<a href="?page=1">First</a>
<a href="?page=<?php echo $page - 1; ?>">Prev</a>
<?php endif; ?>
<span>Page <?php echo $page; ?> of <?php echo $total_pages; ?></span>
<?php if ($page < $total_pages): ?>
<a href="?page=<?php echo $page + 1; ?>">Next</a>
<a href="?page=<?php echo $total_pages; ?>">Last</a>
<?php endif; ?>
</div>
<?php require('../.hta_footer.php'); ?>
<style>
.table-container {
margin: 20px auto;
width: 90%;
max-width: 900px;
}
.table-container {
overflow-x: auto;
/* margin-top: 20px; */
}
.responsive-table {
width: 100%;
border-collapse: collapse;
margin: 0 auto;
box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
}
.responsive-table th, .responsive-table td {
border: 2px solid #7a7a7a;
padding: 10px;
/* text-align: center; */
}
.responsive-table th {
background-color: #402517;
color: #fff;
}
@media (max-width: 600px) {
.responsive-table {
font-size: 14px;
}
.action-btn {
font-size: 12px;
padding: 6px 8px;
}
}
</style>