Skip to content

Use Tailwind in place of custom styles (DOC-426) #8222

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
ethanpalm wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

Use Tailwind in place of custom styles (DOC-426) #8222

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 6 additions & 22 deletions assistant/use.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,40 +24,24 @@ The assistant appears in two locations: as a button next to the search bar and a
<Frame caption="Assistant button next to the search bar.">
<img
src="/images/assistant/assistant-button-light.png"
className="block dark:hidden"
style={{
width: '268px',
height: 'auto',
}}
className="block dark:hidden w-[268px] h-auto"
alt="Search bar and assistant button in light mode."
/>
<img
src="/images/assistant/assistant-button-dark.png"
className="hidden dark:block"
style={{
width: '268px',
height: 'auto',
}}
className="hidden dark:block w-[268px] h-auto"
alt="Search bar and assistant button in dark mode."
/>
</Frame>
<Frame caption="Assistant button at the bottom of the page.">
<img
src="/images/assistant/assistant-bar-light.png"
className="block dark:hidden"
style={{
width: '268px',
height: 'auto',
}}
className="block dark:hidden w-[268px] h-auto"
alt="Assistant bar in light mode."
/>
<img
src="/images/assistant/assistant-bar-dark.png"
className="hidden dark:block"
style={{
width: '268px',
height: 'auto',
}}
className="hidden dark:block w-[268px] h-auto"
alt="Assistant bar in dark mode."
/>
</Frame>
Expand Down Expand Up @@ -88,8 +72,8 @@ Highlight text on a page and click the **Add to assistant** button to open the a
Click the **Ask Assistant** button in a code block to open the assistant chat panel and add the code block as context. You can add multiple code blocks or text snippets to the assistant's context.

<Frame>
<img src="/images/assistant/code-block-light.png" alt="The Ask Assistant button in a code block in light mode." className="block dark:hidden" />
<img src="/images/assistant/code-block-dark.png" alt="The Ask Assistant button in a code block in dark mode." className="hidden dark:block" />
<img src="/images/assistant/code-block-light.png" alt="The Ask Assistant button in a code block in light mode." className="block dark:hidden w-[268px] h-auto" />
<img src="/images/assistant/code-block-dark.png" alt="The Ask Assistant button in a code block in dark mode." className="hidden dark:block w-[268px] h-auto" />
</Frame>

## File attachments
Expand Down
Loading