Replace themes with a single "iceberg-theme" that's shared by landing-page and docs site

[samredai]

This adds an iceberg-theme hugo theme and symlinks it into both docs/themes and landing-page/themes. This will ensure a uniform feel across the entire site. The sites will still exist as two independent sites and all CI and deployment instructions will remain unchanged.

UPDATE: This is now ready to review. To test it out, pull down this PR and run (cd docs && hugo serve) or (cd landing-page && hugo serve). For the docs site, you'll have to copy the docs over from the iceberg repo, specifically the new format captured in PR #5115.

Here's a video preview of the site.

iceberg-theme.mp4

[djamegoldston]

@samredai a few things I noticed:

• min-width: 1024px on the .markdown-body class is causing horizontal scrolling on smaller sizes. The anchor links are off-screen.
• The 20px font size for body looks nice on the home page but makes the nav links in the doc section look giant. ~ 16px default for the body might be a better default for the rest of the site elements, then size up the homepage body size.
• Not sure the large Iceberg logo is necessary on the docs page. Maybe just a text <h1>. See the simple headlines on MarkDoc or Stripe Docs
• The equidistant spacing in the nav bar could use some grouping. Maybe something like:

Group 1	Group 2	Group 3
Logo	Nav Links	Social Links
Search	--	--
Versions	--	--

*With larger spacing in between the groups.

[samredai]

Thanks @djamegoldston ! I removed the min-width from the markdown-body css and added grouping to the topnav elements. As for removing the Iceberg logo, that content actually comes from the iceberg repo and is copied over during a release so I included it in my PR over there.

Here are some additional things I've fixed based on some offline feedback:

• Replaced grid container on single pages with a fixed left nav and fixed TOC (single scrollbar on the right of the page)
• Fixed the width of marketing content on the landing page
• Vertical aligned the github and slack icons in the navbar
• Moved Project, Community, ASF, and Format from the docs site leftnav and instead added dropdowns at the topnav (Added Spec, View Spec, and Terms under Project)
• Fixed positioning of the search results so the first result's title isn't cut off
• Removed external icon from Javadoc in docs site left nav

Here's my PR against the docs directory in the iceberg repo with a few small fixes: PR #5127

[rdblue]

There are a couple things to fix with the top bar. Here's what I'm seeing:

• The Iceberg logo and text are really small compared to the links. Could that be larger?
• The top bar still covers the first search result
• The content in the bar is the correct width, but it is aligned left rather than centered

Also, the content scroll looks better, but there is still a double scroll bar on the right:

I think we should roll back to the way it was with just one scroll bar. The second active scroll bar makes it awkward because it's common to move your mouse all the way to the right, then click & drag, but that doesn't work with an extra disabled scroll bar. Another issue is that I can't actually click on the active scroll bar, so something is definitely broken there.

In the docs site, the scroll bar for the left nav is still there, disabled:

I also still see the community section of pages, which is at the top under Project now.

Last, but probably not something to fix right now, the pages under each section are ordered alphabetically rather than by what people are most interested in. That puts Evolution and Maintenance as the first topics under Tables, which is awkward. I know we're cleaning this up so it isn't urgent, but we should make sure that there is a logical order to those pages and links.

[samredai]

@rdblue

The Iceberg logo and text are really small compared to the links. Could that be larger?

Fixed to match the font-size of the links.

The top bar still covers the first search result

Looks like this is due to some more missing titles, fixed by commit 2be1565

The content in the bar is the correct width, but it is aligned left rather than centered

Fixed!

I also still see the community section of pages, which is at the top under Project now.

Do you mean "How to Release" and "How to Verify Release"? Are you saying that should be moved to a dropdown under community? Is this right?:

Community (Dropdown)

• Roadmap
• Blogs
• Talks
• How to Release
• How to Verify a Release

Project (Dropdown)

• Spec
• View Spec
• Terms

..the pages under each section are ordered alphabetically rather than by what people are most interested in. That puts Evolution and Maintenance as the first topics under Tables, which is awkward.

Fixing this is just a matter of setting all of the weights in the config. I'll make sure to do that before this PR is merged!

I think we should roll back to the way it was with just one scroll bar. The second active scroll bar makes it awkward because it's common to move your mouse all the way to the right, then click & drag, but that doesn't work with an extra disabled scroll bar.

There might be a catch-22 here: If we want to have a single scroll bar to the right, we'll have to allow the table of contents to scroll with the page (GraphQL schema docs as an example). I employed a bit of a hack to get this working on the site that's currently live which is basically adding a big right side margin to the content and fixing the TOC into that margin area. This creates other issues where a long TOC can't scroll if it's on a smaller screen or zoomed in. I'll look into a layout that can get us both but we might end up having to choose between:

• Option A: Allow the scroll bar to be placed by the content and have a fixed TOC (which auto displays a scroll bar if the TOC is too long)
• Option B: Place a single scroll bar to the right and let the TOC scroll with the content

As an aside, I would have liked to keep this change outside of this PR but this logic needed to be changed to account for the left-nav in the docs site which previously didn't need to be considered when the logic was only used for the landing-page. I could also fix the left-nav into a large margin area set on the content but that doubles the issue of no scroll on smaller/zoomed screens.

[samredai]

After reading this article, I narrowed the content area a bit for readability. This nice chart shows a recommended readability range of 50-75 characters. Currently the site is somewhere around 130 characters on a line--way past that limit. With a more narrow content reading area it gets us to about 85 characters which is still slightly over the recommended range but looks much more readable.

Here's a video:

iceberg-theme2.mp4

[samredai]

Changed the TOC to be fixed in the margin space of the content and rearranged the topnav menu.

Video:

iceberg-theme3.mp4

[rdblue]

Nice work @samredai! Great to have this in!