Skip to content

Conversation

@lazarusA
Copy link
Member

This should gives additional space. Similar to the width from vanilla Documenter.

@asinghvi17
Copy link
Collaborator

I can see arguments both for and against. Let's get some test branches on other repos with this, to see how it looks? I can do GeoMakie for example, and probably DimensionalData is a good bet as well...

@asinghvi17
Copy link
Collaborator

asinghvi17 commented Jun 22, 2024

@avik-pal
Copy link
Member

+1 for this. If not by default (personally, I think this is a better default), we should have an option to opt-in to this format.

Currently the navigation bar seems to be aligned incorrectly

@avik-pal
Copy link
Member

Also maybe a little more spacing on the left? The anchors ("#") seem almost too close to the left sidebar

@thofma
Copy link
Contributor

thofma commented Jun 22, 2024

+1 from me! I tried to do this a while ago, but got lost in a web of Vitepress issues and css hell.

@lazarusA
Copy link
Member Author

+1 for this. If not by default (personally, I think this is a better default), we should have an option to opt-in to this format.

Currently the navigation bar seems to be aligned incorrectly

Ok. Latest commit should give better paddings. @asinghvi17 it looks like your tests are not using this branch, or is not using the style from the template.

If there is not more feedback, this should be good to go. Thanks everyone for chiming in 😄 .

@asinghvi17
Copy link
Collaborator

Yeah the style isn't applied. Will fix that.

@avik-pal
Copy link
Member

Ok. Latest commit should give better padding

Yeah padding seems fixed.

image

See the gap between the navigation bar and the left sidebar. And the line separating the Package Name from the headers in the sidebar seems to overflow into the text area.

@lazarusA
Copy link
Member Author

really good catch! Latest commit should fix that.

@avik-pal
Copy link
Member

Looks quite nice https://lux.csail.mit.edu/previews/PR721/tutorials/ 🎉

@lazarusA
Copy link
Member Author

lazarusA commented Jun 22, 2024

mmm... I'm still not happy with the left side paddings.
Screenshot 2024-06-22 at 22 13 18

I need to match the width default values. Looks cool, but it is too small.

Also, I would do only "Documentation" and not "Lux.jl Documentation", you already have the logo for the first part.

@avik-pal
Copy link
Member

avik-pal commented Jun 22, 2024

Also, I would do only "Documentation" and not "Lux.jl Documentation", you already have the logo for the first part.

Good point! Though the downside is it also appears in the titlebar, so it would appear as "XYZ | Documentation". I will go with "Lux.jl Docs" to prevent the overflow for now.

@lazarusA
Copy link
Member Author

lazarusA commented Jun 22, 2024

Ok, final version, it turns out we only need this:

.VPDoc.has-aside .content-container {
  max-width: 100% !important;
}
.aside {
  max-width: 200px !important;
  padding-left: 0 !important;
}
.VPDoc {
  padding-top: 15px !important;
  padding-left: 5px !important;

}
/* This one does the right menu */

.VPDocOutlineItem li {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  max-width: 200px;
}

.VPNavBar .title {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
@media (max-width: 960px) {
  .VPDoc {
    padding-left: 25px !important;  
  }
}

the previous approach expands the whole available screen (which is fine, maybe?), but this last one keeps the content centered while also having a wider area for it. Hence, I will settled for this and merge 😄 .

@lazarusA lazarusA merged commit a4dfed4 into master Jun 22, 2024
@lazarusA lazarusA deleted the la/better_layout branch March 8, 2025 08:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants