From afa169cd0d5e7c5663bde829376b6248b9eba576 Mon Sep 17 00:00:00 2001
From: Boris Kolpackov <boris@codesynthesis.com>
Date: Tue, 26 Jan 2016 16:48:35 +0200
Subject: Initial common and intro styles

---
 common.css    | 39 +++++++++++++++++++++++++
 css-notes.txt | 34 ++++++++++++++++++++++
 intro.css     | 92 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 165 insertions(+)
 create mode 100644 common.css
 create mode 100644 css-notes.txt
 create mode 100644 intro.css

diff --git a/common.css b/common.css
new file mode 100644
index 0000000..0cb1e32
--- /dev/null
+++ b/common.css
@@ -0,0 +1,39 @@
+/* file      : common.css
+ * copyright : Copyright (c) 2014-2016 Code Synthesis Ltd
+ * license   : MIT; see accompanying LICENSE file
+ */
+
+html
+{
+  font-family: "Helvetica Neue", Helvetica, "Segoe UI", Arial, freesans, sans-serif;
+  font-weight: normal;
+  font-size: 18px;
+  line-height: 1.4em;
+}
+
+body {margin: 0;} /* There is non-0 default margin for body. */
+
+/* See notes on what's going on here. */
+body {min-width: 17em;}
+@media only screen and (min-width: 360px)
+{
+  body {min-width: 19em;}
+}
+
+#content
+{
+  max-width: 40em;
+  margin: 0 auto 0 auto;
+  padding: 0 .4em 0 .4em; /* Space between text and browser frame. */
+}
+
+code, pre
+{
+  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  font-size: 0.92em;
+}
+
+pre
+{
+  white-space: pre-wrap;
+}
diff --git a/css-notes.txt b/css-notes.txt
new file mode 100644
index 0000000..7680587
--- /dev/null
+++ b/css-notes.txt
@@ -0,0 +1,34 @@
+Some mobile device dimentions:
+
+Nexus 5   360 598
+Nexus 6   412 690
+iPhone 5  320 568
+iPhone 6  375 667
+iPhone 6+ 414 736
+Galaxy 5  360 640
+Galaxy 6  360 640
+
+iPad            768 1024
+Galaxy 2,3 10"  800 1280
+Galaxy 2 7"     600 1024
+
+Based on this, we define the following size brackets:
+
+320-359    small phone portrait
+360-567    big phone portrate
+568-1023   phone landscape, tablets portrate 
+1024-      tablets landscape, monitor
+
+Body min-width:
+
+320px ~ 20em @ 16px font-size. This is factored in when doing font boosting.
+Specifying 320px directly seems to mess it up.
+
+Font boosting results for font-size:1.1em (~18px), min-width:18em on Nexus 5:
+
+     - about 40 characters in portrait
+     - about 70 characters in landscape
+     - landscape font appears slightly smaller
+
+18em on smaller phones (e.g., iPhone 4) appears to trigger scrolling. 17em
+works well, however.
diff --git a/intro.css b/intro.css
new file mode 100644
index 0000000..2fb8d67
--- /dev/null
+++ b/intro.css
@@ -0,0 +1,92 @@
+/* file      : intro.css
+ * copyright : Copyright (c) 2014-2016 Code Synthesis Ltd
+ * license   : MIT; see accompanying LICENSE file
+ */
+
+html
+{
+  color: #333;
+  text-align: justify;
+}
+
+#content
+{   
+  padding-left: 3em; /* Reserve for headings. */
+}
+
+h1
+{
+  font-weight: normal;
+  font-size: 1.58em;
+  line-height: 1.4em;
+  
+  margin: 1.6em 0 .6em -1.89em;
+}   
+
+code
+{
+  background-color: rgba(0, 0, 0, 0.04);
+  border-radius: 0.2em;
+  padding: .2em 0 .2em 0;
+}
+
+code::before
+{
+  letter-spacing: -0.2em;
+  content: "\00a0";
+}
+
+code::after
+{
+  letter-spacing: -0.2em;
+  content: "\00a0";
+}
+
+pre
+{
+  background-color: #f7f7f7;
+  border-radius: 0.2em;
+
+  padding: .8em .4em .8em .4em;
+  margin: 1.5em -.4em 1.5em -.4em; /* Use margins of #content. */
+
+/*
+  padding: .8em 0 .8em .8em;
+  margin: .2em 0 .2em 0;
+  */
+}
+
+dl {
+  margin: 1em 0 1em 0;
+}
+
+dl dt {
+  margin: 0 0 0 0;
+}
+
+dl dd {
+  margin: 0 0 0 1.8em;
+}
+
+/* Title page */
+
+#titlepage {
+  margin: 3em 0 1.8em 0;
+  padding-bottom: .8em;
+  border-bottom: 1px solid black;
+}
+
+#titlepage .title {
+  font-weight: bold;
+  font-size: 200%;
+  text-align: center;
+  padding: 1em 0 2em 0;
+}
+
+#titlepage p {
+  padding-bottom: 1em;
+}
+
+#titlepage #revision {
+  padding-bottom: 0em;
+}
-- 
cgit v1.1