Use big <div> to hide user menu in a more intuitive fashion.
This commit is contained in:
parent
681c3ef19d
commit
6380ea699d
1 changed files with 17 additions and 1 deletions
|
|
@ -19,15 +19,31 @@ when defined(js):
|
|||
onLogout: onLogout
|
||||
)
|
||||
|
||||
proc onClick(e: Event, n: VNode, state: UserMenu) =
|
||||
state.shown = not state.shown
|
||||
|
||||
proc render*(state: UserMenu, user: User): VNode =
|
||||
result = buildHtml():
|
||||
tdiv():
|
||||
figure(class="avatar c-hand",
|
||||
onClick=(e: Event, n: VNode) => (state.shown = not state.shown)):
|
||||
onClick=(e: Event, n: VNode) => onClick(e, n, state)):
|
||||
img(src=user.avatarUrl, title=user.name)
|
||||
if user.isOnline:
|
||||
italic(class="avatar-presense online")
|
||||
|
||||
tdiv(style=style([
|
||||
(StyleAttr.width, kstring"999999px"),
|
||||
(StyleAttr.height, kstring"999999px"),
|
||||
(StyleAttr.position, kstring"absolute"),
|
||||
(StyleAttr.left, kstring"0"),
|
||||
(StyleAttr.top, kstring"0"),
|
||||
(
|
||||
StyleAttr.display,
|
||||
if state.shown: kstring"block" else: kstring"none"
|
||||
)
|
||||
]),
|
||||
onClick=(e: Event, n: VNode) => (state.shown = false))
|
||||
|
||||
ul(class="menu menu-right", style=style(
|
||||
StyleAttr.display, if state.shown: "inherit" else: "none"
|
||||
)):
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue