Elevation for configurator

pull/345/head
cagataycivici 2020-06-18 12:17:14 +03:00
parent c7a1e0680e
commit 77fe95225a
3 changed files with 14 additions and 13 deletions

View File

@ -9,8 +9,8 @@
<ul ref="topbarMenu" class="topbar-menu">
<li><router-link to="/setup">Get Started</router-link></li>
<li class="topbar-submenu">
<a tabindex="0" @click="toggleMenu($event, 0)" class="themes-menu-link">Themes</a>
<transition name="p-input-overlay" @enter="onMenuEnter" @leave="onMenuLeave">
<a tabindex="0" @click="toggleMenu($event, 0)">Themes</a>
<transition name="p-input-overlay" @enter="onMenuEnter">
<ul v-show="activeMenuIndex === 0">
<li class="topbar-submenu-header">THEMING</li>
<li><router-link to="/theming"><i class="pi pi-fw pi-file"/><span>Guide</span></router-link></li>
@ -42,8 +42,8 @@
</transition>
</li>
<li class="topbar-submenu">
<a tabindex="0" @click="toggleMenu($event, 1)" class="templates-menu-link">Templates</a>
<transition name="p-input-overlay" @enter="onMenuEnter" @leave="onMenuLeave">
<a tabindex="0" @click="toggleMenu($event, 1)">Templates</a>
<transition name="p-input-overlay" @enter="onMenuEnter">
<ul v-show="activeMenuIndex === 1">
<li class="topbar-submenu-header">FREE ADMIN TEMPLATE</li>
<li><a href="https://www.primefaces.org/sigma-vue"><img src="./assets/images/layouts/themeswitcher-sigma.png" alt="Sigma" /><span>Sigma</span></a></li>
@ -60,8 +60,8 @@
</transition>
</li>
<li class="topbar-submenu topbar-resources-submenu">
<a tabindex="0" @click="toggleMenu($event, 2)" class="resources-menu-link">Resources</a>
<transition name="p-input-overlay" @enter="onMenuEnter" @leave="onMenuLeave">
<a tabindex="0" @click="toggleMenu($event, 2)">Resources</a>
<transition name="p-input-overlay" @enter="onMenuEnter">
<ul v-show="activeMenuIndex === 2">
<li><router-link to="/support"><span>Support</span></router-link></li>
<li><a href="https://forum.primefaces.org/viewforum.php?f=110"><span>Forum</span></a></li>
@ -106,14 +106,12 @@ export default {
onMenuEnter() {
this.bindOutsideClickListener();
},
onMenuLeave() {
this.unbindOutsideClickListener();
},
bindOutsideClickListener() {
if (!this.outsideClickListener) {
this.outsideClickListener = (event) => {
if ((this.activeMenuIndex != null && this.isOutsideTopbarMenuClicked(event))) {
this.activeMenuIndex = null;
this.unbindOutsideClickListener();
}
};
document.addEventListener('click', this.outsideClickListener);

View File

@ -10,7 +10,6 @@
transition: transform .3s;
transform: translate3d(550px,0,0);
backface-visibility: hidden;
border-left: 1px solid var(--surface-d);
&.layout-config-active {
transform: translate3d(0,0,0);
@ -30,7 +29,7 @@
padding: 0;
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.24);
color: var(--text-color);
background-color: var(--surface-a);
background-color: var(--surface-e);
.layout-config-button {
display: block;
@ -65,7 +64,11 @@
a {
color: $linkColor;
font-weight: 500;
font-weight: 600;
&:hover {
text-decoration: underline;
}
}
.layout-config-content {

View File

@ -50,7 +50,7 @@
a {
text-decoration: none;
color: $linkColor;
font-weight: 500;
font-weight: 600;
&:hover {
text-decoration: underline;