[
https://issues.apache.org/jira/browse/NIFI-906?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=15355244#comment-15355244
]
Koji Kawamura edited comment on NIFI-906 at 6/29/16 11:21 PM:
--------------------------------------------------------------
I took a look at the documentation page (https://nifi.apache.org/docs.html). It
already uses foundation.js to provide responsive pages, however it doesn't work
on the documentation page, other pages looks fine.
I think there're two issues:
# NiFi Documentation is embedded as iframe. The iframe hides top-bar menu and
footer with narrower screen like mobile.
# The embedded NiFi Documentation is not responsive.
h3. Possible solution for #1
When I modified css as follows, the top-bar menu and footer was shown
correctly. I couldn't find the css file in nifi project available on Github,
though. I assume it's managed somewhere else.
{code}
/*
Iframe
*/
/* line 177, ../../../src/scss/app.scss */
div.external-guide {
position: absolute; // Change this to relative.
left: 0;
bottom: 0;
right: 0;
top: 2.8125rem; // Remove this.
z-index: 1; // Remove this.
background-color: #fff;
}
{code}
h3. Possible solution for #2
Since current web pages are using, I think we can start with foundation.js to
use in NiFi Documentation pages, or flexbox. Once we made the left component
listing pane responsive, it should be easier to see with small displays. I'm
going to test with flexbox first.
was (Author: ijokarumawak):
I took a look at the documentation page (https://nifi.apache.org/docs.html). It
already uses foundation.js to provide responsive pages, however it doesn't work
on the documentation page, other pages looks fine.
I think there're two issues:
# NiFi Documentation is embedded as iframe. The iframe hides top-bar menu and
footer with narrower screen like mobile.
# The embedded NiFi Documentation is not responsive.
h3. Possible solution for #1
When I modified css as follows, the top-bar menu and footer was shown
correctly. I couldn't find the css file in nifi project available on Github,
though. I assume it's managed somewhere else.
{code}
/*
Iframe
*/
/* line 177, ../../../src/scss/app.scss */
div.external-guide {
position: absolute; // Change this to relative.
left: 0;
bottom: 0;
right: 0;
top: 2.8125rem; // Remove this.
z-index: 1; // Remove this.
background-color: #fff;
}
{code}
h3. Possible solution for #2
Since current web pages are using, I think we can start with foundation.js to
use in NiFi Documentation pages. Once we can make the left component listing
pane responsive, it should be easier with small displays. Thoughts?
> Docs do not display well on mobile/smaller res devices
> ------------------------------------------------------
>
> Key: NIFI-906
> URL: https://issues.apache.org/jira/browse/NIFI-906
> Project: Apache NiFi
> Issue Type: Bug
> Components: Documentation & Website
> Environment: Mobile, Small res devices
> Reporter: Joseph Witt
>
> Tweet from @cyroxx
> @apachenifi Unfortunately, the docs (http://nifi.apache.org/docs.html ) are
> not mobile-friendly, makes it hard to read about this interesting project
> https://twitter.com/cyroxx/status/637305973938483200
--
This message was sent by Atlassian JIRA
(v6.3.4#6332)
