teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

feat: a11y account info (#98)

Browse source 
Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>
This commit is contained in:
Sam Richard 2022-11-26 19:19:45 -05:00 committed by GitHub
parent 49b63aa3b2
commit f5ca6c22a4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 7 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
components/account/AccountInfo.vue
View file

@ -9,6 +9,8 @@ const { account, link = true, fullServer = false } = defineProps<{
}>() }>()
</script> </script>
<!-- TODO: Make this work for both buttons and links -->
<!-- This is sometimes (like in the sidebar) used directly as a button, and sometimes, like in follow notifications, as a link. I think this component may need a second refactor that either lets an implementation pass in a link or an action and adapt to what's passed in, or the implementations need to be updated to wrap in the action they want to take and this be just the layout for these items -->
<template> <template>
<div flex gap-3 cursor-default> <div flex gap-3 cursor-default>
<div flex-shrink-0> <div flex-shrink-0>

2
components/content/ContentRich.setup.ts
View file

@ -13,7 +13,7 @@ const props = defineProps<{
const emojiObject = emojisArrayToObject(props.emojis || []) const emojiObject = emojisArrayToObject(props.emojis || [])
export default () => h( export default () => h(
'div', 'span',
{ class: 'content-rich' }, { class: 'content-rich' },
contentToVNode(props.content, emojiObject), contentToVNode(props.content, emojiObject),
) )

9
layouts/default.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<div h-full :class="{ zen: isZenMode }"> <div h-full :class="{ zen: isZenMode }">
<main flex w-full mxa lg:max-w-80rem> <main flex w-full mxa lg:max-w-80rem>
<div class="hidden md:block w-1/4 zen-hide" relative> <aside class="hidden md:block w-1/4 zen-hide" relative>
<div sticky top-0 h-screen flex="~ col"> <div sticky top-0 h-screen flex="~ col">
<slot name="left"> <slot name="left">
<NavTitle mx3 mt4 mb2 self-start /> <NavTitle mx3 mt4 mb2 self-start />
@ -12,18 +12,17 @@
</div> </div>
</slot> </slot>
</div> </div>
</div> </aside>
<NavBottom md:hidden /> <NavBottom md:hidden />
<div class="w-full mb14 md:(w-2/4 mb0) min-h-screen" border="l r base"> <div class="w-full mb14 md:(w-2/4 mb0) min-h-screen" border="l r base">
<slot /> <slot />
</div> </div>
<div class="hidden md:block w-1/4 zen-hide"> <aside class="hidden md:block w-1/4 zen-hide">
<div sticky top-0 h-screen flex="~ col"> <div sticky top-0 h-screen flex="~ col">
<slot name="right"> <slot name="right">
<UserSignInEntry v-if="!currentUser" /> <UserSignInEntry v-if="!currentUser" />
<AccountInfo <AccountInfo
v-if="currentUser" v-if="currentUser"
tabindex="0"
m5 p2 rounded-full m5 p2 rounded-full
hover:bg-active cursor-pointer transition-100 hover:bg-active cursor-pointer transition-100
:account="currentUser.account" :account="currentUser.account"
@ -36,7 +35,7 @@
<NavFooter /> <NavFooter />
</slot> </slot>
</div> </div>
</div> </aside>
</main> </main>
<ModalContainer /> <ModalContainer />
</div> </div>