Merge branch '4.0.0-dev' of https://github.com/themeum/tutor into 4.0.0-dev

Author: shewa12

assets/core/scss/components/_calendar.scss

@@ -35,15 +35,16 @@
 
   button {
     box-shadow: none;
+    transition: none;
+    @include tutor-transition((background-color, color));
   }
 
   button[data-vc-arrow],
-  button[data-vc=month],
-  button[data-vc=year] {
+  button[data-vc='month'],
+  button[data-vc='year'] {
     background-color: transparent;
     color: $tutor-text-primary;
-    padding: 0px;
-  
+
     &:hover,
     &:focus {
       background-color: transparent;
@@ -157,6 +158,7 @@
       flex-wrap: wrap;
       border-bottom: 1px solid $tutor-border-idle;
       padding-bottom: $tutor-spacing-4;
+      margin-bottom: $tutor-spacing-4;
 
       button {
         width: 50%;
@@ -171,6 +173,14 @@
 
   .vc-grid {
     grid-area: grid;
+    display: flex;
+    gap: $tutor-spacing-6;
+
+    @include tutor-breakpoint-down(md) {
+      .vc-column:nth-child(n+2) {
+        display: none;
+      }
+    }
   }
 
   [data-vc='time'] {
@@ -180,4 +190,4 @@
   .vc-footer {
     grid-area: footer;
   }
-}
+}

assets/core/scss/components/_preview-trigger.scss

@@ -5,7 +5,11 @@
 @use '../mixins' as *;
 
 .tutor-preview-trigger {
-  display: inline;
+  display: inline-flex;
+  vertical-align: middle;
+  max-width: 100%;
+  min-width: 0;
+  width: 100%;
   position: relative;
 
   &-text {
@@ -15,6 +19,14 @@
     color: $tutor-text-secondary;
     cursor: pointer;
     @include tutor-transition(color);
+    padding-inline-end: $tutor-spacing-1;
+
+    display: inline-block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 100%;
+    vertical-align: bottom;
   }
 }
 

assets/core/scss/main.scss

@@ -25,6 +25,8 @@
 *::before,
 *::after {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-touch-callout: none;
 }
 
 html {

assets/core/ts/components/preview-trigger.ts

@@ -52,6 +52,15 @@ export const previewTrigger = (props: PreviewTriggerProps = {}) => {
       if (this.isTouchDevice) {
         // Mobile: tap to toggle
         trigger.addEventListener('click', (e: Event) => this.handleTap(e as MouseEvent));
+
+        // Prevent clicks inside content from bubbling to trigger on mobile
+        // This ensures links inside content work and tapping content doesn't toggle the popover
+        const content = this.$refs.content;
+        if (content) {
+          content.addEventListener('click', (e: Event) => {
+            e.stopPropagation();
+          });
+        }
       } else {
         // Desktop: hover to show
         trigger.addEventListener('mouseenter', () => this.handleMouseEnter());
@@ -72,6 +81,15 @@ export const previewTrigger = (props: PreviewTriggerProps = {}) => {
     },
 
     handleTap(event: MouseEvent) {
+      const target = event.target as HTMLElement;
+      const content = this.$refs.content;
+
+      // If the tap is inside the preview content, let it be handled there
+      // This is a fallback in case propagation wasn't stopped
+      if (content && content.contains(target)) {
+        return;
+      }
+
       event.preventDefault();
       if (this.open) {
         this.hide();
@@ -136,10 +154,13 @@ export const previewTrigger = (props: PreviewTriggerProps = {}) => {
       if (!this.previewData) return;
 
       const data = this.previewData;
+      const thumbnailHtml = data.thumbnail
+        ? `<img src="${data.thumbnail}" alt="${this.escapeHtml(data.title)}" class="tutor-preview-card-thumbnail" />`
+        : '';
 
       content.innerHTML = `
         <div class="tutor-preview-card-content">
-          ${data.thumbnail ? `<img src="${data.thumbnail}" alt="${this.escapeHtml(data.title)}" class="tutor-preview-card-thumbnail" />` : ''}
+          ${data.thumbnail ? (data.url ? `<a href="${data.url}">${thumbnailHtml}</a>` : thumbnailHtml) : ''}
           <div class="tutor-preview-card-body">
             <h4 class="tutor-preview-card-title">${data.url ? `<a href="${data.url}">${this.escapeHtml(data.title)}</a>` : this.escapeHtml(data.title)}</h4>
             ${data.instructor ? `<div class="tutor-preview-card-instructor">${sprintf(__(`by <a href="${data.instructor_url}">%s</a>`, 'tutor'), this.escapeHtml(data.instructor))}</div>` : ''}

assets/src/js/front/course/_spotlight.js

@@ -368,7 +368,7 @@ document.addEventListener('DOMContentLoaded', (event) => {
 			const post = await ajaxHandler(formData);
 			if (post.ok) {
 				const response = await post.json();
-				if (!response) {
+				if (response.status_code !== 200 ) {
 					tutor_toast(__('Warning', 'tutor'), __(`Attachment remove failed`, 'tutor'), 'error');
 				} else {
 					currentTarget.closest('.tutor-instructor-card').remove();

assets/src/js/frontend/learning-area/quiz/layout.ts

@@ -227,6 +227,11 @@ const quizLayout = (config: QuizLayoutConfig) => {
           return;
         }
 
+        if (!this.isQuestionAttempted(this.currentIndex)) {
+          this.moveToNextQuestion();
+          return;
+        }
+
         this.isRevealing = true;
         this.revealQuestion(wrapper);
         this.syncRevealFooterState(wrapper);

assets/src/scss/frontend/components/_discussion-card.scss

@@ -63,19 +63,33 @@
 
   &-content {
     width: 100%;
+    min-width: 0;
+    flex: 1;
   }
 
   &-top {
     @include tutor-typography(tiny);
     @include tutor-flex(row, center);
     gap: $tutor-spacing-5;
     margin-block: $tutor-spacing-3;
+    min-width: 0;
+    overflow: hidden;
+    padding-inline-end: $tutor-spacing-17;
+
+    > div {
+      min-width: 0;
+    }
 
     @include tutor-breakpoint-down(sm) {
       flex-direction: column;
       align-items: flex-start;
       gap: $tutor-spacing-none;
       margin-bottom: $tutor-spacing-4;
+      padding-inline-end: $tutor-spacing-9;
+
+      > div {
+        width: 100%;
+      }
     }
   }
 

assets/src/scss/frontend/components/_quiz-attempts.scss

@@ -42,6 +42,10 @@
     }
   }
 
+  .tutor-quiz-attempts-header-item:last-of-type {
+    text-align: center;
+  }
+
   .tutor-quiz-attempts-item-wrapper {
     padding: $tutor-spacing-6;
 
@@ -51,23 +55,6 @@
 
     &:hover {
       background-color: $tutor-surface-l1-hover;
-      .tutor-quiz-attempts-item {
-        .tutor-quiz-item-info {
-          .tutor-quiz-attempts-expand-btn {
-            @include tutor-flex(row, center);
-          }
-        }
-      }
-    }
-
-    &.tutor-quiz-previous-attempts {
-      .tutor-quiz-attempts-item {
-        .tutor-quiz-item-info {
-          .tutor-quiz-attempts-expand-btn {
-            @include tutor-flex(row, center);
-          }
-        }
-      }
     }
 
     &.tutor-quiz-previous-attempts {
@@ -115,13 +102,15 @@
         grid-area: info;
 
         &-expanded {
-          @include tutor-flex(row, center);
+          @include tutor-flex(row, start);
           gap: $tutor-spacing-4;
           text-align: center;
+          min-height: 24px;
         }
 
         &-title {
           @include tutor-typography(medium, semibold);
+          text-align: start;
 
           @include tutor-breakpoint-down(sm) {
             font-size: $tutor-font-size-small;
@@ -149,15 +138,15 @@
         }
 
         .tutor-quiz-attempts-expand-btn {
-          display: none;
           @include tutor-button-reset();
+          @include tutor-flex(row, center);
           gap: $tutor-spacing-2;
           @include tutor-typography(small, medium, brand);
           cursor: pointer;
           white-space: nowrap;
 
           @include tutor-breakpoint-down(sm) {
-            @include tutor-flex(row,center);
+            @include tutor-flex(row, center);
             font-size: $tutor-font-size-tiny;
             line-height: $tutor-line-height-tiny;
           }
@@ -242,7 +231,7 @@
 
       .tutor-quiz-item-result {
         grid-area: result;
-        @include tutor-flex(column, left, center);
+        @include tutor-flex(column, center, center);
 
         @include tutor-breakpoint-down(sm) {
           height: 100%;
@@ -376,16 +365,6 @@
       border-radius: $tutor-radius-2xl;
     }
   }
-
-  .tutor-quiz-students-attempts {
-    &-filter-item {
-      &:first-child {
-        button {
-          padding: 0;
-        }
-      }
-    }
-  }
 }
 
 .tutor-quiz-item-actions {

assets/src/scss/frontend/dashboard/_billing.scss

@@ -72,7 +72,7 @@
   }
 
   &-card {
-    @include tutor-flex(row, center, space-between);
+    @include tutor-flex(row, start, space-between);
     border-bottom: 1px solid $tutor-border-idle;
     padding: $tutor-spacing-6;
     gap: $tutor-spacing-4;

assets/src/scss/frontend/dashboard/_subscription-history.scss

@@ -1,6 +1,7 @@
 @use '@Core/scss/tokens' as *;
 @use '@Core/scss/mixins' as *;
 
+// @TODO:: Move this to pro plugin
 [data-subscription-details="1"] {
   @include tutor-breakpoint-down(sm) {
     .tutor-billing-header {
@@ -43,30 +44,6 @@
           color: $tutor-text-subdued;
         }
       }
-
-      &-action-btn {
-        @include tutor-button-base;
-        @include tutor-button-variant('link');
-        @include tutor-button-size('small');
-        padding: 0;
-        min-height: unset;
-        gap: $tutor-spacing-2;
-        color: $tutor-text-brand;
-        position: relative;
-        margin-right: -$tutor-spacing-7;
-
-        svg {
-          opacity: 0;
-        }
-
-        &:hover {
-          margin-right: 0;
-
-          svg {
-            opacity: 1;
-          }
-        }
-      }
     }
 
   }