fix loading element, and update styles for saved page

src/common/components/atoms/projectCard.tsx

@@ -35,15 +35,16 @@ const ProjectCard = (props: ProjectCard) => {
 
     return (
         <div className={cn('group border-neutral border-2 hover:border-4 hover:border-primary card bg-base-100',
-            'rounded-b-none w-80 h-80 md:h-72 flex flex-col shadow-md cursor-pointer relative', className)}
+            'rounded-none w-80 h-80 md:h-72 flex flex-col shadow-md cursor-pointer relative', className)}
             onClick={(e) => { goToSavedProject(id) }}
             {...rest}>
+            {project.isPublic && <div className="z-10 badge badge-primary uppercase font-bold absolute top-0 right-0 mt-2 mr-2">{t.saved.public()}</div>}
             <Suspense fallback={<div style={{ backgroundImage: `url(${initialImage}` }} className="w-full grow bg-cover bg-center blur-[2px] animate-pulse" />}>
                 <ProjectImage code={project.data} />
             </Suspense>
-            <div className="p-2 md:h-24 bg-base-100">
+            <div className="absolute bottom-0 left-0 w-full px-3">
                 <h2 className="text-2xs md:text-md my-2 font-bold">{name}</h2>
-                <p>{description}</p>
+                <p className="mb-2">{description}</p>
                 <div className="absolute right-0 bottom-0 dropdown dropdown-end" onClick={e => e.stopPropagation()}>
                     <label tabIndex={0} className="btn btn-ghost rounded-none"><DotsVerticalIcon className="w-6" /></label>
                     <ul tabIndex={0} className="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-52 z-10">

src/common/styles/custom.css

@@ -4,17 +4,15 @@
         @apply hover:bg-base-100 hover:text-base-content;
     }
 
-
-    .progress-multi1:indeterminate::after {
+    .progress-multi1:indeterminate {
         animation: 5s progress-loading .1s infinite ease-in-out !important;
     }
 
-    .progress-multi2:indeterminate::after {
+    .progress-multi2:indeterminate {
         animation: 5s progress-loading .2s infinite ease-in-out !important;
     }
 
-
-    .progress-multi::-webkit-progress-bar {
-        background-color: transparent !important;
+    .progress-multi {
+        @apply h-1.5 w-full z-50 bg-transparent;
     }
 }

src/common/styles/index.css

@@ -4,6 +4,6 @@
 
 @import "./screen.css";
 @import "./fonts.css";
-@import "./jsxgraph.css";
+/* @import "./jsxgraph.css"; */
 @import "./animations.css";
 @import "./custom.css";

src/modules/core/utils/snapshot.tsx

@@ -54,7 +54,7 @@ export function useBoardSnapshot() {
                     try {
                         const brd = setBrd({
                             ...options,
-                            screen: [-1.5, 1.7, 1.5, -1.7],
+                            screen: [-1.2, 1.5, 1.2, -1.5],
                             axis: false,
                             renderer: 'canvas' // for PNG 
                         })

src/modules/i18n/en/index.ts

@@ -76,6 +76,7 @@ const en: Translation = {
 		prev_projects: "Previous Projects",
 		no_projects: "No Projects Saved",
 		delete: "Delete",
+		public: "Public"
 	},
 	menu: {
 		publish: "Publish",

src/modules/i18n/es/index.ts

@@ -75,6 +75,7 @@ const es: BaseTranslation = {
 		prev_projects: "Proyectos Anteriores",
 		no_projects: "No tienes proyectos guardados",
 		delete: "Borrar",
+		public: "Público"
 	},
 	project: {
 		name: "Nombre del Projecto",

src/modules/i18n/i18n-types.ts

@@ -255,6 +255,10 @@ type RootTranslation = {
 		 * D​e​l​e​t​e
 		 */
 		'delete': string
+		/**
+		 * P​u​b​l​i​c
+		 */
+		'public': string
 	}
 	menu: {
 		/**
@@ -808,6 +812,10 @@ export type TranslationFunctions = {
 		 * Delete
 		 */
 		'delete': () => LocalizedString
+		/**
+		 * Public
+		 */
+		'public': () => LocalizedString
 	}
 	menu: {
 		/**

src/renderer/app.tsx

@@ -114,10 +114,10 @@ const LoadingComponent = () => {
   const loading = useAtomValue(loadingBarAtom)
   // console.log(loading)
 
-  return (loading && <div className="fixed h-[0.4rem] w-full border-neutral border-b-2">
-    <progress id="loading-progress3" className="absolute progress h-1 w-full progress-accent"></progress>
-    <progress id="loading-progress2" className="absolute progress h-1 w-full progress-secondary progress-multi progress-multi1"></progress>
-    <progress id="loading-progress1" className="absolute progress h-1 w-full progress-primary progress-multi progress-multi2"></progress>
+  return (loading && <div className="fixed h-[0.4rem] w-full z-50">
+    <progress id="loading-progress3" className="absolute progress progress-accent progress-multi"></progress>
+    <progress id="loading-progress2" className="absolute progress progress-secondary progress-multi progress-multi1"></progress>
+    <progress id="loading-progress1" className="absolute progress progress-primary progress-multi progress-multi2"></progress>
   </div>)
 
 }