Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Website V2 #389

Open
wants to merge 36 commits into
base: main
Choose a base branch
from
Open

Website V2 #389

wants to merge 36 commits into from

Conversation

alex-snezhko
Copy link
Member

Website redesign, stack:

  • Astro
  • Tailwind
  • Svelte

@alex-snezhko alex-snezhko force-pushed the v2-astro branch 2 times, most recently from a65f6be to 2bbd454 Compare November 28, 2024 02:52
Copy link

netlify bot commented Nov 28, 2024

Deploy preview ready! 🌾

Name Link
🔨 Latest commit 3e1d5d3
🔍 Latest deploy log https://app.netlify.com/sites/grain-lang/deploys/6796c037cb69dc0008ffe90c
😎 Deploy Preview https://deploy-preview-389--grain-lang.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link
Member

@spotandjake spotandjake left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work on this Alex, the new site is amazing and the share feature on the playground is awesome for being able to share reproducable snippets. Most of my feedback is small a tiny bit of will need a bit of discussion I think and I also left some docs fixes but I don't know if we want to address those in this pr or not.

Below is some general feedback that did not really relate to any file in particular or I couldn't find where it would need to be changed.

Blog

  • If you take a look here you'll notice we have an include ModuleName inline, I feel like the style is slightly off maybe we add a tiny bit more padding, slight border or make the background a tiny bit darker? I think discord does a really good job with the style of these for inspiration.
  • There seems to be some overflow on mobile in the description of the docs, I really don't know the best way for this to be fixed, in the example below example we could certainly reduce the padding around the param column but that doesn't seem like a full fix, maybe we should open an issue for this though if we can't come up with something better as I would argue it's minor? Screenshot 2024-12-09 at 7 34 39 PM
  • Can we use https://docs.astro.build/en/recipes/rss/ to add the blogs rss feed back.
    • I think it would be fine if we opened an issue and handled this in a separate pr.

README.md Outdated Show resolved Hide resolved
public/fonts/LeagueMono/LeagueMono-Regular.woff2 Outdated Show resolved Hide resolved
src/components/BlogEntry.astro Outdated Show resolved Hide resolved
src/components/BlogHero.astro Outdated Show resolved Hide resolved
src/components/BlogThumbnail.astro Outdated Show resolved Hide resolved
src/components/BlogEntry.astro Show resolved Hide resolved
src/content/blog/Grain-State-of-the-Union-2020.md Outdated Show resolved Hide resolved
src/components/OpenSourceBlurb.astro Outdated Show resolved Hide resolved
src/components/OpenSourceBlurb.astro Show resolved Hide resolved
changeView(0);
</script>

<div class="flex flex-col relative h-full w-full">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In light mode this stays dark, I found the contrast between the light background and this to be way to much making it really hard to read. (I noticed we might have the same issue on codeblocks in the docs as well), I don't know the best fix but I think if we just made the purple a bit more faded in lightmode (maybe we head more towards a lavender) it would help a lot.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we just use a light theme in light mode altogether? cc @ospencer @phated

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Where is this?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This file specifically is the home page hero with the code examples, but I was asking if we should just change all rendered code blocks in light mode to be a light theme

Copy link
Member

@spotandjake spotandjake left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a couple of accessibility notes I forgot in the first review as well, the mobile nav button also needs an aria label.

src/components/CodeExamples.astro Outdated Show resolved Hide resolved
src/components/IconLinks.astro Show resolved Hide resolved
@spotandjake
Copy link
Member

Closes:
#46
#88
#142
#348
#356
#365
#388
#192
#353

@@ -34,9 +34,11 @@ git pull --recurse-submodules

To make a change to a document, edit the corresponding Markdown file in [src](src). The file path matches the URL path after `/docs`, but if you have trouble finding the page you're looking for, you can click the "Edit on GitHub" button at the top of page on the website.

Please note that standard library documentation is auto-generated from our standard library source with our documentation tool `grain doc`. If you'd like to make an edit to the standard library docs please do so in the corresponding source file in the main compiler monorepo found [here](https://github.com/grain-lang/grain/tree/main/stdlib). After editing the source file, you can run `grain doc stdlib -o stdlib --current-version=$(grain -v)` from the project root directory to generate the `.md` docs. The changes will be reflected on the website the next time we deploy changes for the next release!
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could offer here Jake's new npm run stdlib doc.

site: "https://grain-lang.org",
vite: {
// We want to include wasm files as raw data and then we glob for their urls
assetsInclude: ["**/*.wasm"],
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this'll break with the new object files.

Comment on lines +12 to +18
<a href="#">
<Chip>
<span class="font-medium mr-1">New release!</span> Grain
v0.6 - Emmer
<ExternalIcon class="text-color-dim w-3 h-3 ml-1.5" />
</Chip>
</a>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we make this a real link to that blog post? We'll probably update this to link to an actual new blog post when we ship this, but we'll PR it into this branch.

const searchParams = new URLSearchParams({
code: compressed
});
window.history.pushState(null, "", "?" + searchParams.toString());
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it would make sense to replace this with replaceState, using pushState makes it very hard to go back from the playground.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment