Fixes #752 - Make the TOC responsive for the order page #930

vincent · 2019-05-25T10:36:22Z

vincent commented

2019-05-25 10:36:22 +00:00

No description provided.

vincent added this to the Hackathon1905 milestone 2019-05-25 10:36:22 +00:00

reinhard commented

2019-05-25 13:21:38 +00:00

Thank you Vincent! I think the PR fixes the actual issue and should be merged.

However, it does not fix the underlying root of the issue: that our standard CSS does not contain gernal, reusable classes for a table of contents, resulting in a number of pages constructing their individual TOC design. Let's keep in mind that this is soemthing we should change.

Thank you Vincent! I think the PR fixes the actual issue and should be merged. However, it does not fix the underlying root of the issue: that our standard CSS does not contain gernal, reusable classes for a table of contents, resulting in a number of pages constructing their individual TOC design. Let's keep in mind that this is soemthing we should change.

vincent commented

2019-05-25 15:57:06 +00:00

I'd suggest to put this in style.less and make sure every TOC has the #toc id

#toc {
  float: right;
  clear: right;
  border: solid 1px;
  margin: .5em;
  background: rgb(240,240,240);
  width: 30%;
}

@media only screen and (max-width: 600px) {
  div#toc {
    width: 100%;
  }
}

Edit: Created an issue here

I'd suggest to put this in style.less and make sure every TOC has the `#toc` id ```css #toc { float: right; clear: right; border: solid 1px; margin: .5em; background: rgb(240,240,240); width: 30%; } @media only screen and (max-width: 600px) { div#toc { width: 100%; } } ``` Edit: Created an issue [here](https://git.fsfe.org/FSFE/fsfe-website/issues/942)

reinhard commented

2019-05-25 16:04:04 +00:00

In principle I agree with the above CSS, however I think it could be better integrated with some bootstrap features.

max.mehl commented

2019-05-26 13:41:51 +00:00

@reinhard @vincent @mweimann Would you like to take another look at how to make it more bootstrap-native, or shall I merge for now to make it at least a bit better?

I tend toward coming up with a decent TOC layout for all kind of pages (and update those), so I'd love to have a quite optimal one

@reinhard @vincent @mweimann Would you like to take another look at how to make it more bootstrap-native, or shall I merge for now to make it at least a bit better? I tend toward coming up with a decent TOC layout for all kind of pages (and update those), so I'd love to have a quite optimal one

vincent commented

2019-05-27 12:19:52 +00:00

I think we should merge this and use #942 to explore possibilities for a global css class.

I think we should merge this and use [#942](https://git.fsfe.org/FSFE/fsfe-website/issues/942) to explore possibilities for a global css class.

reinhard commented

2019-05-27 12:24:55 +00:00

I agree with @vincent.

max.mehl commented

2019-05-27 12:45:13 +00:00

Fine for me. However, @vincent, could you please undo the changes for the da, fr, sq and tr version, or delete these files? They are currently outdated and should not be made up-to-date by these changes:

$ tools/check-translation-status.sh -a -f order/order.en.xhtml 
Basefile: order/order.en.xhtml ( 2019-05-22 )
  STATUS      LANG    DATE
  --------    ----   ----------
  OUTDATED     da    2017-06-13
  OUTDATED     fr    2017-06-13
  OUTDATED     sq    2017-06-13
  OUTDATED     tr    2018-09-06
  Up-to-date   de    2019-05-22
  Up-to-date   it    2019-05-22
  Up-to-date   nl    2019-05-22

Fine for me. However, @vincent, could you please undo the changes for the da, fr, sq and tr version, or delete these files? They are currently outdated and should not be made up-to-date by these changes: ``` $ tools/check-translation-status.sh -a -f order/order.en.xhtml Basefile: order/order.en.xhtml ( 2019-05-22 ) STATUS LANG DATE -------- ---- ---------- OUTDATED da 2017-06-13 OUTDATED fr 2017-06-13 OUTDATED sq 2017-06-13 OUTDATED tr 2018-09-06 Up-to-date de 2019-05-22 Up-to-date it 2019-05-22 Up-to-date nl 2019-05-22 ```

max.mehl added a new dependency 2019-05-27 13:54:37 +00:00

#947 Bootstrap compatible order page

vincent commented

2019-05-27 13:54:42 +00:00

Done!