Merge pull request #52 from Irev-Dev/small-changes

Small changes

web/src/components/EmojiReaction/EmojiReaction.js

@@ -38,12 +38,15 @@ const EmojiReaction = ({ emotes, callback = () => {} }) => {
 
   return [
     <div className="flex justify-between">
-      <Fab variant="round" aria-describedby={popoverId} onClick={togglePopover}>
+        <Fab size="medium" variant="round" aria-describedby={popoverId} onClick={togglePopover}>
+          <div className="bg-gray-200 border-2 m-px border-gray-300 text-gray-500 absolute inset-0 rounded-full flex justify-center items-center">
             <Svg name="dots-vertical" />
+          </div>
         </Fab>
+
       <div>
-        {emotes.map((emote) => (
+        {emotes.map((emote, i) => (
-          <IconButton onClick={() => handleEmojiClick(emote.emoji)}>
+          <IconButton key={`${emote.emoji}--${i}`} onClick={() => handleEmojiClick(emote.emoji)}>
             {emote.emoji} <span>{emote.count}</span>
           </IconButton>
         ))}
@@ -63,8 +66,8 @@ const EmojiReaction = ({ emotes, callback = () => {} }) => {
         horizontal: 'center',
       }}
     >
-      {emojiMenu.map((emoji) => (
+      {emojiMenu.map((emoji, i) => (
-        <IconButton onClick={() => handleEmojiClick(emoji)}>{emoji}</IconButton>
+        <IconButton key={`${emoji}-${i}}`} onClick={() => handleEmojiClick(emoji)}>{emoji}</IconButton>
       ))}
     </Popover>,
   ]

web/src/components/PartForm/ImageUploader.js

@@ -9,7 +9,7 @@ import 'react-image-crop/dist/ReactCrop.css'
 import Svg from 'src/components/Svg/Svg.js'
 
 const CLOUDINARY_UPLOAD_PRESET = "CadHub_project_images";
-const CLOUDINARY_UPLOAD_URL = "https://api.cloudinary.com/v1_1/irevdev/upload/?custom_coordinates=10,10,20,20";
+const CLOUDINARY_UPLOAD_URL = "https://api.cloudinary.com/v1_1/irevdev/upload";
 
 export default function ImageUploader({ onImageUpload, imageUrl }) {
   const [isModalOpen, setIsModalOpen] = useState(false)

web/src/components/Svg/Svg.js

@@ -11,7 +11,7 @@ const Svg = ({name, className: className2, strokeWidth = 2}) => {
       <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={strokeWidth} d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z" />
     </svg>,
     "dots-vertical": <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z" />
+      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={strokeWidth} d="M12 5v.01M12 12v.01M12 19v.01M12 6a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2zm0 7a1 1 0 110-2 1 1 0 010 2z" />
     </svg>
   }
 

web/src/index.css

@@ -36,7 +36,7 @@
 
 body {
   /* TODO can I use a tailwind class here? */
-  background-color: #4a5568;
+  background-color: #E5E5E5;
 }
 
 button, input, label, textarea {

web/src/layouts/MainLayout/MainLayout.js

@@ -23,6 +23,7 @@ const MainLayout = ({ children }) => {
             <li>
               <Tooltip title="Very alpha, there's lots of work todo" >
                 <div className="ml-12 flex">
+                  {/* Because of how specific these styles are to this heading/logo and it doesn't need to be replicated else where as well as it's very precise with the placement of "pre-alpha" I think it's appropriate. */}
                   <h2 className="text-indigo-300 text-5xl font-ropa-sans py-1 tracking-wider" style={{letterSpacing: '0.3em'}}>CadHub</h2>
                   <div className="text-pink-400 text-sm font-bold font-ropa-sans" style={{paddingBottom: '2rem', marginLeft: '-1.8rem'}}>pre-alpha</div>
                 </div>