shaba/libvirt
1
0
Fork 0
mirror of https://gitlab.com/libvirt/libvirt.git synced 2025-10-16 23:33:52 +03:00
Code Releases Activity

docs: make website responsive for mobile devices

Browse Source 
The website does not look good in a mobile device as the text is
far too small and the layout assumes a wide screen.

Make the style dynamically adapt based on viewport size, so a
mobile device gets a layout more suited to its dimensions,
also changing "Learn" to "Docs"

Signed-off-by: Daniel P. Berrange <berrange@redhat.com>
This commit is contained in:
Daniel P. Berrange
2017-08-04 13:29:43 +01:00
parent 10e277a432
commit 7c956d42a2
4 changed files with 131 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
docs/page.xsl
View File

@@ -88,6 +88,7 @@
</xsl:comment>
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet" type="text/css" href="{$href_base}main.css"/>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/>
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/>
@@ -97,6 +98,39 @@
<title>libvirt: <xsl:value-of select="html:html/html:body/html:h1"/></title>
<meta name="description" content="libvirt, virtualization, virtualization API"/>
<xsl:apply-templates select="/html:html/html:head/*" mode="content"/>
<script type="text/javascript">
<xsl:comment>
<![CDATA[
function init() {
window.addEventListener('scroll', function(e){
var distanceY = window.pageYOffset || document.documentElement.scrollTop,
shrinkOn = 94
home = document.getElementById("home");
links = document.getElementById("jumplinks");
search = document.getElementById("search");
body = document.getElementById("body");
if (distanceY > shrinkOn) {
if (home.className != "navhide") {
body.className = "navhide"
home.className = "navhide"
links.className = "navhide"
search.className = "navhide"
}
} else {
if (home.className == "navhide") {
body.className = ""
home.className = ""
links.className = ""
search.className = ""
}
}
});
}
window.onload = init();
]]>
</xsl:comment>
</script>
</head>
<body>
<xsl:if test="html:html/html:body/@class">
@@ -117,7 +151,7 @@
<ul>
<li><a href="{$href_base}downloads.html">Download</a></li>
<li><a href="{$href_base}contribute.html">Contribute</a></li>
<li><a href="{$href_base}docs.html">Learn</a></li>
<li><a href="{$href_base}docs.html">Docs</a></li>
</ul>
</div>
<div id="search">