feat: new style for sidebar on game page

This commit is contained in:
Chubby Granny Chaser
2025-09-30 01:07:45 +01:00
parent ae47498139
commit 26dfb6db8e
35 changed files with 169 additions and 125 deletions

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "تم تسجيل الدخول بنجاح"
},
"home": {
"featured": "مميز",
"surprise_me": "مفاجئني",
"no_results": "لم يتم العثور على نتائج",
"start_typing": "ابدأ بالكتابة للبحث...",

View File

@@ -1,7 +1,6 @@
{
"language_name": "беларуская мова",
"home": {
"featured": "Рэкамэндаванае",
"surprise_me": "Здзіві мяне",
"no_results": "Няма вынікаў"
},
@@ -17,7 +16,6 @@
"home": "Галоўная",
"favorites": "Улюбленыя"
},
"header": {
"search": "Пошук",
"home": "Галоўная",
@@ -31,10 +29,7 @@
"downloading_metadata": "Сцягванне мэтаданых {{title}}…",
"downloading": "Сцягванне {{title}}… ({{percentage}} скончана) - Канчатак {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "Наступная старонка",
"previous_page": "Папярэдняя старонка"
},
"catalogue": {},
"game_details": {
"open_download_options": "Адкрыць варыянты сцягвання",
"download_options_zero": "Няма варыянтаў сцягвання",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Успешно влизане"
},
"home": {
"featured": "Препоръчани",
"surprise_me": "Изненадай ме",
"no_results": "Няма намерени резултати",
"start_typing": "Започнете да пишете за търсене...",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Has entrat correctament"
},
"home": {
"featured": "Destacats",
"surprise_me": "Sorprèn-me",
"no_results": "No s'ha trobat res"
},
@@ -25,7 +24,6 @@
},
"header": {
"search": "Cerca jocs",
"home": "Inici",
"catalogue": "Catàleg",
"downloads": "Baixades",
@@ -41,10 +39,7 @@
"calculating_eta": "Descarregant {{title}}… ({{percentage}} completat) - Calculant el temps restant…",
"checking_files": "Comprovant els fitxers de {{title}}… ({{percentage}} completat)"
},
"catalogue": {
"next_page": "Pàgina següent",
"previous_page": "Pàgina anterior"
},
"catalogue": {},
"game_details": {
"open_download_options": "Obre les opcions de baixada",
"download_options_zero": "No hi ha opcions de baixada",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Úspěšně přihlášen"
},
"home": {
"featured": "Doporučené",
"surprise_me": "Překvap mě",
"no_results": "Výsledek nenalezen",
"start_typing": "Začni psát pro vyhledávání...",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Loggede ind successfuldt"
},
"home": {
"featured": "Anbefalet",
"surprise_me": "Overrask mig",
"no_results": "Ingen resultater fundet",
"start_typing": "Begynd at skrive for at søge...",
@@ -29,7 +28,6 @@
},
"header": {
"search": "Søg efter spil",
"home": "Hjem",
"catalogue": "Katalog",
"downloads": "Downloads",
@@ -45,10 +43,7 @@
"calculating_eta": "Downloader {{title}}… ({{percentage}} færdig) - Udregner resterende tid…",
"checking_files": "Checker {{title}} filer… ({{percentage}} færdig)"
},
"catalogue": {
"next_page": "Næste side",
"previous_page": "Forrige side"
},
"catalogue": {},
"game_details": {
"open_download_options": "Åben download muligheder",
"download_options_zero": "Ingen download mulighed",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Erfolgreich angemeldet"
},
"home": {
"featured": "Empfohlen",
"surprise_me": "Überrasche mich",
"no_results": "Keine Ergebnisse gefunden",
"start_typing": "Tippe, um zu suchen...",
@@ -59,9 +58,7 @@
"download_sources": "Download-Quellen",
"result_count": "{{resultCount}} Ergebnisse",
"filter_count": "{{filterCount}} verfügbar",
"clear_filters": "{{filterCount}} ausgewählte löschen",
"next_page": "Nächste Seite",
"previous_page": "Vorherige Seite"
"clear_filters": "{{filterCount}} ausgewählte löschen"
},
"game_details": {
"open_download_options": "Download-Optionen öffnen",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Edukalt sisse logitud"
},
"home": {
"featured": "Esile toodud",
"surprise_me": "Üllata mind",
"no_results": "Tulemusi ei leitud",
"start_typing": "Alusta otsimiseks kirjutamist...",
@@ -45,10 +44,7 @@
"calculating_eta": "{{title}} allalaadimine… ({{percentage}} valmis) - Järelejäänud aja arvutamine…",
"checking_files": "{{title}} failide kontrollimine… ({{percentage}} valmis)"
},
"catalogue": {
"next_page": "Järgmine leht",
"previous_page": "Eelmine leht"
},
"catalogue": {},
"game_details": {
"open_download_options": "Ava allalaadimise valikud",
"download_options_zero": "Allalaadimise valikuid pole",

View File

@@ -1,7 +1,6 @@
{
"language_name": "فارسی",
"home": {
"featured": "پیشنهادی",
"surprise_me": "سوپرایزم کن",
"no_results": "اتمام‌ای پیدا نشد"
},
@@ -17,7 +16,6 @@
"home": "خانه",
"favorites": "علاقه‌مندی‌ها"
},
"header": {
"search": "جستجوی بازی‌ها",
"home": "خانه",
@@ -31,10 +29,7 @@
"downloading_metadata": "درحال دانلود متادیتاهای {{title}}…",
"downloading": "در حال دانلود {{title}}… ({{percentage}} تکمیل شده) - اتمام {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "صفحه‌ی بعدی",
"previous_page": "صفحه‌ی قبلی"
},
"catalogue": {},
"game_details": {
"open_download_options": "بازکردن آپشن‌های دانلود",
"download_options_zero": "هیچ آپشن دانلودی وجود ندارد",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Connecté avec succès"
},
"home": {
"featured": "En vedette",
"surprise_me": "Surprenez-moi",
"no_results": "Aucun résultat trouvé",
"start_typing": "Commencez à taper pour rechercher...",

View File

@@ -1,7 +1,6 @@
{
"language_name": "Magyar",
"home": {
"featured": "Featured",
"surprise_me": "Lepj meg",
"no_results": "Nem található"
},
@@ -19,7 +18,6 @@
},
"header": {
"search": "Keresés",
"home": "Főoldal",
"catalogue": "Katalógus",
"downloads": "Letöltések",
@@ -31,10 +29,7 @@
"downloading_metadata": "{{title}} metaadatainak letöltése…",
"downloading": "{{title}} letöltése… ({{percentage}} kész) - Befejezés {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "Következő olda",
"previous_page": "Előző olda"
},
"catalogue": {},
"game_details": {
"open_download_options": "Letöltési lehetőségek",
"download_options_zero": "Nincs letöltési lehetőség",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Berhasil masuk"
},
"home": {
"featured": "Unggulan",
"surprise_me": "Kejutkan saya",
"no_results": "Tidak ada hasil ditemukan"
},
@@ -25,7 +24,6 @@
},
"header": {
"search": "Cari game",
"home": "Beranda",
"catalogue": "Katalog",
"downloads": "Unduhan",
@@ -41,10 +39,7 @@
"calculating_eta": "Mengunduh {{title}}… ({{percentage}} selesai) - Menghitung waktu yang tersisa…",
"checking_files": "Memeriksa file {{title}}… ({{percentage}} selesai)"
},
"catalogue": {
"next_page": "Halaman Berikutnya",
"previous_page": "Halaman Sebelumnya"
},
"catalogue": {},
"game_details": {
"open_download_options": "Buka opsi unduhan",
"download_options_zero": "Tidak ada opsi unduhan",

View File

@@ -1,7 +1,6 @@
{
"language_name": "Italiano",
"home": {
"featured": "In primo piano",
"surprise_me": "Sorprendimi",
"no_results": "Nessun risultato trovato"
},
@@ -20,7 +19,6 @@
},
"header": {
"search": "Cerca",
"home": "Home",
"catalogue": "Catalogo",
"downloads": "Download",
@@ -32,10 +30,7 @@
"downloading_metadata": "Scaricamento metadati di {{title}}…",
"downloading": "Download di {{title}}… ({{percentage}} completato) - Conclusione {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "Pagina successiva",
"previous_page": "Pagina precedente"
},
"catalogue": {},
"game_details": {
"open_download_options": "Apri opzioni di download",
"download_options_zero": "Nessuna opzione di download",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Сәтті кіру"
},
"home": {
"featured": "Ұсынылған",
"surprise_me": "Таңқалдыр",
"no_results": "Ештеңе табылмады"
},
@@ -23,7 +22,6 @@
"sign_in": "Кіру",
"favorites": "Таңдаулылар"
},
"header": {
"search": "Іздеу",
"home": "Басты бет",
@@ -40,10 +38,7 @@
"downloading": "Жүктеу {{title}}… ({{percentage}} аяқталды) - Аяқтау {{eta}} - {{speed}}",
"calculating_eta": "Жүктеу {{title}}… ({{percentage}} аяқталды) - Қалған уақытты есептеу…"
},
"catalogue": {
"next_page": "Келесі бет",
"previous_page": "Алдыңғы бет"
},
"catalogue": {},
"game_details": {
"open_download_options": "Жүктеу нұсқаларын ашу",
"download_options_zero": "Жүктеу нұсқалары жоқ",

View File

@@ -1,7 +1,6 @@
{
"language_name": "한국어",
"home": {
"featured": "추천",
"surprise_me": "무작위 추천",
"no_results": "결과 없음"
},
@@ -17,7 +16,6 @@
"home": "홈",
"favorites": "즐겨찾기"
},
"header": {
"search": "게임 검색하기",
"home": "홈",
@@ -31,10 +29,7 @@
"downloading_metadata": "{{title}}의 메타데이터를 다운로드 중…",
"downloading": "{{title}}의 파일들을 다운로드 중… ({{percentage}} 완료) - 완료까지 {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "다음 페이지",
"previous_page": "이전 페이지"
},
"catalogue": {},
"game_details": {
"open_download_options": "다운로드 선택지 열기",
"download_options_zero": "다운로드 선택지 없음",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Logget inn vellykket"
},
"home": {
"featured": "Anbefalinger",
"surprise_me": "Overrask meg",
"no_results": "Ingen resultater fundet",
"start_typing": "Begynn å skrive for å søke...",
@@ -29,7 +28,6 @@
},
"header": {
"search": "Søk efter spill",
"home": "Hjem",
"catalogue": "Katalog",
"downloads": "Nedlastinger",
@@ -45,10 +43,7 @@
"calculating_eta": "Laster ned {{title}}… ({{percentage}} ferdig) - Regner ut resterende tid…",
"checking_files": "Sjekker {{title}} filer… ({{percentage}} ferdig)"
},
"catalogue": {
"next_page": "Neste side",
"previous_page": "Forrige side"
},
"catalogue": {},
"game_details": {
"open_download_options": "Åpne nedlastingsmuligheter",
"download_options_zero": "Ingen nedlastingsmulighet",

View File

@@ -1,7 +1,6 @@
{
"language_name": "Nederlands",
"home": {
"featured": "Uitgelicht",
"surprise_me": "Verrasing",
"no_results": "Geen resultaten gevonden"
},
@@ -19,7 +18,6 @@
},
"header": {
"search": "Zoek spellen",
"home": "Home",
"catalogue": "Bibliotheek",
"downloads": "Downloads",
@@ -31,10 +29,7 @@
"downloading_metadata": "Downloading {{title}} metadata…",
"downloading": "Downloading {{title}}… ({{percentage}} complete) - Conclusion {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "Volgende Pagina",
"previous_page": "Vorige Pagina"
},
"catalogue": {},
"game_details": {
"open_download_options": "Open download Instellingen",
"download_options_zero": "Geen download Instellingen",

View File

@@ -1,7 +1,6 @@
{
"language_name": "Polski",
"home": {
"featured": "Wyróżnione",
"surprise_me": "Zaskocz mnie",
"no_results": "Nie znaleziono wyników"
},
@@ -20,7 +19,6 @@
},
"header": {
"search": "Szukaj",
"home": "Główna",
"catalogue": "Katalog",
"downloads": "Pobrane",
@@ -32,10 +30,7 @@
"downloading_metadata": "Pobieranie {{title}} metadata…",
"downloading": "Pobieranie {{title}}… (ukończone w {{percentage}}) - Podsumowanie {{eta}} - {{speed}}"
},
"catalogue": {
"next_page": "Następna strona",
"previous_page": "Poprzednia strona"
},
"catalogue": {},
"game_details": {
"open_download_options": "Otwórz opcje pobierania",
"download_options_zero": "Brak opcji pobierania",

View File

@@ -26,7 +26,22 @@
"sign_in": "Login",
"friends": "Amigos",
"need_help": "Precisa de ajuda?",
"favorites": "Favoritos"
"favorites": "Favoritos",
"add_custom_game_tooltip": "Adicionar jogo personalizado",
"custom_game_modal": "Adicionar jogo personalizado",
"edit_game_modal_title": "Título",
"playable_button_title": "",
"custom_game_modal_add": "Adicionar Jogo",
"custom_game_modal_adding": "Adicionando...",
"custom_game_modal_browse": "Buscar",
"custom_game_modal_cancel": "Cancelar",
"edit_game_modal_assets": "Imagens",
"edit_game_modal_icon": "Ícone",
"edit_game_modal_browse": "Buscar",
"edit_game_modal_cancel": "Cancelar",
"edit_game_modal_enter_title": "Insira o título",
"edit_game_modal_logo": "Logo",
"edit_game_modal": "Personalizar detalhes"
},
"header": {
"search": "Buscar jogos",
@@ -219,7 +234,18 @@
"historical_keyshop": "Preço histórico em keyshops",
"language": "Idioma",
"caption": "Legenda",
"audio": "Áudio"
"audio": "Áudio",
"edit_game_modal_button": "Alterar detalhes do jogo",
"game_added_to_pinned": "Jogo adicionado aos fixados",
"game_removed_from_pinned": "Jogo removido dos fixados",
"manual_playtime_tooltip": "Este tempo de jogo foi atualizado manualmente",
"manual_playtime_warning": "As suas horas de jogo serão marcadas como atualizadas manualmente. Esta ação não pode ser desfeita.",
"missing_wine_prefix": "Um prefixo Wine é necessário para criar um backup no Linux",
"update_game_playtime": "Modificar tempo de jogo",
"update_playtime": "Modificar tempo de jogo",
"update_playtime_description": "Atualizar manualmente o tempo de jogo de {{game}}",
"update_playtime_error": "Falha ao atualizar tempo de jogo",
"update_playtime_title": "Atualizar tempo de jogo"
},
"activation": {
"title": "Ativação",
@@ -394,7 +420,8 @@
"hidden": "Oculta",
"test_notification": "Testar notificação",
"notification_preview": "Prévia da Notificação de Conquistas",
"enable_friend_start_game_notifications": "Quando um amigo iniciar um jogo"
"enable_friend_start_game_notifications": "Quando um amigo iniciar um jogo",
"editor_tab_code": "Código"
},
"notifications": {
"download_complete": "Download concluído",
@@ -523,7 +550,15 @@
"show_achievements_on_profile": "Exiba suas conquistas no perfil",
"show_points_on_profile": "Exiba seus pontos ganhos no perfil",
"error_adding_friend": "Não foi possível enviar o pedido de amizade. Verifique o código de amizade inserido",
"friend_code_length_error": "Código de amigo deve ter 8 caracteres"
"friend_code_length_error": "Código de amigo deve ter 8 caracteres",
"top_percentile": "Top {{percentile}}%",
"playtime": "Tempo de jogo",
"played_recently": "Jogado recentemente",
"pinned": "Fixado",
"amount_minutes_short": "{{amount}}h",
"amount_hours_short": "{{amount}}h",
"game_added_to_pinned": "Jogo adicionado aos fixados",
"achievements_earned": "Conquistas recebidas"
},
"achievement": {
"achievement_unlocked": "Conquista desbloqueada",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Sessão iniciada com sucesso"
},
"home": {
"featured": "Destaques",
"hot": "Populares",
"weekly": "📅 Mais descarregados esta semana",
"achievements": "🏆 Para completar",
@@ -26,7 +25,8 @@
"game_has_no_executable": "O jogo não tem um executável selecionado",
"sign_in": "Iniciar sessão",
"friends": "Amigos",
"favorites": "Favoritos"
"favorites": "Favoritos",
"edit_game_modal_cancel": "Cancelar"
},
"header": {
"search": "Procurar jogos",
@@ -247,9 +247,6 @@
"download_count_zero": "Sem downloads na lista",
"download_count_one": "{{countFormatted}} download na lista",
"download_count_other": "{{countFormatted}} downloads na lista",
"download_options_zero": "Sem downloads disponíveis",
"download_options_one": "{{countFormatted}} download disponível",
"download_options_other": "{{countFormatted}} downloads disponíveis",
"download_source_url": "URL da fonte",
"add_download_source_description": "Insere o URL que contém o ficheiro .json",
"download_source_up_to_date": "Sincronizada",
@@ -359,8 +356,6 @@
"instructions": "Verifica a forma correta de instalar algum deles na tua distribuição Linux, para garantir a execução normal do jogo"
},
"catalogue": {
"next_page": "Página seguinte",
"previous_page": "Página anterior",
"search": "Filtrar…",
"developers": "Desenvolvedores",
"genres": "Géneros",
@@ -427,7 +422,6 @@
"friend_code_copied": "Código de amigo copiado",
"undo_friendship_modal_text": "Isto vai remover a tua amizade com {{displayName}}",
"privacy_hint": "Para controlar quem pode ver o teu perfil, acede às <0>Definições</0>",
"profile_locked": "Este perfil é privado",
"image_process_failure": "Falha ao processar a imagem",
"required_field": "Este campo é obrigatório",
"displayname_min_length": "O nome de apresentação deve ter pelo menos 3 caracteres",

View File

@@ -1,7 +1,6 @@
{
"language_name": "Română",
"home": {
"featured": "Recomandate",
"surprise_me": "Surprinde-mă",
"no_results": "Niciun rezultat găsit"
},
@@ -19,7 +18,6 @@
},
"header": {
"search": "Caută jocuri",
"home": "Acasă",
"catalogue": "Catalog",
"downloads": "Descărcări",
@@ -32,10 +30,7 @@
"downloading": "Se descarcă {{title}}... ({{percentage}} complet) - Concluzie {{eta}} - {{speed}}",
"calculating_eta": "Se descarcă {{title}}... ({{percentage}} complet) - Calculare timp rămas..."
},
"catalogue": {
"next_page": "Pagina următoare",
"previous_page": "Pagina anterioară"
},
"catalogue": {},
"game_details": {
"open_download_options": "Deschide opțiunile de descărcare",
"download_options_zero": "Nicio opțiune de descărcare",

View File

@@ -4,14 +4,12 @@
"successfully_signed_in": "Успешный вход"
},
"home": {
"featured": "Рекомендации",
"surprise_me": "Удиви меня",
"no_results": "Ничего не найдено",
"hot": "Сейчас популярно",
"start_typing": "Начинаю вводить текст...",
"weekly": "📅 Лучшие игры недели",
"achievements": "🏆 Игры с достижениями",
"already_in_library": "Уже в библиотеке"
"achievements": "🏆 Игры с достижениями"
},
"sidebar": {
"catalogue": "Каталог",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Inloggningen lyckades"
},
"home": {
"featured": "Utvalt",
"surprise_me": "Överraska mig",
"no_results": "Inga resultat hittades",
"start_typing": "Börja skriva för att söka...",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Başarıyla giriş yapıldı"
},
"home": {
"featured": "Öne Çıkanlar",
"surprise_me": "Beni Şaşırt",
"no_results": "Sonuç bulunamadı",
"start_typing": "Aramak için yazmaya başlayın...",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Успішний вхід в систему"
},
"home": {
"featured": "Рекомендоване",
"surprise_me": "Здивуй мене",
"no_results": "Результатів не знайдено",
"start_typing": "Почніть набирати текст для пошуку...",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "Kirish muvaffaqiyatli amalga oshirildi"
},
"home": {
"featured": "Tavsiya etilgan",
"surprise_me": "Hayratda qoldir",
"no_results": "Natijalar topilmadi",
"hot": "Eng mashhur",

View File

@@ -4,7 +4,6 @@
"successfully_signed_in": "已成功登录"
},
"home": {
"featured": "特色推荐",
"surprise_me": "向我推荐",
"no_results": "没有找到结果",
"start_typing": "键入以开始搜素...",
@@ -51,8 +50,6 @@
"installing_common_redist": "{{log}}…"
},
"catalogue": {
"next_page": "下一页",
"previous_page": "上一页",
"clear_filters": "清除已选的 {{filterCount}} 项",
"developers": "开发商",
"download_sources": "下载源",

View File

@@ -2,7 +2,7 @@
.description-header {
width: calc(100% - calc(globals.$spacing-unit * 2));
margin: calc(globals.$spacing-unit * 1) auto;
margin: calc(globals.$spacing-unit * 1) calc(globals.$spacing-unit * 1);
padding: calc(globals.$spacing-unit * 1.5);
display: flex;
justify-content: space-between;
@@ -10,8 +10,8 @@
background-color: globals.$background-color;
height: 72px;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.03);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
border: 1px solid rgba(255, 255, 255, 0.05);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
&__info {
display: flex;

View File

@@ -7,6 +7,15 @@
display: flex;
flex-direction: column;
align-items: center;
max-height: 80vh;
@media (min-width: 1024px) {
max-height: 70vh;
}
@media (min-width: 1280px) {
max-height: 60vh;
}
}
&__viewport {
@@ -16,8 +25,19 @@
overflow: hidden;
border-radius: 8px;
@media (min-width: 1024px) {
width: 80%;
max-height: 400px;
}
@media (min-width: 1280px) {
width: 60%;
max-height: 500px;
}
@media (min-width: 1536px) {
width: 50%;
max-height: 600px;
}
}
@@ -52,10 +72,18 @@
overflow-y: hidden;
gap: calc(globals.$spacing-unit / 2);
@media (min-width: 1024px) {
width: 80%;
}
@media (min-width: 1280px) {
width: 60%;
}
@media (min-width: 1536px) {
width: 50%;
}
&::-webkit-scrollbar-thumb {
width: 20%;
}
@@ -79,6 +107,19 @@
border: solid 1px globals.$border-color;
overflow: hidden;
position: relative;
aspect-ratio: 16/9;
@media (min-width: 1024px) {
width: 15%;
}
@media (min-width: 1280px) {
width: 12%;
}
@media (min-width: 1536px) {
width: 10%;
}
&:hover {
opacity: 0.8;

View File

@@ -43,6 +43,29 @@ export function GameDetailsContent() {
const $images = Array.from(document.querySelectorAll("img"));
$images.forEach(($image) => {
$image.loading = "lazy";
// Remove any inline width/height styles that might cause overflow
$image.removeAttribute("width");
$image.removeAttribute("height");
$image.removeAttribute("style");
// Set max-width to prevent overflow
$image.style.maxWidth = "100%";
$image.style.width = "auto";
$image.style.height = "auto";
$image.style.boxSizing = "border-box";
});
// Handle videos the same way
const $videos = Array.from(document.querySelectorAll("video"));
$videos.forEach(($video) => {
// Remove any inline width/height styles that might cause overflow
$video.removeAttribute("width");
$video.removeAttribute("height");
$video.removeAttribute("style");
// Set max-width to prevent overflow
$video.style.maxWidth = "100%";
$video.style.width = "auto";
$video.style.height = "auto";
$video.style.boxSizing = "border-box";
});
return document.body.outerHTML;

View File

@@ -186,9 +186,10 @@ $hero-height: 300px;
&__description-content {
width: 100%;
height: 100%;
min-height: 100%;
min-width: 0;
flex: 1;
overflow-x: hidden;
}
&__description {
@@ -199,6 +200,8 @@ $hero-height: 300px;
width: 100%;
margin-left: auto;
margin-right: auto;
overflow-x: auto;
min-height: auto;
@media (min-width: 768px) {
padding: calc(globals.$spacing-unit * 2.5) calc(globals.$spacing-unit * 2);
@@ -206,20 +209,30 @@ $hero-height: 300px;
@media (min-width: 1024px) {
padding: calc(globals.$spacing-unit * 3) calc(globals.$spacing-unit * 2);
width: 80%;
}
@media (min-width: 1280px) {
width: 60%;
}
img {
@media (min-width: 1536px) {
width: 50%;
}
img,
video {
border-radius: 5px;
margin-top: globals.$spacing-unit;
margin-bottom: calc(globals.$spacing-unit * 3);
display: block;
width: 100%;
height: auto;
object-fit: cover;
display: block !important;
max-width: 100% !important;
width: auto !important;
height: auto !important;
object-fit: contain !important;
box-sizing: border-box !important;
word-wrap: break-word;
overflow-wrap: break-word;
}
a {
@@ -247,12 +260,17 @@ $hero-height: 300px;
@media (min-width: 1024px) {
padding: calc(globals.$spacing-unit * 3) calc(globals.$spacing-unit * 2);
width: 80%;
}
@media (min-width: 1280px) {
width: 60%;
line-height: 22px;
}
@media (min-width: 1536px) {
width: 50%;
}
}
&__randomizer-button {

View File

@@ -1,6 +1,12 @@
@use "../../../scss/globals.scss";
.sidebar-section {
background-color: globals.$dark-background-color;
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.05);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
overflow: hidden;
&__button {
padding: calc(globals.$spacing-unit * 2.5) calc(globals.$spacing-unit * 2);
display: flex;

View File

@@ -1,11 +1,14 @@
@use "../../../scss/globals.scss";
.content-sidebar {
border-left: solid 1px globals.$border-color;
background-color: globals.$dark-background-color;
background-color: transparent;
height: 100%;
flex-shrink: 0;
width: 280px;
padding: calc(globals.$spacing-unit * 1);
display: flex;
flex-direction: column;
gap: calc(globals.$spacing-unit * 1.5);
@media (min-width: 1024px) {
width: 320px;

View File

@@ -76,6 +76,15 @@
width: 24px;
height: 24px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
&__title-flame-icon {
width: 32px;
height: 32px;
object-fit: contain;
}
&__title {

View File

@@ -158,7 +158,7 @@ export default function Home() {
<img
src={flameIconAnimated}
alt="Flame animation"
className="home__flame-icon"
className="home__title-flame-icon"
/>
</div>
)}