Re: [libvirt] [PATCH] docs: make website responsive for mobile devices

2017-08-04 Thread Pavel Hrdina
On Fri, Aug 04, 2017 at 04:07:51PM +0100, Daniel P. Berrange wrote:
> On Fri, Aug 04, 2017 at 04:56:30PM +0200, Peter Krempa wrote:
> > On Fri, Aug 04, 2017 at 13:31:04 +0100, Daniel Berrange wrote:
> > > The website does not look good in a mobile device as the text is
> > > far too small and the layout assumes a wide screen.
> > 
> > So can we finally change the "Learn" to "Documentation" now that this
> > patch will fix the mobile devices, which was AFAIK the reason not to do
> > that?
> 
> Still not enough room for "Documentation" when in portrait mode on my
> phone. At most we could do "Docs"

+1 for "Docs", my previous attempt was not successful :)



Pavel


signature.asc
Description: PGP signature
--
libvir-list mailing list
libvir-list@redhat.com
https://www.redhat.com/mailman/listinfo/libvir-list

Re: [libvirt] [PATCH] docs: make website responsive for mobile devices

2017-08-04 Thread Daniel P. Berrange
On Fri, Aug 04, 2017 at 05:35:05PM +0200, Pavel Hrdina wrote:
> On Fri, Aug 04, 2017 at 04:07:51PM +0100, Daniel P. Berrange wrote:
> > On Fri, Aug 04, 2017 at 04:56:30PM +0200, Peter Krempa wrote:
> > > On Fri, Aug 04, 2017 at 13:31:04 +0100, Daniel Berrange wrote:
> > > > The website does not look good in a mobile device as the text is
> > > > far too small and the layout assumes a wide screen.
> > > 
> > > So can we finally change the "Learn" to "Documentation" now that this
> > > patch will fix the mobile devices, which was AFAIK the reason not to do
> > > that?
> > 
> > Still not enough room for "Documentation" when in portrait mode on my
> > phone. At most we could do "Docs"
> 
> +1 for "Docs", my previous attempt was not successful :)
> 
> 

Since I'm in the minority opinion here, my v2 changes it to "Docs"


Regards,
Daniel
-- 
|: https://berrange.com  -o-https://www.flickr.com/photos/dberrange :|
|: https://libvirt.org -o-https://fstop138.berrange.com :|
|: https://entangle-photo.org-o-https://www.instagram.com/dberrange :|

--
libvir-list mailing list
libvir-list@redhat.com
https://www.redhat.com/mailman/listinfo/libvir-list


Re: [libvirt] [PATCH] docs: make website responsive for mobile devices

2017-08-04 Thread Daniel P. Berrange
On Fri, Aug 04, 2017 at 04:56:30PM +0200, Peter Krempa wrote:
> On Fri, Aug 04, 2017 at 13:31:04 +0100, Daniel Berrange wrote:
> > The website does not look good in a mobile device as the text is
> > far too small and the layout assumes a wide screen.
> 
> So can we finally change the "Learn" to "Documentation" now that this
> patch will fix the mobile devices, which was AFAIK the reason not to do
> that?

Still not enough room for "Documentation" when in portrait mode on my
phone. At most we could do "Docs"

> 
> > 
> > Make the style dynanically adapt based on viewport size, so a
> > mobile device gets a layout more suited to its dimensions.
> > 
> > Signed-off-by: Daniel P. Berrange 
> > ---
> >  docs/main.css   |  1 +
> >  docs/mobile.css | 95 
> > +
> >  docs/page.xsl   | 34 +
> >  3 files changed, 130 insertions(+)
> >  create mode 100644 docs/mobile.css
> 
> docs/mobile.css:1:
> maint.mk: Prohibited empty first line
> make: *** [cfg.mk:939: sc_prohibit_empty_first_line] Error 1

Opps will fix.


Regards,
Daniel
-- 
|: https://berrange.com  -o-https://www.flickr.com/photos/dberrange :|
|: https://libvirt.org -o-https://fstop138.berrange.com :|
|: https://entangle-photo.org-o-https://www.instagram.com/dberrange :|

--
libvir-list mailing list
libvir-list@redhat.com
https://www.redhat.com/mailman/listinfo/libvir-list


Re: [libvirt] [PATCH] docs: make website responsive for mobile devices

2017-08-04 Thread Peter Krempa
On Fri, Aug 04, 2017 at 13:31:04 +0100, Daniel Berrange wrote:
> The website does not look good in a mobile device as the text is
> far too small and the layout assumes a wide screen.

So can we finally change the "Learn" to "Documentation" now that this
patch will fix the mobile devices, which was AFAIK the reason not to do
that?

> 
> Make the style dynanically adapt based on viewport size, so a
> mobile device gets a layout more suited to its dimensions.
> 
> Signed-off-by: Daniel P. Berrange 
> ---
>  docs/main.css   |  1 +
>  docs/mobile.css | 95 
> +
>  docs/page.xsl   | 34 +
>  3 files changed, 130 insertions(+)
>  create mode 100644 docs/mobile.css

docs/mobile.css:1:
maint.mk: Prohibited empty first line
make: *** [cfg.mk:939: sc_prohibit_empty_first_line] Error 1



signature.asc
Description: PGP signature
--
libvir-list mailing list
libvir-list@redhat.com
https://www.redhat.com/mailman/listinfo/libvir-list

[libvirt] [PATCH] docs: make website responsive for mobile devices

2017-08-04 Thread Daniel P. Berrange
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 dynanically adapt based on viewport size, so a
mobile device gets a layout more suited to its dimensions.

Signed-off-by: Daniel P. Berrange 
---
 docs/main.css   |  1 +
 docs/mobile.css | 95 +
 docs/page.xsl   | 34 +
 3 files changed, 130 insertions(+)
 create mode 100644 docs/mobile.css

diff --git a/docs/main.css b/docs/main.css
index 95d5d325d..71f7b7a6a 100644
--- a/docs/main.css
+++ b/docs/main.css
@@ -1,3 +1,4 @@
 @import url(fonts/stylesheet.css);
 @import url(generic.css);
 @import url(libvirt.css);
+@import url(mobile.css);
diff --git a/docs/mobile.css b/docs/mobile.css
new file mode 100644
index 0..0fc1e9d71
--- /dev/null
+++ b/docs/mobile.css
@@ -0,0 +1,95 @@
+
+@media (max-width: 1000px) {
+#home {
+   width: 100%;
+   display: block;
+   margin: 0px;
+   background: white url(logos/logo-banner-dark-256.png) no-repeat center 
center;
+   height: 94px;
+}
+#home a {
+   width: 100%;
+}
+#search {
+   width: 100%;
+   display: block;
+   margin: 0px;
+   background: white;
+   padding: 0px;
+}
+#search form {
+   padding: 5px;
+}
+body.index h1 {
+   display: none;
+}
+#jumplinks {
+   padding: 0px;
+   display: block;
+   width: 100%;
+   text-align: center;
+   margin: 0px;
+   height: 1.3em;
+   font-size: 1em;
+   border-top: 3px solid rgb(60, 133, 124);
+   border-bottom: 3px solid rgb(60, 133, 124);
+}
+#jumplinks ul {
+   display: block;
+   padding: 0px;
+   margin: 0px;
+}
+#jumplinks li {
+   margin: 0px;
+   padding-left: 0.5em;
+   padding-right: 0.5em;
+}
+#nav {
+   border: 0px;
+}
+
+#search.navhide {
+   display: none !IMPORTANT;
+}
+#home.navhide {
+   position: fixed;
+   top: 0px;
+   z-index: 9001;  
+   width: 6em;
+   display: block;
+   margin: 0px;
+   background: inherit;
+   height: 1.3em;
+   border-top: 3px solid rgb(60, 133, 124);
+   border-bottom: 3px solid rgb(60, 133, 124);
+   font-size: 1em;
+   text-indent: 0px;
+   font-weight: bold;
+   padding-left: 1em;
+}
+#home.navhide a {
+   color: white;
+   text-decoration: none;
+}
+#home.navhide a:hover {
+   color: rgb(255, 230, 0);
+}
+#jumplinks.navhide {
+   position: fixed;
+   text-align: right;
+   top: 0px;
+   z-index: 9000;
+   background: rgb(0, 95, 97);
+}
+#jumplinks.navhide ul {
+   z-index: 9001;
+}
+#body {
+   margin-top: 180px;
+}
+div.panel {
+   width: 80%;
+   float: none;
+   margin-bottom: 2em;
+}
+}
diff --git a/docs/page.xsl b/docs/page.xsl
index 7ca4e7bf4..0f762be7d 100644
--- a/docs/page.xsl
+++ b/docs/page.xsl
@@ -88,6 +88,7 @@
   
   
 
+
 
 
 
@@ -97,6 +98,39 @@
 libvirt: 
 
 
+
+
+  
+   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();
+   ]]>
+  
+
   
   
 
-- 
2.13.3

--
libvir-list mailing list
libvir-list@redhat.com
https://www.redhat.com/mailman/listinfo/libvir-list