question-tem-paper-body.blade.php 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. @props([
  2. 'questions' => ['choice' => [], 'fill' => [], 'answer' => []],
  3. 'selectedTemId' => null,
  4. 'selectedTemIdsForMulti' => [],
  5. ])
  6. <link rel="stylesheet" href="/css/katex/katex.min.css">
  7. <style>
  8. .qtr-paper-shell {
  9. max-width: 100%;
  10. overflow-x: auto;
  11. }
  12. .qtr-paper-shell .question.qtr-selectable {
  13. border-radius: 0.375rem;
  14. transition: box-shadow 0.15s ease, background-color 0.15s ease;
  15. }
  16. .qtr-paper-shell .question.qtr-selectable:hover {
  17. background-color: rgba(14, 165, 233, 0.06);
  18. }
  19. .dark .qtr-paper-shell .question.qtr-selectable:hover {
  20. background-color: rgba(255, 255, 255, 0.05);
  21. }
  22. .qtr-paper-shell .question.qtr-is-selected {
  23. box-shadow: 0 0 0 2px var(--fi-color-primary-500, #0ea5e9);
  24. background-color: rgba(14, 165, 233, 0.08);
  25. }
  26. .dark .qtr-paper-shell .question.qtr-is-selected {
  27. background-color: rgba(14, 165, 233, 0.12);
  28. }
  29. @include('components.exam.paper-body-grading-styles')
  30. </style>
  31. <div class="qtr-paper-shell math-render">
  32. @include('components.exam.paper-body', [
  33. 'questions' => $questions,
  34. 'grading' => true,
  35. 'interactiveTemSelect' => true,
  36. 'selectedTemIdForSelect' => $selectedTemId,
  37. 'interactiveTemMultiSelect' => true,
  38. 'selectedTemIdsForMultiSelect' => $selectedTemIdsForMulti,
  39. ])
  40. </div>