[GRASS-dev] grass71 css changes

Hi,

I like changes in the style of the manual which have been recently
applied in GRASS 7.1 [1]. Only one thing which I am not sure is a
width on the page, it seems to be too narrow [1] to me compared to
GRASS 7.0 manual [2]. What about changing width to `width of page` - 2
* `width of toc`?

Martin

[1] http://grass.osgeo.org/grass71/manuals/v.edit.html
[2] http://grass.osgeo.org/grass70/manuals/v.edit.html

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

2014-09-24 20:42 GMT+02:00 Martin Landa <landa.martin@gmail.com>:

width on the page, it seems to be too narrow [1] to me compared to

look eg. at [1] where some of examples overflow the border.

Martin

[1] http://grass.osgeo.org/grass71/manuals/v.in.ascii.html

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

Hi Martin, I'm glad you like it. I was just discussing this with Markus who
requested the narrower fixed layout, so I don't want to write it again, so
here is the conversation. About the examples, we can add horizontal scroll
bar, example is here:
http://fatra.cnr.ncsu.edu/temporal-grass-workshop/#time-series-registration-and-visualization

On Tue, Sep 23, 2014 at 2:18 PM, Vaclav Petras <wenzeslaus@gmail.com> wrote:

...He wishes back the large screen support...

This is why originally I did not included this style to the new CSS (CSS
for workshop). The problem is that we don't know what is the right
solution. You were using the term large screen support for div with fixed
size to not spread over the whole screen, now you are saying that large
screen support is to actually use the screen width.

The other problem is that the layout is not small enough in small windows,
I for example use website one left half (or <1/2) of the screen and working
on the other. I hit this issue no latter then on the workshop.

especially since the
landing page with the overview needs to be scrolled now (see
screenshot).

The overview is of course special and it is the biggest problem and we

really cannot, or don't want, to have different layout/style/header for the
special pages. Here the situation might be improved by reducing the intro
text to one sentence and a More... link which would go to the bottom where
would be a full intro. Perhaps we should do this in any case.

To make everybody happy, I wonder if there is a way to make the layout
width limitation somehow switchable (essentially: div container on and
off)?

This is quite challenging. You need JavaScript for this which we are not

currently using. But what is worse, you don't want the user to switch it
every time, he or she opens a new page or returns the manual, so you need
cookies. To use the cookies, you should tell the user what you are doing
and offer to opt-out. HTML5 Local Storage might be a bit better but we are
not using HTML5 yet, so I'm not sure if we want to go this way. (But I hope
we will switch to HTML5 eventually, the question is if to use also
JavaScript.) Some things (support for smaller screens, not user settings)
can be also achieved by CSS3 but again, it is not what we are using now.

Current TOC is made for the original full width layout, so there is no
problem with it besides that it is unnecessary to hide it when it is on
empty background on standard and wider screens.

We can simply remove the width constrain now or leave it there and try to
improve the pages where it is an issue (if the change makes sense also for
the original layout).

What about getting some feedback on grass-user?

On Wed, Sep 24, 2014 at 2:51 PM, Martin Landa <landa.martin@gmail.com>
wrote:

2014-09-24 20:42 GMT+02:00 Martin Landa <landa.martin@gmail.com>:
> width on the page, it seems to be too narrow [1] to me compared to

look eg. at [1] where some of examples overflow the border.

Martin

[1] http://grass.osgeo.org/grass71/manuals/v.in.ascii.html

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa
_______________________________________________
grass-dev mailing list
grass-dev@lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/grass-dev

Hi,

2014-09-24 21:40 GMT+02:00 Vaclav Petras <wenzeslaus@gmail.com>:

here is the conversation. About the examples, we can add horizontal scroll
bar, example is here:
http://fatra.cnr.ncsu.edu/temporal-grass-workshop/#time-series-registration-and-visualization

the GUI and Bash tabs are also cool... Martin

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

Hi,

2014-09-25 12:22 GMT+02:00 Martin Landa <landa.martin@gmail.com>:

here is the conversation. About the examples, we can add horizontal scroll
bar, example is here:
http://fatra.cnr.ncsu.edu/temporal-grass-workshop/#time-series-registration-and-visualization

the GUI and Bash tabs are also cool... Martin

would be possible to intergrated into GRASS manual? Martin

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

Hi,

2014-09-24 20:42 GMT+02:00 Martin Landa <landa.martin@gmail.com>:

width on the page, it seems to be too narrow [1] to me compared to
GRASS 7.0 manual [2]. What about changing width to `width of page` - 2
* `width of toc`?

if we keep current width I would suggest to change table layout of
main page [1] from three-columns to two columns...

Martin

[1] http://grass.osgeo.org/grass71/manuals/

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

On Fri, Sep 26, 2014 at 3:14 PM, Martin Landa <landa.martin@gmail.com>
wrote:

Hi,

2014-09-25 12:22 GMT+02:00 Martin Landa <landa.martin@gmail.com>:
>> here is the conversation. About the examples, we can add horizontal
scroll
>> bar, example is here:
>>
http://fatra.cnr.ncsu.edu/temporal-grass-workshop/#time-series-registration-and-visualization
>
> the GUI and Bash tabs are also cool... Martin

would be possible to intergrated into GRASS manual? Martin

I surely would. But there are some considerations and work involved.

Milestone would be 7.1. Tabs in the workshop page are in fact two things
(each with 3 subitems).

1 A
JavaScript and CSS machinery to create the tabs and do the switching. You
have to have JS for this. It is better to use jQuery to make things easier.

1 B
How the HTML should look like. I'm now using

<pre>
<code class="gui">
Menu: Temporal -> GUI tools -> Timeline tool
Select dataset tempmean
</code>
<code class="bash">
g.gui.timeline tempmean
</code>
</pre>

But it is not ideal in all cases. For the tabs, some other elements are
actually added (using JS, jQuery in particular).

1 C
The syntax can/should be highlighted. Now I'm using highlight.js, so I have
simple HTML and coloring is done on the fly. Maybe for GRASS, it would be
better to use pygments or something desktop/command line, so we would have
the simple HTML but no need to ship JS library.

2 A
Completely different thing (but related to generating) is the content of
the tabs. It seems that it is quite advantageous to generate some commands
automatically from one of the versions. I'm doing it now only for simple
cases in JS. Again, it might be better to do it during compilation using
Python.

2 B
One of the main questions is which languages to include and how GUI should
be handled. Note the difference between Standard (platform neutral) and
Bash; consider maintenance of GUI instructions; for Python, grass.script or
grass.pygrass; add also others such R or QGIS? You can perhaps generate
different ones on different occasions.

2 C
How will this influence the manual inside wxGUI rendered by wxPython? With
the CSS changes we are quite lucky, it simple supports nothing. But it will
not ignore additional HTML, so perhaps we would need to generate separate
manual without the multiple languages (maybe on the fly).

--

Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

On Fri, Sep 26, 2014 at 3:15 PM, Martin Landa <landa.martin@gmail.com>
wrote:

Hi,

2014-09-24 20:42 GMT+02:00 Martin Landa <landa.martin@gmail.com>:
> width on the page, it seems to be too narrow [1] to me compared to
> GRASS 7.0 manual [2]. What about changing width to `width of page` - 2
> * `width of toc`?

if we keep current width I would suggest to change table layout of
main page [1] from three-columns to two columns...

This would make the page look better but it goes completely against the

note shared through Markus that the index page is too long.

Martin

[1] http://grass.osgeo.org/grass71/manuals/

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa
_______________________________________________
grass-dev mailing list
grass-dev@lists.osgeo.org
http://lists.osgeo.org/mailman/listinfo/grass-dev

Hi,

2014-09-26 22:19 GMT+02:00 Vaclav Petras <wenzeslaus@gmail.com>:

This would make the page look better but it goes completely against the note
shared through Markus that the index page is too long.

I took liberty to enlarge container to 750px in r62109 to avoid to
wrapping 'Imagery commands manual', 'PyGRASS documentation'... I also
changed background of the table to increase readability. I hope it's
still satisfies Markus notes.

Martin

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

On Sat, Sep 27, 2014 at 1:03 PM, Martin Landa <landa.martin@gmail.com> wrote:

Hi,

2014-09-26 22:19 GMT+02:00 Vaclav Petras <wenzeslaus@gmail.com>:

This would make the page look better but it goes completely against the note
shared through Markus that the index page is too long.

I took liberty to enlarge container to 750px in r62109 to avoid to
wrapping 'Imagery commands manual', 'PyGRASS documentation'... I also
changed background of the table to increase readability. I hope it's
still satisfies Markus notes.

Looks again better!

But I took liberty to change the hardcoded width to 70% since not all
devices come with that size, furthermore those users who like long
lines can now get them.
Let's see how that is received...

I wanted to post the updated manuals but guntitest broke the built
procedure (will send an extra email)

Markus

Hi Markus,

2014-09-28 1:12 GMT+02:00 Markus Neteler <neteler@osgeo.org>:

But I took liberty to change the hardcoded width to 70% since not all
devices come with that size, furthermore those users who like long
lines can now get them.
Let's see how that is received...

I wanted to post the updated manuals but guntitest broke the built
procedure (will send an extra email)

I changed the container width to 60% (r62124) to avoid overlap on my
PC, see the attached screenshot. Martin

--
Martin Landa * http://geo.fsv.cvut.cz/gwiki/Landa

(attachments)

manual-70.png