@@ -90,9 +90,12 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) {
9090 } ;
9191 } ;
9292
93- const buttonClass = "inline-flex items-center h-full text-gray-700 bg-transparent border-none cursor-pointer transition-colors duration-150 hover:bg-gray-50 active:bg-gray-100 focus:bg-gray-50 outline-none" ;
94- const dropdownItemClass = "flex items-center gap-3 w-full p-2 px-3 text-left bg-transparent rounded-md transition-colors hover:bg-gray-100 font-sans text-gray-900" ;
95- const iconContainerClass = "flex items-center justify-center w-7 h-7 bg-gray-100 rounded shrink-0" ;
93+ const buttonClass =
94+ 'inline-flex items-center h-full text-gray-700 bg-transparent border-none cursor-pointer transition-colors duration-150 hover:bg-gray-50 active:bg-gray-100 focus:bg-gray-50 outline-none' ;
95+ const dropdownItemClass =
96+ 'flex items-center gap-3 w-full p-2 px-3 text-left bg-transparent rounded-md transition-colors hover:bg-gray-100 font-sans text-gray-900' ;
97+ const iconContainerClass =
98+ 'flex items-center justify-center w-7 h-7 bg-gray-100 rounded shrink-0' ;
9699
97100 return (
98101 < Fragment >
@@ -125,46 +128,56 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) {
125128 </ div >
126129 </ div >
127130
128- { isMounted && isOpen && createPortal (
129- < div
130- ref = { dropdownRef }
131- className = "fixed w-80 bg-white rounded-xl shadow-lg overflow-hidden z-[9999]"
132- style = { { ...getDropdownPosition ( ) , border : '1px solid #d1d5db' } }
133- >
134- < div className = "p-1" >
135- < button
136- onClick = { copyMarkdownToClipboard }
137- className = { `${ dropdownItemClass } border-none cursor-pointer disabled:opacity-50` }
138- disabled = { isLoading }
139- >
140- < div className = { iconContainerClass } >
141- < Clipboard size = { 14 } />
142- </ div >
143- < div className = "flex-1" >
144- < div className = "font-medium text-gray-900 text-sm leading-5" > Copy page</ div >
145- < div className = "text-xs text-gray-500 leading-4" > Copy page as Markdown for LLMs</ div >
146- </ div >
147- </ button >
148-
149- < Link
150- href = { `/${ pathname } .md` }
151- target = "_blank"
152- rel = "noopener noreferrer"
153- className = { `${ dropdownItemClass } no-underline` }
154- onClick = { handleViewMarkdownClick }
155- >
156- < div className = { iconContainerClass } >
157- < Markdown width = { 14 } height = { 14 } />
158- </ div >
159- < div className = "flex-1" >
160- < div className = "font-medium text-gray-900 text-sm leading-5" > View as Markdown</ div >
161- < div className = "text-xs text-gray-500 leading-4" > View this page as plain text</ div >
162- </ div >
163- </ Link >
164- </ div >
165- </ div > ,
166- document . body
167- ) }
131+ { isMounted &&
132+ isOpen &&
133+ createPortal (
134+ < div
135+ ref = { dropdownRef }
136+ className = "fixed w-80 bg-white rounded-xl shadow-lg overflow-hidden z-[9999]"
137+ style = { { ...getDropdownPosition ( ) , border : '1px solid #d1d5db' } }
138+ >
139+ < div className = "p-1" >
140+ < button
141+ onClick = { copyMarkdownToClipboard }
142+ className = { `${ dropdownItemClass } border-none cursor-pointer disabled:opacity-50` }
143+ disabled = { isLoading }
144+ >
145+ < div className = { iconContainerClass } >
146+ < Clipboard size = { 14 } />
147+ </ div >
148+ < div className = "flex-1" >
149+ < div className = "font-medium text-gray-900 text-sm leading-5" >
150+ Copy page
151+ </ div >
152+ < div className = "text-xs text-gray-500 leading-4" >
153+ Copy page as Markdown for LLMs
154+ </ div >
155+ </ div >
156+ </ button >
157+
158+ < Link
159+ href = { `/${ pathname } .md` }
160+ target = "_blank"
161+ rel = "noopener noreferrer"
162+ className = { `${ dropdownItemClass } no-underline` }
163+ onClick = { handleViewMarkdownClick }
164+ >
165+ < div className = { iconContainerClass } >
166+ < Markdown width = { 14 } height = { 14 } />
167+ </ div >
168+ < div className = "flex-1" >
169+ < div className = "font-medium text-gray-900 text-sm leading-5" >
170+ View as Markdown
171+ </ div >
172+ < div className = "text-xs text-gray-500 leading-4" >
173+ View this page as plain text
174+ </ div >
175+ </ div >
176+ </ Link >
177+ </ div >
178+ </ div > ,
179+ document . body
180+ ) }
168181 </ Fragment >
169182 ) ;
170183}
0 commit comments