mirror of
https://github.com/Neetpone/ponepaste.git
synced 2025-03-12 22:50:07 +01:00
242 lines
No EOL
15 KiB
PHP
242 lines
No EOL
15 KiB
PHP
<main class="bd-main">
|
|
<!-- START CONTAINER -->
|
|
<div class="bd-side-background"></div>
|
|
<div class="bd-main-container container">
|
|
<div class="bd-duo">
|
|
<div class="bd-lead">
|
|
<!-- Start Row -->
|
|
<div class="row">
|
|
<section class="section">
|
|
<div class="tabs">
|
|
<ul class="tabs-menu">
|
|
<li class="is-active" data-target="first-tab"><a>Popular</a></li>
|
|
<li data-target="second-tab"><a>Months Pop</a></li>
|
|
<li data-target="third-tab"><a>New</a></li>
|
|
<li data-target="forth-tab"><a>Updated</a></li>
|
|
<li data-target="fifth-tab"><a>Random</a></li>
|
|
</ul>
|
|
</div>
|
|
<!-- Start Panel -->
|
|
|
|
<!-- Pop Pastes -->
|
|
<div class="tab-content" id="first-tab">
|
|
<div class="panel panel-default">
|
|
<h1 class="title is-4"><?php echo $lang['popular']; ?></h1>
|
|
<div class="columns is-multiline">
|
|
<?php foreach ($popular_pastes as $paste): ?>
|
|
<div class="column is-half">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="media">
|
|
<div class="media-content" style="overflow: hidden">
|
|
<p class="title is-5">
|
|
<a href="<?= urlForPaste($paste['id']) ?>"
|
|
title="<?= $paste['title'] ?>"> <?= $paste['title'] ?> </a>
|
|
</p>
|
|
<p class="subtitle is-6">
|
|
<a href="<?= urlForMember($paste['member']) ?>"><?= $paste['member'] ?></a>
|
|
<br>
|
|
<time datetime="<?= $paste['time'] ?>"><?= $paste['friendly_time'] ?></time>
|
|
</p>
|
|
<?php
|
|
if (count($paste['tags']) !== 0) {
|
|
echo tagsToHtml($paste['tags']);
|
|
} else {
|
|
echo ' <span class="tag is-warning">No tags</span>';
|
|
}
|
|
?>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- mPop Pastes -->
|
|
<div class="tab-content" id="second-tab">
|
|
<div class="panel panel-default">
|
|
<h1 class="title is-4"><?php echo $lang['monthpopular']; ?></h1>
|
|
<div class="columns is-multiline">
|
|
<?php foreach ($monthly_popular_pastes as $paste): ?>
|
|
<div class="column is-half">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="media">
|
|
<div class="media-content" style="overflow: hidden">
|
|
<p class="title is-5">
|
|
<a href="<?= urlForPaste($paste['id']) ?>"
|
|
title="<?= $paste['title'] ?>"> <?= $paste['title'] ?> </a>
|
|
</p>
|
|
<p class="subtitle is-6">
|
|
<a href="<?= urlForMember($paste['member']) ?>"><?= $paste['member'] ?></a>
|
|
<br>
|
|
<time datetime="<?= $paste['time'] ?>"><?= $paste['friendly_time'] ?></time>
|
|
</p>
|
|
<?php
|
|
if (count($paste['tags']) !== 0) {
|
|
echo tagsToHtml($paste['tags']);
|
|
} else {
|
|
echo ' <span class="tag is-warning">No tags</span>';
|
|
}
|
|
?>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- New Pastes -->
|
|
<div class="tab-content" id="third-tab">
|
|
<div class="panel panel-default">
|
|
<h1 class="title is-4"><?php echo $lang['recentpastes']; ?></h1>
|
|
<div class="columns is-multiline">
|
|
<?php foreach ($recent_pastes as $paste): ?>
|
|
<div class="column is-half">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="media">
|
|
<div class="media-content" style="overflow: hidden">
|
|
<p class="title is-5">
|
|
<a href="<?= urlForPaste($paste['id']) ?>"
|
|
title="<?= $paste['title'] ?>"> <?= $paste['title'] ?> </a>
|
|
</p>
|
|
<p class="subtitle is-6">
|
|
<a href="<?= urlForMember($paste['member']) ?>"><?= $paste['member'] ?></a>
|
|
<br>
|
|
<time datetime="<?= $paste['time'] ?>"><?= $paste['friendly_time'] ?></time>
|
|
</p>
|
|
<?php
|
|
if (count($paste['tags']) !== 0) {
|
|
echo tagsToHtml($paste['tags']);
|
|
} else {
|
|
echo ' <span class="tag is-warning">No tags</span>';
|
|
}
|
|
?>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Updated Pastes -->
|
|
<div class="tab-content" id="forth-tab">
|
|
<div class="panel panel-default">
|
|
<h1 class="title is-4"><?php echo $lang['updatedgreen']; ?></h1>
|
|
<div class="columns is-multiline">
|
|
<?php foreach ($updated_pastes as $paste): ?>
|
|
<div class="column is-half">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="media">
|
|
<div class="media-content" style="overflow: hidden">
|
|
<p class="title is-5">
|
|
<a href="<?= urlForPaste($paste['id']) ?>"
|
|
title="<?= $paste['title'] ?>"> <?= $paste['title'] ?> </a>
|
|
</p>
|
|
<p class="subtitle is-6">
|
|
<a href="<?= urlForMember($paste['member']) ?>"><?= $paste['member'] ?></a>
|
|
<br>
|
|
<time datetime="<?= $paste['time'] ?>"><?= $paste['friendly_update_time'] ?></time>
|
|
</p>
|
|
<?php
|
|
if (count($paste['tags']) !== 0) {
|
|
echo tagsToHtml($paste['tags']);
|
|
} else {
|
|
echo ' <span class="tag is-warning">No tags</span>';
|
|
}
|
|
?>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Random Pastes -->
|
|
<div class="tab-content" id="fifth-tab">
|
|
<div class="panel panel-default">
|
|
<h1 class="title is-4"><?php echo $lang['random']; ?></h1>
|
|
<div class="columns is-multiline">
|
|
<?php foreach ($random_pastes as $paste): ?>
|
|
<div class="column is-half">
|
|
<div class="card">
|
|
<div class="card-content">
|
|
<div class="media">
|
|
<div class="media-content" style="overflow: hidden">
|
|
<p class="title is-5">
|
|
<a href="<?= urlForPaste($paste['id']) ?>"
|
|
title="<?= $paste['title'] ?>"> <?= $paste['title'] ?> </a>
|
|
</p>
|
|
<p class="subtitle is-6">
|
|
<a href="<?= urlForMember($paste['member']) ?>"><?= $paste['member'] ?></a>
|
|
<br>
|
|
<time datetime="<?= $paste['time'] ?>"><?= $paste['friendly_time'] ?></time>
|
|
</p>
|
|
<?php
|
|
if (count($paste['tags']) !== 0) {
|
|
echo tagsToHtml($paste['tags']);
|
|
} else {
|
|
echo ' <span class="tag is-warning">No tags</span>';
|
|
}
|
|
?>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<script>
|
|
const tabSystem = {
|
|
init() {
|
|
document.querySelectorAll('.tabs-menu').forEach(tabMenu => {
|
|
Array.from(tabMenu.children).forEach((child, ind) => {
|
|
child.addEventListener('click', () => {
|
|
tabSystem.toggle(child.dataset.target);
|
|
});
|
|
if (child.className.includes('is-active')) {
|
|
tabSystem.toggle(child.dataset.target);
|
|
}
|
|
});
|
|
});
|
|
},
|
|
toggle(targetId) {
|
|
document.querySelectorAll('.tab-content').forEach(contentElement => {
|
|
contentElement.style.display = contentElement.id === targetId ? 'block' : 'none';
|
|
document.querySelector(`[data-target="${contentElement.id}"]`).classList[contentElement.id === targetId ? 'add' : 'remove']('is-active');
|
|
})
|
|
},
|
|
};
|
|
// use it
|
|
tabSystem.init()
|
|
</script>
|