Add tailwind colors to all data types and display them

src/components/EditorCanvas/Table.jsx

@@ -373,11 +373,12 @@ export default function Table(props) {
           ) : settings.showDataTypes ? (
             <div className="flex gap-1 items-center">
               {fieldData.primary && <IconKeyStroked />}
-              {!fieldData.notNull && <span style={{fontFamily: 'monospace'}}>NULL</span>}
-              <span style={{
-                color: dbToTypes[database][fieldData.type].color,
-                fontFamily: 'monospace'
-                }}>
+              {!fieldData.notNull && <span className="font-mono">?</span>}
+              <span
+                className={
+                  "font-mono " + dbToTypes[database][fieldData.type].color
+                }
+              >
                 {fieldData.type +
                   ((dbToTypes[database][fieldData.type].isSized ||
                     dbToTypes[database][fieldData.type].hasPrecision) &&