testing netlify deploy

components/Tooltip.tsx

@@ -0,0 +1,48 @@
+import React, { useRef } from 'react'
+import { useTooltipTriggerState } from '@react-stately/tooltip'
+import { mergeProps } from '@react-aria/utils'
+import { useTooltip, useTooltipTrigger } from '@react-aria/tooltip'
+
+function TooltipContent({ state, ...props }) {
+  const { tooltipProps } = useTooltip(props, state)
+
+  return (
+    <span
+      style={{
+        position: 'absolute',
+        left: '5px',
+        top: '100%',
+        marginTop: '10px',
+        backgroundColor: 'white',
+        color: 'black',
+        padding: '5px',
+      }}
+      {...mergeProps(props, tooltipProps)}
+    >
+      {props.children}
+    </span>
+  )
+}
+
+export default function Tooltip(props) {
+  const state = useTooltipTriggerState(props)
+  const ref = useRef()
+
+  console.log('content', props.content)
+
+  const { triggerProps, tooltipProps } = useTooltipTrigger(props, state, ref)
+
+  return (
+    <span style={{ position: 'relative' }}>
+      <button ref={ref} {...triggerProps}>
+        I have a tooltip
+      </button>
+      {/* {React.cloneElement(props.children, { ref, ...triggerProps })} */}
+      {state.isOpen && (
+        <TooltipContent state={state} {...tooltipProps}>
+          {props.content}
+        </TooltipContent>
+      )}
+    </span>
+  )
+}

netlify.toml

@@ -0,0 +1,6 @@
+[build]
+command = "npm run build"
+publish = "out"
+
+[[plugins]]
+package = "@netlify/plugin-nextjs"

next.config.js

@@ -1,6 +1,7 @@
 const withAntdLess = require('next-plugin-antd-less')
 
 module.exports = withAntdLess({
+  target: 'serverless',
   lessVarsFilePath: './styles/theme.less',
   webpack(config) {
     config.module.rules.push({

pages/stats.tsx

@@ -255,7 +255,7 @@ export default function StatsPage() {
         {selectedAsset ? (
           <FloatingElement shrink>
             <div className="flex justify-center text-2xl">
-              <span className={`text-white`}>Historical</span>
+              <span className={`text-th-fgd-1`}>Historical</span>
               <Select
                 className="mx-4 text-lg"
                 value={selectedAsset}
@@ -267,7 +267,7 @@ export default function StatsPage() {
                   </Select.Option>
                 ))}
               </Select>
-              <span className={`text-white`}>Stats</span>
+              <span className={`text-th-fgd-1`}>Stats</span>
             </div>
 
             <div className="flex flex-col md:flex-row mt-2">