Tweak layout and typography styles

This commit is contained in:
inkch
2025-07-23 20:21:51 +09:00
parent cecfee7229
commit 7123d715f4
2 changed files with 52 additions and 38 deletions

43
public/site.css generated
View File

@@ -1,3 +1,9 @@
/*
Based on styles from Go by Example by Mark McGranaghan and Eli Bendersky
(https://gobyexample.com), licensed under CC BY 3.0.
Modified by inkch. Original: https://github.com/mmcgrana/gobyexample
*/
/* CSS reset: https://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
@@ -45,9 +51,9 @@ table {
/* Layout and typography */
body {
font-family: 'Georgia', serif;
font-family: serif;
font-size: 16px;
line-height: 20px;
line-height: 1.4;
}
em {
font-style: italic;
@@ -61,9 +67,9 @@ h2 a {
text-decoration: none;
}
div.example {
width: 900px;
min-width: 900px;
max-width: 900px;
width: 1100px;
min-width: 1100px;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
margin-bottom: 120px;
@@ -79,12 +85,13 @@ p.footer {
font-size: 75%;
}
div#intro {
width: 420px;
min-width: 420px;
max-width: 420px;
width: 500px;
min-width: 500px;
max-width: 500px;
margin-left: auto;
margin-right: auto;
margin-bottom: 120px;
font-size: 18px;
}
div#intro p {
padding-top: 20px;
@@ -97,22 +104,22 @@ table td {
outline: 0;
}
td.docs {
width: 420px;
max-width: 420px;
min-width: 420px;
width: 500px;
max-width: 500px;
min-width: 500px;
min-height: 5px;
vertical-align: top;
text-align: left;
}
td.docs p {
padding-right: 5px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 15px;
}
td.code {
width: 480px;
max-width: 480px;
min-width: 480px;
width: 590px;
max-width: 590px;
min-width: 590px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
@@ -123,8 +130,8 @@ td.code.leading {
padding-bottom: 11px;
}
pre, code {
font-size: 14px; line-height: 18px;
font-family: 'Menlo', 'Monaco', 'Consolas', 'Lucida Console', monospace;
font-size: 14px; line-height: 20px;
font-family: monospace;
}
img.copy, img.run {
height: 16px;
@@ -205,7 +212,7 @@ body .c1 { color: #808080 } /* Comment.Single */
background: #282828;
}
/* Syntax highlighting: dark mode */
body .nx { } /* Name.Other */
body .nf { } /* Name.Function */

View File

@@ -1,3 +1,9 @@
/*
Based on styles from Go by Example by Mark McGranaghan and Eli Bendersky
(https://gobyexample.com), licensed under CC BY 3.0.
Modified by inkch. Original: https://github.com/mmcgrana/gobyexample
*/
/* CSS reset: https://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
@@ -45,9 +51,9 @@ table {
/* Layout and typography */
body {
font-family: 'Georgia', serif;
font-family: serif;
font-size: 16px;
line-height: 20px;
line-height: 1.4;
}
em {
font-style: italic;
@@ -61,9 +67,9 @@ h2 a {
text-decoration: none;
}
div.example {
width: 900px;
min-width: 900px;
max-width: 900px;
width: 1100px;
min-width: 1100px;
max-width: 1100px;
margin-left: auto;
margin-right: auto;
margin-bottom: 120px;
@@ -73,18 +79,19 @@ div.example table {
margin-bottom: 20px;
}
p.next {
margin-bottom: 20px;
margin-bottom: 40px;
}
p.footer {
font-size: 75%;
font-size: 80%;
}
div#intro {
width: 420px;
min-width: 420px;
max-width: 420px;
width: 500px;
min-width: 500px;
max-width: 500px;
margin-left: auto;
margin-right: auto;
margin-bottom: 120px;
font-size: 18px;
}
div#intro p {
padding-top: 20px;
@@ -97,22 +104,22 @@ table td {
outline: 0;
}
td.docs {
width: 420px;
max-width: 420px;
min-width: 420px;
width: 500px;
max-width: 500px;
min-width: 500px;
min-height: 5px;
vertical-align: top;
text-align: left;
}
td.docs p {
padding-right: 5px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 15px;
}
td.code {
width: 480px;
max-width: 480px;
min-width: 480px;
width: 590px;
max-width: 590px;
min-width: 590px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
@@ -123,8 +130,8 @@ td.code.leading {
padding-bottom: 11px;
}
pre, code {
font-size: 14px; line-height: 18px;
font-family: 'Menlo', 'Monaco', 'Consolas', 'Lucida Console', monospace;
font-size: 14px; line-height: 20px;
font-family: monospace;
}
img.copy, img.run {
height: 16px;
@@ -205,7 +212,7 @@ body .c1 { color: #808080 } /* Comment.Single */
background: #282828;
}
/* Syntax highlighting: dark mode */
body .nx { } /* Name.Other */
body .nf { } /* Name.Function */