Merge branch 'main' of github.com:Irev-Dev/cadhub

This commit is contained in:
Kurt Hutten
2021-08-12 06:54:20 +10:00
9 changed files with 154 additions and 146 deletions

View File

@@ -12,7 +12,7 @@ const CadPackage = ({ cadPackage, className = '' }: CadPackageProps) => {
return ( return (
<div <div
className={ className={
`flex items-center gap-2 cursor-default text-gray-100 ${ `grid grid-flow-col-dense items-center gap-2 cursor-default text-gray-100 ${
isOpenScad && 'bg-yellow-800' isOpenScad && 'bg-yellow-800'
} ${isCadQuery && 'bg-ch-blue-300'} bg-opacity-30 ` + className } ${isCadQuery && 'bg-ch-blue-300'} bg-opacity-30 ` + className
} }

View File

@@ -43,7 +43,7 @@ const Customizer = () => {
}`} }`}
> >
<div className="flex justify-between px-6 py-2 items-center"> <div className="flex justify-between px-6 py-2 items-center">
<div className="flex gap-6 items-center"> <div className="grid grid-flow-col-dense gap-6 items-center">
<button className="px-2" onClick={() => setOpen(!open)}> <button className="px-2" onClick={() => setOpen(!open)}>
<Svg <Svg
name="chevron-down" name="chevron-down"

View File

@@ -76,17 +76,15 @@ const EditableProjectTitle = ({
value={newTitle} value={newTitle}
onChange={onTitleChange} onChange={onTitleChange}
ref={inputRef} ref={inputRef}
onBlur={({ relatedTarget }) => { onBlur={() => setTimeout(() => {
if (relatedTarget?.id !== 'rename-button') {
setInEditMode(false) setInEditMode(false)
setNewTitle(projectTitle) setNewTitle(projectTitle)
} }, 300)}
}}
/> />
</span> </span>
<div className="flex items-center h-full"> <div className="flex items-center h-full">
<button <button
className="ml-4 flex p-px px-2 gap-2 bg-ch-purple-400 bg-opacity-30 hover:bg-opacity-80 rounded-sm border border-ch-purple-400" className="ml-4 grid grid-flow-col-dense p-px px-2 gap-2 bg-ch-purple-400 bg-opacity-30 hover:bg-opacity-80 rounded-sm border border-ch-purple-400"
id="rename-button" id="rename-button"
onClick={() => onClick={() =>
updateProject({ variables: { id, input: { title: newTitle } } }) updateProject({ variables: { id, input: { title: newTitle } } })

View File

@@ -29,7 +29,7 @@ const EditorMenu = () => {
<div className=" text-ch-gray-760 bg-ch-gray-300 cursor-grab px-2 h-full flex items-center"> <div className=" text-ch-gray-760 bg-ch-gray-300 cursor-grab px-2 h-full flex items-center">
<Svg name="drag-grid" className="w-4 p-px" /> <Svg name="drag-grid" className="w-4 p-px" />
</div> </div>
<div className="flex gap-6 px-5"> <div className="grid grid-flow-col-dense gap-6 px-5">
<FileDropdown <FileDropdown
handleRender={onRender} handleRender={onRender}
handleStlDownload={handleStlDownload} handleStlDownload={handleStlDownload}

View File

@@ -59,9 +59,9 @@ const EmojiReaction = ({
<div <div
className={getActiveClasses('relative overflow-hidden pt-1', className)} className={getActiveClasses('relative overflow-hidden pt-1', className)}
> >
<div className="z-10 flex items-center gap-4 h-10"> <div className="z-10 flex items-center h-10">
<div <div
className="h-full w-10" className="h-full w-10 mr-4"
aria-describedby={popoverId} aria-describedby={popoverId}
onClick={togglePopover} onClick={togglePopover}
> >

View File

@@ -67,7 +67,7 @@ const IdeHeader = ({
<div className="h-16 w-full bg-ch-gray-900 flex justify-between items-center text-lg"> <div className="h-16 w-full bg-ch-gray-900 flex justify-between items-center text-lg">
{_projectId ? ( {_projectId ? (
<div className="h-full text-gray-300 flex items-center"> <div className="h-full text-gray-300 flex items-center">
<span className="bg-ch-gray-700 h-full flex items-center gap-2 px-4"> <span className="bg-ch-gray-700 h-full grid grid-flow-col-dense items-center gap-2 px-4">
<Gravatar <Gravatar
image={project?.user?.image || projectOwnerImage} image={project?.user?.image || projectOwnerImage}
className="w-10" className="w-10"
@@ -91,7 +91,7 @@ const IdeHeader = ({
) : ( ) : (
<div /> <div />
)} )}
<div className="text-gray-200 flex gap-4 mr-4 items-center"> <div className="text-gray-200 grid grid-flow-col-dense gap-4 mr-4 items-center">
{canEdit && !projectTitle && ( {canEdit && !projectTitle && (
<CaptureButton <CaptureButton
canEdit={canEdit} canEdit={canEdit}

View File

@@ -1,4 +1,5 @@
import { useState } from 'react' import { useState } from 'react'
import { makeStyles } from '@material-ui/core/styles';
import Dialog from '@material-ui/core/Dialog' import Dialog from '@material-ui/core/Dialog'
import Tab from '@material-ui/core/Tab' import Tab from '@material-ui/core/Tab'
import Tabs from '@material-ui/core/Tabs' import Tabs from '@material-ui/core/Tabs'
@@ -10,6 +11,12 @@ import { toast } from '@redwoodjs/web/toast'
import { Link, routes } from '@redwoodjs/router' import { Link, routes } from '@redwoodjs/router'
import { subscribe } from 'src/helpers/subscribe' import { subscribe } from 'src/helpers/subscribe'
const useStyles = makeStyles({
root: {
transform: `translate3d(0,0,50px)`,
},
})
const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => { const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => {
const { logIn, signUp } = useAuth() const { logIn, signUp } = useAuth()
@@ -20,6 +27,7 @@ const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => {
} }
const [checkBox, setCheckBox] = useState(true) const [checkBox, setCheckBox] = useState(true)
const [error, setError] = useState('') const [error, setError] = useState('')
const classes = useStyles()
const onSubmitSignUp = async ({ email, password, name, userName }) => { const onSubmitSignUp = async ({ email, password, name, userName }) => {
try { try {
@@ -47,7 +55,7 @@ const LoginModal = ({ open, onClose, shouldStartWithSignup = false }) => {
} }
} }
return ( return (
<Dialog open={open} onClose={onClose}> <Dialog open={open} onClose={onClose} className={classes.root}>
<div className="bg-gray-100 max-w-2xl rounded-lg shadow-lg"> <div className="bg-gray-100 max-w-2xl rounded-lg shadow-lg">
<Tabs <Tabs
value={tab} value={tab}

View File

@@ -35,12 +35,12 @@ const KeyValue = ({
if (!children || hide) return null if (!children || hide) return null
return ( return (
<div> <div>
<div className="text-ch-blue-600 font-fira-code flex text-sm"> <div className="text-ch-blue-600 font-fira-code flex text-sm whitespace-nowrap">
{keyName} {keyName}
{canEdit && {canEdit &&
(isEditable ? ( (isEditable ? (
<button <button
className="ml-4 flex p-px px-2 gap-2 bg-ch-purple-400 bg-opacity-30 hover:bg-opacity-80 rounded-sm border border-ch-purple-400" className="ml-4 grid grid-flow-col-dense p-px px-2 gap-2 bg-ch-purple-400 bg-opacity-30 hover:bg-opacity-80 rounded-sm border border-ch-purple-400"
id="rename-button" id="rename-button"
onClick={onEdit} onClick={onEdit}
> >
@@ -128,15 +128,16 @@ const ProjectProfile = ({
projectId={project?.id} projectId={project?.id}
/> />
</div> </div>
<div className="relative flex-grow"> <div className="relative flex-grow h-full">
<div className="grid grid-cols-1 md:auto-cols-preview-layout grid-flow-row-dense absolute inset-0"> <div className="grid grid-cols-1 md:auto-cols-preview-layout grid-flow-row-dense absolute inset-0 h-full">
{/* Viewer */} {/* Viewer */}
<div className="md:col-start-2 w-full min-h-md"> <div className="md:col-start-2 w-full min-h-md">
<ProfileViewer /> <ProfileViewer />
</div> </div>
{/* Side panel */} {/* Side panel */}
<div className="bg-ch-gray-760 font-fira-sans px-20 pt-12 flex flex-col gap-6 overflow-y-auto"> <div className="bg-ch-gray-760 font-fira-sans px-20 pt-12 overflow-y-auto">
<div className="grid grid-flow-row-dense gap-6">
<h3 className="text-5xl capitalize text-ch-gray-300"> <h3 className="text-5xl capitalize text-ch-gray-300">
{project?.title.replace(/-/g, ' ')} {project?.title.replace(/-/g, ' ')}
</h3> </h3>
@@ -181,7 +182,7 @@ const ProjectProfile = ({
/> />
</div> </div>
</KeyValue> </KeyValue>
<div className="flex gap-6"> <div className="grid grid-flow-col-dense gap-6">
<KeyValue keyName="Created on"> <KeyValue keyName="Created on">
{new Date(project?.createdAt).toDateString()} {new Date(project?.createdAt).toDateString()}
</KeyValue> </KeyValue>
@@ -272,6 +273,7 @@ const ProjectProfile = ({
</div> </div>
</div> </div>
</div> </div>
</div>
<ConfirmDialog <ConfirmDialog
open={isConfirmDialogOpen} open={isConfirmDialogOpen}
onClose={() => setIsConfirmDialogOpen(false)} onClose={() => setIsConfirmDialogOpen(false)}

View File

@@ -100,7 +100,7 @@ export const Success = ({
className="h-24 grid bg-ch-gray-900 relative" className="h-24 grid bg-ch-gray-900 relative"
style={{ gridTemplateColumns: '7fr 5fr' }} style={{ gridTemplateColumns: '7fr 5fr' }}
> >
<div className="flex items-center justify-center gap-16"> <div className="grid grid-flow-col-dense items-center justify-center gap-16">
{[ {[
{ {
svg: 'reactions', svg: 'reactions',
@@ -113,7 +113,7 @@ export const Success = ({
count: 0, count: 0,
}, },
].map(({ svg, title, count }, index) => ( ].map(({ svg, title, count }, index) => (
<div className="flex gap-4" key={index}> <div className="grid grid-flow-col-dense gap-4" key={index}>
<Svg className="w-10" name={svg} /> <Svg className="w-10" name={svg} />
<div className="flex flex-col"> <div className="flex flex-col">
<div className="text-3xl">{count}</div> <div className="text-3xl">{count}</div>