sagi/seepur
sagi/seepur
Archived
1
0
Fork 1
Code Issues 1 Pull requests Releases Wiki Activity

Skeleton for dropdown add menu in home

Browse source
This commit is contained in:
Sagi Dayan 2020-05-09 22:48:26 -04:00
parent 85f73ab139
commit bc6ace210a
5 changed files with 51 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/scripts/applications/admin/app.bundle.js
View file

File diff suppressed because one or more lines are too long

4
public/scripts/applications/home/app.bundle.js
View file

File diff suppressed because one or more lines are too long

2
public/scripts/components/navbar/app.bundle.js
View file

File diff suppressed because one or more lines are too long

2
public/scripts/views/register/app.bundle.js
View file

File diff suppressed because one or more lines are too long

51
resources/scripts/applications/home/views/home.vue
View file

@ -63,9 +63,46 @@
<!-- Right side --> <!-- Right side -->
<div class="level-right"> <div class="level-right">
<div class="level-item"> <div class="level-item">
<button class="button" @click="onAddClicked()"> <!-- Dropdown -->
<div :class="`dropdown ${addMenuOpen ? 'is-active' : ''}`">
<div class="dropdown-trigger">
<button
class="button"
aria-haspopup="true"
aria-controls="dropdown-menu"
@click="addMenuOpen=!addMenuOpen"
>
<span>Add</span>
<span class="icon is-small">
<i
:class="`fa fa-angle-${addMenuOpen ? 'up' : 'down'}`"
aria-hidden="true"
></i>
</span>
</button>
</div>
<div class="dropdown-menu" id="dropdown-menu" role="menu">
<div class="dropdown-content">
<a class="dropdown-item" @click="onAddClicked('book')">
<i class="fa fa-fw fa-book"></i> Add a book
</a>
<a class="dropdown-item" @click="onAddClicked('slideshow')">
<i class="fa fa-fw fa-photo"></i> New slideshow
</a>
<a class="dropdown-item" @click="onAddClicked('puzzle')">
<i class="fa fa-fw fa-puzzle-piece"></i> Create a puzzle
</a>
<hr class="dropdown-divider" />
<a class="dropdown-item" @click="onAddClicked('child')">
<i class="fa fa-fw fa-child"></i> Add a child
</a>
</div>
</div>
</div>
<!-- End Dropdown -->
<!-- <button class="button" @click="onAddClicked()">
<i class="fa fa-fw fa-plus"></i> Add <i class="fa fa-fw fa-plus"></i> Add
</button> </button>-->
<button class="button is-success m-l-md" @click="showCreateCallModal=true"> <button class="button is-success m-l-md" @click="showCreateCallModal=true">
<i class="fa fa-fw fa-phone"></i> Call <i class="fa fa-fw fa-phone"></i> Call
</button> </button>
@ -135,12 +172,16 @@ export default {
showCoverModal: false, showCoverModal: false,
showCreateCallModal: false, showCreateCallModal: false,
showAddConnectionModal: false, showAddConnectionModal: false,
childCoverModalImage: null childCoverModalImage: null,
addMenuOpen: false
}; };
}, },
methods: { methods: {
onAddClicked() { onAddClicked(action: string) {
this.notify({ message: "Add button clicked. Still not working" }); this.notify({
message: `Add ${action} button clicked. Still not working`
});
this.addMenuOpen = false;
}, },
onDeleteClicked() { onDeleteClicked() {
this.notify({ message: "Delete button clicked. Still not working" }); this.notify({ message: "Delete button clicked. Still not working" });