Updates dependencies / improve structure and base CSS #33
Conversation
✅ Deploy Preview for unlockopen-com-v4 ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
| @@ -0,0 +1,4 @@ | |||
|
|
|||
| <!-- independent partial hydration islands architecture: https://github.com/11ty/is-land --> | |||
There was a problem hiding this comment.
What's this? I tend to run away screaming when I hear terms like hydration.
There was a problem hiding this comment.
Haha, yeah. Same.
It's Eleventy's equivalent to Astro's island architecture. It's useful for webC components - or web component in general - with embedded JS. If we use various instances of it on one page, we can make it load the JS only once.
<is-land>
<custom-component>
<slot></slot>
<template data-island="once">
<script src="/component-script.js"></script>
</template>
</custom-component>
</is-land>
Or, if it's a component further down, we can specify that the associated script or CSS is only loaded when the user scrolls there (<is-land on:visible>). In most projects I use this in various places. In our case it is for now only used for the lite-youtube web component.
We can of course throw it out if you think it creates too much complexity.
|
Do you want me to change anything? |
Modified how scripts are handled, distinguishing between inline, component, or common types.
Rerouted all component parts to
assets/components.created external partials for inline JS and preloads.
Removed the masonry script
Fixed and expanded Open Graph (OG) metadata (removed white space).
Updated base style sheets
reset.cssandglobal-styles.csswith updated defaults and better internal organizationAddressed Issue Fix OGP and schema.org data #8 by changing "description" to "lede".