Add drawer on mobile and clean code
ClosedPublic

Authored by ognarb on Apr 13 2020, 10:56 PM.

Details

Test Plan

Large:

Small (NoScript):

Small with js enabled:

Diff Detail

Repository
R264 KApiDox
Lint
Automatic diff as part of commit; lint not applicable.
Unit
Automatic diff as part of commit; unit tests not applicable.
ognarb created this revision.Apr 13 2020, 10:56 PM
Restricted Application added projects: Frameworks, Documentation. · View Herald TranscriptApr 13 2020, 10:56 PM
Restricted Application added subscribers: kde-doc-english, kde-frameworks-devel. · View Herald Transcript
ognarb requested review of this revision.Apr 13 2020, 10:56 PM
ognarb updated this revision to Diff 80155.Apr 14 2020, 8:22 PM
  • Add drawer on mobile (with JS)
  • Fix some layout issues
ognarb updated this revision to Diff 80156.Apr 14 2020, 8:47 PM

Add NoScript support

ognarb edited the summary of this revision. (Show Details)Apr 14 2020, 8:49 PM
ognarb added reviewers: cblack, ochurlaud.
ognarb retitled this revision from WIP: Use CSS grid to improve layout to Add drawer on mobile and clean code.
ognarb edited the summary of this revision. (Show Details)
ognarb edited the test plan for this revision. (Show Details)
ochurlaud requested changes to this revision.Apr 15 2020, 7:00 AM

I really dislike how you close brackets in css : it's more dense and harder to read.

You indent sometimes with 1,2 or 3 spaces: it should be consistent.

Is it something common to have css declaration within others? It's the first time I see that, so I'm confused.

This revision now requires changes to proceed.Apr 15 2020, 7:00 AM

Except these clarifications, I'm not against this change

ognarb planned changes to this revision.Apr 15 2020, 9:20 AM

I really dislike how you close brackets in css : it's more dense and harder to read.

You indent sometimes with 1,2 or 3 spaces: it should be consistent.

Is it something common to have css declaration within others? It's the first time I see that, so I'm confused.

The css code is generated from the new scss file. I didn't remove the generated CSS code because I didn't want to add sass as a dependency of kapidox. I will add this information to the doc.

The command to generate the css code is:

sass src/kapidox/data/htmlresource/css/kapidox.scss src/kapidox/data/htmlresource/css/kapidox.css

Maybe this file can be moved later to websites/aether-sass so that the layout with the sidebar can be shared with websites/aether-sphinx and websites/aether-mediawiki and hosted in the KDE cdn.

ochurlaud accepted this revision.Apr 15 2020, 6:21 PM

OK it's clearer:

Please add somewhere that it's a generated css so that no-one tries to change it by hand and ship it

ognarb updated this revision to Diff 80228.Apr 15 2020, 7:36 PM
  • Use version from cdn
This revision is now accepted and ready to land.Apr 15 2020, 7:36 PM
ognarb updated this revision to Diff 80229.Apr 15 2020, 7:42 PM
  • Fix typo in path
  • Add information about there to find the source of the css files

I now generate the CSS from aether-sass. The code can be found https://invent.kde.org/websites/aether-sass/-/blob/master/css/aether-sidebar.scss. And all tree wikis are using it.

@ochurlaud should I create a sysadmin request for you to get access to the repo in invent so that you can edit it if you need?

ochurlaud accepted this revision.Apr 16 2020, 7:37 PM

I now generate the CSS from aether-sass. The code can be found https://invent.kde.org/websites/aether-sass/-/blob/master/css/aether-sidebar.scss. And all tree wikis are using it.

@ochurlaud should I create a sysadmin request for you to get access to the repo in invent so that you can edit it if you need?

No need, I don't work much anymore on apidox.

Does it work locally? If I use your patch and try locally on my computer? If it works, then you can ship it.

This revision was automatically updated to reflect the committed changes.