ui: add tooltip for footer buttons

This commit is contained in:
三咲智子 2022-11-28 15:16:22 +08:00
parent 30eb95f1bd
commit df9e4edde7
No known key found for this signature in database
GPG key ID: 69992F2250DFD93E
2 changed files with 12 additions and 7 deletions

View file

@ -6,12 +6,17 @@ const buildTimeAgo = useTimeAgo(buildTime)
<template> <template>
<footer p4 text-sm text-secondary-light flex="~ col"> <footer p4 text-sm text-secondary-light flex="~ col">
<div flex="~ gap2" items-center mb4> <div flex="~ gap2" items-center mb4>
<button i-ri-sun-line dark:i-ri-moon-line text-lg @click="toggleDark()" /> <CommonTooltip content="Toggle theme">
<button <button flex i-ri-sun-line dark:i-ri-moon-line text-lg @click="toggleDark()" />
text-lg </CommonTooltip>
:class="isZenMode ? 'i-ri:layout-right-2-line' : 'i-ri:layout-right-line'" <CommonTooltip content="Zen mode">
@click="toggleZenMode()" <button
/> flex
text-lg
:class="isZenMode ? 'i-ri:layout-right-2-line' : 'i-ri:layout-right-line'"
@click="toggleZenMode()"
/>
</CommonTooltip>
<NavSelectLanguage /> <NavSelectLanguage />
</div> </div>
<div> <div>

View file

@ -20,7 +20,7 @@ const languageList = [
<template> <template>
<CommonTooltip placement="bottom" content="Select Language"> <CommonTooltip placement="bottom" content="Select Language">
<CommonDropdown> <CommonDropdown>
<button align-top> <button flex>
<div i-ri:earth-line text-lg /> <div i-ri:earth-line text-lg />
</button> </button>