public inbox for libc-alpha@sourceware.org
 help / color / mirror / Atom feed
* [PATCH htdocs 1/2] add meta viewport settings for mobile devices
@ 2023-12-20  3:14 Mike Frysinger
  2023-12-20  3:14 ` [PATCH htdocs 2/2] style: tighten up spacing on smaller devices Mike Frysinger
                   ` (2 more replies)
  0 siblings, 3 replies; 6+ messages in thread
From: Mike Frysinger @ 2023-12-20  3:14 UTC (permalink / raw)
  To: libc-alpha

This makes pages more readable by default on mobile devices.
---
 bugs.html          | 1 +
 documentation.html | 1 +
 index.html         | 1 +
 involved.html      | 1 +
 security.html      | 1 +
 sources.html       | 1 +
 started.html       | 1 +
 template.html      | 1 +
 8 files changed, 8 insertions(+)

diff --git a/bugs.html b/bugs.html
index 87d992165fec..bb7bccc00244 100644
--- a/bugs.html
+++ b/bugs.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/documentation.html b/documentation.html
index 8292ed8cfa11..8458f2e077f1 100644
--- a/documentation.html
+++ b/documentation.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/index.html b/index.html
index b4cefd882cbe..9b35d5f4d8c9 100644
--- a/index.html
+++ b/index.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/involved.html b/involved.html
index 62811e1936f2..b51a01681cf0 100644
--- a/involved.html
+++ b/involved.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/security.html b/security.html
index 4b71d68fdc9f..d0f56074282f 100644
--- a/security.html
+++ b/security.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/sources.html b/sources.html
index 49c5bd0da065..1341f2872a19 100644
--- a/sources.html
+++ b/sources.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/started.html b/started.html
index c37c4cc9f4ca..a962ef94e9dd 100644
--- a/started.html
+++ b/started.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
diff --git a/template.html b/template.html
index 64a63b50d3c7..ca3abc171170 100644
--- a/template.html
+++ b/template.html
@@ -3,6 +3,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rev="made" href="mailto:libc-alpha@sourceware.org" />
  <link rel="shortcut icon" href="favicon.ico" />
  <link rel="stylesheet" type="text/css" href="glibc.css" />
-- 
2.43.0


^ permalink raw reply	[flat|nested] 6+ messages in thread

* [PATCH htdocs 2/2] style: tighten up spacing on smaller devices
  2023-12-20  3:14 [PATCH htdocs 1/2] add meta viewport settings for mobile devices Mike Frysinger
@ 2023-12-20  3:14 ` Mike Frysinger
  2024-02-16 19:35   ` Carlos O'Donell
  2023-12-20  5:33 ` htdocs patch preview Mike Frysinger
  2024-02-16 19:35 ` [PATCH htdocs 1/2] add meta viewport settings for mobile devices Carlos O'Donell
  2 siblings, 1 reply; 6+ messages in thread
From: Mike Frysinger @ 2023-12-20  3:14 UTC (permalink / raw)
  To: libc-alpha

The current padding & margins work well when on a larger screen --
it provides a very comfortable view.  However, on smaller screens,
especially on mobile devices, the large amount of whitespace ends
up crowding out meaningful content leading to a lot of scrolling.

Scale down the spacing on smaller screens to maximize content.
The focus is on removing "extra" padding around elements rather
then padding among the content itself (e.g., line height and
paragraph breaks).  Now reading on a phone is very comfortable.
---
 glibc.css | 28 ++++++++++++++++++++++++++++
 1 file changed, 28 insertions(+)

diff --git a/glibc.css b/glibc.css
index 04f8f243fce5..40f6d6e2f8d7 100644
--- a/glibc.css
+++ b/glibc.css
@@ -146,3 +146,31 @@ pre.keys {
 	background:#eee;
 	width:80%;
 }
+
+/* This is ~768px with 16pt font.  */
+@media only screen and (max-width: 50em) {
+	body {
+		margin: 0;
+	}
+
+	#banner, #footer, #centercontent, #menucontent {
+		margin-left: 0;
+		margin-right: 0;
+	}
+
+	#banner {
+		min-height: 1em;
+	}
+
+	#centercontent {
+		padding: 0;
+	}
+
+	#menucontent {
+		padding: 5px;
+	}
+
+	#banner h1 {
+		font-size: 1.3em;
+	}
+}
-- 
2.43.0


^ permalink raw reply	[flat|nested] 6+ messages in thread

* htdocs patch preview
  2023-12-20  3:14 [PATCH htdocs 1/2] add meta viewport settings for mobile devices Mike Frysinger
  2023-12-20  3:14 ` [PATCH htdocs 2/2] style: tighten up spacing on smaller devices Mike Frysinger
@ 2023-12-20  5:33 ` Mike Frysinger
  2023-12-20 19:12   ` Carlos O'Donell
  2024-02-16 19:35 ` [PATCH htdocs 1/2] add meta viewport settings for mobile devices Carlos O'Donell
  2 siblings, 1 reply; 6+ messages in thread
From: Mike Frysinger @ 2023-12-20  5:33 UTC (permalink / raw)
  To: libc-alpha

[-- Attachment #1: Type: text/plain, Size: 98 bytes --]

if people want to preview these changes, i posted them to:
https://wh0rd.org/~vapier/glibc/
-mike

[-- Attachment #2: signature.asc --]
[-- Type: application/pgp-signature, Size: 833 bytes --]

^ permalink raw reply	[flat|nested] 6+ messages in thread

* Re: htdocs patch preview
  2023-12-20  5:33 ` htdocs patch preview Mike Frysinger
@ 2023-12-20 19:12   ` Carlos O'Donell
  0 siblings, 0 replies; 6+ messages in thread
From: Carlos O'Donell @ 2023-12-20 19:12 UTC (permalink / raw)
  To: Mike Frysinger, libc-alpha

On 12/20/23 00:33, Mike Frysinger wrote:
> if people want to preview these changes, i posted them to:
> https://wh0rd.org/~vapier/glibc/

Looks great!

I'll get your changes integrated shortly. Thanks for the cleanups.

I will also move the repo master branch to main (should have been done
first).

-- 
Cheers,
Carlos.


^ permalink raw reply	[flat|nested] 6+ messages in thread

* Re: [PATCH htdocs 1/2] add meta viewport settings for mobile devices
  2023-12-20  3:14 [PATCH htdocs 1/2] add meta viewport settings for mobile devices Mike Frysinger
  2023-12-20  3:14 ` [PATCH htdocs 2/2] style: tighten up spacing on smaller devices Mike Frysinger
  2023-12-20  5:33 ` htdocs patch preview Mike Frysinger
@ 2024-02-16 19:35 ` Carlos O'Donell
  2 siblings, 0 replies; 6+ messages in thread
From: Carlos O'Donell @ 2024-02-16 19:35 UTC (permalink / raw)
  To: Mike Frysinger, libc-alpha

On 12/19/23 22:14, Mike Frysinger wrote:
> This makes pages more readable by default on mobile devices.

LGTM. Applied.

Reviewed-by: Carlos O'Donell <carlos@redhat.com>

> ---
>  bugs.html          | 1 +
>  documentation.html | 1 +
>  index.html         | 1 +
>  involved.html      | 1 +
>  security.html      | 1 +
>  sources.html       | 1 +
>  started.html       | 1 +
>  template.html      | 1 +
>  8 files changed, 8 insertions(+)
> 
> diff --git a/bugs.html b/bugs.html
> index 87d992165fec..bb7bccc00244 100644
> --- a/bugs.html
> +++ b/bugs.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/documentation.html b/documentation.html
> index 8292ed8cfa11..8458f2e077f1 100644
> --- a/documentation.html
> +++ b/documentation.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/index.html b/index.html
> index b4cefd882cbe..9b35d5f4d8c9 100644
> --- a/index.html
> +++ b/index.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/involved.html b/involved.html
> index 62811e1936f2..b51a01681cf0 100644
> --- a/involved.html
> +++ b/involved.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/security.html b/security.html
> index 4b71d68fdc9f..d0f56074282f 100644
> --- a/security.html
> +++ b/security.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/sources.html b/sources.html
> index 49c5bd0da065..1341f2872a19 100644
> --- a/sources.html
> +++ b/sources.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/started.html b/started.html
> index c37c4cc9f4ca..a962ef94e9dd 100644
> --- a/started.html
> +++ b/started.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />
> diff --git a/template.html b/template.html
> index 64a63b50d3c7..ca3abc171170 100644
> --- a/template.html
> +++ b/template.html
> @@ -3,6 +3,7 @@
>  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
>  <head>
>   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> + <meta name="viewport" content="width=device-width, initial-scale=1.0">
>   <link rev="made" href="mailto:libc-alpha@sourceware.org" />
>   <link rel="shortcut icon" href="favicon.ico" />
>   <link rel="stylesheet" type="text/css" href="glibc.css" />

-- 
Cheers,
Carlos.


^ permalink raw reply	[flat|nested] 6+ messages in thread

* Re: [PATCH htdocs 2/2] style: tighten up spacing on smaller devices
  2023-12-20  3:14 ` [PATCH htdocs 2/2] style: tighten up spacing on smaller devices Mike Frysinger
@ 2024-02-16 19:35   ` Carlos O'Donell
  0 siblings, 0 replies; 6+ messages in thread
From: Carlos O'Donell @ 2024-02-16 19:35 UTC (permalink / raw)
  To: Mike Frysinger, libc-alpha

On 12/19/23 22:14, Mike Frysinger wrote:
> The current padding & margins work well when on a larger screen --
> it provides a very comfortable view.  However, on smaller screens,
> especially on mobile devices, the large amount of whitespace ends
> up crowding out meaningful content leading to a lot of scrolling.
> 
> Scale down the spacing on smaller screens to maximize content.
> The focus is on removing "extra" padding around elements rather
> then padding among the content itself (e.g., line height and
> paragraph breaks).  Now reading on a phone is very comfortable.

Agreed.

LGTM. Applied.

Reviewed-by: Carlos O'Donell <carlos@redhat.com>

> ---
>  glibc.css | 28 ++++++++++++++++++++++++++++
>  1 file changed, 28 insertions(+)
> 
> diff --git a/glibc.css b/glibc.css
> index 04f8f243fce5..40f6d6e2f8d7 100644
> --- a/glibc.css
> +++ b/glibc.css
> @@ -146,3 +146,31 @@ pre.keys {
>  	background:#eee;
>  	width:80%;
>  }
> +
> +/* This is ~768px with 16pt font.  */
> +@media only screen and (max-width: 50em) {
> +	body {
> +		margin: 0;
> +	}
> +
> +	#banner, #footer, #centercontent, #menucontent {
> +		margin-left: 0;
> +		margin-right: 0;
> +	}
> +
> +	#banner {
> +		min-height: 1em;
> +	}
> +
> +	#centercontent {
> +		padding: 0;
> +	}
> +
> +	#menucontent {
> +		padding: 5px;
> +	}
> +
> +	#banner h1 {
> +		font-size: 1.3em;
> +	}
> +}

-- 
Cheers,
Carlos.


^ permalink raw reply	[flat|nested] 6+ messages in thread

end of thread, other threads:[~2024-02-16 19:35 UTC | newest]

Thread overview: 6+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2023-12-20  3:14 [PATCH htdocs 1/2] add meta viewport settings for mobile devices Mike Frysinger
2023-12-20  3:14 ` [PATCH htdocs 2/2] style: tighten up spacing on smaller devices Mike Frysinger
2024-02-16 19:35   ` Carlos O'Donell
2023-12-20  5:33 ` htdocs patch preview Mike Frysinger
2023-12-20 19:12   ` Carlos O'Donell
2024-02-16 19:35 ` [PATCH htdocs 1/2] add meta viewport settings for mobile devices Carlos O'Donell

This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).