PrivateCoffee/wishthis
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add hamburger menu

Browse source
This commit is contained in:
Jay Trees 2022-02-28 09:48:35 +01:00
parent 2aae469641
commit b5bd5d7530
4 changed files with 114 additions and 52 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/assets/css/default.css
View file

@ -215,8 +215,24 @@ p .ui.horizontal.label {
/**
* Menu
*/
@media (min-width: 768px) {
.menu.toggle {
.pusher .menu.toggle {
display: none;
}
.ui.attached.menu.sidebar:not(.tabular) {
border: 0;
}
@media (max-width: 767px) {
.pusher .menu.toggle {
display: block;
}
.pusher > .footer {
display: none;
}
.pusher .menu.attached.desktop {
display: none;
}
}

8
src/assets/js/default.js
View file

@ -103,14 +103,6 @@ $(function() {
$('.menu.sidebar').sidebar('show');
});
$(window).resize(function(event) {
if ($(window).width() > 768) {
$('.menu.sidebar').removeClass('vertical sidebar');
} else {
$('.menu.sidebar').addClass('vertical sidebar');
}
});
$(window).trigger('resize');
});
/**

136
src/classes/page.php
View file

@ -219,6 +219,12 @@ class Page
<title><?= $this->title ?> - wishthis</title>
</head>
<?php
}
public function bodyStart(): void
{
?>
<body>
<?php
}
@ -255,64 +261,103 @@ class Page
);
}
?>
<div class="ui attached stackable vertical menu sidebar">
<div class="ui container">
<a class="item home" href="/?page=home">
<img src="/src/assets/img/logo.svg" />
<img src="/src/assets/img/logo.svg" alt="wishthis logo" />
</a>
<a class="item" href="/?page=wishlists">
<i class="list icon"></i>
My lists
</a>
<div class="right menu">
<?php global $options; ?>
<?php global $options; ?>
<?php if ($options->updateAvailable && $user && 100 === $user->power) { ?>
<a class="item" href="/?page=update">
<i class="upload icon"></i> Update
</a>
<?php } ?>
<?php if ($options->updateAvailable && $user && 100 === $user->power) { ?>
<a class="item" href="/?page=update">
<i class="upload icon"></i> Update
</a>
<?php } ?>
<?php if (count($pagesAccount) === 1) { ?>
<a class="item" href="<?= $pagesAccount[0]['url'] ?>">
<i class="<?= $pagesAccount[0]['icon'] ?> icon"></i>
<?= $pagesAccount[0]['text'] ?>
</a>
<?php } elseif (count($pagesAccount) >= 2) { ?>
<div class="ui simple dropdown item">
<i class="user circle icon"></i>
Account
<i class="dropdown icon"></i>
<div class="menu">
<?php
if (count($pagesAccount) >= 2) {
foreach ($pagesAccount as $item) {
?>
<a class="item" href="<?= $item['url'] ?>">
<i class="<?= $item['icon'] ?> icon"></i>
<?= $item['text'] ?>
</a>
<?php
<?php
foreach ($pagesAccount as $item) {
?>
<a class="item" href="<?= $item['url'] ?>">
<i class="<?= $item['icon'] ?> icon"></i>
<?= $item['text'] ?>
</a>
<?php
}
?>
</div>
<?= $this->footer() ?>
</div>
<div class="pusher">
<div class="ui attached menu desktop">
<div class="ui container">
<a class="item home" href="/?page=home">
<img src="/src/assets/img/logo.svg" />
</a>
<a class="item" href="/?page=wishlists">
<i class="list icon"></i>
My lists
</a>
<div class="right menu">
<?php global $options; ?>
<?php if ($options->updateAvailable && $user && 100 === $user->power) { ?>
<a class="item" href="/?page=update">
<i class="upload icon"></i> Update
</a>
<?php } ?>
<?php if (count($pagesAccount) === 1) { ?>
<a class="item" href="<?= $pagesAccount[0]['url'] ?>">
<i class="<?= $pagesAccount[0]['icon'] ?> icon"></i>
<?= $pagesAccount[0]['text'] ?>
</a>
<?php } elseif (count($pagesAccount) >= 2) { ?>
<div class="ui simple dropdown item">
<i class="user circle icon"></i>
Account
<i class="dropdown icon"></i>
<div class="menu">
<?php
if (count($pagesAccount) >= 2) {
foreach ($pagesAccount as $item) {
?>
<a class="item" href="<?= $item['url'] ?>">
<i class="<?= $item['icon'] ?> icon"></i>
<?= $item['text'] ?>
</a>
<?php
}
}
}
?>
?>
</div>
</div>
</div>
<?php } ?>
<?php } ?>
</div>
</div>
</div>
</div>
<div class="ui attached stackable menu toggle">
<div class="ui container">
<a class="item">
<i class="hamburger icon"></i>
Menu
</a>
<div class="ui attached stackable menu toggle">
<div class="ui container">
<a class="item">
<i class="hamburger icon"></i>
Menu
</a>
</div>
</div>
</div>
<div class="ui hidden divider"></div>
<?php
<div class="ui hidden divider"></div>
<?php
}
public function footer(): void
@ -344,6 +389,13 @@ class Page
</div>
</div>
</div>
<?php
}
public function bodyEnd(): void
{
?>
</div><!-- Pusher -->
</body>
</html>

2
src/pages/wishlists.php
View file

@ -10,6 +10,7 @@ use wishthis\{Page, User, Wishlist};
$page = new page(__FILE__, 'My lists');
$page->header();
$page->bodyStart();
$page->navigation();
?>
<main>
@ -165,3 +166,4 @@ $page->navigation();
<?php
$page->footer();
$page->bodyEnd();