Bottom Action Tray

'use client';

import './FloatingTrayActions.css';

/** FloatingTrayActions — ported from astro-component-kit. */
export interface FloatingTrayActionsProps {
}

export function FloatingTrayActions({}: FloatingTrayActionsProps) {
  return (
    <>
      <div className="tray" data-rk-1cad28="">
        <button className="tray-btn" data-rk-1cad28="">✏️ Edit</button>
        <div className="sep" data-rk-1cad28=""></div>
        <button className="tray-btn" data-rk-1cad28="">↗️ Share</button>
      </div>
    </>
  );
}

export default FloatingTrayActions;

/* FloatingTrayActions — ported from astro-component-kit (overlays/FloatingTrayActions.astro) */

.tray:where([data-rk-1cad28]) { position: fixed; bottom: 2rem; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 100px; display: flex; align-items: center; padding: 4px; box-shadow: 0 10px 40px rgba(0,0,0,0.2); z-index: 1000; border: 1px solid rgba(0,0,0,0.1); }
.tray-btn:where([data-rk-1cad28]) { background: none; border: none; padding: 0.6rem 1.25rem; font-weight: 700; color: #000; cursor: pointer; font-size: 0.85rem; transition: 0.2s; }
.tray-btn:hover:where([data-rk-1cad28]) { opacity: 0.6; }
.sep:where([data-rk-1cad28]) { width: 1px; height: 20px; background: #eee; }