2022-04-02 08:11:17 +13:00
|
|
|
defmodule AshHqWeb.Components.SearchBar do
|
2022-08-07 11:22:58 +12:00
|
|
|
@moduledoc "A clickable search bar that brings up the search overlay"
|
2024-04-03 09:38:44 +13:00
|
|
|
use Phoenix.Component
|
2022-04-02 08:11:17 +13:00
|
|
|
|
2024-04-03 09:38:44 +13:00
|
|
|
import AshHqWeb.Tails
|
2022-04-02 08:11:17 +13:00
|
|
|
|
2024-04-03 09:38:44 +13:00
|
|
|
attr :class, :any, default: ""
|
|
|
|
attr :device_brand, :string
|
|
|
|
|
|
|
|
def search_bar(assigns) do
|
|
|
|
~H"""
|
2022-04-02 08:11:17 +13:00
|
|
|
<button
|
2024-04-03 09:38:44 +13:00
|
|
|
class={classes(
|
|
|
|
["w-96 button border border-base-light-400 bg-base-light-200 dark:border-base-dark-700 rounded-lg dark:bg-base-dark-700 hover:bg-base-light-300 dark:hover:bg-base-dark-600",
|
|
|
|
@class]
|
|
|
|
)
|
2022-04-02 11:49:26 +13:00
|
|
|
}
|
2022-04-02 08:11:17 +13:00
|
|
|
phx-click={AshHqWeb.AppViewLive.toggle_search()}
|
|
|
|
>
|
|
|
|
<div class="flex flex-row justify-between items-center px-4">
|
|
|
|
<div class="h-12 flex flex-row justify-start items-center text-center space-x-4">
|
2024-04-03 09:38:44 +13:00
|
|
|
<span class="hero-magnifying-glass w-4 h-4"/>
|
2022-04-02 08:11:17 +13:00
|
|
|
<div>Search Documentation</div>
|
|
|
|
</div>
|
2024-04-03 09:38:44 +13:00
|
|
|
<div>⌘ + K</div>
|
2022-04-02 08:11:17 +13:00
|
|
|
</div>
|
|
|
|
</button>
|
|
|
|
"""
|
|
|
|
end
|
|
|
|
end
|