Skip colors

src/components/FrameRenderer/FrameRenderer.css

@@ -58,7 +58,7 @@ svg .learning rect {
 }
 
 svg .skipped rect {
-  fill: #ff665a !important;
+  fill: #ff6e6e !important;
 }
 
 svg .learning rect[fill='rgb(51,51,51)'] + text,

src/components/TopicDetail/TopicProgressButton.tsx

@@ -133,26 +133,26 @@ export function TopicProgressButton(props: TopicProgressButtonProps) {
               Done
             </button>
           )}
-          {allowMarkingPending && (
+          {allowMarkingLearning && (
             <button
               class="px-3 py-1.5 text-left text-sm text-gray-800 hover:bg-gray-100"
-              onClick={() => handleUpdateResourceProgress('pending')}
+              onClick={() => handleUpdateResourceProgress('learning')}
             >
               <span
-                class={`mr-2 inline-block h-2 w-2 rounded-full ${statusColors['pending']}`}
+                class={`mr-2 inline-block h-2 w-2 rounded-full ${statusColors['learning']}`}
               ></span>
-              Pending
+              In Progress
             </button>
           )}
-          {allowMarkingLearning && (
+          {allowMarkingPending && (
             <button
               class="px-3 py-1.5 text-left text-sm text-gray-800 hover:bg-gray-100"
-              onClick={() => handleUpdateResourceProgress('learning')}
+              onClick={() => handleUpdateResourceProgress('pending')}
             >
               <span
-                class={`mr-2 inline-block h-2 w-2 rounded-full ${statusColors['learning']}`}
+                class={`mr-2 inline-block h-2 w-2 rounded-full ${statusColors['pending']}`}
               ></span>
-              In Progress
+              Pending
             </button>
           )}
           {allowMarkingSkipped && (