better card click actions

app/assets/css/opensquawk-glass.css

@@ -60,7 +60,7 @@
 }
 
 /* crazy hover effect should be like glas ui 3d transformation with bounced curve without moving */
-.btn:not([disabled]):hover {
+.btn:not([disabled]):hover{
     transform: scaleX(1.03) scaleY(0.98);
     box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12),
     0 14px 26px rgba(0, 0, 0, .36);
@@ -68,6 +68,10 @@
     color-mix(in srgb, var(--text) 12%, transparent),
     color-mix(in srgb, var(--text) 6%, transparent));
 }
+.squash:hover {
+    cursor: pointer;
+    transform: scale(1.01);
+}
 
 .btn[disabled] {
     opacity: .4;

app/pages/learn.vue

@@ -44,8 +44,10 @@
             :key="m.id"
             class="tile"
             :class="tileClass(m.id)"
+            @click="isModuleUnlocked(m.id) && handleModulePrimary(m.id)"
         >
-          <div class="tile-media" :style="{ backgroundImage: `url(${m.art})` }">
+          <div class="tile-media"
+               :style="{ backgroundImage: `url(${m.art})` }">
             <span v-if="isFreshModule(m.id)" class="tile-badge">
               <v-icon size="16">mdi-star</v-icon>
               New briefing
@@ -3017,8 +3019,8 @@ function tileClass(modId: string) {
   return {
     'is-locked': !isModuleUnlocked(modId),
     'is-complete': moduleCompleted(modId),
-    'is-active': moduleHasProgress(modId) && !moduleCompleted(modId),
-    'is-fresh': isFreshModule(modId),
+    'is-active squash': moduleHasProgress(modId) && !moduleCompleted(modId),
+    'is-fresh squash': isFreshModule(modId),
   }
 }