UI fixes to bg-color

src/components/Course/components/Settings/index.svelte

@@ -46,11 +46,11 @@
     await deleteCourse($course.id);
   }
 
-  function setAvatar(logo) {
+  // function setAvatar(logo) {
-    avatar = logo;
+  //   avatar = logo;
-  }
+  // }
 
-  $: setAvatar($course.logo);
+  // $: setAvatar($course.logo);
 </script>
 
 <Modal
@@ -80,7 +80,7 @@
     </form>
   {:else}
     <form on:submit|preventDefault={updateDescription}>
-      <UploadImage bind:avatar />
+      <UploadImage bind:avatar src={$course.logo} />
       <TextField
         bind:value={$course.title}
         placeholder="Course title"

src/components/Course/index.svelte

@@ -16,9 +16,7 @@
       mode = MODES.view;
       if (isDirty) {
         const { overview, id } = $course;
-        const { data, error } = await updateCourse(id, { overview });
+        await updateCourse(id, { overview });
-        console.log(`data`, data);
-        console.log(`error`, error);
       }
     } else {
       mode = MODES.edit;

src/components/Courses/components/Card/index.svelte

@@ -7,7 +7,7 @@
 
 <a
   rel="prefetch"
-  class="root w-72 border bg-gray-100 px-2 py-7 mr-4 mb-4 rounded-md hover:shadow-2xl transition ease-in-out"
+  class="root w-72 border bg-white px-2 py-2 mr-4 mb-4 rounded-md hover:shadow-2xl transition ease-in-out"
   href="/courses/{id}"
 >
   <img

src/components/UploadImage/index.svelte

@@ -25,9 +25,9 @@
     }}
   >
     {#if src}
-      <img class="w-full h-full rounded-full" {src} alt="d" />
+      <img class="w-full h-full rounded-full" {src} alt="Avatar" />
     {:else if avatar}
-      <img class="w-full h-full rounded-full" src={avatar} alt="d" />
+      <img class="w-full h-full rounded-full" src={avatar} alt="Avatar" />
     {:else}
       <img
         class="w-full h-full rounded-full"

src/routes/_layout.svelte

@@ -151,7 +151,7 @@
 
 <style>
   main {
-    background-color: white;
+    background-color: #fafbfc;
     box-sizing: border-box;
   }
 

src/routes/courses.svelte

@@ -134,7 +134,7 @@
   <title>Courses</title>
 </svelte:head>
 
-<section class="w-11/12 m-auto">
+<section class="root">
   <!-- <PageNav title="Courses">
     <div slot="widget">
       <PrimaryButton
@@ -201,10 +201,13 @@
 </section>
 
 <style>
-  /* .root {
+  .root {
-    min-width: 600px;
+    width: 100%;
+    padding: 0 10px;
+    min-height: 90vh;
+    /* min-width: 600px;
     margin: 0 auto;
     border-left: 1px solid var(--border-color);
-    border-right: 1px solid var(--border-color);
+    border-right: 1px solid var(--border-color); */
-  } */
+  }
 </style>