From 58d0a91e937696ac173eb2a671de303abba00a5d Mon Sep 17 00:00:00 2001 From: Marcelo Santos <117441129+marcelo-m7@users.noreply.github.com> Date: Wed, 14 Jan 2026 16:53:37 -0300 Subject: [PATCH] Improve responsive layout and content rendering --- assets/scss/common/_custom.scss | 29 ++++++++++++++++++++++++ layouts/course/single.html | 22 +++++++++--------- layouts/topic/single.html | 2 +- layouts/uc/single.html | 22 +++++++++--------- static/js/loaders.js | 40 ++++++++++++++++----------------- 5 files changed, 72 insertions(+), 43 deletions(-) diff --git a/assets/scss/common/_custom.scss b/assets/scss/common/_custom.scss index 2720f163..be73d2c0 100644 --- a/assets/scss/common/_custom.scss +++ b/assets/scss/common/_custom.scss @@ -35,6 +35,35 @@ dl.row { } } +// Improve content responsiveness +.content, +.facodi-rich-content { + overflow-wrap: anywhere; + + img, + svg, + video { + max-width: 100%; + height: auto; + } + + iframe { + max-width: 100%; + width: 100%; + } + + table { + display: block; + width: 100%; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + } + + pre { + overflow-x: auto; + } +} + // Better card spacing and hover effects .card { transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; diff --git a/layouts/course/single.html b/layouts/course/single.html index ee35aab5..03e12e37 100644 --- a/layouts/course/single.html +++ b/layouts/course/single.html @@ -14,7 +14,7 @@

{{ .Title }}

{{ i18n "course_synced_heading" }}

-
+

{{ i18n "course_synced_loading" }}

@@ -30,16 +30,16 @@

{{ i18n "course_ucs_heading" }}

{{ i18n "course_details_heading" }}

-
{{ i18n "course_details_institution" }}
-
—
-
{{ i18n "course_details_school" }}
-
—
-
{{ i18n "course_details_ects" }}
-
—
-
{{ i18n "course_details_duration" }}
-
—
-
{{ i18n "course_details_language" }}
-
—
+
{{ i18n "course_details_institution" }}
+
—
+
{{ i18n "course_details_school" }}
+
—
+
{{ i18n "course_details_ects" }}
+
—
+
{{ i18n "course_details_duration" }}
+
—
+
{{ i18n "course_details_language" }}
+
—
diff --git a/layouts/topic/single.html b/layouts/topic/single.html index 2d79a1b9..68d48416 100644 --- a/layouts/topic/single.html +++ b/layouts/topic/single.html @@ -11,7 +11,7 @@

{{ .Title }}

{{ i18n "topic_synced_heading" }}

-
+

{{ i18n "topic_synced_loading" }}

diff --git a/layouts/uc/single.html b/layouts/uc/single.html index ee75d812..8fca0634 100644 --- a/layouts/uc/single.html +++ b/layouts/uc/single.html @@ -11,7 +11,7 @@

{{ .Title }}

{{ i18n "uc_synced_heading" }}

-
+

{{ i18n "uc_synced_loading" }}

@@ -39,16 +39,16 @@

{{ i18n "uc_topics_heading" }}

{{ i18n "uc_details_heading" }}

-
{{ i18n "uc_details_course" }}
-
—
-
{{ i18n "uc_details_ects" }}
-
—
-
{{ i18n "uc_details_semester" }}
-
—
-
{{ i18n "uc_details_language" }}
-
—
-
{{ i18n "uc_details_prerequisites" }}
-
—
+
{{ i18n "uc_details_course" }}
+
—
+
{{ i18n "uc_details_ects" }}
+
—
+
{{ i18n "uc_details_semester" }}
+
—
+
{{ i18n "uc_details_language" }}
+
—
+
{{ i18n "uc_details_prerequisites" }}
+
—
diff --git a/static/js/loaders.js b/static/js/loaders.js index 1ace962c..02675131 100644 --- a/static/js/loaders.js +++ b/static/js/loaders.js @@ -119,16 +119,16 @@ } detailsEl.innerHTML = ` -
${t('course.details.institution', 'Instituição')}
-
${toText(course.institution)}
-
${t('course.details.school', 'Escola')}
-
${toText(course.school)}
-
${t('course.details.ects', 'ECTS')}
-
${toText(course.ects_total)}
-
${t('course.details.duration', 'Duração')}
-
${durationLabel(course.duration_semesters)}
-
${t('course.details.language', 'Idioma')}
-
${toText(course.language)}
+
${t('course.details.institution', 'Instituição')}
+
${toText(course.institution)}
+
${t('course.details.school', 'Escola')}
+
${toText(course.school)}
+
${t('course.details.ects', 'ECTS')}
+
${toText(course.ects_total)}
+
${t('course.details.duration', 'Duração')}
+
${durationLabel(course.duration_semesters)}
+
${t('course.details.language', 'Idioma')}
+
${toText(course.language)}
`; const { data: courseContent, error: contentError } = await client @@ -223,16 +223,16 @@ } detailsEl.innerHTML = ` -
${t('uc.details.course', 'Curso')}
-
${toText(uc.course_code)}
-
${t('uc.details.ects', 'ECTS')}
-
${toText(uc.ects)}
-
${t('uc.details.semester', 'Semestre')}
-
${toText(uc.semester)}
-
${t('uc.details.language', 'Idioma')}
-
${toText(uc.language)}
-
${t('uc.details.prerequisites', 'Pré-requisitos')}
-
${toText(uc.prerequisites)}
+
${t('uc.details.course', 'Curso')}
+
${toText(uc.course_code)}
+
${t('uc.details.ects', 'ECTS')}
+
${toText(uc.ects)}
+
${t('uc.details.semester', 'Semestre')}
+
${toText(uc.semester)}
+
${t('uc.details.language', 'Idioma')}
+
${toText(uc.language)}
+
${t('uc.details.prerequisites', 'Pré-requisitos')}
+
${toText(uc.prerequisites)}
`; const { data: ucContent, error: ucContentError } = await client