https://risingstars.co.nz/atlas
login area at top right...
Can't enter text without the panel closing when shrunk down to mobile size OR on a mobile.
Can use "tab" (on PC); but no workaround for a mobile.
Code: Select all
<div class="topbar">
<!-- style="background-color: white" -->
<div class="logo" style="margin-top:0px; vertical-align: bottom; !important">
<p:graphicImage name="images/brand/horsebox_white.png" library="atlas-layout" style="width:90%; display: block" />
</div>
<p:outputLabel style="font-size:30pt; margin-left:10px; font-weight: bold; color: white">Atlas</p:outputLabel>
<a id="topbar-menu-button" href="#">
<i class="fa fa-bars"></i>
</a>
<ul class="topbar-menu fadeInDown animated">
<li class="profile-item">
<a href="#">
<p:outputPanel id="loginDataArea">
<p:outputPanel rendered="#{loginController.isLoggedIn()}">
<div class="profile-info">
<span class="topbar-item-name profile-name"><h:outputText value="#{identityService.name}"/></span>
<p:outputLabel id="user-role" styleClass="topbar-item-name profile-role" value="#{loginController.role()}"/>
<p:tooltip for="user-role" value="#{loginController.roles()}" position="bottom" trackMouse="true" />
</div>
</p:outputPanel>
</p:outputPanel>
</a>
</li>
<li>
<p:outputPanel id="loginControlsArea">
<h:form id="loginForm" rendered="#{!loginController.isLoggedIn()}">
<p:inputText value="#{loginController.email}"/>
<p:password value="#{loginController.password}"/>
<p:commandButton actionListener="#{loginController.login()}" update="loginDataArea loginControlsArea profileControlsArea logoutControlsArea menu-area" style="color:white; vertical-align:middle" value="Login" icon="fa fa-fw fa-sign-in" />
<p:commandButton action="#{registrationController.startRegistration()}" style="color:white; vertical-align:middle" value="Register" icon="fa fa-fw fa-user-plus"/>
</h:form>
</p:outputPanel>
</li>
<li>
<p:outputPanel id="profileControlsArea">
<h:form id="ProfileForm" rendered="#{loginController.isLoggedIn() and loginController.isUserInRole('SUPERUSER')}">
<i style="color:white; vertical-align:middle" class="fa fa-fw fa-user"></i>
<p:commandButton actionListener="#{loginController.profile()}" style="color:white; vertical-align:middle" value="Profile" />
</h:form>
</p:outputPanel>
</li>
<li>
<p:outputPanel id="logoutControlsArea">
<h:form id="logoutForm" rendered="#{loginController.isLoggedIn() and loginController.isUserInRole('SUPERUSER')}">
<i style="color:white; vertical-align:middle" class="fa fa-fw fa-sign-out"></i>
<p:commandButton action="#{loginController.logout()}" update="loginDataArea loginControlsArea profileControlsArea logoutControlsArea menu-area" style="color:white; vertical-align:middle" value="Logout" />
</h:form>
</p:outputPanel>
</li>
</ul>