Commit 59c1bd99 authored by Grant's avatar Grant
Browse files

add nextui

parent 8cad5ec8

packages/client-next/src/components/CanvasMeta.tsx

0 → 100644
+62 −0
Original line number Diff line number Diff line 
import {

  Modal,

  ModalBody,

  ModalContent,

  ModalHeader,

  useDisclosure,

} from "@nextui-org/react";

import { useAppContext } from "../contexts/AppContext";



export const CanvasMeta = () => {

  const { canvasPosition } = useAppContext();

  const { isOpen, onOpen, onOpenChange } = useDisclosure();



  return (

    <>

      <div id="canvas-meta">

        {canvasPosition && (

          <span>

            <button className="btn-link" onClick={onOpen}>

              ({canvasPosition.x}, {canvasPosition.y})

            </button>

          </span>

        )}

        <span>

          Pixels: <span>123</span>

        </span>

        <span>

          Users Online: <span>321</span>

        </span>

      </div>

      <ShareModal isOpen={isOpen} onOpenChange={onOpenChange} />

    </>

  );

};



const ShareModal = ({

  isOpen,

  onOpenChange,

}: {

  isOpen: boolean;

  onOpenChange: () => void;

}) => {

  return (

    <Modal isOpen={isOpen} onOpenChange={onOpenChange}>

      <ModalContent>

        {() => (

          <>

            <ModalHeader className="flex flex-col gap-1">

              share modal

            </ModalHeader>

            <ModalBody>

              <p>share the current zoom level & position as a url</p>

              <p>

                params would be not a hash so the server can generate an oembed

              </p>

            </ModalBody>

          </>

        )}

      </ModalContent>

    </Modal>

  );

};

packages/client-next/src/components/Header.tsx

+1 −1
Original line number Diff line number Diff line
@@ -2,7 +2,7 @@ import React from "react"; 


export const Header = () => {

  return (

    <header>

    <header id="main-header">

      <div></div>

      <div className="spacer"></div>

      <div className="box">

packages/client-next/src/components/Pallete.tsx

+1 −22
Original line number Diff line number Diff line
@@ -4,6 +4,7 @@ import { Canvas } from "../lib/canvas"; 
import { IPalleteContext } from "../types";

import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

import { faXmark } from "@fortawesome/free-solid-svg-icons";

import { CanvasMeta } from "./CanvasMeta";



export const Pallete = () => {

  const { config, user } = useAppContext();
@@ -66,25 +67,3 @@ export const Pallete = () => { 
    </div>

  );

};
 


export const CanvasMeta = () => {

  const { canvasPosition } = useAppContext();



  return (

    <div id="canvas-meta">

      {canvasPosition && (

        <span>

          <button className="btn-link">

            ({canvasPosition.x}, {canvasPosition.y})

          </button>

        </span>

      )}

      <span>

        Pixels: <span>123</span>

      </span>

      <span>

        Users Online: <span>321</span>

      </span>

    </div>

  );

};

packages/client-next/src/style.scss

+2 −4
Original line number Diff line number Diff line
@@ -10,13 +10,11 @@ html, 
body {

  overscroll-behavior: contain;

  touch-action: none;

}



body {

  background-color: #ddd;

  background-color: #ddd !important;

}



header {

header#main-header {

  position: fixed;

  top: 0;

  left: 0;

packages/client-next/tailwind.config.js

+1 −0
Original line number Diff line number Diff line
@@ -7,6 +7,7 @@ export default { 
    "./index.html",

    "./src/**/*.{js,ts,jsx,tsx}",

    "./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}",

    "../../node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}",

  ],

  theme: {

    extend: {},