Try making skatepark standalone block theme

[MaggieCabrera]

Changes proposed in this Pull Request:

This PR converts Skatepark from a Blockbase child to a standalone block theme.

• Some of Blockbase's ponyfills are ported over such as Search block and button styles.
• The alignments styles that we are using for Archeo, Livro, etc.
• The header and footer are brought back from Blockbase to Skatepark.
• We now need a script to load the fonts too
• The 404 page was being inherited from Blockbase, it is now included on Skatepark
• Some of the theme.json options from Blockbase needed to be brought to Skatepark as well

Related issue(s):

Closes #5471

[scruffian]

I noticed that in the screenshot the social links are on a different line:

Now this is a block theme we could go for that layout...

[scruffian]

Some of Blockbase's ponyfills are ported over such as Search block and button styles.
The alignments styles that we are using for Archeo, Livro, etc.
The header and footer are brought back from Blockbase to Skatepark.
We now need a script to load the fonts too
The 404 page was being inherited from Blockbase, it is now included on Skatepark
Some of the theme.json options from Blockbase needed to be brought to Skatepark as well

I think this is all fine, its the same approach we use for other block themes. . We will probably want to remove this extra CSS when that stuff is in Gutenberg, but we're not adding additional complexity. For the patterns I think we'll want to use the patterns from the directory instead when we can.

[scruffian]

LGTM

[MaggieCabrera]

I noticed that in the screenshot the social links are on a different line:
Now this is a block theme we could go for that layout...

I tried that but I don't think it's possible unless the social links are decoupled from the navigation block. Either everything is in the same line or everything is vertical, I didn't find a way to make the line break between the links and the social links without adding CSS.

[MaggieCabrera]

@kjellr if you give a 👍 we can merge and deploy to .org

[kjellr]

Thanks @MaggieCabrera! Just a handful of notes on my end:

---

I'm seeing a lack of left/right padding on small screens:

---

Also, it seems weird that "Next Post" shows up here, even when there's no next post:

I think the best solution is just to hide those Previous/Next Post titles completely for now. We can probably also remove the block pattern for this as well.

---

On the homepage, the previous & next buttons appear too close to the posts themselves, so they're easy to miss. Let's add some margin/padding/separator or something to space them out. The extra space should match the space between the "Latest Posts" header and the post below it.

Current	Intended

---

For some reason, separators in the editor appear less opaque than they do on the front end. Additionally, if you apply a custom color, they lose the custom width we define:

---

I think we should remove the "Two Columns of Text" pattern. I'm not a fan of the text hierarchy, and it also doesn't scale well.

[MaggieCabrera]

Thanks for the review @kjellr!

I'm seeing a lack of left/right padding on small screens:

Yeah, we were missing the correct custom variables for that, it should work fine now

I fixed all the other issues as well, so this should be ready for another review

[kjellr]

Thanks, @MaggieCabrera! I pushed a couple quick updates:

• I added the hover rules to the nav items too, in 2e44548.
• As per @scruffian's note here, I was able to (easily!) implement the intended design for the nav in b4aace2.

This should be ready to go!