Commit #47

madmurphy · Mar 11, 2021 · 0f72dda · 0f72dda
1 parent 06b0129
commit 0f72dda
Show file tree

Hide file tree

Showing 37 changed files with 136 additions and 30 deletions.
diff --git a/ChangeLog.md b/ChangeLog.md
@@ -1,6 +1,19 @@
 # Change Log
 
 
+## 1.3.1 (2021-03-11)
+
+Changes:
+
+* Increased the clickable area of the `a[rel="prev"]` and `a[rel="next"]`
+  buttons for touchscreen devices
+* Used `75vh` instead of `12cm` for the `max-height` of `img`, `audio`, `video`
+  and `iframe` inside a slide
+* Added _My Underwood_ optional font to the package tree
+* Adjusted margins and other parameters
+* Improved examples
+
+
 ## 1.3.0 (2021-03-08)
 
 Changes:

diff --git a/docs/min_example.html → docs/base-example.html b/docs/min_example.html → docs/base-example.html
@@ -4,7 +4,7 @@
 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 	<link rel="stylesheet" type="text/css" href="css/takefive-min.css" media="screen" />
 	<link rel="index" type="text/html" href="index.html" />
-	<link rel="next" type="text/html" href="nested_example.html" />
+	<link rel="next" type="text/html" href="nested-example.html" />
 	<title>Take five! &ndash; Photo of the day</title>
 </head>
 

diff --git a/docs/css/fonts/1942-report/webfont.eot → docs/css/fonts/1942-report/1942-report.eot b/docs/css/fonts/1942-report/webfont.eot → docs/css/fonts/1942-report/1942-report.eot
diff --git a/docs/css/fonts/1942-report/webfont.svg → docs/css/fonts/1942-report/1942-report.svg b/docs/css/fonts/1942-report/webfont.svg → docs/css/fonts/1942-report/1942-report.svg
diff --git a/docs/css/fonts/1942-report/webfont.ttf → docs/css/fonts/1942-report/1942-report.ttf b/docs/css/fonts/1942-report/webfont.ttf → docs/css/fonts/1942-report/1942-report.ttf
diff --git a/docs/css/fonts/1942-report/webfont.woff → docs/css/fonts/1942-report/1942-report.woff b/docs/css/fonts/1942-report/webfont.woff → docs/css/fonts/1942-report/1942-report.woff
diff --git a/docs/css/fonts/gnutypewriter/webfont.eot → ...css/fonts/gnutypewriter/gnutypewriter.eot b/docs/css/fonts/gnutypewriter/webfont.eot → ...css/fonts/gnutypewriter/gnutypewriter.eot
diff --git a/docs/css/fonts/gnutypewriter/webfont.otf → ...css/fonts/gnutypewriter/gnutypewriter.otf b/docs/css/fonts/gnutypewriter/webfont.otf → ...css/fonts/gnutypewriter/gnutypewriter.otf
diff --git a/docs/css/fonts/gnutypewriter/webfont.svg → ...css/fonts/gnutypewriter/gnutypewriter.svg b/docs/css/fonts/gnutypewriter/webfont.svg → ...css/fonts/gnutypewriter/gnutypewriter.svg
diff --git a/docs/css/fonts/gnutypewriter/webfont.ttf → ...css/fonts/gnutypewriter/gnutypewriter.ttf b/docs/css/fonts/gnutypewriter/webfont.ttf → ...css/fonts/gnutypewriter/gnutypewriter.ttf
diff --git a/docs/css/fonts/gnutypewriter/webfont.woff → ...ss/fonts/gnutypewriter/gnutypewriter.woff b/docs/css/fonts/gnutypewriter/webfont.woff → ...ss/fonts/gnutypewriter/gnutypewriter.woff
diff --git a/docs/css/fonts/my-underwood/my-underwood.eot b/docs/css/fonts/my-underwood/my-underwood.eot
diff --git a/docs/css/fonts/my-underwood/my-underwood.otf b/docs/css/fonts/my-underwood/my-underwood.otf
diff --git a/docs/css/fonts/my-underwood/my-underwood.ttf b/docs/css/fonts/my-underwood/my-underwood.ttf
diff --git a/docs/css/fonts/my-underwood/my-underwood.woff b/docs/css/fonts/my-underwood/my-underwood.woff
diff --git a/docs/css/fonts/my-underwood/my-underwood.woff2 b/docs/css/fonts/my-underwood/my-underwood.woff2
diff --git a/docs/css/takefive-min.css b/docs/css/takefive-min.css
diff --git a/docs/index.html b/docs/index.html
@@ -476,7 +476,7 @@ <h2>Slide 10 of 10</h2>
 		</figure>
 		<aside>
 			<p>The <code>&lt;aside&gt;</code> element is the perfect place for additional <code>&lt;nav&gt;</code> containers!</p>
-			<nav style="font-size:48px;">
+			<nav style="font-size:32px;">
 				<a href="javascript:printById('example-gallery-about');" style="font-weight: normal;">&#9113;</a>
 				<a href="#nowhere" style="font-weight: normal;">&#8986;</a>
 				<a href="#nowhere" style="font-weight: normal;">&#9749;</a>
@@ -556,7 +556,7 @@ <h2>Leave a message</h2>
 						<p>From: <input type="email" required name="sender"></p>
 						<p>Message:</p>
 						<p><textarea name="message" style="width: 400px; height: 150px; box-sizing: border-box; resize: none;"></textarea></p>
-						<p><input type="submit" value="Send" /></p>
+						<p style="text-align: center;"><input type="submit" value="Send" /></p>
 					</fieldset>
 
 				</form>

diff --git a/docs/man.html b/docs/man.html
@@ -36,7 +36,7 @@ <h3>Getting started</h3>
 <h4>Example</h4>
 <p>The following minimalistic code</p>
 <pre class="example">&lt;p style="text-align: center; font-size: 2em;"&gt;<br />&nbsp;&nbsp;&nbsp; &lt;a href="#photo_of_the_day"&gt;Photo of the day&lt;/a&gt;<br />&lt;/p&gt;<br /><br />&lt;article class="slide" id="photo_of_the_day" itemscope itemtype="http://schema.org/ImageObject"&gt;<br />&nbsp;&nbsp;&nbsp; &lt;nav&gt;&lt;a href="#nowhere" rel="parent"&gt;My diary&lt;/a&gt;&lt;/nav&gt;<br />&nbsp;&nbsp;&nbsp; &lt;figure&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;img src="images/1.jpg" itemprop="image" alt="Photo of the day" /&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;figcaption itemprop="caption"&gt;Photo of the day&lt;/figcaption&gt;<br />&nbsp;&nbsp;&nbsp; &lt;/figure&gt;<br />&lt;/article&gt;</pre>
-<p>will produce <a href="min_example.html" target="_blank">this result</a>.</p>
+<p>will produce <a href="base-example.html" target="_blank">this result</a>.</p>
 <h3>Slides containers (viewports)</h3>
 <p>Each slide is defined through the element <code><span style="background-color: #ffff00;">&lt;article </span><span style="background-color: #0098ff;">id="my-hash-tag"</span><span style="background-color: #ffff00;"> class="slide"&gt; &hellip; </span><span style="background-color: #ffff00;">&lt;/article&gt;</span></code>. Such element is constructed so that:</p>
 <ul>
@@ -127,7 +127,7 @@ <h5>More than one token within the <code>rel</code> attribute</h5>
 <h3>Nested galleries</h3>
 <p>Galleries can be nested within other galleries, possibly through the <code>&lt;section&gt;</code> element. In this case the link to the child gallery is usually given through a <code>a[rel~="child"]</code> link.</p>
 <pre class="example">&lt;section&gt;<br />&nbsp;&nbsp;&nbsp; &lt;article id="item-1" class="slide"&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;nav&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="#item-1-1" <span style="background-color: #0098ff;">rel="child"</span>&gt;Nested gallery&lt;/a&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="#nowhere" rel="parent"&gt;My diary&lt;/a&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/nav&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="background-color: #ffff00;">&lt;element-to-be-slided /&gt;</span><br />&nbsp;&nbsp;&nbsp; &lt;/article&gt;<br />&nbsp;&nbsp;&nbsp; &lt;section&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;article id="item-1-1" class="slide"&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;nav&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a <span style="background-color: #0098ff;">href="#item-1"</span> rel="parent"&gt;Item #1&lt;/a&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/nav&gt;<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span style="background-color: #ffff00;">&lt;element-to-be-slided /&gt;</span><br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/article&gt;<br />&nbsp;&nbsp;&nbsp; &lt;/section&gt;<br />&lt;/section&gt;</pre>
-<p>The code above will produce a result similar to <a href="nested_example.html" target="_blank">this example</a>.</p>
+<p>The code above will produce a result similar to <a href="nested-example.html" target="_blank">this example</a>.</p>
 <h3>Issues</h3>
 <p>For compatibility issues with other CSS, here follows the table of all the <code>z-indices</code> assigned by <strong>Take five!</strong>. They cover the range 11109-11118, therefore no other elements within the document should have a <code>z-index</code> higher than 11109 in order to not be displayed over the viewport.</p>
 <table>

diff --git a/docs/nested_example.html → docs/nested-example.html b/docs/nested_example.html → docs/nested-example.html
@@ -4,14 +4,33 @@
 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 	<link rel="stylesheet" type="text/css" href="css/takefive-min.css" media="screen" />
 	<link rel="index" type="text/html" href="index.html" />
-	<link rel="prev" type="text/html" href="min_example.html" />
+	<link rel="prev" type="text/html" href="base-example.html" />
 	<title>Take five! &ndash; Nested galleries</title>
 </head>
 
 <body>
 
 	<p style="text-align: center; font-size: 2em;"><a href="#item-1">Nested galleries</a></p>
 
+	<nav>
+		<h3>Table of contents</h3>
+		<ul>
+			<li>
+				<a href="#item-1">Item #1</a>
+				<ul>
+					<li><a href="#item-1-1">Item #1.1</a></li>
+					<li>
+						<a href="#item-1-2">Item #1.2</a>
+						<ul>
+							<li><a href="#item-1-2-1">Item #1.2.1</a></li>
+						</ul>
+					</li>
+				</ul>
+			</li>
+			<li><a href="#item-2">Item #2</a></li>
+		</ul>
+	</nav>
+
 	<section itemscope itemtype="http://schema.org/ImageGallery">
 		<article id="item-1" class="slide" itemscope itemtype="http://schema.org/ImageObject">
 			<header>

diff --git a/fonts/1942-report/webfont.eot → fonts/1942-report/1942-report.eot b/fonts/1942-report/webfont.eot → fonts/1942-report/1942-report.eot
diff --git a/fonts/1942-report/webfont.svg → fonts/1942-report/1942-report.svg b/fonts/1942-report/webfont.svg → fonts/1942-report/1942-report.svg
diff --git a/fonts/1942-report/webfont.ttf → fonts/1942-report/1942-report.ttf b/fonts/1942-report/webfont.ttf → fonts/1942-report/1942-report.ttf
diff --git a/fonts/1942-report/webfont.woff → fonts/1942-report/1942-report.woff b/fonts/1942-report/webfont.woff → fonts/1942-report/1942-report.woff
diff --git a/fonts/gnutypewriter/webfont.eot → fonts/gnutypewriter/gnutypewriter.eot b/fonts/gnutypewriter/webfont.eot → fonts/gnutypewriter/gnutypewriter.eot
diff --git a/fonts/gnutypewriter/webfont.otf → fonts/gnutypewriter/gnutypewriter.otf b/fonts/gnutypewriter/webfont.otf → fonts/gnutypewriter/gnutypewriter.otf
diff --git a/fonts/gnutypewriter/webfont.svg → fonts/gnutypewriter/gnutypewriter.svg b/fonts/gnutypewriter/webfont.svg → fonts/gnutypewriter/gnutypewriter.svg
diff --git a/fonts/gnutypewriter/webfont.ttf → fonts/gnutypewriter/gnutypewriter.ttf b/fonts/gnutypewriter/webfont.ttf → fonts/gnutypewriter/gnutypewriter.ttf
diff --git a/fonts/gnutypewriter/webfont.woff → fonts/gnutypewriter/gnutypewriter.woff b/fonts/gnutypewriter/webfont.woff → fonts/gnutypewriter/gnutypewriter.woff
diff --git a/fonts/my-underwood/my-underwood.eot b/fonts/my-underwood/my-underwood.eot
diff --git a/fonts/my-underwood/my-underwood.otf b/fonts/my-underwood/my-underwood.otf
diff --git a/fonts/my-underwood/my-underwood.ttf b/fonts/my-underwood/my-underwood.ttf
diff --git a/fonts/my-underwood/my-underwood.woff b/fonts/my-underwood/my-underwood.woff
diff --git a/fonts/my-underwood/my-underwood.woff2 b/fonts/my-underwood/my-underwood.woff2
diff --git a/package.json b/package.json
@@ -1,16 +1,46 @@
 {
 	"name": "Take five!",
-	"version": "1.3.0",
+	"version": "1.3.1",
 	"description": "A semantically-consistent pure-CSS slide renderer",
-	"style": "takefive.css",
+	"author": "[email protected]",
 	"license": "GPL-3.0-or-later",
-	"author": "madmurphy",
+	"homepage": "https://madmurphy.github.io/takefive.css",
+	"style": "takefive.css",
 	"repository": {
 		"type": "git",
-		"url": "git+https://github.com/madmurphy/takefive.css.git"
+		"url": "https://github.com/madmurphy/takefive.css.git"
 	},
 	"bugs": {
-		"url": "https://github.com/madmurphy/takefive.css/issues"
+		"url": "https://github.com/madmurphy/takefive.css/issues",
+		"email": "[email protected]"
 	},
-	"homepage": "https://madmurphy.github.io/takefive.css/"
+	"src": [
+		"takefive.css",
+		"takefive-min.css",
+		"fonts/1942-report/1942-report.eot",
+		"fonts/1942-report/1942-report.svg",
+		"fonts/1942-report/1942-report.ttf",
+		"fonts/1942-report/1942-report.woff"
+	],
+	"keywords": [
+		"css",
+		"css-gallery",
+		"css-lightbox",
+		"css-slide-renderer",
+		"css3",
+		"css3-animations",
+		"html-semantics",
+		"html5",
+		"html5-elements",
+		"image-gallery",
+		"lightbox",
+		"microdata",
+		"microformats",
+		"microformats2",
+		"rdfa",
+		"schema-org",
+		"slide-renderer",
+		"slides",
+		"slideshow"
+	]
 }