From mboxrd@z Thu Jan 1 00:00:00 1970 Return-Path: Received: from ffbox0-bg.ffmpeg.org (ffbox0-bg.ffmpeg.org [79.124.17.100]) by master.gitmailbox.com (Postfix) with ESMTPS id B54B84C14F for ; Fri, 6 Feb 2026 12:29:53 +0000 (UTC) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/simple; d=ffmpeg.org; i=@ffmpeg.org; q=dns/txt; s=mail; t=1770380975; h=to : date : message-id : mime-version : reply-to : subject : list-id : list-archive : list-archive : list-help : list-owner : list-post : list-subscribe : list-unsubscribe : from : cc : content-type : content-transfer-encoding : from; bh=FyDy2rPpD+/YsWAbex6IsmRG78eTWaKfDThrMbzgfrw=; b=SGg5tD6YRmxIWSKPur08i2xYWEPGKkHmHlnBycDJZYZfpMqhY+1EJJxhFNBQfsM1gFOaA wqBljCwilHg/dX//S0wkwbv/CUeuHGyzgYzJstrallrLUJ37peFt4s+ePDZhta3I9e4yDVw kZrfi655e/m7b50ThMkniCIg7fMAL9OZ03mzsepniH20qOQ3g8Z+Gz/BZUZ7go+Ui28iW56 WZu6QEEvMrD8U+GxmAO0SCeIoFlgQVJflNY+yN9n5jJw30D5HlNs4HW1qEuMW8BMFY1bLBU as099cWoKiNdnpRz/XrBa5kf7xI0iasqcM3Jq50Yv5aTHJqNVxJYUcxEFKfQ== Received: from [172.20.0.4] (unknown [172.20.0.4]) by ffbox0-bg.ffmpeg.org (Postfix) with ESMTP id 487276910FA; Fri, 6 Feb 2026 14:29:35 +0200 (EET) ARC-Seal: i=2; cv=pass; a=rsa-sha256; d=ffmpeg.org; s=arc; t=1770380943; b=bvzp0RS2v8EsGUasou5Kcq69FMaKQlyKw11MlxIhHUlEMBFob+ybrw372aaStpWdcEjLA 6soZ1ot0URIsd+F/vgSjHf/EX8hHwZDjzINWbEizu6qrd3Dm8NWJQyv6uBUWvo/k0wyZc0k ZEnee3jCDrtEU9XVQA2zkVXTytxxXErJNmF3uIW4K6BEenxdaGI8FPTjxfdQGm0DznsHjcZ dOfeioyY3Mj1Z8pAox5Y2IGQEDJdS60WmPTJRGpGq0kd9OBOOhKQUeYdD7yXClO7zPyR9ky Jk4KLAzL3M0vhDbwtQOKSSG9z92BsTpchbWfiMSEY0mW9w6ocG/50IOqzt3A== ARC-Message-Signature: i=2; a=rsa-sha256; c=relaxed/relaxed; d=ffmpeg.org; s=arc; t=1770380943; h=from : sender : reply-to : subject : date : message-id : to : cc : mime-version : content-type : content-transfer-encoding : content-id : content-description : resent-date : resent-from : resent-sender : resent-to : resent-cc : resent-message-id : in-reply-to : references : list-id : list-help : list-unsubscribe : list-subscribe : list-post : list-owner : list-archive; bh=4y68V5iMvmHmnufB/FjQimHZ+8MHB1LhFusfqxYg1ZA=; b=UJhRG4BKVLhipwuEn1xrd/7zvqhYerJOVCJuGBiYHKlKdNM6xzoKXFP1eF6JhRSG30xub lJ+21WOE0+Atbl8++7fGQDz/t9rNmF1bv21GAjXeWshCKJUgzkpEdep2BxMJxMcFV/lo+hZ kWFiW0xKyYMvpxKVyFie4NfgTBYEHMsa84jp3+Q93V1fis5WNQpel+lH+ayj4RJIj18tph4 lcavtgUyQOy8rtMwma+zLYoWiuO1pHEGPb+HaSRLsGqyVzAkFw9nkkeNW7iykMBxAvzkpky 2GwtPHLcniVpdebJHSlJ4DcZ1p4eToheysfHyamL7PaKvMa9bdu0y28F5nqw== ARC-Authentication-Results: i=2; ffmpeg.org; dkim=fail; arc=pass; dmarc=fail header.from=ritovision.com policy.dmarc=reject Authentication-Results: ffmpeg.org; dkim=fail; arc=pass; dmarc=fail (Used From Domain Record) header.from=ritovision.com policy.dmarc=reject Received: from sender4-of-o55.zoho.com (sender4-of-o55.zoho.com [136.143.188.55]) by ffbox0-bg.ffmpeg.org (Postfix) with ESMTPS id E8C9D69088B for ; Fri, 6 Feb 2026 14:28:46 +0200 (EET) ARC-Seal: i=1; a=rsa-sha256; t=1770380921; cv=none; d=zohomail.com; s=zohoarc; b=QmUbKUvXt92C1MQ1ZQidVw2y5/C3ceO6apCLVlHcB236X4dljfHEgNa8HjGEEcWfC3kcv8UXctOJl6asGDvLXrGGQV3feyhpc4SKcPDxsaL42/G/XnqlYueQK7b0ljkXnr5oB8exe62GqRJxb2ZjmHdjbn9WzP0DQ4ibQTXY4mg= ARC-Message-Signature: i=1; a=rsa-sha256; c=relaxed/relaxed; d=zohomail.com; s=zohoarc; t=1770380921; h=Content-Transfer-Encoding:Cc:Cc:Date:Date:From:From:MIME-Version:Message-ID:Subject:Subject:To:To:Message-Id:Reply-To; bh=0i2b7D89zzHhDzFz6UWodNhWiRnEu0hfoKNdJwcGoNg=; b=Vs/3XWKmT/925APsUWCgujh30YYYy9WZ1dl2PoI2aUFgjirr1gd0yVKq8x2Jz7w1yItu5FmGFnZH1jN0tp+lhHhZRqywWbbr+uoXqtQnXprEREOcVbS7Tm6K8zXVCocySJPst0G4lB2L6idOI5cKIreVo7VTjp25ozQnxiey+h8= ARC-Authentication-Results: i=1; mx.zohomail.com; spf=pass smtp.mailfrom=rito@ritovision.com; dmarc=pass header.from= Received: by mx.zohomail.com with SMTPS id 1770380919282862.896179920522; Fri, 6 Feb 2026 04:28:39 -0800 (PST) To: ffmpeg-devel@ffmpeg.org Date: Fri, 6 Feb 2026 07:26:01 -0500 Message-ID: <20260206122811.88856-1-rito@ritovision.com> X-Mailer: git-send-email 2.51.0 MIME-Version: 1.0 X-ZohoMailClient: External Message-ID-Hash: F3LQ4BDXFUH4DRT4FGBS2BJSU7V4MBEA X-Message-ID-Hash: F3LQ4BDXFUH4DRT4FGBS2BJSU7V4MBEA X-MailFrom: SRS0=Odqh=AK=ritovision.com=rito@ffmpeg.org X-Mailman-Rule-Misses: dmarc-mitigation; no-senders; approved; loop; banned-address; header-match-ffmpeg-devel.ffmpeg.org-0; header-match-ffmpeg-devel.ffmpeg.org-1; header-match-ffmpeg-devel.ffmpeg.org-2; header-match-ffmpeg-devel.ffmpeg.org-3; emergency; member-moderation; nonmember-moderation; administrivia; implicit-dest; max-recipients; max-size; news-moderation; no-subject; digests; suspicious-header X-Mailman-Version: 3.3.10 Precedence: list Reply-To: FFmpeg development discussions and patches Subject: [FFmpeg-devel] [PATCH] prevent sidebar from causing horizontal page scroll on mobile List-Id: FFmpeg development discussions and patches Archived-At: Archived-At: List-Archive: List-Archive: List-Help: List-Owner: List-Post: List-Subscribe: List-Unsubscribe: From: Rito Rhymes via ffmpeg-devel Cc: rito@ritovision.com Content-Type: text/plain; charset="us-ascii" Content-Transfer-Encoding: 7bit Archived-At: List-Archive: List-Post: When the sidebar is opened on mobile devices, it currently pushes the page content to the right, expanding the entire page width and causing horizontal scroll. Horizontal page scrolling on mobile can be disorienting for users, impede a11y and lead to unpredictable browser behaviors. This patch modifies the sidebar behavior on mobile to position it over / occluding the left side of the page, instead of pushing the content aside. Additionally, because the sidebar now directly occludes page content and the hamburger icon: - an additional overlay element covers the content to enforce separation and focus - a close button is added to the sidebar (on mobile only) for clear dismissal Tapping the overlay or the close button will close the sidebar and remove the overlay. --- htdocs/css/simple-sidebar.css | 56 ++++++++++++++++++++++++++++++----- src/template_footer2 | 12 +++++++- src/template_head2 | 3 ++ 3 files changed, 63 insertions(+), 8 deletions(-) diff --git a/htdocs/css/simple-sidebar.css b/htdocs/css/simple-sidebar.css index 71a8a39..d0d6306 100644 --- a/htdocs/css/simple-sidebar.css +++ b/htdocs/css/simple-sidebar.css @@ -89,6 +89,15 @@ padding: 20px; } +/* Overlay and close button - hidden on desktop */ +.sidebar-overlay { + display: none; +} + +.sidebar-close { + display: none; +} + @media (max-width:767px) { #wrapper { @@ -97,17 +106,50 @@ #sidebar-wrapper { left: 0; + margin-left: 0; + height: 100vh; + transform: translateX(-200px); + transition: transform 0.3s ease; + z-index: 1001; } -#wrapper.active { - position: relative; - left: 200px; +#wrapper.active #sidebar-wrapper { + transform: translateX(0); } -#wrapper.active #sidebar-wrapper { - left: 200px; - width: 200px; - transition: all 0.4s ease 0s; +.sidebar-close { + display: block; + position: absolute; + top: 0; + right: 0; + color: #999; + font-size: 24px; + text-decoration: none; + z-index: 1001; + line-height: 1; + padding: 20px; +} + +.sidebar-close:hover, +.sidebar-close:active, +.sidebar-close:focus { + color: #fff; + text-decoration: none; +} + +.sidebar-overlay { + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100vh; + background: rgba(0, 0, 0, 0.5); + z-index: 999; +} + +#wrapper.active .sidebar-overlay { + display: block; } #menu-toggle { diff --git a/src/template_footer2 b/src/template_footer2 index 735d540..958b963 100644 --- a/src/template_footer2 +++ b/src/template_footer2 @@ -1,8 +1,18 @@ diff --git a/src/template_head2 b/src/template_head2 index 4f61b62..8277e3f 100644 --- a/src/template_head2 +++ b/src/template_head2 @@ -12,6 +12,7 @@