Merge pull request #32 from Noboomta/feature/line-clamp

rafac: refactor display of table
Noboomta · Jun 22, 2024 · d0362a5 · d0362a5
2 parents 386c86d + 077bd7b
commit d0362a5
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 19 deletions.
diff --git a/src/pages/Schedule.vue b/src/pages/Schedule.vue
@@ -79,23 +79,15 @@
 							v-for="(course, courseIndex) in mappedCourses[date]"
 							:key="`course-${courseIndex}`"
 						>
-							<p class="flex flex-wrap justify-between mb-2">
-								<span>{{ course.subject_code }} </span>
-								<span>[{{ course.time_from }} - {{ course.time_to }}]</span>
-							</p>
-							<p v-if="isCheck">{{ course.subject_name_en }}</p>
-							<p v-else>{{ course.subject_name_th }}</p>
-							<div class="flex justify-between text-gray-700 text-xs">
-								<div>
-									<span v-if="isCheck">ROOM: {{ course.room_name_en }}</span>
-									<span v-else>ห้อง: {{ course.room_name_th }}</span>
-								</div>
-								<div class="text-right">
-									<span v-if="isCheck">
-										SEC{{ course.section_code }} {{ course.section_type_en }}
-									</span>
-									<span v-else> หมู่{{ course.section_code }} {{ course.section_type_th }} </span>
-								</div>
+							<div class="mb-2">
+								<p class="truncate">[{{ course.time_from }}-{{ course.time_to }}]</p>
+								<p class="truncate">{{ course.subject_code }}</p>
+							</div>
+							<p class="truncate" v-if="isCheck">{{ course.subject_name_en }}</p>
+							<p class="truncate" v-else>{{ course.subject_name_th }}</p>
+							<div class="text-gray-700 text-xs">
+								<p class="truncate" v-if="isCheck">{{ course.room_name_en }} | {{ course.section_type_en }} {{ course.section_code }}</p>
+								<p class="truncate" v-else>{{ course.room_name_th }} | {{ course.section_type_th }} {{ course.section_code }}</p>
 							</div>
 						</div>
 					</div>
@@ -184,7 +176,7 @@ export default {
 			createBy.className = 'mx-1 text-right block dark:text-white'
 			const options = {
 				type: 'dataURL',
-				windowWidth: '2560px',
+				windowWidth: 2560,
 			}
 			if (this.theme === 'dark') {
 				options.backgroundColor = '#111827'

diff --git a/yarn.lock b/yarn.lock
@@ -326,7 +326,7 @@
   resolved "https://registry.yarnpkg.com/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.18.0.tgz#5d694d345ce36b6ecf657349e03eb87297e68da4"
   integrity sha512-UOo5FdvOL0+eIVTgS4tIdbW+TtnBLWg1YBCcU2KWM7nuNwRz9bksDX1bekJJCpu25N1DVWaCwnT39dVQxzqS8g==
 
-"@tailwindcss/postcss7-compat@^2.2.7", "tailwindcss@npm:@tailwindcss/postcss7-compat":
+"@tailwindcss/postcss7-compat@^2.2.7":
   version "2.2.17"
   resolved "https://registry.yarnpkg.com/@tailwindcss/postcss7-compat/-/postcss7-compat-2.2.17.tgz#dc78f3880a2af84163150ff426a39e42b9ae8922"
   integrity sha512-3h2svqQAqYHxRZ1KjsJjZOVTQ04m29LjfrLjXyZZEJuvUuJN+BCIF9GI8vhE1s0plS0mogd6E6YLg6mu4Wv/Vw==
@@ -2116,6 +2116,47 @@ supports-preserve-symlinks-flag@^1.0.0:
   resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
   integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
 
+"tailwindcss@npm:@tailwindcss/postcss7-compat":
+  version "2.2.17"
+  resolved "https://registry.yarnpkg.com/@tailwindcss/postcss7-compat/-/postcss7-compat-2.2.17.tgz#dc78f3880a2af84163150ff426a39e42b9ae8922"
+  integrity sha512-3h2svqQAqYHxRZ1KjsJjZOVTQ04m29LjfrLjXyZZEJuvUuJN+BCIF9GI8vhE1s0plS0mogd6E6YLg6mu4Wv/Vw==
+  dependencies:
+    arg "^5.0.1"
+    autoprefixer "^9"
+    bytes "^3.0.0"
+    chalk "^4.1.2"
+    chokidar "^3.5.2"
+    color "^4.0.1"
+    cosmiconfig "^7.0.1"
+    detective "^5.2.0"
+    didyoumean "^1.2.2"
+    dlv "^1.1.3"
+    fast-glob "^3.2.7"
+    fs-extra "^10.0.0"
+    glob-parent "^6.0.1"
+    html-tags "^3.1.0"
+    is-color-stop "^1.1.0"
+    is-glob "^4.0.1"
+    lodash "^4.17.21"
+    lodash.topath "^4.5.2"
+    modern-normalize "^1.1.0"
+    node-emoji "^1.11.0"
+    normalize-path "^3.0.0"
+    object-hash "^2.2.0"
+    postcss "^7"
+    postcss-functions "^3"
+    postcss-js "^2"
+    postcss-load-config "^3.1.0"
+    postcss-nested "^4"
+    postcss-selector-parser "^6.0.6"
+    postcss-value-parser "^4.1.0"
+    pretty-hrtime "^1.0.3"
+    purgecss "^4.0.3"
+    quick-lru "^5.1.1"
+    reduce-css-calc "^2.1.8"
+    resolve "^1.20.0"
+    tmp "^0.2.1"
+
 text-segmentation@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/text-segmentation/-/text-segmentation-1.0.3.tgz#52a388159efffe746b24a63ba311b6ac9f2d7943"